Skip to main content
Version: v2.4.1

UIConfig

Defined in: parser/types.ts:241

The UIConfig is used to configure the UI of the app. This includes the logo, contact email, and whether to show a progress bar. The UIConfig is also used to configure the sidebar, which can be used to display the task instructions and capture responses. Below is an example of how the uiConfig would look in your study configuration (note, there are optional fields that are not shown here):

uiConfig:{
"logoPath": "<study-name>/assets/logo.jpg",
"contactEmail": "contact@revisit.dev",
"withProgressBar": true,
"withSidebar": true,
"helpTextPath": "<study-name>/assets/help.md",
"autoDownloadStudy": true,
"autoDownloadTime": 5000,
"studyEndMsg": "Thank you for completing this study. You're the best!",
"windowEventDebounceTime": 500,
"urlParticipantIdParam": "PROLIFIC_ID",
"numSequences": 500
}

In the above, the <study-name>/assets/ path is referring to the path to your individual study assets. It is common practice to have your study directory contain an assets directory where all components and images relevant to your study reside. Note that this path is relative to the public folder of the repository - as is all other paths you define in reVISit (aside from React components whose paths are relative to src/public.)

Properties​

PropertyTypeDescriptionDefined in
allowFailedTraining?booleanControls whether the component should allow failed training. Defaults to true.parser/types.ts:282
autoDownloadStudy?booleanControls whether the study data is automatically downloaded at the end of the study.parser/types.ts:300
autoDownloadTime?numberThe time in milliseconds to wait before automatically downloading the study data.parser/types.ts:302
clickToRecord?booleanEnables a click-and-hold microphone button instead of continuous recording. When true, audio is muted by default and is recorded only while the button is held. When false, recording starts immediately and can be paused/resumed via the microphone button. Defaults to false.parser/types.ts:286
contactEmailstringThe email address that used during the study if a participant clicks contact.parser/types.ts:246
enumerateQuestions?booleanWhether to prepend questions with their index (+ 1). This should only be used when all questions are in the same location, e.g. all are in the side bar.parser/types.ts:292
helpTextPath?stringThe path to the help text file. This is displayed when a participant clicks help. Markdown is supported.parser/types.ts:262
instructionLocation?ConfigResponseBlockLocationThe location of the instructions.parser/types.ts:260
logoPathstringThe path to the logo image. This is displayed on the landing page and the header.parser/types.ts:244
nextButtonDisableTime?numberThe time in milliseconds to wait before the next button is disabled.parser/types.ts:272
nextButtonEnableTime?numberThe time in milliseconds to wait before the next button is enabled.parser/types.ts:270
nextButtonLocation?ConfigResponseBlockLocationThe location of the next button.parser/types.ts:268
nextButtonText?stringThe text to display on the next button.parser/types.ts:266
nextOnEnter?booleanWhether enter key should move to the next question. Defaults to false.parser/types.ts:264
numSequences?numberThe number of sequences to generate for the study. This is used to generate the random sequences for the study. Defaults to 1000.parser/types.ts:304
participantNameField?stringThe default name field for a participant. Directs reVISit to use the task and response id as a name in UI elements. For example, if you wanted the response 'prolificId' from the task 'introduction' to be the name, this field would be 'introduction.prolificId'parser/types.ts:308
previousButtonText?stringThe text that is displayed on the previous button.parser/types.ts:274
provideFeedback?booleanControls whether the component should provide feedback to the participant, such as in a training trial. Defaults to false.parser/types.ts:278
recordAudio?booleanWhether or not we want to utilize think-aloud features. If true, will record audio on all components unless deactivated on individual components. Defaults to false.parser/types.ts:284
recordScreen?booleanWhether or not we want to utilize screen recording feature. If true, will record audio on all components unless deactivated on individual components. This must be set to true if you want to record audio on any component in your study. Defaults to false. It's also required that the library component, $screen-recording.components.screenRecordingPermission, be included in the study at some point before any component that you want to record the screen on to ensure permissions are granted and screen capture has started.parser/types.ts:288
recordScreenFPS?numberDesired fps for recording screen. If possible, this value will be used, but if it's not possible, the user agent will use the closest possible match.parser/types.ts:290
responseDividers?booleanWhether to show the response dividers. Defaults to false.parser/types.ts:294
showTitle?booleanControls whether the title should be hidden in the study.parser/types.ts:256
showTitleBar?booleanControls whether the title bar should be hidden in the study.parser/types.ts:258
sidebarWidth?numberThe width of the left sidebar. Defaults to 300.parser/types.ts:254
studyEndMsg?stringThe message to display when the study ends.parser/types.ts:298
stylesheetPath?stringThe path to the external stylesheet file.parser/types.ts:310
timeoutReject?booleanWhether to redirect a timed out participant to a rejection page. This only works for components where the nextButtonDisableTime field is set.parser/types.ts:276
trainingAttempts?numberThe number of training attempts allowed for the component. The next button will be disabled until either the correct answer is given or the number of attempts is reached. When the number of attempts is reached, if the answer is incorrect still, the correct value will be shown to the participant. The default value is 2. Providing a value of -1 will allow infinite attempts and the participant must enter the correct answer to continue, and reVISit will not show the correct answer to the user.parser/types.ts:280
urlParticipantIdParam?stringIf the participant ID is passed in the URL, this is the name of the querystring parameter that is used to capture the participant ID (e.g. PROLIFIC_ID). This will allow a user to continue a study on different devices and browsers.parser/types.ts:306
windowEventDebounceTime?numberDebounce time in milliseconds for automatically tracked window events. Defaults to 100. E.g 100 here means 1000ms / 100ms = 10 times a second, 200 here means 1000ms / 200ms = 5 times per secondparser/types.ts:296
withProgressBarbooleanControls whether the progress bar is rendered in the study.parser/types.ts:248
withSidebarbooleanControls whether the left sidebar is rendered at all. Required to be true if your response's location is set to sidebar for any question.parser/types.ts:250