Workflow-grounded · v1

Forty-two people who already use the engine.

Not a market-research deck. A library of 28 workflow personas and 14 strategic typologies written against the engine's real surface area — named routes, named presets, named transitions, named limits — set against the live product at the domain. For a project planner, it is a constraint map disguised as a cast list.

ENGINE · 6 LAYERS · 5 BANDS
RE-MAP → ● REC

Resolved · 2026-10-07
One canonical marketed count: 23 engine personas. The 28 workflow personas and 14 strategic typologies are internal research and are not numbered in marketing copy. Styles split Looks vs Surfaces — the shipped count is 22 visual styles; the AR loop, Photo Studio, Dashboard, ECHO and Hologram are surfaces, not styles. The analysis below predates this resolution.

28
workflow personas
14
strategic typologies
11
named surfaces
40+
live routes
11
decisions pending

01 — Orientation

Three libraries live in one directory. Only two ship.

Before you plan against this, know which layer you are reading. They are built with different intents, and conflating them is the fastest way to misuse the set.

SHIPS 28

Workflow-grounded personas

Real workflows against real surfaces. Each names the routes, presets, transitions and capabilities they actually touch — /engine, /versions/film.html, kraft, whip-blur, BPM detection, the 12-bin chromagram, MediaRecorder WebM export, magic-link login.

10 per-surface · 5 cross-cutting · 13 domain

SHIPS 14

Strategic typologies

Roles the engine's creator thinks with, not users to market to. Every section is reframed around how the typology would push his own work forward. No "what they would click."

Four modes: Auditor · Practitioner · Broker · Cross

CANCELLED 8

Abandoned consumer personas

A granular end-user library (buskers, beatmakers, real-estate agents, AR business-card designers) started and cancelled at the creator's request. Kept on disk under marketing/personas/abandoned/ as a record — explicitly not part of the deliverable.

Do not plan against this layer.

02 — The surface area

Eleven surfaces. Every persona is a path through them.

This is the spine of the library. A planner should read the surface, not the persona, first — the surface tells you what breaks and who notices. Click any card to filter the persona index.

● Storyboard engine (SB) is planned — seven personas design against it anyway, a signal worth carrying into planning.

03 — Anatomy

Eight sections, one argument.

Every workflow persona uses the same template. Learn it once and you can scan all 28 in minutes — the useful fields are "a typical session" and "what would make them leave."

slug + surfacesThe route key and which of the 11 surfaces the persona genuinely touches. A 3+ minimum, enforced by the coverage matrix.
who they areSecond person, with a toolbelt — the software they already pay for and the habit that predates the engine.
what they wantThe job to be done, stated as a workflow with an obvious end — a client approval, a lecture, an archive drop.
why each surfaceA numbered list of surfaces with the reason attached. This is where route names, presets and transitions appear.
typical session90–180 minutes, step by step, always ending in an "almost quit at step N" moment. That near-abandonment is the most valuable line in the file.
pay forScope and pricing shape, plus the thing they explicitly refuse to pay for. One-time purchase vs. subscription is a real signal.
leaveThe single most actionable field. A refusal, and the concession they will tolerate forever.
quoteOne sentence in their voice that names the surfaces they trust. Read all 28 quotes in a row and you get the product thesis.

04 — Coverage

Which surfaces carry the most weight.

Count of the 28 workflow personas touching each surface. For a planner this is a blast-radius map: change the top two and you have changed the library.

The two poles

Presets (22) and the recorder (20) are the most-touched surfaces — and the two with the cleanest mental models (an anchor map, a WebM file). The engine core sits just behind at 20: connective tissue almost every workflow passes through, rarely anyone's primary surface.

The thin edge

Projects/auth is touched by only 6 personas — the smallest set, with the strongest signal: every one of them trusts the magic-link login specifically, and none would accept OAuth as a substitute.

The quiet signal

