Skip to content
TurnTwo

Workshop Editorial

The Workshop Editorial visual system — cream, petrol navy, and amber, anchored to Jay's dive computer.

TurnTwo's visual system, "Workshop Editorial." Warm cream backgrounds, petrol navy as the instrument and ink color, amber as the fill and stamp accent, Fraunces serif for editorial display, Geist sans for body. The palette is anchored to Jay's Shearwater Teric dive computer — see Jay Pedersen.

Working rules

Cream only reads well when petrol navy and amber are present in the same view; cream alone goes flat. Pages should be vivid, not wall-to-wall cream. The editorial palette is universal across surfaces; the editorial serif belongs on editorial surfaces only, while dashboards stay on sans.

Applies across TurnTwo and its sub-products Lens and Workbench, each with its own accent variations.

Frontend principles & audit (cross-project, evidence-based)

Workshop Editorial is the house look. Underneath it sits a separate, project-neutral layer of frontend best practice that applies to every project (TurnTwo, Setwhen, TrustFirst, and anything built next), not just the TurnTwo aesthetic. It's a reusable skill of roughly 210 concrete do's and don'ts across 14 areas — usability, visual hierarchy, typography, color and contrast, navigation, forms, interaction and state, motion, performance (Core Web Vitals), accessibility, responsive/mobile, content, trust, and the cognitive-load laws. Every rule is backed by a reputable source (Nielsen Norman Group, Baymard, the WCAG 2.2 accessibility standard, Google's web.dev, Material/Apple/GOV.UK design systems) rather than opinion.

It is dual-purpose: the same rules are used to design new pages and to audit existing ones — each rule carries a way to detect it on a live site and a severity (blocker / major / minor), so a review produces a prioritized fix list, not vibes. The house-style rules above layer on top; where they differ on a TurnTwo surface, house style wins and the difference is noted.