> ## Documentation Index
> Fetch the complete documentation index at: https://docs.assesskit.com/llms.txt
> Use this file to discover all available pages before exploring further.

# Timeline Management

> Control trial sequences, randomization, and experimental flow

## What is a Timeline?

In Cajal (and jsPsych), a **timeline** is the sequence of events that make up your experiment. Think of it as the blueprint that defines what participants see, when they see it, and in what order.

<Note>
  The timeline controls the flow of your experiment from start to finish. It specifies not just individual trials, but also how trials repeat, randomize, and connect together.
</Note>

### Timeline vs. Frames

* **Frame**: A single screen or moment in time (e.g., a fixation cross, a stimulus display)
* **Timeline**: The complete sequence of frames that make up your task

**Example**: A Stroop trial timeline might be:

```
Frame 1: Fixation (500ms) → Frame 2: Stimulus + Response → Frame 3: Feedback (1000ms) → Frame 4: Blank (500ms)
```

This 4-frame sequence would then **loop** for 50 trials with different stimuli.

***

## Frame-Based Timeline Structure

### Understanding Frames

Frames are the building blocks of your timeline. Each frame represents a discrete moment in the experiment.

<CardGroup cols={2}>
  <Card title="Single Frame" icon="image">
    One screen with components (e.g., "Show fixation cross")
  </Card>

  <Card title="Frame Sequence" icon="film">
    Multiple frames in order (e.g., "Fixation → Stimulus → Feedback")
  </Card>

  <Card title="Frame Duration" icon="stopwatch">
    How long each frame displays (fixed time or until response)
  </Card>

  <Card title="Frame Transitions" icon="arrow-right">
    Auto-advance or wait for response
  </Card>
</CardGroup>

### Frame Duration Options

Each frame can display for:

1. **Fixed Duration**: Exact time in milliseconds (e.g., 500ms)
2. **Until Response**: Wait for participant input (0ms = unlimited)
3. **Maximum Duration**: Display up to X ms, but advance on response
4. **Conditional Duration**: Based on previous response or trial variable

<Tabs>
  <Tab title="Fixed Duration Example">
    **Fixation cross for exactly 500ms**

    ```text theme={null}
    Frame 1:
    - Component: Black Fixation Cross
    - Duration: 500ms
    - Auto-advance: Yes
    ```

    This frame will display for exactly 500ms, then automatically move to the next frame.
  </Tab>

  <Tab title="Response-Based Example">
    **Stimulus until participant responds**

    ```text theme={null}
    Frame 2:
    - Components: Stroop Stimulus + Response Component
    - Duration: 0 (until response)
    - Timeout: 5000ms (optional max)
    ```

    This frame waits indefinitely for a response (or until 5-second timeout).
  </Tab>

  <Tab title="Hybrid Example">
    **Show stimulus for max 2 seconds, but advance on response**

    ```text theme={null}
    Frame 2:
    - Components: Image Stimulus + Button Response
    - Duration: 2000ms (maximum)
    - Advance on Response: Yes
    ```

    Frame ends when participant responds OR after 2 seconds, whichever comes first.
  </Tab>
</Tabs>

***

## Timeline Variables

**Timeline variables** are the secret to running multiple trials with different stimuli while using the same trial structure.

### What Are Timeline Variables?

Timeline variables define **per-trial data** that changes across repetitions. Instead of creating 50 separate trials, you create **one trial template** and **one table of variables**.

<Info>
  Think of timeline variables as a spreadsheet where each row is one trial, and each column is a variable that changes per trial (stimulus word, correct answer, condition, etc.).
</Info>

### Example: Stroop Task Timeline Variables

