BriefBrief
Design Files
Brief - Design & Brand Brief.html
Youcan you make a design/branding brief based on this: (pasted)
Wireframe
Pasted text (107 lines)
Claude
Claude has some questions →

I'll put together a design/branding brief for Brief based on your pitch. Before I sketch, a few quick questions to point me the right way:

YouQuestions answered: - format: Both, as one combined doc - audience: A reviewer/stakeholder evaluating the project - fidelity: Hi-fi single doc — pick one direction and polish - variations: 4–5 — wider net - sections: Product one-liner & positioning, Target user & jobs-to-be-done, Brand personality & voice, Visual direction (palette, type, radius, motion), Onboarding flow (3 entry points), Surface inventory (the 6 surfaces), Competitive landscape (status quo), Token architecture diagram - tone: Editorial — magazine-style, considered - client_demos: Yes — they're the whole point - length: Long-form — every section gets room - tweaks: Decide for me
Claude
Updated todos
Copying starter

Locking direction now. Building a long-form editorial brief — magazine cadence (numbered sections, pull quotes, margin annotations, generous columns) on a warm "Drafting Table" base. I'll meta-demonstrate the core idea: the brief itself re-themes between Dandy / Sundial / Halo via a Tweaks toggle — same document, different brand environment.

Type pairing: Instrument Serif (editorial display) + Geist (body) + JetBrains Mono (annotations). Three client themes load IBM Plex Serif / DM Serif Display / JetBrains Mono inline as samples.

Reading, Writing

Now let me write the brief. Single long-form editorial document with a meta tweak: cycle the doc's own theme through Drafting Table / Dandy / Sundial / Halo to demonstrate the premise live.

Updated todos
✓ #1
✓ #2
✓ #3
✓ #4
✓ #5
✓ #6
✓ #7
✓ #8
Done, Verify

Built Brief — Design & Brand Brief.html as a single long-form editorial document.

Structure — Masthead → Cover (with stat-stack masthead) → §01 Premise → §02 User + JTBD → §03 Status quo → §04 Insight (with the 420 ms choreography diagram) → §05 Personality & voice (is/isn't grid) → §06 Visual direction (palette + type + radius + motion) → §07 Token architecture (4-layer stack diagram) → §08 Six surfaces inventory → §09 Onboarding (3 paths) → §10 Client environments (Dandy / Sundial / Halo rendered as actual themed brief-detail mocks) → Colophon.

The meta-demo — open Tweaks (toggle in the toolbar) and switch Client theme between Drafting Table / Dandy / Sundial / Halo. The brief itself re-themes — accent color, italic display color, focus rings, swatches, section bars — over the same 420 ms transition the product would use. The hint pill in the top-right tells you which theme is active.

Other tweaks — Density (Editorial ↔ Working doc) and a toggle for the orange margin annotations.

Type/color foundation — Instrument Serif (display), Geist (body), JetBrains Mono (labels). Warm graphite chrome palette in oklch, chroma capped at 0.012 so it never competes with a client theme. Client themes load IBM Plex Serif / DM Serif Display / JetBrains Mono inline as samples.

Worth a look at: the three client cards in §10 — they're the proof the premise actually pays off visually.

Click anything on the canvas to edit it.
No comments yet. Leave feedback for your teammates below.