Skip to content

Home Page Redesign — Search-First Home

Status: Proposal (April 2026) — Phase 1 + 2 scoped for implementation on branch homeredesign-claude Reviewer role assumed: Product designer + frontend architect with AI-chat UX background (Claude.ai, Perplexity, v0.dev, Linear) and familiarity with engineering SaaS Purpose: Replace the current workspace-picker landing with a focused search composer for parts and standards, with a secondary mode rail and a recent-items strip. Related: Code Review Frontend findings — D1 (store) and D2 (API client) land naturally on this new surface.

Problem With The Current Home

  • Big hero + laptop-mockup reads like a marketing page, not a work surface.
  • Top-right "Modes" dropdown duplicates the 5 mode cards below — two launchers for the same action.
  • "REVIEW WORKSPACE" label implies persistent workspace state that doesn't exist on the home.
  • The user can only pick a mode. There is no way to find a part or look up a standard from the home.
  • Returning users have no path to recent work.

The Reframing

The home is a focused search composer for parts and standards, with a secondary rail of mode launchers and a returning-user strip of recent and pinned items. Everything else is decoration.

The chat is not a general AI assistant — it is a domain-specific search input with two scopes: Parts (vision-indexed library) and Standards (DFM rule library + company standards). Framing it as generic "Ask anything" would set the wrong expectation and get compared against ChatGPT.

Layout

┌─────────────────────────────────────────────────────────────────────────────┐
│ ▣ RapidDraft                                                      [avatar] │
├─────────────────────────────────────────────────────────────────────────────┤
│                                                                             │
│                 Find a part. Check a standard. Open a review.               │
│                                                                             │
│         ┌─────────────────────────────────────────────────────────────┐     │
│         │ [●Parts ○Standards ○All]                                    │     │
│         │                                                             │     │
│         │  Describe the part, or drop a STEP / image…                 │     │
│         │                                                             │     │
│         │ [📎 Attach]                               [⏎ Search]        │     │
│         └─────────────────────────────────────────────────────────────┘     │
│         Library: 1,284 parts · indexed by vision · last update 4h ago       │
│                                                                             │
│   Try:  [L-bracket M6 pattern]  [pocket R 2 mm]  [ASME Y14.5 §5.3]          │
│         [ISO 2768-mK]  [sheet metal 1.5mm AL]                               │
│                                                                             │
├─────────────────────────────────────────────────────────────────────────────┤
│ RECENT PARTS                                              Pinned standards  │
│ [thumb] [thumb] [thumb] [thumb] [thumb] →     ASME Y14.5-2018   ISO 2768    │
│                                                AS9100D §8.4    DIN 7167     │
├─────────────────────────────────────────────────────────────────────────────┤
│ OR JUMP INTO A WORKSPACE                                                    │
│  [≣ Batch]  [📐 Drawing]  [★ Design Review]  [👥 Collab]  [◆ Expert]        │
└─────────────────────────────────────────────────────────────────────────────┘

Anatomy

Header. Logo left, avatar right. Drop the "REVIEW WORKSPACE / Modes" duplicate — the rail at the bottom owns that now.

Composer. - Scope chips (Parts · Standards · All) on the left. Default Parts. Resolves "is this chat or search" ambiguity. - Multiline textarea; placeholder changes with scope. - Attachment button; drag-and-drop the whole composer zone also works — the entry point for vision-indexed image/STEP search. - Submit on ⌘⏎ or button click. - Caption below: Library: N parts · indexed by vision · last update Xh ago. Trust signal + freshness.