<CodeGroup>
  ```text Variables Table theme={null}
  | word    | color  | congruent | correct_key |
  |---------|--------|-----------|-------------|
  | RED     | red    | true      | r           |
  | RED     | blue   | false     | b           |
  | BLUE    | blue   | true      | b           |
  | BLUE    | red    | false     | r           |
  | GREEN   | green  | true      | g           |
  | GREEN   | red    | false     | r           |
  | YELLOW  | yellow | true      | y           |
  | YELLOW  | blue   | false     | b           |
  ```

  ```text Usage in Components theme={null}
  Frame 2: Stimulus + Response

  Text Stimulus Component:
  - Text: {{word}}           (e.g., "RED", "BLUE")
  - Color: {{color}}         (e.g., red, blue)

  Response Component:
  - Correct Answer: {{correct_key}}  (e.g., "r", "b")

  Custom Data:
  - congruent: {{congruent}}  (true/false)
  ```
</CodeGroup>

### How Timeline Variables Work

1. **Define the table**: Create columns for each variable that changes per trial
2. **Reference variables**: Use `{{variable_name}}` in component properties
3. **Set repetition**: Specify how many rows to use (all, subset, or specific count)
4. **Randomize**: Optionally randomize row order

<Steps>
  <Step title="Create Variable Columns">
    Define what changes per trial (stimulus, condition, correct answer, etc.)
  </Step>

  <Step title="Fill in Rows">
    Each row represents one trial with specific values for each variable
  </Step>

  <Step title="Link to Components">
    Use `{{variable_name}}` syntax in component properties to reference variables
  </Step>

  <Step title="Configure Looping">
    Set how many trials run (all rows, subset, or repeat rows)
  </Step>
</Steps>

***

## Trial Sequences and Loops

### Basic Looping

The simplest timeline loops through all rows of your timeline variables exactly once.

**Example**: 8 rows in timeline variables = 8 trials

<Card title="Basic Loop Configuration" icon="repeat">
  **Settings**:

  * **Repetitions**: 1 (each row once)
  * **Randomize**: Yes
  * **Sampling**: Without replacement (each row used once)

  **Result**: 8 randomized trials, each with different stimulus values
</Card>

### Advanced Looping Options

<AccordionGroup>
  <Accordion title="Multiple Repetitions" icon="arrows-rotate">
    **Use case**: Repeat each condition multiple times

    **Configuration**:

    * **Timeline Variables**: 8 rows
    * **Repetitions**: 3
    * **Result**: 24 trials (each row appears 3 times)

    **Best for**: Increasing trial count while maintaining balanced conditions
  </Accordion>

  <Accordion title="Partial Sampling" icon="shuffle">
    **Use case**: Randomly sample subset of trials

    **Configuration**:

    * **Timeline Variables**: 100 rows
    * **Sample Size**: 20 trials
    * **Sampling**: Random without replacement
    * **Result**: 20 trials randomly selected from 100 options

    **Best for**: Large stimulus sets where you want variety without running all trials
  </Accordion>

  <Accordion title="Sampling with Replacement" icon="recycle">
    **Use case**: Allow same trial to appear multiple times

    **Configuration**:

    * **Timeline Variables**: 10 rows
    * **Sample Size**: 30 trials
    * **Sampling**: Random with replacement
    * **Result**: 30 trials, some rows may repeat

    **Best for**: When you want more trials than unique stimuli
  </Accordion>

  <Accordion title="Blocked Design" icon="table-cells">
    **Use case**: Group trials into distinct blocks

    **Configuration**:

    * **Block 1**: Congruent trials only (filter `congruent == true`)
    * **Block 2**: Incongruent trials only (filter `congruent == false`)
    * **Order**: Randomize within blocks, counterbalance block order

    **Best for**: Comparing performance across conditions
  </Accordion>
</AccordionGroup>

***

## Randomization and Counterbalancing

### Randomization Options

Cajal supports multiple randomization strategies:

