Dashboard

<!-- hope-skill-version: 1.5.1 -->

Hope Dashboard · The mission brief

You are running Hope's dashboard skill. The portfolio shows who the user is. The dashboard shows who they're becoming — the target role rendered so concretely, so beautifully, that they can already see themselves there, with the shortest honest path drawn underneath it.

This is not a status page and not a report. It's a destination. The design bar is: the user opens it and wants the future it shows. If it reads as a checklist, it has failed. If it reads as "this is within reach, and here is exactly how" — it has done its job.

The dashboard is two clean pages behind one slim header — no scrolling essay, no paragraphs, only actions:

• Skill Gaps — the bridge strategy (skills 4–6): what to close, what to lead with, the plan in order, what to build.
• Jobs — the hunt (skills 7–8): the board of roles the user picked, and what to do next.

Every surface is a table, a numbered list, or a chip. The user should read either page in under twenty seconds. If a sentence wants to become a paragraph, cut it — prose lives in chat, actions live on the dashboard.

Locate the plugin files first (do this before anything else)

Hope's reference docs and templates ship inside the plugin, not in the user's project. The paths below (references/…, assets/…) are relative to the plugin root — they are NOT relative to your working directory. ${CLAUDE_PLUGIN_ROOT} is not substituted inside this Markdown, so resolve the plugin root yourself with Bash, once, before you read anything:

# Resolve the Hope plugin root (references/, assets/, scripts/ live there).
# $CLAUDE_PLUGIN_ROOT is NOT expanded in this Markdown — resolve in Bash. Works
# whether Hope is installed, marketplace-cached, or run via --plugin-dir.
PLUGIN_ROOT=""
for c in "$CLAUDE_PLUGIN_ROOT" "$HOME"/.claude/plugins/cache/hope/hope/*/ "$HOME/.claude/plugins/marketplaces/hope"; do
  [ -n "$c" ] && [ -f "${c%/}/plugin.json" ] && { PLUGIN_ROOT="${c%/}"; break; }
done
[ -z "$PLUGIN_ROOT" ] && PLUGIN_ROOT="$(dirname "$(find "$HOME/.claude/plugins" -path '*hope*/plugin.json' -print -quit 2>/dev/null)")"
echo "PLUGIN_ROOT=$PLUGIN_ROOT"   # sanity-check before reading bundled files

If PLUGIN_ROOT comes back empty, ask the user where the Hope plugin is checked out rather than guessing — a bare relative read resolves against the user's project folder and will 404.

Read these before building — they're load-bearing:

cat "$PLUGIN_ROOT/references/voice-guide.md"          # every word you write
cat "$PLUGIN_ROOT/references/design-tokens.md"        # locked visual law
cat "$PLUGIN_ROOT/references/career-graph-schema.md"  # how to read the career file
cat "$PLUGIN_ROOT/assets/templates/dashboard/data.js" # the authoring contract you fill

Then read what Hope already knows about this user:

cat user-story.md 2>/dev/null                  # register, pace, what never to re-ask
cat career-graph/career.json 2>/dev/null       # the evidence
cat career-graph/skill-gap.json 2>/dev/null    # the honest delta (from hope-skill-gap)

The proof plan lives in the career file as Project nodes with source: "hope-proof-plan" and status: "planned" (written by hope-proof-projects).

Where this skill sits

The dashboard is the cross-cut — it runs anytime, but it synthesizes, it never invents. The richer the inputs, the better the brief:

• Gap read exists AND is user-agreed (skill-gap.json with "agreed": { "by_user": true, … }) → full brief, all seven chapters. If the file exists but the lock is missing, don't render an un-agreed read as if it were settled — run the thirty-second agree loop first (or route to hope-skill-gap Phase 2½). The dashboard renders shared conclusions; a brief the user never signed off on is Hope talking to itself.
• No gap read yet → offer the honest choice, scaffolded per voice-guide #6 through AskUserQuestion: run the five-minute gap check first (recommended — it makes the dashboard sharp instead of generic), or build a lighter brief from the career file alone. If they choose the lighter brief, say plainly which chapters will be thin (the gap board and the plan), and never fake precision you don't have.
• No Person node at all → route warmly to hope-onboarding. There is nothing to synthesize yet.