The 14-FX pipeline is touched by 10 personas — and in 7 of those, chroma is the exact uniform they push. It is the single most-named specific feature in the whole library.

05 — Index

Find the person who will file the bug.

Filter by surface or search by name and one-line. Start from the surface you are about to change.

06 — Signals

What the library noticed about itself.

Both READMEs close with a "what we noticed" pass. These are the findings a planner should treat as constraints.

07 — Playbook

How to actually use this in a project.

STEP 01

Name the surface before the feature

Write the spec against ENG, VER, FX, TX, AR, SB, REC, PST, AAP, LIB or AUD. If a feature does not land on a surface, no persona in this library can validate it.

STEP 02

Pull everyone who touches it

Use the coverage matrix as the invite list. Changing presets means 22 stakeholders. Changing auth means 6 — but all six are immovable on the mechanism.

STEP 03

Read the session, not the bio

"A typical session" tells you where the workflow breaks today — usually the almost quit line. That is your real acceptance test, and it is usually not a crash.

STEP 04

Treat "leave" as a hard requirement

These are non-negotiables, not preferences. Write them as regression tests.

The guardrails

Each line is a documented abandonment condition from the files.

Open question the directory raises

"What is the engine refusing to do, and is the refusal deliberate?"

The strategic README flags this as the most actionable item in the set: the typologies converge on it, and no public answer exists. For a planner, it is the question that determines whether the next release is a design decision or a surrender.

Partial answer found in section 11. The live product does document deliberate refusals — zero backend, no install, no render farm, no ffmpeg.wasm. But the same pages add new refusals the persona library never saw, and at least one contradicts a documented persona tolerance.

Resolved as D11 in the memo ↓

08 — The live product

What is actually running at the domain.

Everything below is from the deployed site at sainted-word-records.vercel.app — landing, campaign, profit-plan, market-study, portfolio, marketplace and the versions/status page. Author on all pages: Kai Djuric.

15.6k
ENGINE HTML (GZ)

The whole engine, one HTML file. No node_modules for the user.

5
FFT BANDS

Bass, mid, treble, air, sub — plus rms, centroid, beat, onset, bpm.

6
LAYERS

Each with its own blend mode and a stack of reactors. Bindings, not keyframes.

27
LIBRARY ITEMS

Demo assets, auto-classified by motion, luma and mean hue, then routed to a role.

0
BACKEND

No API keys, no external services, no server render. MIT on the source.

What the engine does

Most visualizers just react to the spectrum. This one classifies every asset — motion, brightness, hue — and routes each one to the band of the song that suits it. The composition is algorithmic; the score is the audio.

beat detectBass-energy tracker with an adaptive threshold. Locks BPM, fires an envelope every kick, decays gracefully — techno, jazz, and an ill-advised spoken-word record.
RE-MAPAuto-mapper picks from top candidates weighted by score and shuffles blend order. Every click yields a new composition.
exportCanvas captured via MediaRecorder at 30 fps, H.264 + AAC, 8 Mbps. No ffmpeg.wasm, no server, no transcode.
library dropDrop any number of PNG/JPEG/MP4/MP3/WAV. Images pass through an asset curator — chroma-key on a uniform background, then a local tag heuristic. A live chip per file shows the verdict.

The 5 named versions

Single-file variants of the same engine. Same controls, same library, same MP4 export.

The funnel as published

FREE

Test in browser · limited demo library · 10-second watermarked clip · 1–2 styles · self-serve, no support.

SERVICE

No watermark · 10/15/30/60s or full song · all 5 styles · custom artwork · higher-quality exports · commercial rights · 9:16 + 1:1 + 16:9.

LICENCE

Pay once, no subscription · render credits that never expire · watermark removed · persistent IndexedDB library · 1–2 years of updates by tier.

Stated rationale for credits over subscription: indie musicians ship irregularly — four singles, then six months of nothing. A subscription punishes them for not shipping.

