◐ Theme
Strata · Design Language● v1.0 — Locked

The design language of Subsurface Data Workbench

The single source of truth for the Discovery workspace. Information architecture, interaction model, tokens and components are frozen at v1.0. Every subsequent screen inherits this system unchanged.

Accent
Indigo · #635BFF
Surfaces
6 levels · S0–S4
Type
Newsreader · Inter · Plex Mono
Themes
Light · Dark (first-class)
00

Status & governance

What “locked” means and how the system may change.
Locked at v1.0 — do not change without a version bump
  • Information architecture is frozen. The Context → Spatial context → Decision workflow, the object model, and the intent-driven adaptive hierarchy do not change.
  • Tokens are frozen. Surfaces, ink, lines, the indigo accent and the four semantic colours are fixed for both themes.
  • Two rules are inviolable: indigo belongs to selection / intelligence / interaction only; and completeness vs. quality never share a visual language.
  • Component naming: classes must be unique and namespaced to their context (e.g. a header count is .colhead .meta with an explicit display) — never reuse a generic class like .meta across unrelated components. Collisions silently break layout.
  • Changes require a new version (v1.1+) and an entry in the changelog; screens then opt in.
01

Design principles

Seven rules that hold the system together.
P1

Calm carries complexity

The data is dense; the interface is not. Whitespace is the primary structural tool.

P2

Colour explains, never decorates

One accent (indigo) for selection, intelligence and interaction. Semantic colour for data state only.

P3

Two languages, never blended

Completeness (structure / process) and quality (trust) use deliberately different visual systems.

P4

Typography is the hierarchy

Meaning from type, weight, contrast and spacing — not boxes, slogans or colour.

P5

Honesty over reassurance

Render the unknown, name the denominator, show evidence rather than assert conclusions.

P6

Status is never colour alone

Colour + shape + label, legible in greyscale. Accessibility is a property of the language.

P7

Built for experts

Monospaced data, real CRS & units, precise alignment. Density without noise.

02

Information architecture · locked

One workflow. Surfaces narrate the flow; the object model never changes.
Intent

I need…

Concept + place + decision intent compose one question.

Intent bar · S1
01

Context

The project hierarchy — decision objects, not folders. Primary navigator.

Hierarchy · S0
02

Spatial context

The map — why data is relevant; completeness on the ground.

Map · S1 (hero)
03

Decision

Datasets ranked by fitness; the adaptive summary card.

Datasets · S2
04

Action

Evaluate · open · add to model · open audit log.

Primary action

Object model

LevelExampleNotes
BasinTaranaki BasinTop container (hub).
Field (development)Maui Field · Pohokura FieldDrives the map.
GroupsWells · Seismic surveys · Interpretations · Earth models · Pressure & production · DocumentsEach carries completeness roll-ups and status.
WellboreMaui-A1Selecting it generates candidate datasets; expands into its datasets.
DatasetTriple combo · Sonic log · Checkshot · Image logThe unit of decision; selecting one highlights its card.

Navigation & layout rules

• The hierarchy is the primary navigator; selection drives the map and the dataset set as one synchronized state.
Page title (“Discovery”) sits above the breadcrumb; the product name is the kicker; there is no partition/scope control in the header.
• Panels are resizable via splitters and the side panels collapse to a labelled rail. The map flexes between them.
• Surfaces narrate the flow: Context = S0 canvas · Spatial context = S1 white (hero) · Decision = S2 lavender.

03

Adaptive Decision Intent · locked

One control reorders the summary card. The object model and workflow never change — only the information hierarchy.

Decision intent is grouped (Analyse & decide · Discover · Govern). Selecting an intent re-prioritises the same summary-card component: the apex value, the primary blocks, and the primary action all change; secondary detail moves into progressive disclosure. No persona tabs, no role switch, no lens.

IntentApex showsPrimary blocksPrimary action
InterpretationFit for purpose + confidenceRecommendationEvaluate evidence
Formation evaluationLog availability (curve coverage %)Curve coverage · intervalOpen log viewer
Reservoir modellingModelling readiness (model fit %)Spatial coverage · modelling readinessAdd to model
ScreeningFit + confidence (balanced)Recommendation · qualityEvaluate evidence
Data curationReadiness + metadata completeness %Quality · readinessOpen in curation
Governance reviewGovernance status (Certified)Governance status · complianceOpen audit log

Analytical views

The View control re-presents the same datasets for a different analytical task — it does not navigate to another page. Switching animates and preserves context.

ViewOptimised for
Decision cards (default)Full evidence for the lead option.
Compact tableScanning all options at a glance.
CompareTop options side by side.
Evidence matrixCoverage across evidence types.
TimelineDatasets by date.
04

Colour

Cool neutrals, deep-navy ink, indigo accent. Semantics for meaning only.

Ink

Ink#0B0F19
Ink-2#39414F
Ink-3#8B94A2
Ink-4#AFB6C2

Accent · indigo

