Designing data interfaces

As the data behind a website grows more complex, the tools for managing it have to keep up. These are live, interactive examples — not screenshots — of admin built to stay accurate and quick to work in.

New stock item
Draft
0 / 20

Catch mistakes as they happen

Data entry shouldn’t just work well, it should feel satisfying. The format is masked as you type and the counter tracks length, so the field guides you instead of correcting you. Anything still off the mark is caught before you submit, not bounced back afterwards, so less comes back for a redo.

In a small but widely-cited 2009 test, validating inline rather than after you submit cut errors 22% and completion time 42%.

Product record
PMP-2024-0153
Name
Hydraulic pump
Code
PMP-2024-0153
Category
Pumps & actuators

Edit deep relationships, without losing your place

Real records are tangled: a product links to a supplier, the supplier to its terms. Drill straight down the relationship and change a value three levels deep, with a breadcrumb keeping you oriented the whole way.

A breadcrumb lets you recognise where you are instead of having to hold it in memory.

Injecting deep relationships into content

Write naturally, drop in a field or a product image, and pick how it’s laid out. Everything binds to the live record by path and renders into the designed output. Switch the record and every bound value updates at once.

Change the record and every bound field updates at once, so you always see the current state, never a stale copy.

Let's talk.

I help content-rich organisations understand their data and fix broken admin. Tell me what specific problems you're having and I'll be happy to talk solutions with you.