UI Designer

Build the web surface itself — website, landing page, webapp shell — from a curated industry × platform × style taxonomy: exact motion physics, per-industry pattern sets and skip-lists, section templates, cursor/3D gating. These are the concrete decisions training memory averages into the generic AI look. Detects its mode from disk — inside a compose campaign it consumes the brand's recorded decisions; standalone it grounds cold starts via ux-researcher + analyze-market + intake before building.

What it does

Mode detection from disk: compose-campaign consume, artifacts-without-campaign, cold-start grounding (ux-researcher + analyze-market → intake)

Industry × platform × style taxonomy: motion physics, per-industry pattern sets and skip-lists, section templates, cursor/3D gating

10-position routing contract across the design-forge suite

Design decision tree for tool selection (CSS, Motion.dev, GSAP, Three.js, Spline, Canvas 2D)

When to use it

Give /design-forge:ui-designer what to build in plain words — or the industry platform style axes if you know them. It detects its mode from disk: inside a compose campaign it consumes the brand's recorded decisions; with design artifacts but no campaign it consumes them and names unsupplied positions; on a cold start it grounds itself via ux-researcher + analyze-market + intake before building.

Example

$ /design-forge:ui-designer "marketing site for a health clinic"
Mode: cold start (no campaign, no artifacts on disk)
Grounding: ux-researcher + analyze-market → intake
Taxonomy: healthcare × marketing-site × trust-forward
Building sections with the industry pattern set — skip-list applied.

What you get by plan

PRO

33+ production-ready premium components with motion and 3D.

Component catalog with 33+ patterns
Mode detection: campaign-aware, artifact-aware, cold-start grounding
Generative canvas presets and particle fields
Glassmorphism, scroll, cursor primitives
Animation stacks: Motion.dev, GSAP, Framer
3D via Three.js and Spline
Reduced-motion and WCAG 2.1 AA compliant
Section templates and asset generation

Other Design Forge skills

/design-forge:intakePRO

IntakeFour quick questions — what you're building, your design system, brand assets, and motion level — turn a vague "make it look good" into a precise brief every downstream Design Forge skill reads, so you never re-explain your intent. Native AskUserQuestion at each step; re-run to change a single answer.

/design-forge:ingestPRO

IngestLift a real design system into Design Forge in seconds — point it at your current project, a GitHub repo, a named shadcn theme, or a live URL and it extracts the colors, typography, and spacing tokens every generator then matches. No manual token entry; network calls are consent-gated with graceful fallback.

/design-forge:product-plannerPRO

Product PlannerMap user types, goals, flows, screens before coding.

/design-forge:ux-researcherPRO

Design ResearchAI-powered design research agent using WebSearch and WebFetch to discover patterns, evaluate competitors, analyze technologies.

Try it in your terminal

Install free. No credit card required.