Customizing the App

Customizing Experience Sampler

How to customize Experience Sampler with your own questions and signalling schedule

In this Experience Sampler customization tutorial, we will show you how to customize Experience Sampler's functions to meet your study needs.

All the changes you will make are to the JavaScript file in the www folder you see when you open your app folder (click here for the Android JavaScript file and here for the iOS JavaScript file). Do NOT edit the www folder that is inside the platform > android or platform > ios folder. When you run the cordova run or cordova build commands, cordova will copy the files from the www folder into the www folder in the platform > android or platform >ios folder.

In the HTML file, the only lines you need to be edit are lines 61-62; you just have to copy and paste the URL of your data collector in these lines. You can change the CSS file if you want to change the appearance of the app. (Please see this W3School's tutorial about CSS).

We have divided the customization procedure into five stages (see below). After completing each customization stage, you should test the code using the appropriate emulator. By dividing the customization process into stages, you will be able to identify errors in the code much more easily. The functions included in each stage will also increase in difficulty; thus, the stages also scaffold the programming process, making it easier for people with no programming experience to become accustomed to the app development process. To help you move through the stages, we have noted which functions or parts of the function are used in which stages and have commented out the code that is not needed. You should uncomment parts of the JavaScript code as you progress through the stages. JavaScript comments are preceded by //. Blocks of code or specific parts of a line of code that are commented out are preceded by /* and end with */. To uncomment the code, remove the comment indicators (i.e., // and /* */). If you are using a text editor designed specifically for programming or an IDE, you should look for a commenting/uncommenting command.

Stage 1 - Questions and Messages

Learn how to customize your survey questions, end-of-questionnaire messages, and participant setup questions.


Testing the App

It's important to test your app after each customization stage. Learn how to test your app on a smartphone emulator.


Stage 2 - Saving the Data

In this stage, you'll learn how to set up your server and app to save your questionnaire data.


Stage 3 - Advanced Survey Features

In this stage, you'll learn how to implement skip logic, question branching, and piped text for your questionnaire.


Stage 4 - Snooze Function

Implement a snooze function to remind participants to complete questionnaires at a later time if they are currently busy.


Stage 5 - Scheduling Notifications

Schedule your signals for either a signal-contingent design (with random or fixed intervals) or an interval-contingent design.