Creating Badges

Badges can be used to provide rewards upon reaching a certain stop or answering quiz questions.

When a user does an action in your app such as visiting a screen and/or answering a question correctly depending on your configuration to trigger your badge, a popup will appear, notifying that you received a badge for completing certain task(s).

Users can view the badges they acquired by selecting the Profile tab, in place of the Setting tab. The “Settings” is now located on the Profile Tab. Look for the gear icon on the top right section of the screen.

How to add badges in your app:

1. In order to create badges in the STQRY builder, you must create a badge group

You can create as many as you want. To do this choose Content >> Badges >> Create Group >> then choose Add new badge to add a new badge to the group.

2. Fill out the badge form.

The picture below shows the windows to configure a badge. Numbers in the images refer to the functions on the window.

1. Badge name: only appears in the builder.
2. Group: drop-down menu for the badge group where your badge intends to belong.
3. Badge Page: the toggle to set up the badge visibility of your badge on the Profile tab.
4. The image of the badge: this can be taken by uploading from your PC/device or you can get it from STQRY Builder’s Media Files. Hit Save after finishing 1, 2, 3 and 4. 
5. Triggers: these are the screens that, when navigated to/answer a quiz question correctly, will trigger the badge popup if it has yet to be earned by the user.
6. Badge Popups (Unearned): badge popup appears when the user clicks on an unearned badge on the Profile tab. Help text: Used to provide some information to the user about how to earn this badge.
7. Start Screen: screen link to start the tour or series of challenges. Default is None. When None, the button will be omitted from the badge popup. Start Page Button Label: required only if Start Screen is set.

8. Badge Popups (Earned): badge popup appears when the badge is initially earned, or when the user clicks on an earned badge on their Badges screen.

   Heading: the congratulatory line on the badge popup.

   Message Body: provides some information to the user about the badge they just earned.

9. Reward Screen: if you would like to provide a screen link for the user to be able to navigate to after earning the badge to provide extra information or access to hidden content. Default is None. When None, the button will be omitted from the badge popup.

   Reward Page Button Label: Required only if Reward Screen is set.

3. Link the badge(s) to the app

When done adding your badges, you can now link them to your app. To do this:

1. Go to the Project tab
2. Select your app.
3. On the Overview page, scroll down and add a group of badges by choosing Select Add New Badge Group.

4. Once you link a badge group, the Setting tab will be replaced with the Profile tab