Coding Workspaces (Desktop)
Code tools are used for long sessions by people who build spatial memory around files, panes, and shortcuts. Optimize for stable hierarchy and direct manipulation, not dashboard-like decoration.
Establish the work surface
Keep the editor or primary artifact visually dominant. Secondary tools — file navigation, source control, terminal, output, problems, documentation, and AI assistance — should be discoverable and quickly reachable without competing for equal attention.
Use persistent panes only for information a user needs continuously. Everything else should be collapsible, movable, or summonable from a command palette. Remember pane sizing and visibility per workspace when that does not create surprise.
Familiar domain logic
- File trees reveal structure; avoid hiding ordinary operations behind icon-only controls or hover-only affordances.
- Tabs represent open working context, not an arbitrary navigation system. Make modified, pinned, preview, and close states unambiguous.
- Diffs should preserve orientation: old/new meaning, line numbers, additions, deletions, and context must remain visible while reviewing.
- Terminal output is dense, selectable, searchable, and distinct from polished application messaging. Never restyle it into a chat transcript.
- Command palettes are for fast actions and fuzzy recall. Keep results keyboard-navigable, ranked sensibly, and free of decorative card layouts.
Agent-assisted coding
An agent is another work surface, not the center of the IDE. Show its plan, active files, commands, and proposed changes in language a developer can audit. Link a claimed change to its diff or file; expose permission boundaries and failures plainly. Preserve the developer's ability to edit while the agent works, and reconcile conflicts rather than silently overwriting local work.
Keyboard and focus
Every primary task must have a keyboard path. Do not steal focus when output refreshes, a task completes, or a terminal emits data. Use familiar shortcuts where platform conventions apply and document uncommon shortcuts adjacent to the feature until they are learnable.
Visual rules
Use a restrained technical register: high legibility, small-to-medium radius, purposeful monospace only where code or structured data benefits, and one clear active-selection treatment. Dense does not mean cramped: align gutters, give rows breathing room, and use borders or subtle surface shifts to separate panes instead of excessive shadows.
Review format
| Before | After | Why |
|---|---|---|
| A large AI panel permanently displaces the editor | The editor remains primary; agent status is dockable and linked to files and diffs | Developers retain their working context while gaining auditable assistance |
| A diff uses only red and green backgrounds | Gutter markers, +/- symbols, labels, and accessible contrast supplement color | Review meaning survives color-vision differences and dense code |
| Every tool is a fixed sidebar icon | Frequent tools are stable; infrequent actions live in a searchable command palette | The workspace stays scannable without making features hard to find |