Beginner Tutorial Part 2 - Navigating and Preparing the Application Builder

Owned by Jeremy W.
Last updated: Jun 11, 2024 by Gillian JavetskiVersion comment
5 min read

To proceed, make sure that you:

  • have created a CommCareHQ account

  • have created a CommCareHQ project space

  • are logged into CommCareHQ

In this page we'll get to know the major features of the CommCare Application Builder.

Beginner Tutorial Part 2 Learning Objectives

  • Understand the different parts of CommCareHQ and what they are used for

  • Recognize the different pieces of the application builder

  • Create a blank application

  • Save changes

  • Change application, menu, and form names

Welcome to CommCareHQ!

When you log in to CommCareHQ you will notice a number of different options. We are going to focus on Application Building, but let's at least get to know what everything does!

Along the top of the screen there are several big categories or pages in your project space.

Here is what each of them does:

  • Dashboard - this is the "homepage" of your CommCareHQ Project Space - from here you can quickly access saved reports, specific applications, or navigate to other parts of CommCareHQ

  • Reports – this is where you view data submitted via CommCare Mobile, like worker activity reports and text message records

  • Data – this is where you can download form or case data, or edit data for an ongoing project by executing tasks like moving cases from one worker to another, or updating cases through Excel

  • Users– manage accounts for both mobile and web users:

    • Add new mobile user accounts, define details about them like their name and phone number, and organize your users into groups

    • Invite web users to join your CommCareHQ project space

  • Applications – here is where we are going to be working in this tutorial- building, changing, and downloading CommCare applications

  • Web Apps– Web Apps is like a website-based version of CommCare Mobile. It is useful for testing your forms and for doing data entry from a computer instead of a mobile device. Note that Web Apps for data entry is only available if you have software plan at the Pro level of higher. 

  • Messaging – this is a tool for sending SMS/text messages to your mobile workers

Application Builder

Once you are logged into your CommCare account and project, the first thing you will see is a blank application in the "application builder".

 

 

Take a look at the menu of your application. A number of different functions are available, described below. Feel free to click through to see what each is comprised of.

  • App Preview: Allows you to move the mobile phone emulator on and off of your browser window.

  • App Summary: Use this to view the contents of your entire application at-a-glance. Summaries can be viewed by form or by case. You can view app contents, and hide or unhide calculations, display conditions, or validation conditions.

  • Publish: Enables you to make new versions of your application to download onto your Android device. This is accessible by clicking on the application name.

  • Gear icon next to "Untitled Application": Allows you to navigate to the application's settings page, where you can enable more advanced features, languages, and multimedia.

Setting Up an Application

Now that we have a blank application, we can start building. But first, let's review what we're going to build.

Imagine that you work for an organization that coordinates a maternal and child health program in which community health workers (CHW) monitor and counsel pregnant women in their communities. When a CHW learns that a women is pregnant, she registers the woman into the program. Throughout the pregnancy, the worker visits the pregnant woman to collect data and provide counseling messages. At the end of the pregnancy, the CHW monitors the health of the newborn child as well. Currently, the program uses paper forms to support each interaction.

Using this information as a guide, let's build an app to replace the paper forms and support these workers. We will build this app step-by-step. 

Let's start by giving our application a name.

1. Set the application name

  • From the "settings" display of your application, click "Untitled Application" and type "Village Health"

  • Click the green checkbox to save.

 

Don't Forget to Save!

In the application builder, there is always a green save button. When you make a change it becomes bright green and you will need to push it to save your changes. While building applications, it is important to keep saving, though you will always get a warning message when you try to navigate away from a page without saving changes.


2. Create a set of forms

Next, use the "+ Add..." button to select the kind of form structure you would like to use.  The options are the following:

  • Survey: Select this option for a template application for one-time data collection.

  • Case List: Select this option for a template case management application that allows you to track information about a specific case over time.

By selecting one of these, you will begin the application building process.  For this app, because the CHW will monitor pregnant women over time, select "Case List," which will create a "Register" form and a "Followup" form.

What about Case Management?

By clicking on "Case List," you can update the name as well as configure a number of settings. Most of these settings have to do with case management which we will cover in subsequent tutorials. For now, you can leave all of the settings as they are by default.


3. Begin editing your forms

After selecting, "Case List", you are now automatically entered into the "Register" form and can begin to add questions to your form. But don't add anything yet! We'll do this in the next module. 

Remember, a form is one specific set of information within a case list. For example, our "Register" form will be used to collect registration information for a pregnant woman. We can edit our second form called "Followup" to capture information about the pregnancy during a follow-up visit. 

You can edit any form in the Case List by clicking on it.  

4. Add more forms

For our application, we'll need a third form to enter data about the health of the newborn child. To add another form, click on the green "+" next to the words, "Case List". 

You're ready to start building your first form! Go on to Part 3!