Cinematic UI
Wählt einen Regisseur und einen spezifischen Film aus und übersetzt dessen visuelle Grammatik dann in Seitenstruktur, Tokens und Bewegung.
Getestet · Funktioniert
Was es kann
Ein vierphasiger Design-Workflow (Entscheidungen -> Storyboard -> kompilierte Spezifikation -> Build), der einen echten Regisseur/Film benennt, um Farbe, Typografie, Komposition und Bewegung zu verankern, anstatt generischer 'Premium SaaS'-Standardeinstellungen, mit einer großen Referenzbibliothek von Regisseuren, Hero-Archetypen, Kameraeinstellungen und Farbkorrekturen. Wird bei expliziten Anfragen für eine filmische, filmähnliche, vom Regisseur inspirierte oder Filmgenre-Website (Noir, Sci-Fi, Thriller usw.), einschließlich chinesischsprachiger Anfragen, ausgelöst; lehnt explizit generische Webdesign-Anfragen ab.
Testbericht
Bei demselben Briefing (ein Noir-Betrugserkennungs-SaaS-Hero) erzeugte ein einfacher Prompt den standardmäßigen dunkel-gradienten Hero-plus-Glaskarte, den jede 'Premium Dark SaaS'-Anfrage erzeugt; der Skill zog stattdessen David Fincher/Se7en direkt aus seiner 200-Regisseur-Tabelle und verwandelte 'entsättigtes Teal, tiefe Schatten, Scanlinien' in ein tatsächliches Beweistafel-Hero-Konzept mit benannten Hex-Tokens und einer expliziten Liste verbotener Standardeinstellungen.
Getestet am: 2026-07-14 · Claude Code 2.x (agent harness)
Installation
git clone https://github.com/akseolabs-seo/cinematic-ui cd cinematic-ui mkdir -p ~/.claude/skills cp -r . ~/.claude/skills/cinematic-ui
Befehle & Beispiel-Prompts
/cinematic-uiWählt einen Regisseur und einen spezifischen Film aus und übersetzt dessen visuelle Grammatik dann in Seitenstruktur, Tokens und Bewegung.
Skills reagieren auf normale Anfragen — keine Slash-Befehle nötig. Nach der Installation aktivieren Prompts wie diese den Skill (auf Englisch):
Design a movie-poster-style landing page for my sci-fi startupI want a film-noir aesthetic homepage for my detective appGive my SaaS hero section a David Fincher, thriller kind of feel