Component Overview
Components are the building blocks of interactive experiments in HyperStudy. They provide the interface elements that participants see and interact with.
HyperStudy has two types of components:
- Focus Components: The main interactive element in each experiment state. Only one focus component can be active per state.
- Global Components: Elements that persist across multiple states, providing consistent functionality throughout the experiment.
Each component page below includes interactive demos from storybook.hyperstudy.io where you can explore configurations live.
Focus Components
Focus components are the primary content of each experiment state. When you add a state, you select a focus component for that state.
| Component | Description | Common Uses |
|---|---|---|
| Text Display | Shows formatted text content | Instructions, stories, scenarios |
| Image | Displays static images | Visual stimuli, diagrams, photos |
| Synchronized Video | Plays video with precise synchronization | Stimuli, demonstrations, scenarios |
| Multiple Choice | Presents a question with selectable options | Quizzes, surveys, decision tasks |
| Text Input | Field for free text entry | Open questions, form fields |
| VAS Rating | Visual analog scale for continuous ratings | Subjective ratings, evaluations |
| Audio Recording | Records participant audio responses | Voice responses, think-aloud tasks |
| Code | Display syntax-highlighted code | Programming tasks, code review |
| Waiting | Empty state with optional message | Transitions, synchronization points |
| Trigger | Hardware trigger send/receive | fMRI sync, equipment time-locking |
| Likert Scale | Standard agreement/frequency scales | Surveys, questionnaires |
| Ranking | Drag-and-drop ranking of items | Preference ordering, prioritization |
| Rapid Rate | Multi-dimensional quick rating | Emotion ratings, fast assessments |
Global Components
Global components persist across multiple experiment states. Configure them once and control their visibility per state using the visibility matrix.
| Component | Description | Common Uses |
|---|---|---|
| Video Chat | Real-time audio/video communication | Participant interactions, interviews |
| Text Chat | Text messaging between participants | Text-based communication |
| Continuous Rating | Real-time rating during stimuli | Moment-by-moment evaluations |
| Sparse Rating | Time-based rating prompts | Moment-specific evaluations |
| Scanner Pulse Recorder | Records fMRI scanner TR pulses | fMRI hyperscanning synchronization |
| Gaze Overlay | Real-time eye tracking visualization | Gaze monitoring, calibration verification |
Common Properties
All components share these configurable properties:
- Title: Optional heading text for the component
- Instructions: Optional guidance text for participants
- Width/Height: Size settings (percentage or pixels)
- Visibility: Which roles can see this component
Stimulus Display
Seven input components support showing an image alongside the response interface: Text Input, Likert Scale, VAS Rating, Multiple Choice, Ranking, Audio Recording, and Rapid Rate. Enable "Show Stimulus Image" in the component config to display a static or dynamic image in one of four layout positions (above, below, left, right). See Stimulus Display for details.
Text Formatting
All text fields in components support:
- Variables: Insert dynamic values using
{variableName}syntax - HTML Tags: Format text with
<b>,<i>,<u>,<s>,<h1>-<h6>,<br>,<p>
See Text Component - HTML Formatting for details.