UX and interface design studio

Complicated things,
made legible.

UX and interface design first: flows, screens and the system behind them. Then the work that surrounds a product: user guides, dashboards, 3D art, photography and audio-reactive visuals. One discipline wearing several coats, taking something dense and making it usable.

Start a conversation See the work

91%less text in the SP-1 guide, with nothing lost
4.5:1minimum contrast, both themes, every pair
7 kBcompressed weight of the heaviest page
0accessibility issues at last build

What we make

Seven things, one discipline.

Seven disciplines, one method: understand it, cut it, group it by intent, then draw it.

UX and interface design

UX design · user research · interaction design · UI design · design systems · prototyping · usability

Flows mapped, screens drawn, then written down as tokens, components and rules, so the twentieth screen still looks like the product.

The SP-1 interface →

User guides people finish

Technical documentation · information architecture · instructional design

Dense reference turned into something readable. Grouped by what you are trying to do, not by how the product is built.

SP-1 Tape Looper guide →

Dashboards that answer a question

Data visualisation · analytics dashboards · information design · reporting

One screen, one decision. Charts chosen for the question being asked, with the numbers that matter readable at a glance.

Audio-reactive visuals

Real-time graphics · WebGL · generative art · music visualisation · live visuals · motion graphics

Geometry driven by sound: stem separation, spectral analysis and a phase-locked beat grid, for installations, live shows and release artwork.

The visual gallery →

3D art and photography

3D art · rendering · art direction · photography · product imagery

Stills and sequences, shot or rendered, made to sit inside a product rather than beside it.

Design systems

Design tokens · component libraries · accessibility · WCAG contrast · documentation

One palette, one type scale, contrast measured against WCAG, generated from what ships rather than from a slide.

The NSKU design system →

Technical SEO and performance

Technical SEO · structured data · Core Web Vitals · semantic HTML · WCAG accessibility

Crawlable markup, schema.org, honest metadata, compressed payloads and contrast that passes. Measured, not asserted.

How a guide gets made

Six steps, in this order.

The same process runs a dashboard. Understand it, cut it, group it by intent, draw the parts that have structure, then let it answer questions.

  1. Read all of itEvery page of the source, not a summary. You cannot cut what you have not understood.
  2. Cut hardMost documentation is padding. The SP-1 guide went from 14,788 words to 1,364 and says more.
  3. Group by intentPeople arrive with a task. Sections match the task, not the feature list.
  4. Draw the dataAnything with structure gets drawn. A button combination becomes a score you read at a glance.
  5. Make it answer backFilters that match how you think: pick the buttons in your hand, see only what they do.
  6. Prove itContrast, landmarks and labels checked on every build. Payload measured, not guessed.

Selected work

All of it is live on this site.

No case studies. Open them.