Example prompts. 4–6 short chips, scope-aware; clicking populates (doesn't auto-submit).

Recent + Pinned strip. Thumbnail strip of recent parts (with vision-generated caption on hover) and a small list of pinned standards. Hidden when empty.

Mode rail. Compact icon + label, single row, "Or jump into a workspace".

Key Interactions

  • ⌘K / Ctrl-K focuses the composer from anywhere, including inside workspaces.
  • Tab cycles scope chips; / opens scope switcher.
  • Drag or paste a STEP/PNG/JPG on the composer → attachment captured, scope auto-switches to Parts.
  • Enter submits; results appear on a dedicated search results page (not inline on home).
  • Recent part click opens the part in whatever mode it was last used in (last-used affinity).
  • Mode rail hover shows a one-line description.

Copy

  • Headline: Find a part. Check a standard. Open a review.
  • Placeholder (Parts): Describe the part — e.g. "L-bracket for 10 mm shaft, M6 bolt pattern" — or drop a STEP / image.
  • Placeholder (Standards): Look up a clause — e.g. ASME Y14.5 §5.3 datum precedence, ISO 2768-mK.
  • Caption: Library: N parts · vision-indexed · last update X ago.
  • Mode-rail caption: Or jump into a workspace
  • Trust footer: Results are advisory. Open a review to verify.

Reference Patterns

Source Borrow
Claude.ai Calm composer, centered, single focus
Perplexity Scope chips + trust caption below composer
v0.dev Example prompts as chips that populate (not submit)
Linear ⌘K discipline; same shortcut home and inside workspaces
GitHub Copilot Workspace Attachment-centric input (STEP, image, PDF)
Figma community Recent thumbnails row — quiet, clickable, returning-user bait

Phased Plan

Phase 1 — Frontend shell + composer (IMPLEMENTING NOW)

UI-only. No backend search. Submit produces a "coming soon" state.

Scope: - New Home.tsx replacing the current ModeLauncher as the landing component. - Composer with scope chips, placeholder, attachment-capable drag zone, submit button. - Example-prompt chips, scope-aware; click populates composer. - Compact mode rail at the bottom calling into existing workspace-open logic. - Remove the top-right Modes dropdown and hero laptop mockup on the home route. - Keyboard: ⌘K / Ctrl-K focuses composer; Enter submits; Tab cycles scopes. - Calm visual: no search results page yet — submit toasts "Search coming soon".

Out of scope for Phase 1: backend search, recent parts, pinned standards, ⌘K from inside workspaces.

Phase 2 — Mode rail wiring + recent thumbnails (IMPLEMENTING NOW)

  • Mode rail opens the existing workspace modes through the existing launch path (no behavior change inside workspaces).
  • Recent parts strip pulled from the existing models endpoint (GET /api/models); click opens model in last-used mode.
  • Pinned standards placeholder strip; static list acceptable for Phase 2 (wired into localStorage so it feels real but is not yet backend-backed).

Out of scope for Phase 2: search backend, standards corpus ingestion, server-side pinned standards, user preferences sync.

Phase 3+ — deferred

  • Parts search backend + indexing.
  • Standards search.
  • ⌘K everywhere, dedicated results page, keyboard a11y polish.
  • Sync pinned items server-side.

These phases depend on backend work and are documented here for traceability; they are not part of the current branch.

Open Questions (do not block Phase 1/2)

  1. Keep 5 modes or consolidate to 3?
  2. Should returning users bypass the home straight to their last workspace?
  3. Standards corpus at launch: rule library only, user-uploaded company standards, or both?
  4. Keep Modes dropdown as ⌘K workspace switcher inside workspaces (removed from home)?
  5. Marketing content moves to a separate rapiddraft.ai site while app.rapiddraft.ai becomes pure work surface?

Implementation Notes (for the current branch)

  • Branch: homeredesign-claude (local only, never pushed from this review folder).
  • Repo: D:\02_Code\54_ClaudeReview_Rapiddraft\rapiddraft_utumpitch.
  • Minimise cross-cutting churn — the home is a leaf, not a refactor.
  • Do not introduce Zustand/React Query in this branch. The code review's D1 and D2 findings are the right moment for that migration — but not here. Use local component state and existing fetch patterns; keep the diff small.
  • Use only existing dev dependencies (react, clsx). No new npm packages.
  • Style with inline CSS classes defined in web/src/styles.css, matching the existing look.
  • Build verification: npm run build must pass before the branch is considered ready to deploy locally.

Acceptance Criteria For Phase 1 + 2

  • Visiting the app with no model loaded shows the new Home.
  • Composer renders with three scope chips; default is Parts; clicking a chip changes placeholder.
  • Typing in composer and pressing Enter shows a "Search coming soon" message (Phase 1) — does not crash.
  • Attachment button opens a file picker; drag-and-drop onto the composer zone works.
  • Example-prompt chips populate the composer without submitting.
  • Mode rail shows all currently-enabled modes; clicking one opens that workspace (existing behavior).
  • When the models endpoint returns results, the recent-parts strip renders thumbnails and routes to the last-used mode on click (Phase 2).
  • Pinned standards strip renders from localStorage; Phase 2 can ship with a static starter list.
  • npm run build passes, no new TypeScript errors.
  • Existing Playwright specs still pass.

Deferred To A Later Branch

  • Dedicated search results page.
  • Backend search endpoints (POST /api/search/parts, POST /api/search/standards).
  • Vision-based part indexing pipeline (persist one canonical caption per part).
  • ⌘K global palette inside workspaces.
  • Drag-and-drop STEP that auto-opens upload + review flow.