Skip to main content

​
Overview

The Show Red Vignette action briefly shows a red pulsing overlay at the edges of the screen. This provides immediate visual feedback that the learner did something incorrect — tapped the wrong object, gave a wrong answer, or violated a constraint. The effect is automatic and brief, fading out on its own. No configuration is needed — simply use it to provide error feedback.

​
When to Use

  • Incorrect object interaction — Learner tapped or manipulated the wrong object
  • Wrong answer selection — Learner chose an incorrect option in a multiple-choice question
  • Safety violation — Speed threshold exceeded, unsafe interaction detected
  • Boundary violation — Learner attempted to go to a restricted area
  • Compliance failure — Learner skipped a required step or acknowledgment
  • Constraint violation — Learner broke any rule or procedural requirement

​
Parameters

ParameterTypeRequiredDescription
None——No parameters. The effect is automatic and non-configurable

​
Example: Wrong Object Selection

State: SelectCorrectComponent
  onEntry:
    → Set Interactable Objects (["component-a", "component-b", "component-c"], true)
    → Show Panel
        Title: "Select the correct part"
        Display Text: "Which component should you select?"
        Billboard: true

  transitions:
    - event: "component-a-tapped"
      action: Show Red Vignette
      target: "SelectCorrectComponent"
    - event: "component-b-tapped"
      action:
        - Show Red Vignette
        - Show Text "Wrong component!"
      target: "SelectCorrectComponent"
    - event: "component-c-tapped"
      action:
        - Show Text "Correct!"
        - Show Panel
            Title: "Success"
            Display Text: "You identified the correct component."
            Billboard: true
      target: "NextStep"

  onExit:
    → Hide Panel
Tapping the wrong components triggers the red vignette and a retry.

​
Example: Speed Violation Feedback

State: HandleCarefully
  onEntry:
    → Set Interactable Objects (["vial"], true)
    → Start Speed Tracking
        Object: "vial"
        Threshold: 0.5
        Unit: "m/s"
    → Show Text "Move the vial slowly. Careful handling is required."

  transitions:
    - event: "speed-violation"
      action:
        - Show Red Vignette
        - Show Text "Too fast! Slow down. Safety is critical."
      target: "HandleCarefully"
    - event: "vial-placed-safely"
      target: "SafePlacement"

  onExit:
    → Stop Speed Tracking
    → Hide Text
Exceeding the speed limit triggers the red vignette and a warning message.

​
Visual Effect Details

  • Red overlay — A semi-transparent red tint covers the screen edges
  • Pulsing — The overlay pulses briefly (typically 1-2 seconds)
  • Automatic fade — The effect fades out automatically; no manual dismissal needed
  • Non-intrusive — The 3D scene remains visible behind the overlay

​
Best Practices

1

Pair with feedback text

Combine the visual red vignette with Show Text explaining what went wrong.
2

Use for constraint violations

The vignette works best for safety rules, speed limits, and interaction errors.
3

Don't overuse

Reserve red vignettes for actual errors, not for normal feedback.
4

Return to the same state

After showing the vignette, usually transition back to the current state to let learners retry.
5

Test on different screens

Verify the vignette visibility on different screen sizes and brightness levels.

​
Common Patterns

​
Quiz Wrong Answer with Feedback

State: MultiChoiceQuestion
  onEntry:
    → Show Panel
        Title: "Question 3"
        Display Text: "What is the correct procedure?"
        Choices:
          - text: "Option A"
            event: "answer-a"
          - text: "Option B"
            event: "answer-b"
          - text: "Option C"
            event: "answer-c"
        Billboard: true

  transitions:
    - event: "answer-a"
      action:
        - Show Red Vignette
        - Show Text "Incorrect. Try again."
      target: "MultiChoiceQuestion"
    - event: "answer-b"
      action:
        - Show Red Vignette
        - Show Text "Incorrect. Try again."
      target: "MultiChoiceQuestion"
    - event: "answer-c"
      action:
        - Show Text "Correct!"
        - Record achievement "Question 3 answered correctly"
      target: "Question4"

  onExit:
    → Hide Panel
Choosing wrong answers shows the red vignette and an error message. The correct answer advances.

​
Boundary Violation Detection

State: RestrictedArea
  onEntry:
    → Show Panel
        Title: "Boundary Alert"
        Display Text: "This area is restricted. You cannot proceed further."
        Billboard: true

  transitions:
    - event: "attempted-forward-movement"
      action:
        - Show Red Vignette
        - Show Text "You cannot enter this restricted area."
      target: "RestrictedArea"

  onExit:
    → Hide Panel
When the learner tries to move into a restricted zone, the red vignette signals the violation.

​
Safety Rule Violation

State: EquipmentOperation
  onEntry:
    → Show Panel
        Title: "Safety Reminder"
        Display Text: "Always wear protective equipment before operating this equipment."
        Billboard: true

  transitions:
    - event: "attempt-without-ppe"
      action:
        - Show Red Vignette
        - Show Text "STOP! You must wear protective equipment first. Safety is non-negotiable."
      target: "EquipmentOperation"
    - event: "with-ppe-equipped"
      target: "EquipmentReady"

  onExit:
    → Hide Panel
Attempting to operate equipment without PPE triggers the red vignette and a strong warning.
  • Show Text — Provide textual explanation alongside the visual vignette feedback
  • Show Panel — Display detailed error messages or remedial information
  • Pause Training — Optional: pause to ensure the learner sees the error feedback
  • Speed Tracking — Trigger vignette on speed violations