Spin Wheel Widget

The spin wheel turns your lesson into a moment of suspense. Learners spin a wheel of your own segments, the wheel lands on one, and the actions you defined for that segment run automatically — navigate to a different scene, award points, set a variable, play an effect, or anything else your lesson needs.

Select the wheel on the canvas and click the floating ⚙ Configure button to open its setup dialog — the segments, spin behavior, and scoring all live there. See Configuring a Spin Wheel for the full walkthrough.

Settings to know

• Segments (2–24) — each wedge of the wheel. Every segment has a label, color, weight, points value, and a list of On Selected actions.
• Max spins — how many times the learner can spin the wheel. Defaults to one. After the limit, the wheel locks.
• Require spin to complete scene — when on (and Scoring is enabled), the scene cannot be marked complete until the wheel has been spun at least once. Use this when the spin is a required step.
• Spin duration — how long the wheel spins before landing, in milliseconds. The default of four seconds is the right "suspense" range for most lessons; lower it for fast-paced games.
• Show pointer — toggles the triangular pointer at the top of the wheel.
• Never repeat winning segments — when on, a segment that has already won is excluded from future spins. The wheel locks once every segment has been chosen, and only a Reset action (e.g. a button calling the wheel's reset method) re-enables it. Useful for fair random pickers — picking each student exactly once, working through a list of vocabulary words, etc.

Per-segment settings

Each segment has its own configuration:

• Label — what the learner sees in the wedge.
• Color — the wedge fill color. Bright contrasting colors make the wheel readable from across the room.
• Weight — relative probability. Equal weights (default) mean every segment is equally likely. A weight of 3 is three times more likely than a weight of 1 — use this for a "rare prize" wheel.
• Points — points added to the widget's score when this segment is selected. Scoring is on by default, so these points count right away; turn Scoring off to make the wheel purely cosmetic.
• On Selected — the list of actions that run after the wheel lands on this segment. You can mix and match any of the standard actions (navigate to a scene, set or increment a variable, play an effect, call a method on another widget, etc.) just like you would on any other interaction.
• Condition (optional) — click Add Condition under a segment's actions to run them only when something is true, like "the wheel's Spin count equals 3" for a prize that only pays out on the last spin. The spin and its points still count either way; the condition only decides whether the actions run. It's checked after the spin lands, so the wheel's own Spin count and Last selected segment already include this spin.

Grading setup

The spin wheel is a participation widget — there's no "right" segment to get correct. It still ships with Scoring on by default, so it can do two things:

1. Award points based on which segment is selected — set each segment's Points field, and the score adds to both the scene and lesson totals. The wheel has no Points field of its own: it's worth the most its segments can award — the best segment on every spin, or, with Never repeat winning segments on, the best different segments one per spin. A learner who never spins scores 0 out of that same total.
2. Gate the scene — turn on Require spin to complete scene and the scene won't be considered complete until the wheel has been spun. This is how you turn a spin into a required step in a story or activity.

If you set Require spin to complete scene but don't enable Scoring, you'll see a reminder in the editor — the gate only applies when scoring is on.

How to set up the content

Start with two to four segments and label them clearly. The wheel reads best when labels are short — one or two words. Use distinct colors so learners can see where the wheel landed at a glance.

For each segment, decide what should happen when it's selected. The most common patterns:

• Random branching activity: four segments, each with navigate_to_scene actions pointing at four different scenes. Step-by-step: Spin a wheel to pick a random challenge.
• Vocabulary roulette: ten segments labeled with vocabulary words, each with a set_variable action that sets a "current word" variable used by a later scene.
• Story starter: four heroes, each segment setting a hero variable that a line of text shows with {{ hero }}. Step-by-step: Spin a wheel to pick a story starter.
• Prize wheel: uneven weights and per-segment points to create a rare grand-prize segment. A segment can even send the learner straight to the lesson's ending — its points are counted before the wheel moves on.
• Story dice: each segment fires a different combination of set_variable and play_effect actions to shape the next scene.

Useful setting combinations

• Spin Wheel + Score widget: show the running total of points across many spins.
• Spin Wheel + play_effect action: celebrate the result with confetti or fireworks.

How the spin feels

A few details to know if you're tuning the experience:

• Click anywhere on the wheel to spin. The central hub button is the keyboard target, but for mouse and touch the entire wheel area is a tap target.
• Spin curve. The wheel ramps up smoothly, accelerates through the middle, then decelerates onto the landing wedge. It feels like a real spinning wheel — not a constant-speed rotation, not a snap.
• Pointer flick. As the wheel spins, the pointer at the top nudges every time a segment edge passes under it — wide, heavily weighted segments tick less often than narrow ones — the way a physical pointer would tick against a peg. The flicks slow down as the wheel slows, reinforcing the deceleration visually.
• Pointer placement. The pointer overlaps the rim with its base above the wheel and the tip resting inside the segments — so when the wheel stops, it's unambiguous which segment won.

Accessibility

The wheel is fully keyboard-operable: Tab to focus the spin hub, Space or Enter to spin. The result is announced to assistive technology when the wheel stops. If a learner has reduced-motion turned on in their device settings, the spin animation is shortened so the result appears almost immediately — actions still run normally, and the pointer flick is suppressed.

Great pairings with other widgets

• Pair the spin wheel with text to add directions like "Spin once to find out what you'll do next."
• Pair it with score to make the points it awards visible.
• Pair it with audio or text to speech for a "ta-da" sound when the wheel stops (call the audio widget's play method from an On Selected action).
• See Scene Progression for more on how the required-spin gate interacts with scene advancement.