# Design Plan

> 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".

- **Type:** Skill
- **Install:** `agentstack add skill-slogsdon-skills-design-design-plan`
- **Verified:** Yes — security-reviewed for prompt injection and unsafe behavior
- **Seller:** [slogsdon](https://agentstack.voostack.com/s/slogsdon)
- **Installs:** 0
- **Category:** [Agent Skills](https://agentstack.voostack.com/c/agent-skills)
- **Latest version:** 0.1.0
- **License:** MIT
- **Upstream author:** [slogsdon](https://github.com/slogsdon)
- **Source:** https://github.com/slogsdon/skills-design/tree/main/skills/design-plan

## Install

```sh
agentstack add skill-slogsdon-skills-design-design-plan
```

Requires the [AgentStack CLI](https://agentstack.voostack.com/docs/cli). Works with Claude Code, Cursor, and any MCP-compatible agent.

## About

# Skill: design-plan

Produces `./design//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//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//DESIGN-PLAN.md` using this exact structure:

```markdown
# DESIGN-PLAN: 

**Slug:** ``
**Date:** YYYY-MM-DD
**Status:** Draft

## Audience

## Visual Direction

**Primary direction:** 

## Voice & Tone

**Adjectives:** , , 

**In practice:**
- 
- 

## Brand Archetype (optional)

## Mood References

- **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

- 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]"
- 

## Platform Priorities

**Phase 1:** 

## Token Direction Hints (for design-system to interpret)

**Color stance:** 

**Type stance:** 

**Density:** 

**Surface:** 

---

## Handoff

Run: `/design-system ` — the design-system skill will read this plan and generate concrete `DESIGN.md` tokens, `tokens.css`, and `showcase.html`.
```

### 4. Confirm and hand off

After writing the file, tell the user:

> Plan saved to `./design//DESIGN-PLAN.md`.
>
> Next: run `/design-system ` to derive concrete tokens and a visual showcase. Or revise the plan first — anything you want me to push back on or expand?

## Rules

- The plan is **strategic only** — no hex codes, no font sizes, no spacing values. Those live in `DESIGN.md`.
- Never hardcode Shane's personal brand into this skill. The plan is brand-agnostic input.
- 1 page max. If the file exceeds ~80 lines, cut.
- If the user can't answer a question, write `TBD — needs decision before tokens` rather than guessing.
- If `./design//DESIGN-PLAN.md` already exists, ask before overwriting.
- **Universal anti-patterns** (purple-cyan gradients, indigo/violet default, orbs, italics-emphasis, Inter/Roboto/system primary, etc.) live in `../design-anti-patterns.md` and apply to every brand. The positive craft floor (`../design-principles.md`) and the direction roster + offer-3 procedure (`../design-variation-sop.md`) are the other two shared canonical references. The Hard NOs section of the plan is for brand-SPECIFIC bans on top of those universals — don't restate the universals here.

## Source & license

This open-source skill is cataloged on AgentStack and links to its original source — we do not rehost the code.

- **Author:** [slogsdon](https://github.com/slogsdon)
- **Source:** [slogsdon/skills-design](https://github.com/slogsdon/skills-design)
- **License:** MIT

Install and usage instructions live in the source repository linked above.

## Pricing

- **Free** — Free

## Security capabilities

Automated source analysis of v0.1.0 — what this tool can access:

- **Network access:** no
- **Filesystem access:** no
- **Shell / process execution:** no
- **Environment & secrets:** no
- **Dynamic code execution:** no

*"Yes" means the capability is present in the source — more access means more to trust, not that it is unsafe.*


## Versions

- **0.1.0** — security scan: passed — Imported from the upstream source.

## Links

- Listing page: https://agentstack.voostack.com/l/skill-slogsdon-skills-design-design-plan
- Seller: https://agentstack.voostack.com/s/slogsdon
- Browse the marketplace: https://agentstack.voostack.com/browse

---
Listed on AgentStack — the marketplace for AI agent skills and MCP servers. Every listing is security-reviewed. Creators keep 70%.