feat(skills): teach temporal thinking and visual variety

[miguel-heygen]

Summary

Addresses the core gap where LLMs default to slide-like layouts (centered text over dark background, same layout every scene). The main hyperframes skill now teaches agents to think through frames in time rather than composing pages.

What's new in SKILL.md

Temporal map requirement (Step 3 in Plan)

• Write a one-line-per-second description of what the viewer sees before any HTML
• Forces the agent to think about visual interest at each moment, not just content structure

"Think in Frames, Not Pages" section

• Slideshow trap: explicit anti-patterns (same layout, same animation, same color temp, no surprise)
• Scene variety checklist: 7 layout types to rotate between (statement, full-bleed image, split frame, kinetic type, data beat, terminal/code, atmospheric)
• One focus per frame: billboard-per-beat principle
• Beat duration guide: impact (0.7-1.8s), content (2-4s), atmosphere (4-8s)

Easing vocabulary table

• Intent-based ease selection (snap, overshoot, soft land, mechanical, spring, dramatic) instead of defaulting to power2.out on everything

What's NOT changed

• All existing rules, data attributes, composition structure, transition rules — untouched
• House style and motion principles refs stay as-is (the new sections complement, not replace)

Test plan

• A/B comparison: same prompt rendered with old vs new skill (in progress, will post results)
• Verify temporal map step doesn't slow down simple edits (the "skip straight to rules" escape hatch is preserved)

🤖 Generated with Claude Code