design
Install

Design skill · Web surface

Systems that hold up.

A design system is a promise. This skill builds the system, reviews whether the experience keeps it, and leaves checks that make the promise hard to break.

Explore the cases Read the skill
2 modes 8 cases 6 surface classes 1 self-contained page
TUI host-owned CLI pipe-safe Mobile whole screens Game safe zones Print fixed canvas Web this page Eight cases. Six surface classes. One system of evidence.

One skill, two directions

Build the system.
Judge the experience.

The same standards govern both. System work produces tokens, scenes, and a drift check. Review work produces an evidence-graded issue register, a fix plan, and guard rules.

01 · SYSTEM

Make it coherent.

Extract, rebuild, greenfield, or govern. The system is the source of truth; the showcase proves it.

ExtractRebuildGreenfieldGovern
Output · showcase · specification · drift check
02 · REVIEW

Make it honest.

Review a product, an artifact, or the system itself. Evidence over taste; protect what works; prioritize what changes the decision.

ProductArtifactSystem
Output · review report · issue register · fix plan · guard rules
Evidence over inventionRead the real source. Quote the value. Mark what is designed.
Reasoning is traceableStance → principle → rule → token → check. No orphan decisions.
Accessibility is a foundationContrast, focus, targets, motion, and assistive tech are part of the system.
Adopt before inventingUse a mature convention when it fits, and record every deviation.

The cases

Eight proofs, one system.

Each case is a whole-use scene, not a component sampler. Open one to see its tokens, states, and verification probes. The requirements behind each case are linked below it.

What they prove

Evidence, not decoration.

Each case is built to be inspected. These are the claims the system is willing to be judged on.

TUI

Host-owned palettes

Roles, not RGB; a monochrome path that survives the terminal.

orbit → CLI

Output as interface

stdout, stderr, width, exit codes, and a machine contract.

relay → Mobile

Whole screens, both modes

States in context, 48dp targets, 2.0× reflow, motion tokens.

pulse → Game

Safe zones and input

HUD containment, controller prompts, redundant status.

drift → RPG

Three registers

Display, UI, and text each do one job; lore never borrows display.

emberhold → Anime

Bright world, dark panels

Scenery, menu focus, and a bilingual layout that fits both scripts.

asteria → Casual

Shape-coded play

Color is delight; shape is the contract. No dark patterns.

sugarfall → Print

Fixed canvas

True proportion, one grid, CMYK assumptions, grayscale survival.

fieldstation →

Context

The cases have requirements, not just screenshots.

Each case is backed by an inferred requirements document: context, principles, tokens, states, accessibility, and verification. Read it before a redesign or a review, so the next version does not lose what the case was proving.

Read the review verdict and coverage matrix →

This page is the web case: read its requirements →

orbit · terminal 01 relay · CLI 02 pulse · mobile 03 drift · game 04 fieldstation · print 05 emberhold · RPG 06 asteria · gacha 07 sugarfall · casual 08

Use it

Install the skill.

Build the system, review the experience, and leave checks behind. The bundle also includes presentation for talks, sharing sessions, demos, and written reports.

Read SKILL.md GitHub Requirements
npx
npx skills add kimmywork/skills --skill design
Claude plugin
claude plugin install design@kimmywork-skills

Each case is one self-contained HTML file. No build step; system fallbacks keep it readable offline.