<Tabs>
  <Tab title="Full Randomization">
    **Strategy**: Completely random trial order

    **Configuration**:

    * **Randomize**: Yes
    * **Constraints**: None

    **Example**: Stroop task with 48 trials in completely random order

    **Best for**: Most cognitive tasks where order effects are minimal
  </Tab>

  <Tab title="Pseudorandomization">
    **Strategy**: Randomize with constraints

    **Configuration**:

    * **Randomize**: Yes
    * **Constraints**: "No more than 3 consecutive congruent trials"

    **Example**: Prevent long runs of the same condition

    **Best for**: Controlling potential confounds from sequential effects
  </Tab>

  <Tab title="Fixed Order">
    **Strategy**: Present trials in exact table order

    **Configuration**:

    * **Randomize**: No

    **Example**: Gradually increasing difficulty level

    **Best for**: Training tasks, difficulty ramps, specific sequences
  </Tab>

  <Tab title="Block Randomization">
    **Strategy**: Randomize within blocks, fixed block order

    **Configuration**:

    * **Within-block**: Randomized
    * **Between-block**: Fixed order

    **Example**: Practice block (randomized) → Test block (randomized)

    **Best for**: Separating practice from test, comparing blocks
  </Tab>
</Tabs>

### Counterbalancing

Counterbalancing ensures condition order varies systematically across participants.

<AccordionGroup>
  <Accordion title="Simple Counterbalancing" icon="arrows-left-right">
    **Method**: Alternate condition order based on participant ID

    **Example**:

    * **Participant 1, 3, 5...**: Condition A → Condition B
    * **Participant 2, 4, 6...**: Condition B → Condition A

    **Implementation**:
    Use conditional timeline branching based on participant ID (odd/even)
  </Accordion>

  <Accordion title="Latin Square Counterbalancing" icon="table">
    **Method**: Systematically rotate condition order across participants

    **Example (3 conditions)**:

    * **Participant 1**: A → B → C
    * **Participant 2**: B → C → A
    * **Participant 3**: C → A → B

    **Implementation**:
    Generate different timeline variable orders based on participant number
  </Accordion>

  <Accordion title="Response Key Counterbalancing" icon="keyboard">
    **Method**: Alternate which key maps to which response

    **Example**:

    * **Group 1**: Z = Left, M = Right
    * **Group 2**: M = Left, Z = Right

    **Implementation**:
    Use timeline variables to swap correct answer mappings
  </Accordion>
</AccordionGroup>

***

## Sequential vs. Conditional vs. Randomized Flow

### Sequential Flow

The simplest timeline: frames advance in a fixed order.

```mermaid theme={null}
graph LR
    A[Frame 1: Fixation] --> B[Frame 2: Stimulus]
    B --> C[Frame 3: Feedback]
    C --> D[Frame 4: ITI]
    D --> A
```

**Use case**: Standard trial structure where every trial follows the same sequence

### Conditional Flow

Timeline branches based on participant responses or trial variables.

```mermaid theme={null}
graph TD
    A[Response Frame] --> B{Correct?}
    B -->|Yes| C[Positive Feedback]
    B -->|No| D[Corrective Feedback]
    C --> E[Continue]
    D --> E[Continue]
```

**Use case**: Adaptive tasks, branching experiments, conditional feedback

<Tabs>
  <Tab title="Accuracy-Based Branching">
    **Logic**: Show different feedback based on correctness

    ```text theme={null}
    Frame 3: Conditional Feedback
    - If response == correct_answer:
        Show "Correct!" (green, 500ms)
    - Else:
        Show "Incorrect" (red, 1000ms)
    ```
  </Tab>

  <Tab title="Response-Based Branching">
    **Logic**: Different next trial based on participant choice

    ```text theme={null}
    Frame 2: Preference Question
    - If response == "A":
        → Show Image Set A
    - Else if response == "B":
        → Show Image Set B
    ```
  </Tab>

  <Tab title="Performance-Based Branching">
    **Logic**: Adjust difficulty based on accuracy

    ```text theme={null}
    After Block 1:
    - If accuracy > 80%:
        → Proceed to Hard Trials
    - Else:
        → Repeat Practice Trials
    ```
  </Tab>
