Agent skill · marketing growth · nexu-io
huashu-golden-circle
A brand-repositioning strategy for a heritage coffee chain — why, how, what — the governing idea and the moves to prove it. Built as a decision-grade consulting deck for client CMO, board.
Why this skill is useful
Provides a structured methodology for creating decision-grade consulting decks, which includes specific design and content guidelines not commonly found in public resources.
What it needs
About 6k tokens when loaded. Last updated 2026-08-07. 84,236 stars on the source repository.
What this skill does
Golden Circle Diagram · 黄金圆环图解 Produce a single-file, one-diagram concept deck. You are visualizing a methodology the way Simon Sinek drew the Golden Circle on a TED flip chart: one geometric master figure carries the entire argument, and every page is that figure seen from a different angle. The visual system, canvas contract, and navigation runtime are locked by example.html. Start from example.html, replace content only — do not rewrite the design or the script. Do not introduce any color or font outside this spec. Generated from the 中性派「单图母图概念图解 / Diagrammatic Minimalism」spec in references/design-styles.md of huashu-design by 花叔 (alchaincyf), MIT licensed. Lineage: Simon Sinek's Golden Circle TED talk, Bauhaus geometric abstraction, "one diagram rules the room" information architecture. Hard spec (locked — violating any line is a regression) Canvas & runtime One <div id="stage"> fixed at 1920 × 1080 px, centered with position: fixed; top: 50%; left: 50%; a fit() function applies translate(-50%, -50%) scale(min(innerWidth/1920, innerHeight/1080)) on load and resize. All inner layout in px — the scaler owns responsiveness. Each page is one <section class="slide"> inside #stage with a data-screen-label="01 封面"-style label; exactly one slide carries .active; the dark closing page adds .dark. Navigation (keep the script verbatim): ←/↑/PageUp previous, →/↓/Space/PageDown next, Home/End first/last; #/N hash routing (1-indexed) read on load + hashchange, written via history.replaceState; click left third = back, rest = forward; fixed counter pill bottom-right, key-hint bottom-left. No external JS, no build step — the file must open inside a sandboxed iframe via file://. …
How to use it
Reference it in AdaL, Claude Code, Cursor or any coding agent — nothing to install:
@skills nexu-io/huashu-golden-circle