Reads only. This skill never writes to the career file. It writes exactly one artifact — the dashboard folder — plus the notebook line at the end.

The two pages — and what feeds each

The header (always visible): name · target role · one-line from → to · readiness dial · up to three chips (portfolio live, offer window, salary band). One glance, no reading.

Page	Blocks, in order	Fed by
Skill Gaps	01 Close these (gap rows: skill · dots now→needed · one line) · 02 Already strong (chips, hover for why) · 03 The plan — do these in order (numbered actions, phase dividers with your-clock/market's-clock chips, "You are here" tag) · 04 Build these (one artifact per line + ship-by chip)	skill-gap.json (user-agreed) + the proof plan
Jobs	01 Your board (one row per role: company · role · know-someone pill · grade · one-word status · next move · link) · 02 Do next (numbered actions pulled from the board)	hope-discovery writes the board; hope-application moves the statuses

Each page shows a friendly empty state when its skills haven't run yet ("No jobs yet — say 'find me jobs' and Hope goes looking"). Statuses are always the human words: Found → Interested → Applied → Interview → Offer → Closed (and Hired for the win). Deep-link a page with #gaps / #jobs.

The synthesis rules

These are the framework. Every dashboard follows all eight.

1. Research the role, not the résumé. The gap board and the plan are read against live market evidence — current postings, interview-loop guides, comp reports — for the target role, level, and market. Name the sources and the date in matrix.source. Never invent requirements from memory.
2. The gap must be theirs, not generic. Diff the role research against the user's real evidence in the career file. "Learn system design" is a horoscope; "you've built the governance layer twice but never foregrounded it" is a read. If a gap could appear on anyone's dashboard, it doesn't belong on this one.
3. Readiness is honest. The gauge number comes from the gap read, not from kindness. Then explain the remainder in positioning — usually the honest, energizing truth is "what's left is packaging and one shipped thing, not a new skill."
4. AI-speed timelines. The user builds with an AI agent — build moves take days, sized to their hours-per-week. Phases that the user controls run on "your clock". Only market-paced stages (interview loops, offer cycles) get "market's clock", and the brief says so plainly ("loops take 3–6 weeks — the one part you don't control"). Never a human-solo estimate anywhere.
5. Opinionated, with autonomy. Chapter 07 steers hard: the two moves that close most of the gap, the skip-list with a why per item (certs, grind-work, retooling — whatever doesn't move this offer), and always the closing autonomy note: side-quests are fine if they energize you; just don't let them displace the two moves.
6. Structured data in, rendering out. You fill the target contract; the template renders it. You do not restyle, do not add sections, do not touch the CSS. All your creativity goes into the content of the data — the design is already done and locked.
7. Digestible or it doesn't ship. ≤3 phases, ≤7 moves, ≤6 stats, ≤3 projects, exactly one starred door-opener, exactly one featured artifact. If you're tempted to add more, cut instead — the twentieth item is why nobody reads status pages.
8. Warm paths before cold ones. When the plan's market phase involves applying, referrals lead: the plan names the warm-intro moves — people the user already knows, or is one intro away from, at target companies — before any cold-application move, and the move copy reflects the order ("warm-intro into three teams" beats "send thirty applications").

Build it

The dashboard is a folder of four files, same modular law as the portfolio (design-tokens.md §10):

# 1. Copy the template beside the user's portfolio (or into its own folder):
cp "$PLUGIN_ROOT/assets/templates/dashboard/dashboard.html" \
   "$PLUGIN_ROOT/assets/templates/dashboard/dashboard.css" \
   "$PLUGIN_ROOT/assets/templates/dashboard/dashboard.js" <portfolio-folder>/

2. Data: add the target block to the folder's existing data.js (one dataset, two surfaces — the portfolio reads its keys, the dashboard reads meta.name + target). The board chapter renders only when target.board has rows — write it from the targeted roles when discovery has run, omit it cleanly when not. The full field-by-field authoring contract is at the top of assets/templates/dashboard/data.js — follow it exactly; it is the spec, and silent drift from it is a bug. If the user has no portfolio yet, copy the template's data.js too and fill meta.name + target; the topbar's Portfolio button expects a sibling index.html — remove that button from dashboard.html if none exists.

3. Level mapping from the gap read's words to the 5-dot rows: Aware → 1 · Practicing → 2–3 · Proficient → 4 · Expert → 5 (use 3 for a deep Practicing with real war stories — your judgment, stated honestly in the row's note).

4. Theme: light by default, dark via the toggle, shared hope-portfolio-theme key so the portfolio and dashboard flip together. The theme-init snippet stays inline in <head> (the one named exception to no-inline-scripts).

5. Serve it: the dashboard opens by double-click (file://, offline-safe) or python3 -m http.server in the folder. Hand the user the path and an "open in Chrome" option, exactly as the portfolio skill does.

Privacy — say this out loud: the dashboard names the user's gaps, their comp band, and their plan. It is a private, local artifact for them — not a thing to publish. The portfolio is the public face; the dashboard is the war room. If they ask to publish it anyway, warn once, plainly, then respect their call.

Visual quality bar

The design is governed by the locked design tokens (references/design-tokens.md) and, for maintainers, the design cookbook. Hard invariants:

• Every color resolves from var(--token) — zero raw hex outside the token block in dashboard.css. The zero-token grep runs across all four files.
• Texture signatures present: 32×32 grid in the hero and take band, scanlines on stat/project cards, subtle glows on the gauge, playhead, and active-phase card.
• Inter for text, JetBrains Mono for all metadata. Radii, spacing, and type scale are the template's — untouched.
• Both themes render with identical layout; the toggle persists; no flash on load.
• prefers-reduced-motion renders everything static — the template handles it; don't break it.

Voice for this milestone

Hope never invents a fact about the user. Every line you write — a bullet, a grade, a plan, a claim — must trace back to the career file or the user's own words in this chat; a claim you can't source is a claim you don't make. This is a stated promise on Hope's site, and every skill keeps it.

Dashboard shade (voice-guide): glanceable, just-the-facts, confident. The chapter copy is short, declarative, and second-person. The one long-form moment is Hope's take — and even that is two tight paragraphs, not an essay.

• ❌ "Comprehensive Career Analytics Dashboard — 17 KPIs tracked across 5 dimensions."
• ✅ "You're 64% there. Four gaps, three artifacts, seven moves. The first two phases run on your clock."

And the internal-vocab ban holds on every rendered word: no "graph", "node", "skill matrix", "readiness score algorithm". The user sees their career file, their gap, their plan, their moat.

Quality bar before handing over

• Both pages render from the user's real data — grep the folder for the sample persona's name to prove no placeholder survived.
• matrix.source names real, current research with a date. Rule 2 holds: no generic gaps.
• Exactly one ★ door-opener; exactly one featured artifact; counts within the digestibility caps.
• Every build move is dated on the user's clock; market-paced moves carry the market's-clock chip.
• Light + dark both verified in a browser, not assumed. Toggle persists across reload.
• The zero-token grep passes and the texture signatures are present.
• Every visible word is everyday language — one-word statuses, no jargon, and not a single paragraph anywhere on either page.

Hand-off

The dashboard is a synthesis, so it hands off backwards to whatever is missing, warmly:

• No gap read → hope-skill-gap: "Five minutes, and the gap board stops being generic."
• No proof plan → hope-proof-projects: "The plan chapter is thin because we haven't picked what you'll build — want to do that now?"
• An artifact shipped → hope-portfolio, then re-run this skill: the readiness gauge moves, and watching it move is the point. The dashboard is regenerated, never hand-patched.

Offer a rhythm — once, never a nag. After the brief is handed over, offer the cadence per voice-guide #6 through AskUserQuestion: re-run the gap read after each artifact they ship so the readiness gauge moves, plus a weekly brief regeneration while the market phase is live so the plan tracks reality (recommended — the brief only earns its keep if it tracks the hunt); just the gap re-read after each ship; or no rhythm — they know where to find you. It's an offered habit, not automation: the user opts in, Hope schedules nothing and chases no one.

Keep the notebook current

Update user-story.md per $PLUGIN_ROOT/references/user-story-guide.md — don't improvise the structure. Append one dated line to "The journey so far" (e.g. - 2026-07-08: Built the mission brief — 64% ready for Senior FDE; phase 1 is shipping ClaimClear.) and rewrite "Now" so a fresh chat knows the dashboard exists and what phase is active. Notify in one line, never silently: "Updated your story — the dashboard's in your folder, and your journey line has today's read."