The engine's own controls, transcribed

The live engine panel exposes five global sliders and twelve FX sliders. This is the real control surface behind every persona that talks about pushing a uniform — and the reason chroma being the most-named feature in the persona library is not a coincidence.

Global sliders
sensitivity1.00
beat gate1.40
decay0.88
temp0.00 — the uniform the AR poster maker cools
mutations0.30
Quick start, as printed in the app
1Drop a song file anywhere — the audio becomes the score.
2Drop a library of clips / GIFs / images — the visualizer reads them.
3Hit Play — bass, mids, treble, beats drive the composition.
4Hit Export — the whole song renders to a video file.
The 12 FX sliders — defaults all at zero
posterize vignette chroma grain sepia glow gray blur liquid pearl glitch temp*

*temp appears both as a global slider and in the FX set, depending on the surface. The v0.5 release notes list 14 uniforms including mut and mutAlgo, which the live panel does not expose; the licence page advertises "20 CSS filters." Three counts for one control set — resolved as D2.

The asset curator, per the landing page

Drop any number of PNG, JPEG, MP4, MP3 or WAV files. Images go through the asset curator — chroma-key on a uniform background, then a local tag heuristic. Audio and video pass through untouched. Folder drops are flattened recursively, and a live chip per file shows the verdict. Listens for swr:drop on document.

~/sainted-word-records — zsh
$ git clone git@github.com:kai-djuric/sainted-word-records.git $ cd sainted-word-records && npm install $ npm run dev # dev server, port 5174 $ npm run build # → dist/

Five curated media sets — the actual sellable graphics

The site's only visual product is a set: a hand-picked bundle of clips and stills tuned to one mood. A track is routed through the engine and rendered as a 30-second MP4. The swatches below are CSS renderings of each set's described palette — the underlying clips are licensed stock and are not redistributable, which is D3.

Custom Source

Your own footage + photos, blended with one SWR set. Same 48h turnaround, €55.

.swr-set template

Marketplace bundles: audio, FX chain and library pre-loaded. Install one and it opens in the engine in one click.

Yugo-nostalgia pack

6 visual styles, WAV/MP3 reactive, 9:16 + 1:1 exports. Launch €12, €19 after — first 50 buyers.

Press kit

The site publishes logos, screenshots, hero images and a one-line bio — the assets a planner would reuse.

landing.html

The engine is the product

Three creator paths (musician / designer / mixed-media). Self-serve, open source, MIT, "drop a song, hit REC." 8 named user profiles, each pointed at one of the 5 versions.

campaign.html

The finished MP4 is the product

"Sell promotion-ready videos, not an audio-reactive visual engine. The engine is your competitive advantage — it is not the thing they buy." Five curated sets, €25–€75 service tiers, €120–€600 licence tiers.

profit-plan.html

Five vectors, ranked by speed

Market-study paywall first (page already exists), then per-video service, library presets, visual commissions, and a hosted $8/mo tier as the Q1 groundwork.

The house style, and the one graphic that ignores it

The site is a warm editorial system — Fraunces for display, Geist for body, Geist Mono for machine facts, a pink accent on a cream ground, with a dark theme that swaps the accent to a hotter magenta. Everything is set in it except one thing: the hand-drawn mascot.

Tokens the site publishes
displayFraunces — the warm, wonky old-style serif
bodyGeist — Swiss-geometric, 16px / 1.7
monoGeist Mono — every rate, build hash and route
accent#e6306b light / #ff2d8a dark
secondary#ff8a3a warm · #1c8c64 green
separatorthe middot · — the brand's connective punctuation

This explainer runs entirely on those tokens — same fonts, same accent, same middot grammar — expressed on the site's own dark values. Flip to the light set by swapping :root for the light values in the stylesheet.

The outlier

A hand-drawn mascot that watches your camera

