Redesign the workbench visual hierarchy #87

Merged
weichen merged 4 commits from feature/workbench-visual-redesign into main 2026-10-14 16:53:45 +00:00
Owner

The three-column workbench now has a distinct visual frame: dark navigation establishes context, the conversation uses a focused reading column with clearly different user and assistant surfaces, and the work rail keeps its own task hierarchy. This replaces the flat gray presentation while preserving the existing fast/slow task behavior and middle/right ownership rules.

Navigation colors come from the paired UI token PR #56; feature CSS no longer derives private colors or motion. The visual contract is covered by browser assertions that first failed against the old full-width, low-contrast layout. Validation on 9b9f24b includes 272 unit tests, a production build, and 19 Playwright scenarios across light/dark/molv and 320–1920px, including folded process history, work/card deduplication, files, confirmations, and responsive navigation.

The three-column workbench now has a distinct visual frame: dark navigation establishes context, the conversation uses a focused reading column with clearly different user and assistant surfaces, and the work rail keeps its own task hierarchy. This replaces the flat gray presentation while preserving the existing fast/slow task behavior and middle/right ownership rules. Navigation colors come from the paired [UI token PR #56](https://git-home.u1680832.nyat.app:30319/weichen/Agent-System-UI/pulls/56); feature CSS no longer derives private colors or motion. The visual contract is covered by browser assertions that first failed against the old full-width, low-contrast layout. Validation on `9b9f24b` includes 272 unit tests, a production build, and 19 Playwright scenarios across light/dark/molv and 320–1920px, including folded process history, work/card deduplication, files, confirmations, and responsive navigation.
weichen added 3 commits 2026-10-14 16:45:25 +00:00
Why: The three-column workspace read as flat and visually scattered, making conversation, current work, and navigation difficult to distinguish.
Evidence: 272 unit tests, 16 focused browser scenarios across 320-1920px, and the production build pass locally.
Impact: Refines the existing workbench presentation without changing its data flow or fast/slow task behavior.
Refs: Agent-System-Dev feature/workbench-visual-redesign
Why: Spacing-only refinements still looked like the original flat gray workspace and did not satisfy the approved visual redesign.
Evidence: 272 unit tests, 16 browser scenarios across 320-1920px, and the production build pass locally.
Impact: Gives navigation, authored messages, assistant results, and work details clearly different visual surfaces while preserving behavior.
Refs: Agent-System-Dev feature/workbench-visual-redesign
Why: The inherited light-theme divider and hover treatment disappeared inside the new inverse create button.
Evidence: Focused browser layout test and production build pass locally.
Impact: Changes only the create action divider and hover surface.
Refs: Agent-System-Dev feature/workbench-visual-redesign
weichen added 1 commit 2026-10-14 16:50:27 +00:00
Why: Independent review found component-local color derivation, a private transition, and missing dark/molv coverage in the visual candidate.
Evidence: Frontend design guard passes and 19 Playwright scenarios cover light, dark, molv, and 320-1920px layouts.
Impact: Keeps the approved visual direction while moving color ownership to @ui tokens and removing private motion.
Refs: Agent-System-Dev feature/workbench-visual-redesign
weichen merged commit 5ab81432d1 into main 2026-10-14 16:53:45 +00:00
Sign in to join this conversation.
No Reviewers
No labels
1 Participants
Notifications
Due Date
No due date set.
Dependencies

No dependencies set.

Reference: weichen/Agent-System-Frontend#87