Interaction Recipes

The easiest way to build good lesson logic is to start from a small pattern that already fits a teaching moment.

Tip: several of these patterns are now one tap away. Select a widget on the canvas and press ⚡ Behaviors — the guided behaviors flow offers ready-made ideas that fit your scene and writes each one out in plain words before you add it.

These recipes use the product’s real interaction model:

• Events trigger behavior
• Actions do the work
• Conditions keep the result intentional

Recipe: Button reveals an image

Use this when:

• Learners should think before seeing the answer
• You want to stage a visual explanation
• An answer key should appear only on demand

Pattern:

1. Place an image widget and keep it hidden by default
2. Place a button labeled Reveal
3. Make the button use the image widget’s Show action
4. Optionally hide the button after it is pressed

Good pairings:

• Button + image
• Button + text
• Button + shape-backed explanation panel

Recipe: Submit and branch

Use this when:

• Learners should complete a full task before seeing the outcome
• You want a clear pass/fail path
• The activity should feel like a checkpoint

Pattern:

1. Enable grading on the relevant widgets
2. Add a Submit button
3. Make the button submit answers for the current scene
4. In the scene's Progression settings, choose Navigate to a scene and pick your success scene
5. Add a regular Button labeled Try Again to give students who need another attempt a way back

Good pairings:

• Button + graded widgets + score
• Multiple choice + feedback scene
• Text input + retry scene

Recipe: One button, two branches

Use this when:

• You want a single button to do the branching, instead of a separate "Try Again" button
• The two outcomes are mutually exclusive — correct vs. not yet correct
• You want to avoid cluttering the scene with extra navigation widgets

Pattern:

1. In the scene's Progression settings, set the mode to Stay — this recipe's button does the navigating, so the scene itself must not auto-advance the moment an answer becomes correct.
2. Enable grading on the relevant widgets and add a Submit button.
3. On the button's On Press event, add a first behavior: submit the current scene's answers, with a condition that the scene is passing, and a Navigate to scene action pointing at your success scene.
4. Press Add Behavior and choose On Press again to add a second behavior on the _same_ button: submit the answers, with a condition that the scene is not passing, and a Display Message action showing an encouraging "not quite — try again" message.

Berdee checks both behaviors against the state at the moment of the press, so exactly one fires — the learner never sees both. See Several behaviors on one event for how this works under the hood.

Good pairings:

• Submit button + multiple choice + one On Press event driving both outcomes
• Any scene where you want to avoid a second, separate retry button

Recipe: Show immediate modal feedback

Use this when:

• The learner should acknowledge feedback before continuing
• You want feedback without creating a separate scene
• A short success, failure, or reminder message is enough

Pattern:

1. Choose the event that should produce feedback, such as a button press, correct selection, wrong selection, timer completion, or answer submission
2. Add a Display Message action
3. Write the message learners should read
4. Choose Normal, Success, or Failure as the message style
5. Keep any next action after the message simple, because the learner must dismiss the modal before continuing

Good pairings:

• Multiple choice + success or failure message
• Submit button + failure guidance
• Timer + normal "time is up" message
• Hint button + normal reminder

Recipe: Show a hint after a failed attempt

Use this when:

• You want support to feel earned
• You want to avoid over-explaining too early
• Learners may need a second chance before the full answer is revealed

Pattern:

1. Track attempts with a variable or pass/fail logic
2. Keep the hint hidden by default
3. Reveal the hint only after the first unsuccessful result
4. Keep the main task visible so the learner can try again immediately

Good pairings:

• Text widget + image widget
• Variable + conditional visibility
• Button + sorting or matching reset

Recipe: Media controls another task

Use this when:

• Learners should listen or watch before responding
• A timed media moment should unlock the next action
• A clip should jump to a useful moment

Pattern ideas:

• A button plays audio
• A video finishing reveals a question
• A second button seeks to a key moment in the clip
• A timer pause or reset controls when the learner can continue

Good pairings:

• Audio + text input
• Video + hotspot
• Text-to-speech + multiple choice

Recipe: Variable-powered personalized feedback

Use this when:

• The learner should see their own progress reflected back
• A retry message should change after each attempt
• A lesson should feel more responsive without needing extra scenes

Pattern:

1. Create a variable such as attempts or selected_topic
2. Update that variable through a button or submission action
3. Reference the variable in text using Liquid syntax
4. Optionally combine it with visibility rules for staged support

Good pairings:

• Variable + text widget
• Submit button + retry counter
• Selected topic + recap scene

Example:

• After a first unsuccessful try, increase attempts
• show a text block such as Attempt {{ variables.attempts }}: Try looking at the labels before answering again.

Recipe: Drag, drop, and check

Use this when:

• The task depends on sorting or categorizing
• The learner should get feedback through movement
• You want interaction to feel hands-on instead of quiz-like

Pattern:

1. Add draggable widgets or items
2. Add a drop bucket or target
3. Define what counts as a valid drop
4. Trigger feedback, scoring, or variable updates when the drop succeeds

Good pairings:

• Image cards + drop bucket
• Sorting list + retry button
• Drag/drop + score widget

Recipe: Persistent score during a challenge

Use this when:

• The lesson should feel game-like
• Learners should feel momentum across scenes
• A final celebration should reflect cumulative performance

Pattern:

1. Put a score widget where it can stay visible
2. Include relevant widgets in scene or lesson score
3. Put the score on a layout if it should appear through several scenes
4. Show a final feedback scene tied to the resulting score

Good pairings:

• Score + timer
• Score + interactive rain
• Score + repeated assessment scenes

Recipe: Reset without leaving the scene

Use this when:

• The activity should be replayable
• The learner should keep context while trying again
• The retry should feel immediate

Pattern:

1. Add a Try Again button
2. Use a reset action where supported
3. Clear or update supporting variables if needed
4. Hide old feedback when the learner restarts

Good pairings:

• Sorting list + button
• Button + hidden feedback panel
• Timer + reset

Recommended next reads

• Widget State and Actions
• Grading and Score
• Visibility and Personalization
• Reusable Lesson Patterns