What problem does it solve?
It prevents AI from producing generic, template-like websites by forcing a director + specific film research loop and a storyboard-first workflow that translates cinematic grammar into page structure, composition, and motion.
Core Features & Use Cases
- Director + film-driven design: Extracts lighting logic, framing discipline, scene rhythm, and material cues from a chosen film to determine the site’s emotional language.
- Storyboard-first, artifact-based workflow: Produces
decisions.md → storyboard.md → compiled-spec.md before any UI coding, ensuring coherent direction across pages.
- Demo Uniqueness Protocol: Audits prior outputs and enforces a shell-ban list plus a primary composition family to keep successive demos visually distinct.
- Cinematic motion with guardrails: Limits interaction budgets, enforces entrance variety, requires library source IDs for major visual moves, and supports reduced-motion.
Quick Start
Use the cinematic-ui skill to design a director- and film-inspired homepage: choose a director and a specific film, complete the start questionnaire, then generate decisions, storyboard, and compiled spec before building the HTML/CSS/JS.