Design concept
The Bead
One small mass of light is the whole brand. It rests in the corner of your day, arrives as an invitation, opens into the Moment, and settles back when you return. Everything else in Unlook stays flat and quiet — so that the one liquid thing means something.
01 · Meaning
The state of the system, made material
The Bead is not a logo that was later animated. It is the engine's state, given a body: when Unlook is counting your focus it breathes; when you snooze it stretches and stills; when you pause it flattens; when the product is read-only it empties to an outline.
That is a deliberate inversion of how most software communicates. Unlook carries state insilhouette — never in colour, never in a badge, never in a number. It is what lets the same mark survive reduced motion, high contrast, and forced colours without losing its meaning: the shape is still the message when everything else is stripped away.
02 · Geometry
Four silhouettes, one identity
The Bead is drawn with nothing but corner radii — four asymmetric curves that keep it organic without ever becoming a blob or a perfect circle. These are the approved values, exactly as the product ships them.
Monitoring
58% 42% 47% 53% / 46% 51% 49% 54%Breathes on the 11-second clock. The default living state.
Snoozed
62% 38% 60% 40% / 42% 46% 54% 58%Elongated and still — waiting, not watching.
Paused
50% 50% 50% 50% / 40% 40% 60% 60%Flattened and still — held, on purpose.
Off
monitoring geometry · outline onlyNo fill, a boundary line. Present, not active.
At 16 pixels the Bead simplifies to a single solid path — the mark — with no gradient and no rim: 57% 43% 48% 52% / 47% 50% 50% 53%. It is the favicon of this site.
03 · Surface & light
Lit from one place, always
A single off-screen light origin, above and to the left, lights everything Unlook draws — the Bead's fill, the sheen that slides across it, the warm wash on the canvas, the Suspension field. One world, one sun.
radial · #FCFAF2 → #E9E2CE 44% → #CDC2A2rim · brass.500 at 55%radial · #3A372C → #232219 46% → #141310rim · brass.300 at 60%The rim is a material property, not a signal — deliberately weaker than the product's one full-strength brass indicator, so the two can never be mistaken for each other. And the Bead casts no shadow inside its own container: depth belongs to surfaces, not to the mark.
04 · Colour
Ink, bone, and a disciplined gold
Three scales and nothing else. Warm near-blacks, warm off-whites, and brass — the gold that makes Unlook feel like an object rather than an interface. There is no red, no green, no alarm colour anywhere in the product.
Ink
- ink.950 · #0B0B0A
- ink.900 · #0E0E0C
- ink.850 · #131311
- ink.800 · #191916
- ink.700 · #23231F
- ink.600 · #31302A
- ink.500 · #4A4942
- ink.400 · #6C6B61
- ink.300 · #939186
Bone
- bone.50 · #FCFBF7
- bone.100 · #F8F7F1
- bone.200 · #F3F1EA
- bone.300 · #EFEDE6
- bone.400 · #E6E3D9
- bone.500 · #DAD7CB
- bone.600 · #C6C2B3
Brass
- brass.200 · #DBC48D
- brass.300 · #C4A863
- brass.400 · #AE9455
- brass.500 · #937C42
- brass.600 · #7E6935
- brass.700 · #6E5B2E
The brass rule
Full-strength brass appears in exactly two places: the keyboard focus ring, and the camera-active signal. At 55–60% it is the Bead's rim. And it is never a button fill, a link, a heading, a chart, a hover, or body text. Gold stays precious because it is spent carefully.
05 · Typography
A voice and a ledger
Karla speaks; Azeret Mono keeps the books. Everything human is set in Karla — headings at 600, labels at 500, body at 400, with 700 reserved for the wordmark alone. Every figure, time, and status is mono, with tabular numerals, so the record reads like a record.
Look somewhere far away.
Let your eyes settle. Blink whenever you like. A break is not a failure to work — it is part of a sustainable workday.
MONITORING · 4H 12M · 6 OF 9 MET · 09:59
06 · The line language
Curves too large to close
During a Moment, three immense circular arcs cross the display — their centres far outside it, their radii floored so that no screen can ever contain a whole one. You are inside something, not looking at something.
Only the centres drift
The eleven-second drift moves each arc's gradient centre a few pixels in opposing directions. The field itself never slides — so no rectangular edge can ever enter the frame, and the dark field feels fixed, like a room.
Rimmed in brass, barely
Each arc carries a 1.5-pixel brass rim at less than 60% strength — the same material as the Bead's rim, at the same restraint. The heaviest fill paints last, so the lighter rims stay visible through it.
No tricks
No blur, no filters, no particles, no video. Six gradient layers and one slow clock. The calm is composed, not rendered.
07 · The motion laboratory
The approved states, live
Six states, with their real tokens. Motion in Unlook communicates state without creating anxiety: nothing bounces, nothing flashes, and every movement has one authority and one curve.
Rest — ambient.breathe
Your system asks for reduced motion, so the laboratory is honouring it: every state is shown still, exactly as the product would.
08 · Usage
How the mark keeps its dignity
✓The mark on a quiet surface, with room around it
✓State shown by silhouette — flattened, elongated, outline
✓The 16 px mark as one solid path, no gradient
✕Recoloured — the Bead is never filled with brass
✕A perfect circle — the silhouette is the identity
✕Boxed — the Bead never sits inside a visible frame
09 · From desktop to here
The same system, at page scale
This website runs on the product's own tokens: the same three scales, the same two typefaces, the same silhouettes, the same durations and curves — extended with a larger editorial type ramp, and nothing else. What you have been reading is the brand, practising what it preaches.