Skip to main content
Lessons in Handhold are narrated, animated presentations that combine code, visualizations, diagrams, and math to explain programming concepts. This guide covers how to control playback and navigate through lessons effectively.

​
Lesson Interface

The lesson view consists of:
  • Sidebar: Shows all steps in the lesson with progress indicators
  • Stage: The main visualization area where animations appear
  • Narration text: Displays the current narration at the bottom
  • Controls: Playback controls and progress bar

​
Playback Controls

Use the control bar at the bottom of the lesson to manage playback:
ControlFunction
PreviousJump to the previous step
Play/PauseStart or pause narration and animation
NextAdvance to the next step
Progress barScrub to any point in the current step
Speed selectorAdjust playback speed (0.75x - 2x)
The controls automatically disable when you reach the first or last step

​
Keyboard Navigation

Lessons support keyboard controls for efficient navigation:
KeyAction
SpacePlay/Pause, or advance to next step if current step is complete
→ (Right Arrow)Next step
← (Left Arrow)Previous step
Keyboard shortcuts work when the lesson view is focused. Click the stage area to ensure focus.

​
Scrubbing Through Content

The progress bar shows your position in the current step’s narration:
1

Click the progress bar

Click anywhere on the bar to jump to that position
2

Drag the indicator

Click and drag the progress indicator for fine-grained control
3

Audio and animation sync

Narration and animations automatically sync to the new position

​
Viewing Step Content

As narration plays, the stage updates to show:
  • Code: Syntax-highlighted code with focus regions and annotations
  • Data structures: Visual representations of arrays, trees, graphs, and more
  • Diagrams: System architecture and flow diagrams
  • Math: LaTeX-rendered equations and formulas
  • Charts: Bar, line, and scatter plots
Animations are triggered by specific words in the narration, creating a synchronized visual experience.

​
Step Progress

Handhold tracks your progress through lessons:
  • Completed steps: Show a filled green indicator in the sidebar
  • Current step: Highlighted with a pulsing indicator
  • Incomplete steps: Show an outline indicator
Progress is saved automatically—you can close and resume lessons anytime

​
Jumping Between Steps

To navigate directly to a specific step:
1

Locate the step in the sidebar

The sidebar shows all steps with their titles
2

Click the step

Click any step to jump directly to it
3

Playback resets

The new step starts from the beginning

​
Smart Play Behavior

When you press Space on a completed step:
  1. Handhold advances to the next step
  2. If the next step exists, playback begins automatically
  3. If you’re on the last step, the course completion callback fires (if configured)
This allows you to quickly move through completed content by repeatedly pressing Space

​
Lesson Completion

A lesson step is marked complete when:
  • You’ve played the narration to the end, or
  • You’ve manually advanced past the step
Completed lessons appear with a filled indicator in the sidebar for easy reference.

Build docs developers (and LLMs) love

Get started for freeTalk to us