fd3d-art-direction

Files (1)

• SKILL.md

SKILL.md (first lines)

# Art direction before effects

## Input
The real product, audience, decision the page should support, brand tokens and three permissible references. When the subject is absent, propose a concrete original concept and mark the assumption. Do not invent claims about an existing product.

## Procedure
1. Describe the product's material and visual vocabulary: precision-machined, textile, ceramic, optical, industrial, organic, playful. Pick one primary direction, not every reference at once.
2. Make three genuinely different small compositions: object-led, typography-led, and editorial/detail-led. Reject your initial favorite if the alternative communicates the product more clearly.
3. State the one memorable action: rotate to understand silhouette, separate to understand construction, or change a material to understand finish. Write what the action teaches, not just what moves.
4. Define 4–6 named colors, type roles, scale, line lengths, whitespace rules, corner hierarchy and one lighting language. Preserve the user's existing token owner; do not create a competing brand registry.
5. Reserve a clean silhouette region and text-safe region. Build the hero at the smallest target viewport before hiding the problem behind a desktop render.
6. Design actual content, keyboard focus, loading, empty/error and static states. Use real copy, not premium-sounding filler or fabricated technical specifications.
7. Compare screenshots, remove one unnecessary effect, then record the selected direction and rejected alternatives.

## Deliver
A one-page design brief; a token JSON; a desktop/mobile wireframe; one storyboard with visible product benefit. Load `upstream/anthropic/frontend-design/SKILL.md` as a complementary critique pass, not as a replacement for the brief.

## Gate
The identity remains recognizable with all animation paused. The primary action is clear without a canvas. Never equate luxury with giant files, tiny grey text, false scarcity or a branded asset you do not own.

Sources: R01, R02, R03. See `resources/STACK-CHOICES.md`.

## Kit location
Kit root: `{{KIT_ROOT}}`. The sync script expands this token. In the canonical ZIP, resolve the root two directories above this skill folder. Paths mentioned above are relative to that root. Read only the referenced files needed for the task.

From KooshaPari/PhenoShared, MIT.

More from KooshaPari/PhenoShared