claudeindex
Plugin

create-storyboard

Build an interactive UI storyboard as a StyleX + Storybook project from a product specification and a user-supplied DESIGN.md. The DESIGN.md (the product's own brand/design system) drives the look — NOT locked to a macOS aesthetic, so the storyboard renders in whatever visual identity the brand specifies. It reads a bundled HIG library purely as the interaction, behaviour, structure, and accessibility backbone (layout, master–detail/list/table grammar, modality, feedback, focus/keyboard, motion, empty/loading/error/status, writing), uses the design-craft and frontend-design skills for distinctive, accessible, AI-slop-resistant direction, derives the user flows + screens, builds a reusable StyleX design system (tokens → elements → composites) from the DESIGN.md, and implements every screen as Storybook stories across the happy / empty / loading / error / AI states at production fidelity, plus an MDX flow-overview that sequences the screens into journeys. A brand-driven sibling of macosify's macos-storyboard skill (which is locked to a macOS-native look).

Installation

1

Add the marketplace

/plugin marketplace add DiologIR/diolog-plugins
2

Install plugins

/plugin

Run these commands in Claude Code to add this plugin to your environment. The marketplace must be added before you can install its plugins.