Skip to content

Raylinkh/design-register-commit

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

7 Commits
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

design-register-commit

Taste is commitment, not restraint. A Claude Code skill that forces commitment to a named cultural register (a "world") before any UI output, then gates output against that register's closed token budget and refusal list.

Built because existing design skills (frontend-design, uiux-pro-max, etc.) optimize for defensible output — competent and polished but interchangeable with every other SaaS app from 2024. This skill optimizes for authored output: committed, specific, refused-into-a-shape.


Why this exists

When you ask an AI to "design a meditation app," most design skills match product-type to style — wellness → pastel palette + soft sans + rounded corners. The result is competent and forgettable. It belongs to every meditation app, which means it belongs to none.

This skill flips the process:

  1. Name the register first — not a vibe ("minimal wellness") but a cultural world with real anchors ("a Kyoto teahouse at dawn" / "a Scandinavian therapist's reading room"). Each world has real products, books, and buildings you can point to.
  2. Declare a closed token budget — 3 colors or 30, but sealed. New values require explicit revision.
  3. Write down what the register refuses — Memphis refuses serifs. Brutalism refuses rounded corners. Refusals are grep-able patterns.
  4. Build inside the budget — every color:, border-radius:, font-family: must resolve to a declared token.
  5. Gate before shipping — four automated checks: token conformance, refusal conformance, hero presence (≥1.6× next element), specificity (no lorem ipsum, no "Elevate your X").

Any output that violates its own declared register's refusal list is tasteless — regardless of how beautiful each individual element is. Internal consistency to a chosen world beats objective prettiness.


Install

The skill follows the Agent Skills open standard and is host-agnostic. It works out of the box with Claude Code, OpenAI Codex CLI, and OpenCode — and any other agent that adopts the same spec (Cursor, Gemini CLI, Antigravity, JetBrains Junie, Copilot, Aider, Windsurf, Kilo, etc.).

Claude Code

/plugin marketplace add Raylinkh/design-register-commit
/plugin install design-register-commit@design-register-commit

Codex CLI

# User-global
git clone https://github.com/Raylinkh/design-register-commit.git /tmp/drc
cp -R /tmp/drc/.agents/skills/design-register-commit ~/.agents/skills/
cp -R /tmp/drc/.agents/skills/uiux-improvement-fixes ~/.agents/skills/

Or clone into a project as .agents/skills/ — Codex walks up from your CWD to the repo root looking for .agents/skills/, so in-repo adoption works too.

OpenCode

OpenCode reads ~/.claude/skills/, ~/.agents/skills/, and ~/.config/opencode/skills/ automatically. Any of the install methods above will make the skills discoverable to OpenCode.

Manual (symlink into your global skills dir)

git clone https://github.com/Raylinkh/design-register-commit.git ~/Documents/projects/design-register-commit

# Claude Code
ln -s ~/Documents/projects/design-register-commit/.agents/skills/design-register-commit ~/.claude/skills/design-register-commit
ln -s ~/Documents/projects/design-register-commit/.agents/skills/uiux-improvement-fixes ~/.claude/skills/uiux-improvement-fixes

# Codex CLI
ln -s ~/Documents/projects/design-register-commit/.agents/skills/design-register-commit ~/.agents/skills/design-register-commit
ln -s ~/Documents/projects/design-register-commit/.agents/skills/uiux-improvement-fixes ~/.agents/skills/uiux-improvement-fixes

OpenCode picks up either location automatically.

What's in the package

Two skills ship together:

  • design-register-commit — the main skill. Commit-first design with 9 registers + automated gates.
  • uiux-improvement-fixes — complementary task-first UX skill. Run after a register is chosen to fix whether the screen actually works (task clarity → information architecture → interaction logic → visual hierarchy → system consistency → emotional tone → polish). Refuses dashboards on child focus screens, cards-everywhere, multiple primary buttons, SaaS-voice copy.

What ships

  • SKILL.md — the main skill entry; the six-step ritual and the four automated gates
  • PRIMER.md — a taste/UX cheat sheet for humans (what taste is, the canon, the practice, 10 traps to refuse). Read this first if you're new to deliberate design practice.
  • references/ — deeper reading on the four pillars, the grep methodology, register-vs-effect distinction
  • commands/ — slash commands that operate on registers (export-designmd, etc.)
  • templates/ — 9 starter registers, each with 6 source files (tokens.css, refusals.md, push.md, references.md, diegesis.md, demo.html). Two registers (paper-editorial, arcade-neon) also ship a pre-generated DESIGN.md as community-standard exemplars.

The 10 starter registers

Each template is a complete commitment kit — tokens + refusals + references + diegetic rules + a working demo.html reference screen. Open any demo.html in a browser to see the register in its shipped form.

Register World Demo subject
paper-editorial A careful Chinese notebook on a wooden desk Tea shop / notebook publisher
arcade-neon Tokyo arcade at 2 AM in 1985 Kabukicho arcade operator console
luxury-restrained A concierge note slipped under a hotel door at 11 PM Spa / hotel concierge
brutalist-gallery Wim Crouwel meets the 1972 Munich Olympics system Exhibition archive
trading-terminal Bloomberg terminal at 4 AM with five people watching Commodities / ops dashboard
field-notebook On-call engineer's project log at 3 PM Linear-style task view
children-picturebook Picture book on a lamp-lit bedside table Read-aloud app home
memphis-postmodern Milano 1981 Memphis Group debut Design-furniture catalog
zine-punk Riot Grrrl zine photocopied at 2 AM Zine issue page
industrial-monochrome A piece of well-engineered hardware on a designer's desk Audio-interface monitor screen

