diff --git a/docs/portfolio/README.md b/docs/portfolio/README.md index 4b1fa06..f49bdf3 100644 --- a/docs/portfolio/README.md +++ b/docs/portfolio/README.md @@ -1,10 +1,11 @@ # AssistSupport Portfolio Pass -Single entry point for the four-session portfolio build. Everything in -this folder is meta-documentation — the actual artifacts live in their -respective session folders and are linked below. +Single entry point for the four-session portfolio build plus the +follow-on artifacts. Everything in this folder is +meta-documentation — the actual assets live in their respective +session folders and are linked below. -## The four artifacts +## The four primary artifacts | # | Artifact | Session folder | Primary output | | --- | ----------------------------------------------- | ----------------------------------------------- | ---------------------------------------------------------------------------------------------- | @@ -13,9 +14,19 @@ respective session folders and are linked below. | 3 | Landscape-letter one-pager PDF | [`docs/one-pager/`](../one-pager/README.md) | [`AssistSupport-one-pager.pdf`](../one-pager/AssistSupport-one-pager.pdf) (11in × 8.5in) | | 4 | 12-slide LinkedIn Live deck | [`docs/deck/`](../deck/README.md) | [`AssistSupport-LinkedIn-Live.pptx`](../deck/AssistSupport-LinkedIn-Live.pptx) + PDF preview | +## Supporting artifacts + +| Artifact | Location | Purpose | +| ------------------------------------------ | ---------------------------------------------------------------------- | ------------------------------------------------------------------------------------------- | +| Case study — three architectural decisions | [`docs/case-study.md`](../case-study.md) | Long-form writeup on logreg · hybrid retrieval · trust-gated. Evergreen portfolio piece. | +| LinkedIn Live rehearsal kit | [`docs/deck/REHEARSAL.md`](../deck/REHEARSAL.md) | 40-min budget, slide-by-slide cues, Q&A matrix, dry-run checklist. | +| 90-second demo video storyboard | [`docs/deck/DEMO-VIDEO.md`](../deck/DEMO-VIDEO.md) | 7-shot storyboard + verbatim narration for an async demo reel. | +| Live-capture pipeline | [`docs/screenshots/live-capture.mjs`](../screenshots/live-capture.mjs) | Spawns dev server + Playwright, captures 4 real-app panels. | +| Enriched Tauri IPC mock | [`src/test/e2eTauriMock.ts`](../../src/test/e2eTauriMock.ts) | Portfolio-grade seed data (3 artifacts, 4 runs, 3 eval runs, 5 triage clusters, 5 KB gaps). | + ## Shared design system -All four artifacts consume the same token set from the live app — +All artifacts consume the same token set from the live app — [`src/styles/revamp/tokens.css`](../../src/styles/revamp/tokens.css). No artifact introduces new tokens. @@ -47,29 +58,35 @@ status, KB-gap flags) but are never used for decoration. ▼ ▼ ▼ Session 1 Session 2 Session 4 Workspace redesign ───► Screenshot set ───► LinkedIn Live deck - (new React + CSS) (6 × 2× PNGs) (embeds the PNGs) - │ + (React + CSS, (live captures (embeds the PNGs, + behind flag) + HTML mockups) speaker notes + + │ rehearsal kit) ▼ Session 3 One-pager PDF (embeds panel 01 as hero) + │ + ▼ + Case study + (three architectural + decisions, long-form) ``` -If the workspace redesign lands on master, re-running session 2's -capture script regenerates every screenshot; sessions 3 and 4 then -pick up the new screenshots on their next build. The whole portfolio -re-syncs from a single source. +If the workspace redesign ships on master, re-running session 2's +live-capture script regenerates every screenshot; sessions 3, 4, and +the case study then pick up the new screenshots on their next build. +The whole portfolio re-syncs from a single source. ## Voice -Engineering-professional across all four artifacts: +Engineering-professional across all artifacts: - No emojis - No marketing superlatives - Specific numbers: `22 ms p50`, `0.914 macro-F1`, `3,500+ articles`, `25% deflection`, `90-second rollback SLO` -- Pronouns first-person singular only in the deck (sessions 1–3 are - product-voice, session 4 is speaker-voice) +- Pronouns first-person singular only in the deck + case study + (sessions 1–3 are product-voice) - Citations are real — every number traces back to either the README, the eval harness, or a prior production benchmark @@ -79,14 +96,18 @@ Engineering-professional across all four artifacts: # Session 1 — verify handoff bundle compiles pnpm install pnpm ui:typecheck +pnpm lint +pnpm test # 266 tests including WorkspaceHeroLayout.test.tsx -# Session 2 — rerender six panels + contact sheet -node docs/screenshots/capture.mjs +# Session 2 — live captures (real app) or HTML mockups +node docs/screenshots/live-capture.mjs # panels 01/02/04/05 from running dev server +node docs/screenshots/capture.mjs # all 6 from HTML mockups +node docs/screenshots/rebuild-contact-sheet.mjs # re-stitch after mixing # Session 3 — rerender one-pager PDF + PNG preview node docs/one-pager/generate.mjs -# Session 4 — rebuild the PPTX (+ optional PDF) +# Session 4 — rebuild the PPTX (optional PDF via LibreOffice) cd docs/deck && npm run build soffice --headless --convert-to pdf AssistSupport-LinkedIn-Live.pptx ``` @@ -97,47 +118,43 @@ soffice --headless --convert-to pdf AssistSupport-LinkedIn-Live.pptx docs/ ├── portfolio/ │ └── README.md ← this file +├── case-study.md ← long-form writeup (three decisions) ├── redesign/ -│ ├── README.md -│ ├── SPEC.md -│ ├── INTEGRATION.md -│ └── ACCEPTANCE.md +│ ├── README.md · SPEC.md · INTEGRATION.md · ACCEPTANCE.md ├── screenshots/ -│ ├── README.md -│ ├── CAPTIONS.md -│ ├── shell.css -│ ├── capture.mjs -│ ├── panels/ -│ │ ├── 01-workspace.html -│ │ ├── 02-queue.html -│ │ ├── 03-intent.html -│ │ ├── 04-kb-gap.html -│ │ ├── 05-ops.html -│ │ └── 06-eval.html -│ └── out/ -│ ├── 01-workspace.png (2880 × 1800) -│ ├── 02-queue.png (2880 × 1800) -│ ├── 03-intent.png (2880 × 1800) -│ ├── 04-kb-gap.png (2880 × 1800) -│ ├── 05-ops.png (2880 × 1800) -│ ├── 06-eval.png (2880 × 1800) +│ ├── README.md · CAPTIONS.md · shell.css +│ ├── capture.mjs ← HTML-mockup renderer +│ ├── live-capture.mjs ← real-app capture pipeline +│ ├── rebuild-contact-sheet.mjs +│ ├── panels/*.html ← 6 HTML mockups +│ └── renders/ +│ ├── 01-workspace.png (2880 × 1800, live) +│ ├── 02-queue.png (2880 × 1800, live) +│ ├── 03-intent.png (2880 × 1800, mockup) +│ ├── 04-kb-gap.png (2880 × 1800, live) +│ ├── 05-ops.png (2880 × 1800, live) +│ ├── 06-eval.png (2880 × 1800, mockup) │ └── contact-sheet.png (2880 × 2700) ├── one-pager/ -│ ├── README.md -│ ├── one-pager.html -│ ├── generate.mjs +│ ├── README.md · one-pager.html · generate.mjs │ ├── AssistSupport-one-pager.pdf (11in × 8.5in landscape) │ └── AssistSupport-one-pager.png (2112 × 1632 preview) └── deck/ - ├── README.md - ├── build.mjs - ├── package.json - ├── AssistSupport-LinkedIn-Live.pptx (editable, 12 slides) + ├── README.md · build.mjs · package.json + ├── REHEARSAL.md ← timing + Q&A prep + ├── DEMO-VIDEO.md ← 90s storyboard + narration + ├── AssistSupport-LinkedIn-Live.pptx (editable, 12 slides · gitignored, rebuild via npm run build) └── AssistSupport-LinkedIn-Live.pdf (PDF preview) src/ ├── features/workspace/ -│ └── WorkspaceHeroLayout.tsx (new, drop-in for ClaudeDesignWorkspace) -└── styles/revamp/ - └── workspaceHero.css (new, scoped under .wsx) +│ ├── WorkspaceHeroLayout.tsx (new, drop-in for ClaudeDesignWorkspace) +│ └── WorkspaceHeroLayout.test.tsx (smoke coverage) +├── styles/revamp/ +│ └── workspaceHero.css (new, scoped under .wsx) +├── features/revamp/ +│ ├── flags.ts (adds ASSISTSUPPORT_REVAMP_WORKSPACE_HERO) +│ └── shell/RevampShell.tsx (collapses shell rail when hero is on) +└── test/ + └── e2eTauriMock.ts (portfolio-grade seed data) ``` diff --git a/src/styles/revamp/claudeDesignWorkspace.css b/src/styles/revamp/claudeDesignWorkspace.css index fae2db4..fe83603 100644 --- a/src/styles/revamp/claudeDesignWorkspace.css +++ b/src/styles/revamp/claudeDesignWorkspace.css @@ -289,6 +289,7 @@ } .cdw .seg button { + font: inherit; padding: 5px 12px; font-size: 12px; border-radius: 6px; @@ -296,7 +297,6 @@ background: none; border: none; cursor: pointer; - font: inherit; transition: background 120ms ease, color 120ms ease; diff --git a/src/styles/revamp/workspaceHero.css b/src/styles/revamp/workspaceHero.css index 30f84fa..1a0768a 100644 --- a/src/styles/revamp/workspaceHero.css +++ b/src/styles/revamp/workspaceHero.css @@ -49,7 +49,6 @@ background: color-mix(in oklab, var(--as-surface-1) 82%, transparent); border-bottom: 1px solid var(--as-border-1); backdrop-filter: blur(12px); - -webkit-backdrop-filter: blur(12px); } .wsx__ticketBar {