frontend-designlisted
Install: claude install-skill xsefirosus/sefi-agents
# Frontend Design -- anti-slop craft
Craft skill backing the ui-ux-designer and the software-engineer above the API seam.
The goal is UI that looks decided, not generated. Deep material lives in three
references, read on demand: references/direction-lanes.md (the named direction
catalog), references/anti-slop-checklist.md (the tells, in two tiers), and
references/industry-patterns.md (domain heuristics, illustrative only).
User instructions always override this skill.
All factual output follows the anti-hallucination skill: cite or mark UNKNOWN, never
guess (this includes design tokens -- never cite a token that is not in the spec).
## Rule block
1. Direction first: commit to ONE named aesthetic direction before any markup -- a
lane from references/direction-lanes.md or an original named with the same rigor --
with a one-line rationale tied to the audience. The default lane is restrained;
immersive/maximalist is opt-in and requires the brief to ask for it. "Clean and
modern" is the absence of a direction.
2. Typography carries the hierarchy: a deliberate type scale (not browser defaults),
real hierarchy between heading levels, line lengths capped for reading. If the
design works in grayscale, the hierarchy is real; if it needs color to read, it
is not.
3. Spacing is a system: one scale in 0.25rem increments, applied everywhere. Ad-hoc
pixel values are the tell that no system exists.
4. Color is restrained and intentional: defined color roles (surfac