naps62-yoloandClaude Opus 4.8
e909790b56
Capture the web UI's strategic register (product) and the visual design system (OKLCH token palette, monospace-first type, dark+light theming) for the impeccable workflow. Supersedes the transient .impeccable.md. Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
73 lines
3.4 KiB
Markdown
73 lines
3.4 KiB
Markdown
# Product
|
|
|
|
## Register
|
|
|
|
product
|
|
|
|
## Users
|
|
|
|
A single technical operator (a developer) managing every interactive shell and
|
|
agent — Claude Code, opencode, plain bash — running across multiple machines.
|
|
The job-to-be-done: from any device (laptop, desktop, **phone**), get an
|
|
accurate at-a-glance picture of all live sessions across all hosts, then attach
|
|
to one and drive its terminal. Usage is often glance-and-go: checking on a
|
|
long-running agent, killing a stray session, or hopping into a shell mid-task.
|
|
Mobile-first is a hard requirement — touch targets, viewport-fit safe areas,
|
|
and bottom-sheet modals already reflect this.
|
|
|
|
## Product Purpose
|
|
|
|
Maestro is a unified terminal-session orchestrator: one place to see and attach
|
|
to every interactive session running across every machine the operator cares
|
|
about. tmux for persistence, WebSocket for transport, a daemon-per-host
|
|
federated by a small always-on registry. The web UI is the browser face of
|
|
that system — it renders the cross-host session catalog and provides the attach
|
|
terminal (xterm.js). Success = the operator trusts the picture is accurate and
|
|
current, and can get from "open the page" to "typing in the right session" in
|
|
seconds, on any device.
|
|
|
|
## Brand Personality
|
|
|
|
Three words: **precise, calm, alive.** This is infrastructure tooling — it must
|
|
read as trustworthy and exact, never toy-like — but it watches living
|
|
processes, so status must feel present and current, not static. Voice is terse
|
|
and technical, matching the CLI and the repo's terse house style. It is a
|
|
craftsman's tool: opinionated, monospace-literate, with quiet personality
|
|
rather than decoration. Emotional goals: in control / confident, fast /
|
|
efficient, calm / uncluttered, with earned moments of delight.
|
|
|
|
## Anti-references
|
|
|
|
- Generic Tailwind-admin / SaaS-cream dashboards.
|
|
- Heavy gradients, glassmorphism, glass cards as decoration.
|
|
- Playful, rounded, "friendly app" aesthetics that undercut the
|
|
infrastructure-tool trust.
|
|
- Whitespace-maximalist layouts that trade away the at-a-glance scan for
|
|
"elegance."
|
|
- Anything where you could guess the design from the category alone
|
|
("terminal tool → CRT-green-on-black novelty"): the orchestrator identity is
|
|
earned through restraint, not costume.
|
|
|
|
## Design Principles
|
|
|
|
1. **The scan is the product.** Optimize for instant comprehension of "what's
|
|
running, where, and is it healthy" across many sessions and hosts. Status
|
|
legibility beats everything else.
|
|
2. **Calm under load.** Stay uncluttered whether there are 3 sessions or 300;
|
|
hierarchy and grouping carry the weight, not color-shouting every row.
|
|
3. **Fast and keyboard-literate.** Low-friction, efficient, gets out of the
|
|
way; honor keyboard navigation, don't make the operator hunt.
|
|
4. **Monospace as identity.** Treat the mono/sans pairing as deliberate brand
|
|
typography, not just terminal output. Ids, hosts, counts, and state read as
|
|
precise technical data.
|
|
5. **Earned delight.** Personality lives in motion and micro-detail (live-status
|
|
pulse, attach transitions, cursor cues), never in noise — always craft.
|
|
|
|
## Accessibility & Inclusion
|
|
|
|
Standard good practice, applied rigorously: WCAG AA contrast for all text and
|
|
status, visible keyboard focus on every interactive element, and a full
|
|
`prefers-reduced-motion` alternative for every animation. Status must never rely
|
|
on color alone (pair the dot with a label/shape). Dark and light themes are
|
|
equal citizens, driven entirely by CSS custom-property tokens.
|