Quick Start – Build a Simple CyberTracker Photo Notes App

Getting Started with CyberTracker Online

LOGIN

Find Google Translate at the bottom of this website page.

Customize your own application on a desktop computer and then install your app onto an Android or iPhone smartphone.

Quick Start

On your desktop PC or Mac, Login to CyberTracker Online

  • For new users, you can use the Quick Access option to see how CyberTracker Online works.
  • Enter your email, select the Terms of Service and Privacy Policy, and then the reCAPTCHA .
  • Select Proceed and fill in your Profile (your name, the name of your organization/community/individual, and select your country) and your Project name.
  • You are ready to get started building apps, deploying them, and viewing your data!
  • Once you have tested your app and collected some test data, you can create a Password to protect your field data.

Build and Deploy a Simple Photo Notes App

In this tutorial we will look at:

In CyberTracker Online:

  • Add a project.
  • Build your application.
  • Add screens.
  • Add a save button.
  • Publish your application.

On CyberTracker Mobile:

  • Deploy your application to a mobile device using the CyberTracker Mobile QR Scan.
  • Collect data on the mobile.
  • Submit data from the mobile.

Back in CyberTracker Online:

  • View data

Step 1: Add a Project in CyberTracker Online

  • In the menu at top right, click on Projects.
  • In the Projects tab, click on Add Project.
  • Select a name for your project and click Save.

Step 2: Build your App in CyberTracker Online

  • In the menu at top left, click on Applications.
  • Select your project from the dropdown.

Step 3: Add Screens in CyberTracker Online

We will build a simple Photo Notes app consisting of three screens.

Simple Photo App

Screen 1: Start Screen

  • On the Screens tab for your project, click on Add Screen.
  • Under Screen Title enter the name of your app. It can be the same or different to your project name.
  • Select Start from the Template dropdown.
  • Click Save.
  • You are now on the Edit Screen page for your start screen.
  • At this point you can optionally add an Image for your start screen. Click Save if you do so.
  • Save will take you back to the Screens list, and you will see your new start screen listed.
  • If you didn’t add an image and Save, then use the Back to Screens button to get back to the Screens list.

Screen 2: Photo Screen

  • Click on Add Screen.
  • Under Label enter “Photo”.
  • Select Photo from the Template dropdown.
  • Click Save.
  • You are now on the Edit Screen page for your Photo screen.
  • Choose the Maximum number of images you want to capture for one observation.
  • Click Save to save your changes and return to the Screen list.

Screen 3: Note Screen

  • Click on Add Screen.
  • Under Label enter the type of Note, for example “Field Notes”.
  • Select Note from the Template dropdown.
  • Click Save.
  • You are now on the Edit Screen page for your Note screen.
  • Under the Navigation Buttons section, check the checkbox for Save button.
  • Click Save to save your changes and return to the Screen list.

You should now see three screens listed in your Screens list. On your mobile device the screens in your app will be displayed in the order in which they are displayed in this list.

Step 4: Publish your App in CyberTracker Online

  • Go to the Publish tab and click the Publish button.
  • A message will confirm when your app has been published.
  • A CyberTracker Mobile App QR Code image will appear.
  • The QR Code is used to install your app onto mobile phones.

Step 5: Deploy your App to your Mobile Phone

  • Download CyberTracker Mobile from the Apple App Store onto your iPhone or from Google Play onto your Android phone.
  • Use the QR Scanner in CyberTracker Mobile to scan the Mobile App QR Code on your laptop or desktop computer where you published your app.

Step 6: Collect Data with CyberTracker Mobile

Navigation Buttons

The Navigation Buttons on the screens allows you to move from one screen to the next, Save your observations and loop back to a Target Screen.

From left to right they are:

  • Back: Takes you back to the previous screen within your app if you need to make a correction.
  • Projects: Takes you to the list of Projects in CyberTracker Mobile if you need to switch to another Project.
  • Map: Takes you to the Map screen in CyberTracker Mobile.
  • Save: Saves the data you have entered so far, and records the time, date and a GPS co-ordinate; by default, returns you to the Start Screen of the app, or you can select a Save Target screen.
  • Next: Takes you to the next screen in the app.

Depending on what is required, screens may not display all the Navigation Buttons.

  • On the mobile device, in CyberTracker App, select the Projects button and then go to Settings. Enter your name under Collect as in the CyberTracker Settings on the mobile device. Your name will be attached to every observation.
  • Collect a few observations on your mobile device, making choices and entering data.
  • Advance to the next screen using the Next button.
  • On the last screen, touch the Save button. It will record your GPS co-ordinates.
  • You may be prompted to allow CyberTracker Mobile to use your phone’s GPS co-ordinates, or you may need to switch on the Location function on your phone. Wait for the satellites to be acquired.

Step 7: Submit Data from Mobile Phone

  • On the start screen of the app on your mobile, touch the Submit Data button.
  • If there is data that you have not yet submitted, the icon shows an Upload Arrow.

  • Once all data has been submitted, the icon shows a tick in a cloud.
  • Your data is now uploaded and saved in CyberTracker Online.

Step 8: View Data in CyberTracker Online

  • Go to View Data using the link in the header to see the Map view.
  • You can also view your data in the Observations table, Photo table and Audio table by selecting the drop-down menu.

To collect more complex data, see our next tutorial on Build a Simple Linear Sequence of Screens with Icons as well as More Options.