Logo
NeoArc Studio

Presentation Mode Reference

Technical reference for presentation mode including step structure, intent types, visibility actions, viewport animation, tween engine, and playback configuration.

This reference documents the technical specifications for presentation mode, including data structures, animation system, playback configuration, and performance characteristics.

Architecture Overview

Presentation mode uses a sparse intent architecture where each step stores only the changes from the previous step, not the full diagram state.

Step Structure

Each presentation step contains the following properties:

Intent Types

Four intent types describe the changes that occur at each step.

Visibility Actions

Four visibility action types control how elements appear and disappear.

Viewport Structure

The viewport defines the visible area and zoom level for a step.

Configuration Object

The presentation configuration controls playback behaviour.

Exit Animation Types

Six exit animation types are available for after the final step.

Tween Engine

The tween engine interpolates between step states for smooth 60fps animation.

State Resolution

The state resolver reconstructs the full diagram state at any step by applying intents forward from the base state.

True Base Computation

When a document with presentation steps is loaded, elements added in step intents must be filtered from the base state.

The algorithm:

  1. Collect all element IDs from add intents across all steps
  2. Filter document.shapes to exclude these IDs
  3. The result is the "true base" containing only original elements

This prevents elements added mid-presentation from appearing at step 0.

Playback Controller

The playback controller manages animation timing and state updates.

Accessibility

Presentation mode includes built-in accessibility features.

Performance Characteristics

Understanding performance helps optimise presentations for smooth playback.

File Structure

Presentation data can be stored within a diagram document or as a standalone presentation file.

interface PresentationDiagramDocument {
  schemaVersion: string;
  id: string;
  type?: 'presentation';  // Set for standalone files
  shapes: DiagramShapeState[];
  connections: DiagramConnectionState[];
  presentationConfig?: PresentationConfig;
  presentationSteps?: PresentationStep[];
}

The presentationConfig and presentationSteps fields are optional. When absent, the diagram has no presentation and displays as a static diagram.

Standalone Presentation Files

Presentations can be saved as standalone .presentation.json files alongside the diagram they are derived from. These files have type: 'presentation' set and contain the full presentation definition: base shapes, connections, animation steps, and configuration.

Content Block Playback

The Presentation Diagram content block embeds standalone presentations with step navigation controls. All steps are pre-rendered on load using the state resolver for instant navigation.