fix: simplify coding project card rail
This commit is contained in:
14
design-qa.md
14
design-qa.md
@@ -1,20 +1,20 @@
|
||||
**Comparison Target**
|
||||
|
||||
- Source visual truth: `/var/folders/m7/x9ry3xgx4x50fxb20_0108tr0000gn/T/codex-clipboard-58e2cc35-7a17-4951-8bbc-53fee12d5246.png`, superseded at the lower action area by the user's explicit follow-up: use a standalone `新增项目` CTA and horizontally arranged existing-project cards, not a conversation box.
|
||||
- Implementation screenshot: `/Users/inmanx/.codex/visualizations/2026/09/06/01a0756a-b6f5-7892-a11c-1c1608ebe592/makelore-coding-default-v2.png`
|
||||
- Full-view comparison: `/Users/inmanx/.codex/visualizations/2026/09/06/01a0756a-b6f5-7892-a11c-1c1608ebe592/codex-reference-vs-makelore-v2.png`
|
||||
- Focused lower-region comparison: `/Users/inmanx/.codex/visualizations/2026/09/06/01a0756a-b6f5-7892-a11c-1c1608ebe592/codex-reference-vs-makelore-v2-bottom.png`
|
||||
- Source visual truth: `/var/folders/m7/x9ry3xgx4x50fxb20_0108tr0000gn/T/codex-clipboard-58e2cc35-7a17-4951-8bbc-53fee12d5246.png`, superseded at the lower action area by the user's explicit follow-ups: use a standalone `新增项目` CTA and horizontally arranged existing-project cards, not a conversation box, and omit the visible `已有项目` / `选择一个项目继续` labels.
|
||||
- Implementation screenshot: `/Users/inmanx/.codex/visualizations/2026/09/06/01a0756a-b6f5-7892-a11c-1c1608ebe592/makelore-coding-default-v3.png`
|
||||
- Full-view comparison: `/Users/inmanx/.codex/visualizations/2026/09/06/01a0756a-b6f5-7892-a11c-1c1608ebe592/codex-reference-vs-makelore-v3.png`
|
||||
- Focused lower-region comparison: `/Users/inmanx/.codex/visualizations/2026/09/06/01a0756a-b6f5-7892-a11c-1c1608ebe592/codex-reference-vs-makelore-v3-bottom.png`
|
||||
- State: Codex reference start screen and Makelore Code with two remembered local projects but no active project.
|
||||
- Viewport: implementation CSS viewport 1280 x 800 at device scale factor 1. The source is 908 x 835 pixels with unknown capture density. For full-view comparison, the source was aspect-fit onto a 1280 x 800 white canvas and the implementation remained at its native 1280 x 800 size. The focused comparison uses a 400-pixel-tall lower crop from each normalized content region.
|
||||
|
||||
**Findings**
|
||||
|
||||
- No actionable P0, P1, or P2 differences remain after applying the user's correction.
|
||||
- Fonts and typography: the M hero keeps the reference's restrained system-sans hierarchy and single-line display copy. The CTA, section label, project names, and recency metadata form a clear descending hierarchy without crowding or truncation at the verified viewport.
|
||||
- Fonts and typography: the M hero keeps the reference's restrained system-sans hierarchy and single-line display copy. The CTA, project names, and recency metadata form a clear descending hierarchy without crowding or truncation at the verified viewport.
|
||||
- Spacing and layout rhythm: the hero retains generous white space. The standalone CTA is visually separated from the existing-project row, and fixed-width cards create a true horizontal browsing pattern without increasing page height as the catalog grows.
|
||||
- Colors and visual tokens: the CTA uses the existing Makelore brand orange and the cards use existing neutral surface tokens, preserving the single light product system and one-accent discipline.
|
||||
- Image quality and asset fidelity: the hero uses the repository's existing vector Makelore M asset. Project cards use the product's installed icon library; no placeholder image, CSS drawing, or reconstructed logo is present.
|
||||
- Copy and content: `新增项目`, `已有项目`, and `选择一个项目继续` state the two available paths directly. Project cards use real project names and last-opened timestamps from the local catalog.
|
||||
- Copy and content: `新增项目` remains the only action label above the card rail. The redundant `已有项目` heading and `选择一个项目继续` helper are absent; project cards themselves use real project names and last-opened timestamps from the local catalog.
|
||||
- Interaction and accessibility: the CTA opens the existing creation dialog; each card has a project-specific accessible name, keyboard focus treatment, pressed feedback, horizontal overflow, and routes through the Sidebar's existing validated project-entry behavior.
|
||||
|
||||
**Open Questions**
|
||||
@@ -35,6 +35,7 @@
|
||||
- Pass 1: the user identified a P1 interaction-model mismatch: the lower surface looked like a default conversation box and omitted horizontally arranged existing projects.
|
||||
- Fix: replaced the composer-shaped starter with a standalone `新增项目` CTA; added a horizontal, overflow-safe row backed by the real project catalog; connected card clicks to the existing Sidebar entry path; added unit and Electron coverage.
|
||||
- Pass 2: the revised full-view and focused comparisons show the corrected CTA/card hierarchy with no remaining actionable P0/P1/P2 findings.
|
||||
- Pass 3: removed the visible project-section heading and helper copy at the user's request. The fresh screenshot and focused comparison confirm that the CTA now leads directly into the unchanged horizontal card rail.
|
||||
|
||||
**Implementation Checklist**
|
||||
|
||||
@@ -42,6 +43,7 @@
|
||||
- [x] Remove the composer-shaped no-project starter.
|
||||
- [x] Add one standalone `新增项目` primary CTA.
|
||||
- [x] Render real existing projects as horizontal cards.
|
||||
- [x] Remove the visible `已有项目` and `选择一个项目继续` labels.
|
||||
- [x] Reuse the existing creation and validated project-entry flows.
|
||||
- [x] Verify both the empty catalog and remembered-project states in Electron.
|
||||
|
||||
|
||||
Reference in New Issue
Block a user