</Tabs>

### Randomized Flow

Trial order determined randomly at runtime.

**Use case**: Prevent order effects, increase generalizability

<Card title="Randomization Levels" icon="dice">
  **Within-Trial**: Randomize component positions (e.g., left/right stimulus placement)

  **Between-Trial**: Randomize trial order from timeline variables

  **Between-Block**: Randomize block order (counterbalanced across participants)
</Card>

***

## Timeline Best Practices

<CardGroup cols={1}>
  <Card title="Use Timeline Variables for Repetition" icon="table">
    **Don't**: Create 50 separate trial frames manually

    **Do**: Create 1 trial template + 50-row timeline variable table

    This reduces errors and makes updates easier.
  </Card>

  <Card title="Balance Your Conditions" icon="scale-balanced">
    Ensure equal trials per condition in your timeline variables.

    **Example**: 24 congruent trials, 24 incongruent trials (not 30 vs 18)
  </Card>

  <Card title="Include Practice Trials" icon="graduation-cap">
    Add a separate practice timeline before main trials:

    * Fewer trials (4-8 typically)
    * Same structure as main trials
    * Show feedback (even if hidden in main trials)
    * Allow participants to repeat if needed
  </Card>

  <Card title="Use Appropriate ISIs" icon="hourglass-half">
    **Inter-stimulus interval (ISI)** prevents visual persistence and resets attention.

    Typical ISIs:

    * **500ms**: Standard cognitive tasks
    * **1000ms**: After complex stimuli or feedback
    * **2000ms**: Between blocks or conditions
    * **Variable (500-1500ms)**: Prevent anticipatory responses
  </Card>

  <Card title="Test Timing Accuracy" icon="stopwatch">
    Browser-based timing is accurate to \~10-20ms, sufficient for most psychology tasks.

    **Tips for timing precision**:

    * Preload all images before trials start
    * Use simple stimuli for timing-critical tasks
    * Test on target hardware (desktop vs mobile)
    * Avoid video backgrounds or animations during critical timing
  </Card>

  <Card title="Consider Mobile Compatibility" icon="mobile">
    If participants may use mobile devices:

    * Use button responses instead of keyboard
    * Increase touch target sizes (min 44x44px)
    * Test on smaller screens
    * Avoid complex layouts that may not fit
  </Card>
</CardGroup>

***

## Common Timeline Patterns

### Pattern 1: Simple Repeated Trials

**Use case**: Basic cognitive task with identical trial structure

<CodeGroup>
  ```text Trial Structure theme={null}
  Frame 1: Fixation (500ms)
  Frame 2: Stimulus + Response (until response)
  Frame 3: Blank ISI (500ms)
  ```

  ```text Timeline Variables (6 rows) theme={null}
  | stimulus | correct_answer |
  |----------|----------------|
  | A        | left           |
  | B        | right          |
  | C        | left           |
  | D        | right          |
  | E        | left           |
  | F        | right          |
  ```

  ```text Configuration theme={null}
  Repetitions: 5
  Randomize: Yes
  Total trials: 30 (6 rows × 5 repetitions)
  ```
</CodeGroup>

### Pattern 2: Practice → Test Blocks

**Use case**: Training phase before main experiment

<CodeGroup>
  ```text Block 1: Practice theme={null}
  Timeline Variables: 4 rows
  Repetitions: 1
  Randomize: Yes
  Feedback: Shown
  Instructions: "This is practice. You will see feedback."
  ```

  ```text Block 2: Main Trials theme={null}
  Timeline Variables: 48 rows
  Repetitions: 1
  Randomize: Yes
  Feedback: Hidden
  Instructions: "Main experiment. No feedback will be shown."
  ```
</CodeGroup>

### Pattern 3: Study → Delay → Test

