Skip to main content

Core Concepts

Overview​

The Experience Engine transforms traditional content into interactive experiences. Whether working with video content or creating standalone interactive experiences, the platform provides powerful tools for engagement.

Experience Types​

Video-Based Experiences​

The Experience Engine provides sophisticated video capabilities:

  • Multi-Provider Support

    • HTML5 video playback
    • YouTube integration
    • Vimeo integration
    • Custom provider support
    • Adaptive streaming capabilities

  • Playback Control

    • Precise timing control
    • Quality management
    • Volume and mute control
    • Fullscreen handling
    • Picture-in-Picture support

  • Mobile Optimization

    • Touch-friendly controls
    • Orientation handling
    • Bandwidth optimization
    • Platform-specific optimizations

Overlay-Based Experiences​

For interactive experiences that don't require video content:

  • Timing System

    • Precise control over interaction timing
    • Synchronized animations and transitions
    • Sequenced content delivery
    • Timeline-based interactions

  • Layout Control

    • Full-screen interactive areas
    • Responsive design support
    • Mobile-optimized layouts
    • Custom positioning options

  • Interaction Management

    • User input handling
    • State tracking
    • Event sequencing
    • Analytics integration

Activations​

Activations are the building blocks of interactive experiences. They can be used with both video and overlay-based experiences.

Activation Types​

1. Overlay Activations​

  • Float above content
  • Can be positioned anywhere
  • Support rich media content
  • Customizable appearance
  • Responsive design support

2. Interactive Activations​

  • Respond to user input
  • Support click/touch events
  • Can trigger actions
  • State-aware behavior
  • Custom interaction patterns

3. Timed Activations​

  • Trigger at specific timestamps
  • Duration-based visibility
  • Sequence support
  • Timing synchronization
  • Conditional timing

4. State-Based Activations​

  • Respond to system state
  • Context-aware behavior
  • Dynamic content updates
  • Conditional rendering
  • State persistence

Behavior System​

The behavior system provides fine-grained control over functionality through a hierarchical configuration system.

Behavior Levels​

1. Global Behaviors​

  • Apply to entire experience
  • Set default behaviors
  • Can be overridden
  • Affect all components
  • System-wide settings

2. Activation Behaviors​

  • Specific to activations
  • Override global behaviors
  • Activation-type specific
  • Component-level control
  • Feature toggles

3. Instance Behaviors​

  • Per-instance settings
  • Highest precedence
  • Context-specific
  • Runtime modifications
  • State-dependent

Common Behaviors​

Playback Behaviors​

  • autoPlay: Control automatic playback start
  • muted: Set initial audio state
  • loop: Enable content looping
  • preventSeek: Disable timeline seeking
  • preventPause: Disable pause functionality
  • playThroughDetails: Continue playback during details view

UI Behaviors​

  • hideControls: Hide playback controls
  • hideProgressBar: Hide timeline progress
  • hideVolume: Hide volume controls
  • hideFullscreen: Hide fullscreen button
  • preventClickToPlay: Disable click/tap playback control

Mobile Behaviors​

  • forcePortraitOrientation: Force portrait mode
  • hideVideoInPortraitOnOverlay: Hide video in portrait with overlay
  • disableBottomSpace: Remove bottom spacing
  • fullscreenDetailsInMobilePortrait: Fullscreen details in portrait

State Management​

The system maintains state across different aspects of the experience:

Playback State​

  • Current time position
  • Playing/paused status
  • Volume and mute state
  • Quality settings
  • Buffer status

Activation State​

  • Visibility status
  • Interaction history
  • Current state
  • Position information
  • Content updates

User State​

  • Interaction history
  • Preferences
  • Session information
  • Custom settings

Mobile Support​

The Experience Engine provides comprehensive mobile support:

Orientation Handling​

  • Portrait and landscape modes
  • Automatic layout adjustment
  • Custom orientation behaviors
  • Fullscreen management

Touch Optimization​

  • Touch-friendly controls
  • Gesture support
  • Mobile-specific interactions
  • Responsive layouts

Performance​

  • Bandwidth management
  • Quality optimization
  • Resource efficiency
  • Loading optimization

Best Practices​

  1. Content Planning

    • Design with interaction points in mind
    • Consider mobile viewing scenarios
    • Plan activation timing carefully
    • Structure content for engagement

  2. Behavior Configuration

    • Use appropriate behavior levels
    • Test behavior combinations
    • Consider mobile implications
    • Validate user experience

  3. Mobile Optimization

    • Test on various devices
    • Optimize for touch interaction
    • Consider bandwidth limitations
    • Validate orientation handling

  4. Performance

    • Monitor resource usage
    • Optimize activation timing
    • Manage state efficiently
    • Test under various conditions