Two deliberately contrasting extremes (paper-editorial quiet ↔ arcade-neon maximalist) plus eight in between prove the thesis: commitment intensity, not restraint intensity, is the real taste dial.


Using the skill

In Claude Code:

I want to build a meditation app. Use /design-register-commit.

Claude will:

  1. Refuse to proceed until you name a register (push back if you say "minimal" or "modern")
  2. Walk you through the 5-question register qualifier
  3. Load the chosen template's 5 files as the ceiling
  4. Build inside the budget
  5. Run the four gates before declaring done

Adding a new register

Drop a new folder under templates/ with 6 files. The skill auto-discovers it.

See templates/README.md for the template spec and the register qualifier (5 questions that decide whether a proposed name is a register or just an effect).

Contributions welcome — see CONTRIBUTING.md.


Complementary skills

These skills solve adjacent problems. Install together for the strongest stack.

20+ slash commands for frontend polish (/polish, /distill, /audit, /typeset, /overdrive, /critique, /arrange, /colorize, /delight, /onboard, /quieter, /bolder, /normalize, /harden, /extract, /clarify, /adapt) plus an enhanced frontend-design skill with curated AI-slop anti-patterns. Same plugin-ecosystem install pattern as ours.

How it stacks: our skill sets the commitment (the ceiling); impeccable commands operate inside the declared register to polish specific surfaces. Run /register-declare first to lock the register, then use impeccable commands as you build.

Distilled from Anthropic's Claude Design system prompt into a portable skill. Six-step workflow (understand → gather → declare → v0 draft → build → verify), OKLCH-based color derivation, and its own anti-cliché catalog (purple-pink-blue gradients, left-border accent cards, rounded-card-with-shadow defaults).

How it stacks: raises the baseline quality of any AI-generated web artifact — works on any project, no register required. Ours enforces the ceiling of a chosen register. Run web-design-engineer as your default floor; escalate to design-register-commit when the output must feel authored rather than merely competent.

Catalog-based design skill with 50+ styles, 161 palettes, 57 font pairings, 161 product types, and a reasoning engine that matches product type to style.

How it stacks: fast-path catalog for projects where "defensible and competent" beats "authored and committed" — admin dashboards, internal tools, MVP landings. Ours is the escalation path when output needs a point of view. Run them together and uiux-pro-max proposes; design-register-commit enforces.

A single-register skill crystallizing Nothing's industrial-monochrome design language — Braun + Teenage Engineering + Swiss type + OLED black + dot-matrix. Per-platform output mappings (HTML/CSS, SwiftUI, React/Tailwind, paper).

How it stacks: they are a focused single-register skill; we ship it as one of our 10 templates (industrial-monochrome) inside the broader register-commitment framework. If you only ever want this one world, install theirs. If you want the same world plus 9 contrasting ones plus the four automated gates, use ours. Their platform-mapping.md pattern is adopted as our optional 7th template file (see templates/platform-mapping-spec.md).

Stack recommendation

For authored consumer products where feel matters: install all three. web-design-engineer as the craft baseline, impeccable for polish commands, design-register-commit for register enforcement. For internal tools and admin surfaces: uiux-pro-max alone is often enough.


Cross-tool interop: DESIGN.md

Every register can export to Google Stitch's DESIGN.md format — the emerging community standard (awesome-design-md) for plain-markdown design specs readable by any AI coding agent (Stitch, Cursor, Antigravity, Gemini CLI, Codex, Claude Code).

/export-designmd paper-editorial
/export-designmd arcade-neon

Output: a 9-section DESIGN.md at your project root, readable by any tool without this skill installed.

Two exemplars shipped in-repo:

The division of labor. DESIGN.md tells any agent what the project should look like. This skill enforces that it stays there — the four automated gates (token conformance, refusal conformance, hero presence, specificity) are the linter for what DESIGN.md specs.

Ship both DESIGN.md and .design-register.md at your project root. They complement.


How it differs from uiux-pro-max / frontend-design

frontend-design / uiux-pro-max design-register-commit
Unit of extension A style or palette (neumorphism, "sunset palette") A register — a named cultural world with anchors and refusals
Optimizes for Breadth of coverage, fast defensible output Depth of commitment — refuse anything off-register
Rules as... Aspirational checklists Automated gates — grep your output against the token budget and refusal list
Good at Admin dashboards, internal tools, "give me a working wellness app" Consumer / creative / taste-sensitive products where "looks AI-generated" would kill it

They are complementary. Run this skill before catalog skills to set the register ceiling those skills must respect.


When NOT to use this

  • Admin dashboards where speed-to-defensible beats authored feel
  • Internal tools where nobody will ever see it outside the team
  • When the brief is genuinely "just ship the standard thing"

For everything else — anything a user will judge on identity, feel, or authorship — start here.


Inspiration + prior art

  • impeccable by Paul Bakaus — the skill pattern, anti-pattern vocabulary, command family (/polish, /distill, /overdrive). If you use this skill, install impeccable too. They compose.
  • ui-ux-pro-max-skill — the catalog approach this skill deliberately contrasts against.
  • Anthropic's agent-skills — canonical format and the skill-creator spec.
  • Frank Chimero's The Shape of Design — philosophical grounding for "commitment as taste."

License

MIT. See LICENSE.


Contributing

New register templates welcome. Improvements to the existing ones welcome. See CONTRIBUTING.md.

The bar: any template you submit must pass its own refusals.md when grepped against its own demo.html. Register templates that fail their own gate get rejected. That's the whole game.

About

Taste as commitment, not restraint. A Claude Code design skill that forces commitment to a named cultural register, with 9 extensible register templates.

Topics

Resources

License

Contributing

Stars

Watchers

Forks

Packages

 
 
 

Contributors