**Use case**: Memory experiments with encoding and retrieval phases

```mermaid theme={null}
graph LR
    A[Study Phase] --> B[Delay/Distractor]
    B --> C[Test Phase]
```

<CodeGroup>
  ```text Study Phase (Encoding) theme={null}
  Timeline Variables: 30 words
  Display: 2 seconds per word
  Response: None (just viewing)
  Randomize: Yes
  ```

  ```text Delay Phase theme={null}
  Task: Arithmetic distractor (2 minutes)
  Purpose: Prevent rehearsal
  ```

  ```text Test Phase (Retrieval) theme={null}
  Timeline Variables: 60 words (30 old + 30 new)
  Display: Until response
  Response: Old/New judgment
  Randomize: Yes
  ```
</CodeGroup>

### Pattern 4: Adaptive Difficulty

**Use case**: Adjust task difficulty based on performance

```text theme={null}
Trial N:
- Stimulus: Difficulty level based on previous accuracy
- Response: Collect answer
- Calculate: Running accuracy

After Trial:
- If last 10 trials > 80% correct → Increase difficulty
- If last 10 trials < 60% correct → Decrease difficulty
- Else → Maintain current difficulty

Next Trial:
- Use updated difficulty level
```

***

## Timeline Variables Reference

### Common Variable Types

| Variable Type        | Example                             | Purpose             |
| -------------------- | ----------------------------------- | ------------------- |
| **Stimulus Content** | `word`, `image_url`, `number`       | What to display     |
| **Correct Answer**   | `correct_key`, `correct_button`     | Scoring responses   |
| **Condition Tags**   | `congruent`, `condition`, `block`   | Experimental design |
| **Timing**           | `stimulus_duration`, `isi_duration` | Variable timing     |
| **Position**         | `stimulus_x`, `stimulus_y`          | Spatial control     |
| **Metadata**         | `trial_type`, `difficulty_level`    | Data analysis       |

### Variable Naming Best Practices

<Tabs>
  <Tab title="Good Variable Names">
    ```text theme={null}
    ✅ word (clear, concise)
    ✅ correct_answer (descriptive)
    ✅ image_url (indicates type)
    ✅ congruent (boolean condition)
    ✅ stimulus_duration_ms (includes units)
    ```
  </Tab>

  <Tab title="Avoid These Names">
    ```text theme={null}
    ❌ stim (too abbreviated)
    ❌ ans (unclear meaning)
    ❌ x (not descriptive)
    ❌ condition1 (use meaningful name instead)
    ❌ var (generic)
    ```
  </Tab>
</Tabs>

***

## Advanced Timeline Features

### Nested Timelines

Create **timelines within timelines** for complex experimental structures.

**Example**: A multi-block experiment

```text theme={null}
Experiment Timeline:
├── Consent Form
├── Instructions
├── Practice Block (nested timeline)
│   ├── Practice Instructions
│   ├── Practice Trials (10 trials)
│   └── Practice Feedback Summary
├── Break (1 minute)
├── Main Block 1 (nested timeline)
│   ├── Block 1 Instructions
│   └── Block 1 Trials (50 trials)
├── Break (1 minute)
├── Main Block 2 (nested timeline)
│   ├── Block 2 Instructions
│   └── Block 2 Trials (50 trials)
└── Debriefing
```

### Timeline Functions

Use JavaScript functions to dynamically generate timeline properties.

<Tabs>
  <Tab title="Dynamic Stimulus Selection">
    ```javascript theme={null}
    // Select stimulus based on previous accuracy
    stimulus: function() {
      const lastAccuracy = getAccuracy();
      return lastAccuracy > 0.8 ? 'hard_stimulus.png' : 'easy_stimulus.png';
    }
    ```
  </Tab>

  <Tab title="Variable ITI">
    ```javascript theme={null}
    // Randomize inter-trial interval
    duration: function() {
      return 500 + Math.random() * 1000; // 500-1500ms
    }
    ```
  </Tab>

  <Tab title="Conditional Display">
    ```javascript theme={null}
    // Show component only on certain trials
    show_if: function() {
      return getCurrentTrial() % 10 === 0; // Every 10th trial
    }
    ```
  </Tab>
