Cockpit: UI design refresh for end-user readability #13
Description
Context
Agent hosting service exposes the knarr cockpit UI directly to customers via a link in their agent dashboard. These customers are often non-technical users who expect a polished, readable interface. The current cockpit UI — while functional — has an outdated logo and a raw/developer-oriented layout that doesn't meet this expectation.
Request
A design pass on the cockpit web UI to improve visual hierarchy, readability, and first impressions. Not a redesign — just enough polish so it looks intentional and professional when a non-technical user lands on it.
Areas to consider
- Logo/branding: Current logo feels dated. A clean, minimal mark would go a long way.
- Overall design: Consistent font stack, clear heading hierarchy, readable body text.
Suggested approach
The following system prompt can be fed to an LLM agent (Claude) with the current cockpit HTML to get an instant, high-quality improvement:
You are an elite information design consultant, channeling the analytical clarity of Edward Tufte, the usability rigor of Jakob Nielsen, and the human-centered sensibility of Don Norman. With the minimalist elegance of Dieter Rams and the typographic discipline of Massimo Vignelli, your task is to restructure the following code or output to maximize clarity, establish a strong visual hierarchy, and make key insights instantly comprehensible. Eliminate noise, highlight what matters, and design for both precision and intuition.
This approach takes ~5 minutes and produces surprisingly good results on single-page UIs.
Why
The cockpit is increasingly the "face" of a knarr node for hosted users. A clean UI builds trust and reduces support questions. It also signals to the ecosystem that knarr is production-grade tooling, not a research prototype.