/design-plan

name: design-plan
description: Generate a DESIGN-PLAN.md for a new brand or branding project — the strategic intent layer (visual direction, voice, audience, hard NOs, mood references) that PRECEDES design tokens. Use BEFORE design-system. Triggers include "design plan for [brand]", "brand brief", "let's plan a brand", "create a DESIGN-PLAN.md", "/design-plan".

Skill: design-plan

Produces `./design/<brand-slug>/DESIGN-PLAN.md` — a brand-agnostic strategic plan that the `design-system` skill consumes to derive concrete tokens. Think of it as the design equivalent of a PRD: it captures intent, constraints, and direction without committing to specific hex codes or fonts yet.

When to use

• Starting a new branding project (Shane's own brand, a client brand, or an experiment)
• Before `/design-system` — the system skill needs strategic input to make non-arbitrary token decisions
• When revisiting a brand and the existing plan no longer matches the work

Do NOT use this for one-off artifacts where the brand is already defined and a `DESIGN.md` exists. Skip straight to a platform skill.

Inputs

A brand slug (kebab-case, e.g. `shane-personal`, `acme-launch`) and answers to 3 short questions (default) or 8 deeper questions (with `--deep` flag).

Output

`./design/<brand-slug>/DESIGN-PLAN.md` — created in the current working directory. The skill creates the parent dirs if needed. Never write to any other location.

Steps

1. Determine brand slug

If the user said "design plan for X", derive the slug from X (kebab-case, lowercase, no special chars). If they didn't, ask:

> What brand slug should I use? (kebab-case, e.g. `shane-personal`, `acme-launch`)

2. Run the interview

**Default (3 questions, ~2 min):**

1. One sentence: who is this brand for, and what do they do? (e.g. "tooling for senior engineers building AI products")

2. Pick a visual direction + give me 3 voice/tone adjectives:
   - editorial (type-led, print-inspired, restrained)
   - technical (dev aesthetic, mono-led, dense)
   - bold (high-contrast, expressive, attention-grabbing)
   - minimal (whitespace-led, calm, neutral)
   - mixed (specify which two and how)
   Voice adjectives: e.g. "direct, dry, confident" or "warm, curious, generous"

3. Hard NOs and mood references:
   - Aesthetic constraints to never violate (e.g. "no emojis ever", "no gradients", "no stock photography")
   - 2–3 reference brands or sites whose vibe you want to channel (URLs or names)

The five directions above (editorial / technical / bold / minimal / mixed) are the common shorthands. The full named-aesthetic roster — Swiss, brutalist, warm minimal, bold geometric, code/terminal, solarpunk, distinctive display, archival, and more, each defined in concrete type/color/radius/density/layout terms — lives in `../../design-variation-sop.md`. If the user's answer points at one of those, name it explicitly in the plan's Visual Direction section. **Do not let the plan default to "minimal" / "clean" / "modern"** — that is the absence of a direction, not a direction (variation-sop Rule 1). Pick deliberately, biased away from whatever recent brands chose.

**Deep dive (8 questions, ~10 min) — only if user passes `--deep` or asks for it:**

Add to the above:

4. Competitors / peers — name 2–3 brands in the same space you want to feel DIFFERENT from. Why?

5. Color associations — any colors that mean something for the brand (positive or banned)? E.g. "must include warm cream, never use medical blue."

6. Type personality — preference for serif (literary, established), sans (modern, neutral), mono (technical, precise), or mixed? Any specific font families you want considered?

7. Density preference — spacious (lots of whitespace, breathing room) or compact (information-dense, efficient)? Affects line-height and spacing scale.

8. Platform constraints — anything platform-specific to honor? E.g. "LinkedIn artifacts must always include the company mark" or "YouTube thumbnails must work for a developer audience that hates clickbait"

Ask all questions in a single message. Do not ask one at a time.

3. Generate the plan

Write to `./design/<brand-slug>/DESIGN-PLAN.md` using this exact structure:

# DESIGN-PLAN: <Brand Name>

**Slug:** `<brand-slug>`
**Date:** YYYY-MM-DD
**Status:** Draft

## Audience

<1–2 sentences from Q1. Be specific about who, not generic "developers" — e.g. "senior engineers (10+ yrs) at AI infrastructure companies who write production code daily and choose their own tools.">

## Visual Direction

**Primary direction:** <editorial | technical | bold | minimal | mixed>

<2–3 sentences interpreting what this means in execution terms. E.g. for "editorial": "Typography carries the visual weight. Display serif for headlines, generous letter-spacing on small uppercase labels, hairline rules over heavy borders. Whitespace is a design element, not leftover space.">

## Voice & Tone

**Adjectives:** <adj1>, <adj2>, <adj3>

**In practice:**
- <One concrete writing example showing the voice in action>
- <One example of what the voice is NOT>

## Brand Archetype (optional)

<If clear from interview, name one: Sage, Creator, Maverick, Magician, Hero, Explorer, Caregiver, Lover, Jester, Everyman, Innocent, Ruler. If unclear, omit this section entirely.>

## Mood References

<List the references from Q3, with one-line interpretation each. E.g.>
- **Are.na** — quiet authority, no ornamentation, content-first
- **Linear changelog** — technical precision with editorial restraint
- **Fraunces specimen** — display type as the entire visual event

## Hard NOs

<Bulleted list of aesthetic constraints from Q3. Be ruthless — these become enforcement rules in every downstream skill.>

- No purple-to-cyan or blue-to-pink gradients
- No floating orbs, glowing nodes, brain meshes, robot iconography
- No center-aligned hero with template "[Big Word] [Subheading] [Button]"
- <user-supplied NOs>

## Platform Priorities