</Tabs>

### Timeline Looping with Conditions

Loop through trials until a condition is met (instead of fixed count).

**Example**: Continue trials until participant reaches 80% accuracy

```text theme={null}
Loop Configuration:
- Loop Type: While condition true
- Condition: accuracy < 0.80
- Max Iterations: 100 (safety limit)
- Min Iterations: 20 (ensure minimum data)
```

***

## Data Collection from Timelines

### Automatic Timeline Data

Every trial automatically records:

| Data Field         | Description                         |
| ------------------ | ----------------------------------- |
| `trial_index`      | Sequential trial number (0-indexed) |
| `time_elapsed`     | Milliseconds since experiment start |
| `trial_type`       | jsPsych plugin used                 |
| `internal_node_id` | Timeline position identifier        |

### Custom Timeline Data

Add custom data fields to each trial:

```javascript theme={null}
Timeline Variables:
| word  | color | congruent | correct_key |
|-------|-------|-----------|-------------|
| RED   | red   | true      | r           |
| BLUE  | blue  | true      | b           |

Additional Data Saved:
- word: "RED"
- color: "red"
- congruent: true
- correct_key: "r"
- (plus response, rt, correct from response component)
```

### Timeline-Level Data

Add data that applies to all trials in a timeline:

```text theme={null}
Timeline Settings:
- Block Number: 1
- Condition: "experimental"
- Session ID: "abc123"

Result: Every trial in this timeline gets these additional data fields
```

***

## Performance Considerations

### Optimizing Timeline Performance

<CardGroup cols={1}>
  <Card title="Preload Media" icon="download">
    Load all images, audio, and video before trials start.

    **Why**: Prevents delays during trial presentation

    **How**: Cajal automatically preloads media referenced in timeline variables
  </Card>

  <Card title="Minimize Timeline Variable Rows" icon="table">
    Use repetition settings instead of duplicating rows.

    **Don't**: 1000 rows with many duplicates

    **Do**: 50 unique rows × 20 repetitions
  </Card>

  <Card title="Avoid Complex Calculations Per Trial" icon="calculator">
    Pre-compute values in timeline variables when possible.

    **Don't**: Calculate stimulus position on every trial

    **Do**: Pre-define positions in timeline variable columns
  </Card>

  <Card title="Test on Target Devices" icon="mobile-screen">
    Performance varies significantly between desktop and mobile.

    **Desktop**: Faster, more consistent timing

    **Mobile**: Slower, more variable (test your actual design)
  </Card>
</CardGroup>

***

## Troubleshooting Common Timeline Issues

<AccordionGroup>
  <Accordion title="Trials Not Randomizing" icon="shuffle">
    **Problem**: Trials appear in same order every time

    **Solution**:

    * Check "Randomize" setting is enabled
    * Ensure sampling method is set correctly
    * Verify timeline variables table exists
  </Accordion>

  <Accordion title="Timeline Variables Not Displaying" icon="eye-slash">
    **Problem**: `{{variable_name}}` appears literally instead of value

    **Solution**:

    * Check variable name spelling matches exactly
    * Ensure timeline variables table has this column
    * Verify variable is wrapped in double curly braces: `{{name}}`
  </Accordion>

  <Accordion title="Wrong Number of Trials" icon="hashtag">
    **Problem**: More or fewer trials than expected

    **Solution**:

    * Check repetition setting (rows × repetitions = total trials)
    * Verify sampling method (with/without replacement)
    * Look for nested timeline repetitions multiplying count
  </Accordion>

  <Accordion title="Timing Feels Off" icon="clock">
    **Problem**: Stimuli display for wrong duration

    **Solution**:

    * Verify duration is in milliseconds (not seconds)
    * Check for response-based advancement overriding duration
    * Ensure preloading is complete before trials start
    * Test on target hardware (timing varies by device)
  </Accordion>

  <Accordion title="Conditions Unbalanced" icon="scale-unbalanced">
    **Problem**: Some conditions appear more than others

    **Solution**:

    * Count rows per condition in timeline variables
    * Ensure equal representation in source table
    * Check sampling method isn't creating imbalance
  </Accordion>