Accent#635BFF
Accent-2#8B85FF
Soft / line.08 / .22

Semantic (light)

Trusted#1A8F5C
Processing#B45309
Risk#DF1B41
Info#0073E6

Semantic (dark)

Trusted#3FBF84
Processing#E0922E
Risk#FF6B81
Info#5AA0F2

The one rule. Indigo = selection · intelligence · interaction. Semantic colour = data state. They never trade roles; chrome and navigation stay neutral.

05

Surface system

Six levels build depth without heavy shadow. Lavender tints derive from the accent.
S0
Canvas / context
#EEF1F6
S1
Cards / map
#FFFFFF
S2
Decision panel
#FAF7FF
S4
AI / intelligence
#F6F1FF
S3
Selected
#F0E9FF
S·sunk
Recessed
#E9EDF3
06

Typography

Newsreader for restrained editorial moments, Inter for UI, Plex Mono for data. Sentence case throughout.
H1 / DisplayNewsreader 34 / 500 · rare
Maui Field
H2 / Verdict & numberNewsreader 20–33 / 500 · card apex only
Formation evaluation · 87%
H3 / Card & column titleInter 15 / 600
Triple combo — main pass
BodyInter 13 / 400 · #39414F
Quality-checked, environmentally corrected and depth-aligned to the field reference.
Caption / labelInter 10–11 / 600 · #8B94A2
Evaluating for interpretation
DataIBM Plex Mono 11–12 · tabular
NZGD2000 / NZTM · 2,540–3,160 m · 2026-04-18

Rule: the serif is reserved for the card verdict, the confidence number, section/panel titles and the map title. It is never used in the navigation tree or data rows. Separators between inline items use a larger middot ·.

07

Spacing · radius · elevation

A 4 / 8 rhythm, soft corners, restrained depth.
SpacingRadiusElevation
base 4 · 8 · 12 · 16 · 24 · 40control 9 · chip 8 · card 14 · panel 160 flat · 1 raised (xs) · 2 lifted · 3 overlay
Whitespace is structural; group with space, separate with hairlines.Soft, not rounded — consistent across controls.Depth from hairlines first, shadow second.
08

Components

The locked building blocks, live in the current theme.

Adaptive summary card

Triple combo — main passLAS 3.0
Well log · Gamma ray · Resistivity · Density · Neutron
Fit for
Formation evaluation
TrustedRecommended
87%
High confidence
Recommendation
Quality-checked, environmentally corrected and depth-aligned to the field reference. Used in 8 comparable reservoir studies.

Hierarchy (tree)

Maui-A1
Wells
Interpretations

Single typeface (Inter); developments are heavier weight, not serif. Wells carry a completeness roll-up bar; wellbores carry a six-dot log-suite indicator and expand into their datasets. Collapse chevron is a borderless icon.

Buttons & chips

Well logs ×Reservoir quality ×LAS 3.0ZGYDLIS
09

Status indicators

The core of the identity — two systems that must never look alike.

A · Completeness — structure / process

Rounded / hollow geometry · hierarchy & map
Presentfilled · green
Processingdashed · amber
Expected / pendingdotted · neutral
Unresolvedslashed · neutral
Extent unknowndash · faint

B · Quality / readiness — trust

Square / diamond pills · cards & rows
Trustedsquare · green
Recommendeddiamond · indigo (intelligence)
Incompletecircle · amber
Unexaminedhollow · neutral
Confidence 5-tick + word
10

Spatial intelligence

The map is how the product thinks about space, not a basemap.
S1

Spatial context is evidence

The map explains why data is relevant; coverage and uncertainty are drawn on the ground.

S2

Selection propagates

Selecting an object updates hierarchy, datasets, confidence — at once.

S3

Completeness rings

Each well shows how much of its log suite is loaded; hover reveals the six-log breakdown.

S4

Annotation hierarchy

Selected › expected/processing › formation (sans, not italic) › grid/CRS. AOI uses the indigo accent. GIS tools (zoom, layers, measure, draw).

11

Motion & microcopy

Motion reinforces relationships; copy speaks like a quiet domain expert.
MotionMicrocopy
Purpose only — selection sync, panel reveal, hover lift, loading → loaded, view fade. Timing micro 120ms · standard 180ms · overlay 240ms. No spinners except button loading. Honours prefers-reduced-motion. Editorial, precise, sentence case. The system explains and recommends — never commands or hypes. Name the denominator. Say what’s unknown. Term: Data manager (not “steward”). ✅ “Fit for interpretation — quality certified, used in 8 studies.” 🚫 “Great dataset! ✨”.
Case rule. Descriptions, helper text and card body copy are sentence case. Title Case is reserved for screen names and proper nouns (Discovery, Maui Field). ALL CAPS only for micro-labels (≤2 words: CRITICAL, UX REVIEW). ✅ “Compare viable datasets and the risk you inherit.” 🚫 “Compare Viable Datasets And The Risk You Inherit.”