When an agent system grows to multiple running agents, missions, and configurations, the dashboard easily becomes a packed noticeboard full of tables, numbers, and status badges. That’s exactly what happened with Orca — and exactly what this redesign fixes.
Why change the dashboard
The original layout crammed everything onto one screen: recent tasks, missions, token usage per model, outcomes, metrics. It was clear when you had one agent and a few tasks. Once there were more, it became more distracting than useful.
The redesign goal was simple: calm overview, not a data dump. Instead of “show everything” — “show what matters and leave the rest to detail pages.”
Aurora hero panel
The new dashboard opens with a glass panel backed by a subtle aurora glow. Inside: a greeting, status line, current time, and buttons for new task or mission. No data — just context and a starting point.
@keyframes aurora-drift {
from { transform: translate3d(0, 0, 0) scale(1); opacity: 0.85; }
to { transform: translate3d(5%, 3%, 0) scale(1.1); opacity: 1; }
}The aurora animation is subtle, almost imperceptible — but it gives the panel life without getting in the way. And thanks to prefers-reduced-motion, people with that preference won’t see it at all.
Big stat cards
Instead of mini metrics in a row, the dashboard now offers four large cards: projects, models, active missions, running agents. Big number, small label, icon. System overview at a single glance.
Instead of “how many tasks are in progress” — “how large a system is currently running.”
Live agent lane
The running agents section only appears when there are any. Each agent gets a status pulse, model icon, name, and latest activity. When nothing’s running, the section disappears — the dashboard stays clean.
Autopilot and configuration
The autopilot spotlight stayed — it’s a key section for mission monitoring. New is the configuration row: current autonomy level, max sessions, engine, review status — all as small pills with icons. You can immediately see how the system is configured without going into settings.
CSS split into modules
Along with the redesign came an architectural change: the monolithic globals.css broke into four modules:
tokens.css— design tokens (colors, fonts, spacing)base.css— global styles, scrolling, focus ringscomponents.css— recurring component stylesanimations.css— all keyframes and transition utilities
Everything is collected via postcss-import into a single entry point. No runtime overhead, just cleaner organization.
What was removed
The most important part of the redesign might be what disappeared:
- Recent tasks table — moved to the Tasks page
- Mission list with progress bars — available in Tasks
- Token usage per model — available in settings
- Recent outcomes list — available in task detail
The dashboard lost a lot of data this way. But it gained something more important: room to breathe.
Why it makes sense
An agent dashboard isn’t an analytics tool. It’s a place you glance at to know whether something’s happening and whether you need to intervene. For that, you don’t need a token table — you need a clear signal.
A calm dashboard for a busy system. That was the goal.