QuotaLens · design review · 3 September 2026
The current system — Bench, an instrument in an anodised housing with one lit amber readout — is coherent and it works. What follows is not a repaint of it. Each direction takes a different position on what the page is, which changes the layout before it changes a single colour.
Every direction below keeps the rules that are load-bearing rather than decorative: colour is never the only channel, epistemic states (stale, auth failed, unverified) remove the number instead of colouring it, there is no green for "good", and the specimens are set in the system stack the product actually ships. What changes is the organising idea.
Direction A
The page is one time axis. Now is a fixed vertical rule; the record runs left of it and the projection runs right. Every window is a lane on that axis instead of a card of its own.
The weekly window reaches 100% today at 16:40, an hour and forty minutes before the session window resets.
4.82 pts/hr — 3.4× your 5-hour baseline. Climb began 03:14.
One shared x-axis; lanes, not cards. Attribution becomes a fourth lane rather than a table.
Paper #F1F2EF and ink, light-first. One chromatic: ultramarine #1B44A0 = now & live. Red only for a breach.
System sans for prose, mono for anything on the axis. No large readout — the shape is the headline.
High. The chart is the layout, so the dashboard is rebuilt. The site keeps the strip as its hero image.
The claim the product actually makes — we keep the series, and we can see ahead — becomes the structure of the page rather than one panel inside it. "The session resets before the weekly runs out" is legible without reading a number.
The single dominant readout. Someone glancing for one number has to read a bar. It also needs real horizontal room, so the phone layout is a genuine second design, not a reflow.
Direction B
Lead with the sentence, not the number. The page states its conclusion in plain English and puts the evidence underneath. Colour appears only when something is wrong — so a grey page is itself the all-clear.
You reach the weekly limit today, about 16:40 — two hours and eleven minutes from now.
You are burning 4.82 points an hour, 3.4× your usual pace for this time of day. The climb started at 03:14 while nothing was open on this machine.
One 600px column, stacked. Detail lives one click down, not on the first screen. The site is the same column with different words.
Achromatic, plus a single red #A81E26 that only appears when a window is in trouble. No accent, no brand hue at all.
The conclusion at 31px in the UI face; mono only for figures. Prose-scale, not instrument-scale.
Lowest. One stylesheet serves the app and the site, and most of the existing markup survives as the "details" view.
It answers the question people open the tool to ask, in the words they would use. Site and app become one design, so a change is made once. And a page with no colour on it is unambiguous good news.
Density. This is a page you read, not an instrument you scan, and power users who want six series at once must click through. Writing a correct sentence for every state is real work — six states, plus the "nothing is wrong" case.
Direction C
It is a local tool you started from a terminal, so render it like one. Everything sits on a monospace character grid: meters are cells, the chart has square joins, there are no icons and no curves anywhere.
climb began 03:14 — gic-migration-factory, opus-4.6, no local session open
| project | model | turns | in | burn | last |
|---|---|---|---|---|---|
| gic-migration-factory | opus-4.6 | 412 | 1.94M | 3.1 pts/h | 2m |
| quotalens | sonnet-4.8 | 96 | 318k | 0.6 pts/h | 1m |
| brahma-scc | opus-4.6 | 54 | 221k | 0.4 pts/h | 46m |
| (web app) | — | — | — | 0.3 pts/h | 18m |
A fixed measure, sections divided by full-width rules. Nothing is a card. Everything is on screen at once.
Near-black #0E1113, ice #5FC9DE for the live rate, red for breach. Dark only — a light mode would fight the idea.
Monospace for everything, including prose. Two sizes and one accent size; the grid does the rest.
Medium. New tokens and a rewritten chart, but the markup and density are close to what exists.
The highest density of the three and the strongest fit to what the thing is — a CLI with a window attached. Meters made of cells cost nothing to draw and stay honest at any width, and the look is unmistakable next to any other Claude usage tool.
Prose set in mono is harder to read, so the website cannot use this language directly — it needs a quieter sibling. Terminal aesthetics also read as niche; someone who is not a developer will find it cold.
Identity
The lens with rays was doing symbolic work — refraction as the metaphor for turning a level
into a rate. It is a fair idea and a dull picture, and it stops being legible at 16px. These go the other
way: no metaphor, just a shape that either carries information or gets out of the way. All are one or two
paths, all hold at favicon size, all inherit currentColor.
1 · The meter
The mark is the reading. Fixed at 68% on the site; live in the app, so the favicon in your tab strip is the session window. No symbolism to explain.
2 · The window
A window is the product's actual unit — five-hour, seven-day. Two brackets, nothing inside them. Geometric, quiet, and it never needs to be redrawn for a new feature.
3 · The now-rule
A timeline crossed by the present moment. Direction A's central device shrunk to 16px — if the dashboard is a tape, this is a frame of it.
4 · The break
Flat, then the climb. One path, two segments — the same idea the lens was reaching for, said without the optics lesson. The most conventional of the five.
5 · No mark at all
Lowercase wordmark and a block cursor, which blinks in the app and holds still on the site. The favicon becomes the cursor alone. Nothing to defend, nothing to redraw.
Side by side
| A · Tape | B · Answer | C · Console | |
|---|---|---|---|
| Organising idea | Shared time axis | Conclusion first, evidence after | Character grid |
| Default scheme | Light | Light, dark equally good | Dark only |
| Chroma | One blue + red | None until something breaks | One cyan + red |
| Density | Medium | Low | High |
| Site and app | Different languages, shared strip | Literally the same stylesheet | Site needs a quieter sibling |
| Phone | Second design required | Free — it is already a column | Horizontal scroll or a cut-down view |
| Rebuild | Dashboard from scratch | Restructure, keep most markup | New tokens, new chart, same bones |
| Pairs with mark | 3 (now-rule) or 1 | 5 (no mark) or 1 | 5 (cursor) or 1 |
Specimens are hand-built HTML and inline SVG with no external requests, set in the system stacks the product ships. Figures are the same illustrative sample throughout — 4.82 pts/hr, 68% and 91% — and are not read from a real account. This page's own chrome is set in IBM Plex, which is a review-document choice; nothing here proposes adding a webfont to the product.