Click it and it requests your camera, samples frames at 8 fps and reacts in real time. A hand-wave makes it wave back. A face held high makes it look up. Sustained motion makes it lean in. Long quiet after activity makes it ease back. Head tilts toward your face.

8 fps samplingno modelno CDNswr-mascot-camera.client.js

It is the only asset on the domain that is neither generated nor licensed, and the only one that asks for a permission. It is also the only graphic a competitor could not copy by reading the source — the campaign's Belgrade argument, applied to a mascot.

Tension with the persona library: five strategic typologies have a documented tolerance of zero for nudge-style interaction. A camera-reactive mascot is charming as a hero graphic and is exactly the mechanism those five refuse — resolved as D6.

09 — Release history

Six releases in eighteen days, then a self-evolving engine.

The published status page is the source of truth for what is live, deprecated and next. It also documents a late change that no persona in the library was written against.

v1.0 · self-evolving 2026-08-17 · build a3f2 LATEST

The engine creates new audio-reactive personalities on its own. A daily cloud pipeline ships 2 fresh presets every morning (10 shaders × 8 palettes × 7 motions), the engine ingests them on load, and after 3 uses of a single persona it mutates a personalised variant tuned to your song's BPM and key.

cron 0 9 * * */presets/manifest.jsonon-device mutation★ personal badgecron auto-deploy
v0.9 · engine upgrade option2026-08-14 · build fec5c2

The engine stops being a static visualizer. Manifest endpoint, a presets.client.js ingest layer (load / diff / markSeen / apply), a "N new personalit*" pill in the footer, macOS crontab, and automated Vite deploy.

v0.7 · URL restructure2026-08-14 · build e71200

Splash at /, app at /engine/, no index.html at root. PWA launches straight into the app. Service worker bumped to swr-v2 to invalidate the old cache.

v0.6 · 12 visual styles2026-08-12 · build 7617b1c