</AccordionGroup>

***

## Examples: Complete Timelines

### Example 1: Basic Stroop Task

<CodeGroup>
  ```text Timeline Variables (8 rows) theme={null}
  | word   | color  | congruent | correct_key |
  |--------|--------|-----------|-------------|
  | RED    | red    | true      | r           |
  | RED    | blue   | false     | b           |
  | BLUE   | blue   | true      | b           |
  | BLUE   | red    | false     | r           |
  | GREEN  | green  | true      | g           |
  | GREEN  | blue   | false     | b           |
  | YELLOW | yellow | true      | y           |
  | YELLOW | red    | false     | r           |
  ```

  ```text Trial Structure theme={null}
  Frame 1: Black Fixation Cross
  - Duration: 500ms

  Frame 2: Stroop Stimulus + Response
  - Text: {{word}}
  - Color: {{color}}
  - Valid Keys: r, g, b, y
  - Correct Answer: {{correct_key}}
  - Timeout: 5000ms

  Frame 3: Feedback
  - Show "Correct!" or "Incorrect"
  - Duration: 500ms

  Frame 4: Blank ISI
  - Duration: 500ms
  ```

  ```text Configuration theme={null}
  Repetitions: 6
  Randomize: Yes
  Total Trials: 48 (8 rows × 6 reps)
  Duration: ~5 minutes
  ```
</CodeGroup>

### Example 2: Recognition Memory Task

<CodeGroup>
  ```text Study Phase Timeline Variables (30 rows) theme={null}
  | item          | item_type |
  |---------------|-----------|
  | elephant.jpg  | animal    |
  | hammer.jpg    | tool      |
  | ...           | ...       |
  ```

  ```text Study Phase Structure theme={null}
  Frame 1: Fixation (500ms)
  Frame 2: Study Item
  - Image: {{item}}
  - Duration: 2000ms
  - Instruction: "Remember this item"
  Frame 3: Blank (1000ms)

  Configuration:
  - Repetitions: 1
  - Randomize: Yes
  - Total: 30 study trials
  ```

  ```text Delay Phase theme={null}
  Distractor Task: Math problems (2 minutes)
  ```

  ```text Test Phase Timeline Variables (60 rows) theme={null}
  | item          | old_new |
  |---------------|---------|
  | elephant.jpg  | old     |
  | hammer.jpg    | old     |
  | bicycle.jpg   | new     |
  | ...           | ...     |
  ```

  ```text Test Phase Structure theme={null}
  Frame 1: Fixation (500ms)
  Frame 2: Test Item + Response
  - Image: {{item}}
  - Valid Keys: Z (Old), M (New)
  - Correct Answer: {{old_new}}
  Frame 3: Blank (500ms)

  Configuration:
  - Repetitions: 1
  - Randomize: Yes
  - Total: 60 test trials
  ```
</CodeGroup>

***

## Next Steps

<CardGroup cols={2}>
  <Card title="Component Library" icon="puzzle-piece" href="/task-editor/components">
    Learn about available components for your timeline
  </Card>

  <Card title="Task Editor Overview" icon="wand-magic-sparkles" href="/task-editor">
    Return to Task Editor main documentation
  </Card>

  <Card title="Templates" icon="clone" href="/templates">
    Browse pre-built timeline templates
  </Card>
</CardGroup>