Ercan LabsStyle Lab
A design style catalogue: 145 styles with tokens, measurable motion signatures and 580 rendered scene screenshots.
How this was measured: Counts from kit/styles.index.json, kit/shots.manifest.json and kit/gates.sh; scenes are committed PNGs, not generated on read.
- SCHEMA
- tokens.json
- style.md
- token-block.css
- GATES
- 38 adımşema · kontrast · koyu mod
- RENDER
- headless Chrome
- 580 PNG
- OUT
- galeri
- AI brief
Problem
Client work kept collapsing into the same layout: dark hero, three cards, generous whitespace. The problem was not taste, it was that there was no vocabulary — every project started from zero and reached for the same defaults.
So the fix was not a mood board. It was a catalogue where every style has machine-readable tokens, a written signature, and evidence that it actually renders.
Constraints
- Every style must be reproducible from tokens alone, not from a screenshot someone liked.
- Uniformity must be measurable: if two styles produce the same fingerprint, the catalogue is lying.
- Screenshots are expensive; the repo holds only what is needed to prove the style exists.
Architecture decisions
Style as a schema, not a document
Each style ships style.md (why), tokens.json (machine-readable palette, type, motion) and token-block.css. The gallery is generated from the schema, so a style cannot exist only in prose.
Cost: Writing JSON for 145 styles is more work than writing 145 blog posts.
Four committed scenes per style, the rest generated
Landing, dashboard, components and dark landing are committed (580 PNGs, ~167 MB). The other 27 scenes per style are produced on demand into a gitignored cache (3.915 images), so the repo stays cloneable.
Cost: A render step before deep review; measured in the repo's own revision report.
38 gates run before commit
A shell gate checks schema validity, contrast, dark-mode parity, shot presence and duplicate fingerprints. A style that breaks the contract cannot be committed.
Cost: Commits are slower; the catalogue cannot drift silently.
Uniformity index as a number
Hero/nav fingerprints are compared across styles; the reported index dropped from 100% (all identical) to 16%. A catalogue that claims variety now has to prove it.
Cost: Extra compatibility matrix to maintain.
Proof
- Styles145 (21 families)
- Core scenes580 committed PNG
- Generated scenes3.915 in local cache
- Gate steps38
- Docs167 markdown files
Known limits
- The catalogue proves a style renders; it does not prove the style sells. No conversion data exists.
- Motion signatures are measured as parameters, not as perceived quality.
- It is an internal tool: the repository is private and no style is licensed for reuse.
What I learned
Taste becomes reusable only when it is written as numbers. A palette, a type scale and a motion curve can be reviewed, diffed and rejected; "make it feel premium" cannot.