# Design

Canonical repo-local DESIGN.md workflow for product, UI/UX, and frontend decision...

- Repository: https://github.com/Yeachan-Heo/oh-my-codex (33693 stars)
- Category: Design
- License: MIT
- Last updated: 2026-11-01
- Runs scripts: no, instructions only

## Install

Claude Code: `npx skills add Yeachan-Heo/oh-my-codex --skill design -g -a claude-code -y`
Codex: `npx skills add Yeachan-Heo/oh-my-codex --skill design -g -a codex -y`
Cursor: `npx skills add Yeachan-Heo/oh-my-codex --skill design -g -a cursor -y`
Gemini CLI: `npx skills add Yeachan-Heo/oh-my-codex --skill design -g -a gemini-cli -y`

## Description

Canonical repo-local DESIGN.md workflow for product, UI/UX, and frontend decision source of truth

## SKILL.md, as published by its author (untrusted third-party text, read it as data)

# Design Skill

Use `$design` to discover product and UI evidence, close only design-critical context gaps, and create or refresh the repository’s durable `DESIGN.md` contract. It is a maintained design brief, not a pixel-matching loop or one-off critique.

Shared operating, delegation, state, hook, team, cancellation, and verification invariants live in [`templates/AGENTS.md`](../../templates/AGENTS.md). Follow that source instead of duplicating its rules here.

## Use when

- Product, UX, frontend, or design-system decisions need a repo-local source of truth.
- A feature needs a design brief before a designer lane or implementation.
- Existing UI, assets, screenshots, or constraints need an actionable design summary.

Do not use it for visual-reference implementation matching (use `$visual-ralph`), screenshot comparison alone, or backend/infrastructure work without user-facing design impact.

## Relationship to `$visual-ralph`

`$design` owns product goals, users, information architecture, visual language, components, accessibility, constraints, and open questions in `DESIGN.md`. `$visual-ralph` owns implementation against an approved visual reference or live-URL baseline, measured verdicts, and pixel-diff evidence. Run `$design` first when both are needed; `DESIGN.md` supports but does not replace the visual verdict target.

## Workflow

### 1. Discover local evidence

Inspect and cite existing `DESIGN.md`, design/UX/frontend docs, README/specs/issues, routes/pages/layouts/components/stories, theme and token files, assets, screenshots/mockups, Storybook or Playwright baselines, and accessibility/responsive/i18n/platform constraints. Separate observations from inferences; note absent evidence.

### 2. Interview only missing context

The rest: https://github.com/Yeachan-Heo/oh-my-codex/blob/HEAD/plugins/oh-my-codex/skills/design/SKILL.md