Each style is a self-contained engine variant at /versions/*.html with its own GLSL post-process pass. Same WebGL pipeline, different uniforms plus a page-specific effect function. One GLSL with a switch on u_page (0..5).

v0.5 · first play2026-08-07 · build 8592b42

The engine works. Drop a song, drop a library, get a music video. WebGL post-process with 14 FX uniforms (temp, mut, chroma, vignette, grain, sepia, glow, blur, grayscale, posterize…), audio features (bass / mid / treble / air / sub / rms / centroid / beat / onset / bpm), MediaRecorder MP4 export, and project save/load.

v0.1 · initial commit2026-07-31

First commit. Single HTML file, two layers, one shader pass. "The idea is simple: a music video shouldn't require an editor, a renderer, or a render farm."

"We ship new personalities every morning."

This is the single largest addition the persona library never saw. It replaces the fixed preset set the personas were written against with a container that ingests fresh presets daily and mutates a personal variant after three uses.

Read against the strategic set, it is a direct hit on the largest documented anti-signal: five typologies have zero tolerance for popups, notifications or nudges. A daily-arriving gold pill is exactly that mechanism. And read against the live VJ, whose anchor map is a hand-authored set list, a pipeline that ships presets overnight means the map is a moving target.

Resolved as D6 (discovery) and D9 (freeze the pipeline).

The preset is a container

Schema swr-preset/v1 — 12 required fields, 3 optional. Validated by preset-pipeline/verify.mjs (20/20 checks).

REQUIRED
id · schema · name · family · shader · palette · motion · fx · reactivity · tags · created · seed
OPTIONAL
_meta (basePersona / usageCount / bpmAvg / key) · color · parent

A preset is a complete FX state + a palette + an audio-reactive mapping. swr-preset/v1.5 is drafted for Q3 2026: an LLM-curated novelty pass plus a cross-engine compatibility field.

The visual languages, rendered as swatches

Each version is a self-contained engine variant with its own GLSL post-process pass and its own palette. These swatches are CSS renderings of each look's described treatment — real output requires the engine.

One engine, four different counts

Four places on the site count the visual styles differently. For a planner this is the cheapest concrete inconsistency to fix, and worth fixing before anything is marketed by count — see D2.

5

Named, described, with a dedicated directory page: Neon, Film, Grid, Smoke, Hallucination.

landing · campaign · "5 visual languages"

12

The v0.6 release entry: neon, film, grid, smoke, hallucination, glitch, aurora, pulse, void, chrome, watercolor, fractal (+ eclipse legacy).

versions · "12 visual styles"

22

The live-state probing value on the status page: "22 per-page GLSL".

versions · live state panel

25

Every named style in the Visual styles list — including whole surfaces that are not styles at all.

versions · "25 engine variants"

The list mixes two categories

A preset is a look. A page is a tool. They are listed in the same breath.

Looks — sensible to count as styles
Surfaces — not styles at all

Read against the persona library, that count is not cosmetic: "the variants stay peers" is a documented abandonment condition for several personas. A planner cannot scope "keep the variants" until the set has one definition.

10 — Route map

The site has its own route structure, and it does not match the 11 surfaces.

The persona library works in abstract surface codes (ENG, PST, REC…). The shipped site uses real paths. Below is the real map, grouped by function, followed by the specific places where the two disagree.

Route-level conflicts, worth resolving before the next release

11 — Revenue, market & risk

How this is meant to make money, and where the personas push back.

The site publishes a service offer, a licence offer, a five-vector plan, a market study with its own sizing, and a ranked risk list. A planner needs all of it in one place, plus the one thing none of those pages say out loud.

The service tiers

Curated media sets rather than uploaded assets: pick a mood, send your song, get a finished MP4. Five sets are named — Neon Church, Morning Haunt, Brutalist Grid, Dream Sequence, System Error.

add-ons+€10 for 60-second length · +€25 full-song render · +€5 Spotify Canvas crop · +€15 24-hour rush. Bundle: 3+ songs = 15% off any tier. Founding customers (first 5 orders) get 30% off in exchange for portfolio display rights — after that, listed prices apply.

The self-serve licence tiers

Pay once, no subscription. Credit-bank rather than seat-based, justified by irregular release rhythm. Keys arrive by email as swr-{tier}-{code} and are activated via the PT chip in the engine header. Note the fine print — WebM today, MP4 at v1.1. That is D5.

Five monetization vectors, ranked by speed to first dollar

From the 90-day plan. Each stands alone — none requires the others to be live.

The 90-day model

Organic-only, one channel at a time, no paid acquisition. Headline range: $3,200–$7,400 total revenue across the first 90 days.

VectorWk 1–2Wk 3–6Wk 7–10Wk 11–13
Market study paywall$80$300$400$300
Per-video service$0$250$500$500
Library presets$0$120$300$400
Visual commissions$0$0$400$600
Hosted tier (Q1)$0$0$0$150
Total$80$670$1,600$1,950

The $1k-per-week milestone hits at week 6 if two vectors are live by then (paywall + one of per-video or presets). The single metric it optimises for: $1,000 of revenue per week, sustainable for four weeks in a row.

The market, as the site sizes it

$48M
2025 — PROJECTING TO
$124M
2028 · CAGR 37%

Fragmented, no clear leader — top five tools hold ~38% share. Built from 47 interviews across March–July 2026, telemetry from 6 tools (~340k monthly active creators), 18 months of search and social signals.

Share of paying users (2025)

Bedroom producers are the volume segment at the lowest ARPU (median $48/yr). Labels are the inverse: 17% of paying users, 38% of revenue, median $340/yr. n = 12,400 paying users.

The published willingness-to-pay finding

Van Westendorp PSM across 312 indie creators, May 2026. Indie sweet spot: $8–12/month for unlimited exports, or $0.50–$1.00 per single export pay-as-you-go.

A $5 "remove the watermark" one-time purchase "lands inside the lower edge of the WTP range and tests well." Note this is the finding that makes the hosted tier legible, and the persona refusals that make it dangerous — D8.

Risks the site ranks itself

The thing none of these pages say out loud

Two pages promise "MP4, native, no server" as the core advantage. A third warns that your MIT licence does not cover the bundled media.

The landing page and the campaign page both sell native H.264 + AAC export as the thing that removes ffmpeg, a server and a transcode step. The campaign page's own "read this before you sell" section states that while the source is MIT-licensed, the bundled visual library is not — stock footage, images and clips are not covered — so every asset in a rendered output must be verified for commercial use and redistribution before it is sold. It also notes customers must own or have permission for the audio they submit, and that the docs say modern Chrome or Safari with a wide window, so identical output should not be promised across browsers and devices.

For a planner, that is the top of the dependency list — it sits underneath the entire service tier, the per-video vector and the €55 custom-source tier at once. It is also exactly where the persona library's library-as-metadata finding meets reality: the personas treat the library as tags and metadata, and never once discuss rights.

Resolved as D3 — the highest-priority item in the memo ↓

The stated Belgrade advantage

Three claims the campaign makes as a wedge rather than a constraint: local pricing power (€25 reads as a marketing expense in the EU, a real purchase in Serbia, so the same job wins at roughly double the margin), an authentic Yugo-nostalgia angle (brutalist architecture, CRT scan lines, the warm/cool palette of late-Yugoslav design — "a San Francisco competitor can copy the SVG, they can't copy the intuition"), and in-person closes at KC Grad, Drugstore or Dot.

+ a €12 launch preset pack (€19 after)

12 — Reconciliation

Where the personas and the shipped site genuinely disagree.

Not conflicts to smooth over — the useful part. Each row is a decision a planner has to make, with both sides stated and a recommended resolution.

14 — Decision memo

Eleven decisions, in the order they unblock things.

Every row below is a resolution of a conflict documented above, or a documented refusal that needs to be made explicit. Each carries an owner, a trigger, the reason it matters, and the concrete act. Nothing here is a research task — all of it is waiting on a decision.

D1–D2 · unblock marketing D3–D4 · unblock revenue D5–D7 · unblock the next release D8–D11 · strategic, no deadline but no upside in waiting

If only three get done this quarter

D3 protects the revenue path legally. D4 protects it commercially. D1 makes every persona-led message falsifiable, which is the cheapest of the three and the one that gates the most copy. The rest are improvements; these three are preconditions.

15 — Sources

Where every number above came from.

Two source sets, kept separate so a planner can cite the right one. Everything is quoted, not inferred — where the sources disagree, sections 12 and 14 say so.

The persona directory

28 workflow files + README · strategic README (14 files)

gives youSurface codes, the coverage matrix, per-persona sessions, pay/leave conditions, and both READMEs' "what we noticed" passes.
authorityInternal. Written in second person with the engine's creator as the implied reader. The strategic set says it is "not derived from market research."
use forAcceptance tests, abandonment conditions, surface blast radius. Not for market sizing or pricing.

The live site

landing · campaign · profit-plan · market-study · versions · portfolio · marketplace

gives youEngine metrics, the v0.1→v1.0 timeline, the preset schema, route inventory, the five curated sets, service and licence pricing, the 90-day model, market sizing and ranked risks.
authorityAuthor Kai Djuric, MIT-licensed source. Note market-study.html is itself a demo with placeholder methodology and a wiring guide for real payments — treat its figures as illustrative.
use forWhat is actually shipped and priced, plus the self-stated risks. Verify live state on the page rather than trusting this summary.

Reading discipline

The persona directory and the commercial pages were written for different readers and at different times. Treat the directory as the specification of what users refuse, and the site as the specification of what is sold. Where they meet — sections 11, 12 and 14 — that is where this project's real planning surface is. All design tokens, fonts and palettes in this page are lifted from the live site's own stylesheet.