Animations and Visual Primitives

The 16 Animation Families

Explayner includes 16 built-in animation primitives that can be assigned to text, code, shapes, and images:

• fadeIn / fadeOut: Subtle opacity transitions for cards and backgrounds.
• typewriter: Simulates live code or terminal typing character by character.
• draw: Animates vector lines, borders, and connectors as if drawn with a pen.
• reveal: Wipes cards or slides smoothly into view.
• pulse / blink: Draws attention to key metrics, warnings, or callout badges.
• move / scale / rotate: Kinetic movement for floating elements and product shots.
• shake / flow / scroll: Dynamic kinetic effects for emphasis and code listings.
• morph / highlight / colorChange: Smoothly shifts colors or borders to highlight state changes.

Timing & Composition Best Practices

Every animation has an explicit start time (delay) and duration relative to the scene start. Keep labels cleanly inside or outside shapes - text crossing vector borders creates visual fatigue.