devrites-ux-shapelisted
Install: claude install-skill ViktorsBaikers/DevRites
# devrites-ux-shape: plan the UX/UI before code
Decide what the UI *is* and how it should look and behave **before** code, and write it to
the feature's `design-brief.md`: the contract the build (`devrites-frontend-craft`),
polish, and seal all check against. This is "shape before code" raised to a **feature-level
artifact**: produced once at spec time, refined per slice. It is **woven into the
lifecycle** (`/rite-spec` calls it when UI is detected; `/rite-build` refines it), not a
separate phase the user runs.
## When it runs
- `/rite-spec` invokes it after references-intake when the feature touches UI
(`../rite-build/reference/frontend-trigger.md`). Output: `design-brief.md` + a
confirmation pause.
- `/rite-build` / `devrites-frontend-craft` read the brief as the **build target** and
refine it for the slice's surface. They don't re-derive it.
- Skip entirely for backend / data / CLI / infra-only features.
## 1. Foundation: discover, don't impose
Reuse what's there first. Read the design system + register and any references the spec
gathered:
- Design system + register (tokens, components, type, spacing, neighbors; brand-vs-product)
→ `../devrites-frontend-craft/reference/design-references.md`.
- `PRODUCT.md` / `DESIGN.md` / `CLAUDE.md` if present: anchors that reduce questions.
`DESIGN.md` is the project's **rolled-up design memory** (tokens, calibration baseline,
proven component behaviors) earlier features closed during Polish via
`../rite-polish/referenc