一键导入
gsp-brand-brief
Define your brand — who, why, and what it should feel like — use when: create a brand, define our brand identity, who are we, what's our brand
用 Codex 或 Claude 帮你安装 复制这段 Prompt,粘贴到 Codex、Claude 或其他助手里,让它检查 Skill 页面并帮你完成安装。
菜单
Define your brand — who, why, and what it should feel like — use when: create a brand, define our brand identity, who are we, what's our brand
用 Codex 或 Claude 帮你安装 复制这段 Prompt,粘贴到 Codex、Claude 或其他助手里,让它检查 Skill 页面并帮你完成安装。
基于 SOC 职业分类
Add reference material to a project — use when: add a reference, save inspiration, attach examples, link this site as reference, drop in a moodboard
Craft ASCII art interactively — you direct, the artist creates — use when: make ASCII art, terminal art, decorative banner, splash screen, hero ASCII
Audit an existing brand before evolving it — use when: audit our brand, what do we have, before a rebrand, brand health check, current brand state, brand inventory
Sync brand to match a project's shipped state — tokens, voice, visual patterns, personality — use when: brand drifted from the app, reverse-engineer the brand, the code is ahead of the brand docs, sync brand to shipped, update brand from production
Design color systems — palettes, contrast, semantic mapping, dark mode — use when: pick colors, build a palette, semantic tokens, dark mode pairings, brand color, accent color
Design icon systems — library selection, sizing, containers, custom SVG direction — use when: pick an icon library, icon sizing rules, icon containers, custom SVG direction, swap icons, icon strategy
| name | gsp-brand-brief |
| description | Define your brand — who, why, and what it should feel like — use when: create a brand, define our brand identity, who are we, what's our brand |
Works two ways:
/gsp-start detects "new brand" intent and invokes this skill/gsp-brand-brief directlyThis skill handles new brands only. For existing brands (evolve mode), /gsp-start routes to /gsp-brand-audit directly.
Input: Brand name (from args or asked)
Output: .design/branding/{name}/ with BRIEF.md, STATE.md, config.json, ROADMAP.md
Next: /gsp-brand-research
<questioning_principles>
One decision per question. Every question must be its own AskUserQuestion call. Ask one thing, wait for the answer, use it to inform the next question.
Never re-ask what the user already answered. If you need to validate, confirm: "I see X from earlier — still accurate?"
Inference over interrogation. Don't ask what you can infer. "Fintech for Gen Z" → mobile-first, modern, trustworthy. State inferences, let them correct.
Concrete options over open-ended. "More like Stripe's clean approach or Duolingo's playful style?" beats "What style do you want?" Use AskUserQuestion with 2-3 options when the option space is known.
Adapt and skip. If an early answer reveals enough, skip later questions. Follow up on surprises before moving on. The sequence is a guide, not a script.
Know when you have enough. A brand brief is complete when you can answer:
Check if a brand name was passed via invocation args. If not, ask:
AskUserQuestionValidate: lowercase alphanumeric + hyphens only. Check .design/branding/{name}/ doesn't already exist. If it does, use AskUserQuestion: Overwrite / Pick a different name.
Accept an optional e2e flag from the invoking skill. Default to false.
Create directory structure:
mkdir -p .design/branding/{name}/{discover,strategy,identity,patterns}
Sequential AskUserQuestion calls. Ask one, wait, adapt, ask the next. Skip anything you can already infer.
AskUserQuestion)AskUserQuestion with options if you can infer likely models from industry, otherwise open-ended)AskUserQuestion: Looks right / Adjust / Add a secondary personaBefore presenting personality options, internally synthesize promise (what should someone feel?) and point of view (what does this brand disagree with?) from prior answers. Don't ask these directly — use them to ground personality options.
AskUserQuestion with 2-3 concrete personality directions. Each option must explain WHY it fits this brand's audience and problem — not just a style label:
AskUserQuestion with 2-3 anti-directions inferred from their personality pick, plus open-ended option)AskUserQuestion)AskUserQuestion (open-ended):
"What should it look and feel like visually? You can share image or website links, describe a mood ('editorial and dark', 'warm brutalist', 'cinematographic with beautiful stills'), drop adjective clusters ('rounded, clean, airy'), or even describe a scene or texture. The weirder and more specific the better — this is what prevents a bland brand."
visual_direction block in the brief: mood words, reference aesthetics, texture/atmosphere descriptors, any specific anti-patterns (e.g., "never stock-photo corporate"). This block directly informs color, typography, and imagery choices downstream.Any non-negotiables or constraints? (timeline, budget, must-haves) — open-ended AskUserQuestion
State your understanding back — but lead with feeling, not facts. Format:
"Here's what I'm hearing: [2-sentence factual summary]. The feeling this brand should leave: [emotional compass — one evocative sentence capturing the brand's energy, not its category]."
The emotional compass is the hardest line to write and the most important. It should make the user feel something when they read it. Not "a fintech tool that simplifies investing" but "the brand that makes financial confidence feel earned, not given." Synthesize it from the personality direction, the persona aspiration, the brand POV, and the visual direction. It should be specific enough to be wrong — vague sentences aren't compasses.
Use AskUserQuestion:
If "Adjust" — ask what to change, update your understanding, re-confirm. Don't re-ask everything.
Read templates at write time from ${CLAUDE_SKILL_DIR}/../../templates/branding/ and write:
.design/branding/{name}/BRIEF.md from brief.md template
brand_heartbeat in the Emotional Compass sectionbrand_mode to new.design/branding/{name}/STATE.md from state.md template
skippedpending.design/branding/{name}/config.json from config.json template
brand.name, brand.created (ISO date)brand_mode: "new"e2e flag from Step 1.design/branding/{name}/ROADMAP.md from roadmap.md template
Write/update .design/CLAUDE.md — register the brand as started. If the file doesn't exist, read ${CLAUDE_SKILL_DIR}/../../templates/design-claude.md first. Append under ## Brands:
### {brand-name} · in progress · {DATE}
"{brand_heartbeat}"
next: gsp-brand-research · .design/branding/{brand-name}/
Use AskUserQuestion — always offer Continue / Stop here / What happens next:
/gsp-brand-research via Skill tool/gsp-startIf e2e: true, mention that after the full branding diamond completes, it will auto-transition to project setup.
e2e: true and branding diamond is complete)After all four brand phases complete (brand-research → brand-strategy → brand-identity → brand-guidelines), scaffold the project directory before invoking /gsp-project-brief:
Derive {project-slug} from the brand name: lowercase, spaces and underscores replaced with hyphens.
Create the project directory:
mkdir -p .design/projects/{project-slug}/
Read templates at write time from ${CLAUDE_SKILL_DIR}/../../templates/projects/ and write:
.design/projects/{project-slug}/config.json from config.json template — set project.name (title-cased from project-slug) and project.created (ISO date).design/projects/{project-slug}/STATE.md from state.md template — fill in project name and brand nameWrite .design/projects/{project-slug}/brand.ref containing the brand directory name (e.g. {brand-name}), so the project knows which brand it belongs to.
Display:
brand complete — {brand-name}
now let's scope your project.
/gsp-project-brief via Skill tool, passing {project-slug} so Step 0 resolves the existing directory rather than prompting for one.