All work · Case

KPT-UGMA · UNIT 02 – a free groovebox that brings traffic to the shop

An 8-track instrument in the browser for Keep It Underground: the whole beat lives in the link, every beat has a name that comes from its pattern, and sharing is built in so every shared beat leads back to the instrument and the shop.

keepitunderground.com2026-10-20

Open the product ↗

StatusLive

Period2026-10

StackWeb Audio · AudioWorklet · Vanilla JS · Next.js 16 · PWA · GA4

Design systemOpen the interactive system

What this work shows a buyer
Type of evidence	Studio's own product. A product for the studio's own brand: idea, sound, design, development, measurement and QA.
Whose problem it illustrates	A small brand whose audience ignores ads and that needs something people use themselves and pass on.
What it does not prove	The instrument is live and measured, but the first seeding round has no numbers yet. It does not yet prove a share rate or sales.
What you can order from this	Product build · from 12,000 €

unit-02 · evidence

4 claims · 3 with a public source, 1 with a private source (shown on request)

8 × 32 tracks × steps, 8 patterns per track, 36 synthesised sounds → source: keepitunderground.com/unit

16 genre presets, each with a name that comes from its pattern → source: keepitunderground.com/unit

5 ways to share: link, text, embed, 9:16 video, WAV → source: keepitunderground.com/unit

55 automated checks in real Chrome before and after every release → source: tests/e2e/unit-qa.mjs · private, shown on request

3/4 publicly sourced

Why an instrument, not an ad?

Keep It Underground makes clothes for people who build and run sound systems. That audience ignores banners and responds to something it can use itself and send to a friend. So UNIT 02 is a free, real instrument, not a demo: open the link, press Play and make your own beat in a minute.

What did we build?

A groovebox in the browser: 8 tracks, 32 steps, 8 patterns per track, 36 sounds synthesised in the browser and 16 genre presets.
The whole beat is packed into the URL (JSON → deflate-raw → base64url) – no account or database is needed.
Every beat has a name computed from its pattern (FNV-1a hash → two words and a number), for example "EAST SYSTEM 53". The same pattern always gives the same name.
Keys, live recording, Web MIDI, WAV export, PWA install and offline use.
The first screen on a phone is the instrument: Play, the name and a thumb-sized focus track.

The first Play sends the measured event unit_play.
Sharing comes in five forms: link, text as an emoji grid, embed player, 9:16 video with sound and a QR code, and WAV.
A shared link opens the beat in the same instrument (/unit/b/<code>) and the unit_remix_open event shows the loop closed.
A changed pattern gets a new name and a new link – every sharer is a new start.
"Wear the sound" leads, measured, to the shop and from there to Fourthwall checkout.

How was quality kept?

Gate	What it checks
Unit tests	the share code gives the same result in the browser and on the server; the measurement bridge lets through only allowed events
QA script in real Chrome	page, instrument, sharing, name, video, WAV, embed, PWA, the phone's first screen and the header layout
Recording lock	video export freezes the name, genre and tempo at the start
Privacy	a user's name makes a beat but never enters the link, storage or an event

What is not proven yet?

Going viral is an outcome, not a plan. The first seeding round of three clips is ready; there are no numbers yet. The stop rule was written before the results: if fewer than 5 % share at ≥ 200 plays, no new sharing features are added – the first minute is fixed instead (source: KPT seeding plan, 18 October 2026).

Where is the whole design system?

The interactive system page shows the tokens, type, components, motion, the naming engine and the share loop, and includes a small playable UNIT: open the system page.