Навыки: Дизайн

Generate a new UI component following the StyleSeed design conventions

Add appropriate user feedback states (loading, success, error, empty) to a component or page

Design user flows and navigation structure following proven UX patterns

Quick automated lint — detects common design system violations in seconds

Apply a named StyleSeed motion to a component — either one of the 5 personality seeds (Spring/Silk/Snap/Float/Pulse × en...

Scaffold a new product page or screen from the compiled StyleSeed output grammar, surface adapter, brand recipe, and pro...

Generate a composed UI pattern from the active StyleSeed grammar and brand recipe using existing primitives.

Use when you have a PRD or requirement description and need a complete technical proposal before writing any code. Filte...

Compile screenshots, URLs, Figma exports, or an existing UI into a project-local StyleSeed output grammar with evidence,...

Review UI code for design system compliance, accessibility, and best practices

Generate an accessible semantic palette from a key color, or view, add, and modify StyleSeed design tokens. Use when a u...

Designs and structures the Movemental living SSOT dashboard (HTML/CSS/JS). Use when creating or refining the single-sour...

SSR-first Next.js App Router doctrine with zero layout shift. Use when creating a page or data-fetching UI, fixing CLS,...

Prevent width jitter when content changes dynamically, by reserving the width of every content the element can hold. Use...

Builds kinetic typography on Canvas 2D in which one line of capitals is stacked nine rows deep and every letter is its o...

Builds a kinetic-type poster on Canvas 2D, in which four lines of type on flat highlight bars hop in from the edges alon...

Between-sessions metaphysics-as-discipline. A six-question intake adapted from Lin & Corley's epistemic-stance.md — writ...

Migrate any left-panel to the Cinema panel standard — animated tab bar, always-visible search, filter icon toggle, thick...

Enforce Cinema design tokens and PanelSlider usage in all right-panel property editors. Use when creating or modifying a...

Index of official Android/Kotlin/Gradle docs, Now in Android and JetSnack references, and house patterns (UI events, act...

Build accessible user interfaces using semantic HTML, proper ARIA attributes, keyboard navigation, color contrast, and s...

Write consistent, maintainable CSS following the project's methodology (Tailwind, BEM, utility classes, CSS modules) wit...

Create visually distinctive frontend interfaces that avoid generic AI-generated aesthetics. Apply when building landing...

Frontend component and UI development standards for modern React/Next.js applications. Includes React 19 patterns, Tailw...

Build responsive, mobile-first layouts using fluid containers, flexible units, media queries, and touch-friendly design...

Use for UI/UX design, product flows, frontend or native interface design, design audits, design translation, asset plann...

Front door. Reads the current project (framework, tokens, brief, spec, harness) and reports what ui-craft can do right n...

Lesson 3.1: Join the Onboarding Space & Add Your First Entity - request membership to the shared Geo Onboarding Space an...

Lesson 4.1: Submit Your Proposal - publish your edit to the Geo Onboarding Space as a proposal and learn how community g...

Safely start any new piece of work on this site. Asks what you want to do in one line, creates a git branch so `main` is...

Starts the Orchestrator 3 Stream application (backend + frontend) in background mode. Use when the user asks to start or...

チケット（Linear / Jira）を読み、Kibela で調査し、ブランチを切って実装のたたきを作る

/start-work - Begin Working on a GitHub Issue

Linear multi-agent build pipeline with file hand-offs in production_artifacts/, run after /bdbrainstorm or /grill-me. Th...

Use when running the autonomous multi-agent build pipeline after /bdbrainstorm or /grill-me. Routes to the startcycle-di...

Fresh gradient-heavy startup aesthetic — bold hero, modern sans, investor-pitch energy, built to convert.

Generates all 6 required UI state variants for a screen per Phase 6 gate checklist

Plain-object Redux actions for the chota-react-saga template — three-phase async triples (REQUEST / SUCCESS / ERROR) per...

Systematic implementation of state-based button displays with navigation structures, modal triggering, and responsive la...

Reactにおける状態リフティングと状態配置判断を支援するスキル。兄弟コンポーネント間の状態共有、Prop Drilling削減、Context導入判断、Compound Componentパターンまで、React状態管理の全体像を扱う。A...

Models any UI, workflow, or agent behavior as an explicit state machine. Use whenever the user describes a component or...

Document UI component states (current vs expected) with transitions

Model complex UI flows using finite state machines to ensure deterministic behavior.

State management: own state minimally, avoid redundant/duplicate state, handle loading/error/empty/offline/optimistic UI...

Manage frontend application state predictably across local UI state, global app state, server state, cached data, loadin...

Expert-level state management with Redux Toolkit and Zustand using TypeScript. Handle complex application state includin...

When deciding where and how to store data in a modern web application.

Redux-Saga (generator-based) middleware for async side effects — yields declarative effects (call/put/select/takeLatest/...