WorkCase study
Tile
Interactive series composer: one story, many tiles, shared spine.
A self-contained tool for composing visual tile series from one spine. Published on X with a one-word root post and screen recording. Reviewed against the design system contract using Use Kit One.
Summary
Outcome · pass with notes
Tile is a considered tool. The live artifact proves a composition model: one spine, many tiles, human-language roles, zero dependencies. Published with a one-word root post and screen recording, it earned 617 views on X, the only post in 24 hours to break out of the 20 to 60 view noise floor. Remaining work: Designesy graduation, machine export, and format re-testing.
Engagement
- Root post617 views
- Try-it reply61 views
Noise floor: 20 to 60 views
The root post outperformed every other post type in the same period (quote-post, brand repost, founder narrative, text build note). The try-it reply drew 61 views and 1 like.
617 views, 3 likes · 1 reply
The only post in 24 hours to break out of the 20 to 60 view noise floor.
Inputs used
Dimension findings
Each dimension in Kit One format: observation, judgment, action.
Purpose
Observation. Tile states a single job: compose a series grid that stays related without template repetition or multi-post filler. The tool, the spine, the roles, and the export all serve that job.
Judgment. Purpose is sharp and earns the form. The tool is a composition instrument with a shared spine.
Action · Keep. Do not add template presets that dilute the spine model.
Clarity
Observation. Primary path is immediate: pick a look, pick an accent, compose tiles, download set. Human language leads (Opening, Main point, Proof, Detail, Ending) in place of role jargon.
Judgment. Primary action is discoverable. The tool does not explain itself before it works. One screen, one job.
Action · Keep the human-language labels. Do not expose grammar terminology in the public UI.
Context
Observation. Self-contained single index.html, no framework, no CDN, no backend. Deployed on GitHub Pages. Screen-records cleanly in 10 to 20 seconds. Works on desktop and mobile.
Judgment. Context fit is strong: the deployment pattern is minimal and portable. No dependency risk.
Action · Keep the zero-dependency deployment pattern. Document it as the reference for future tools.
Inclusion
Observation. Dark default with four look options (Dark, Paper, Slate, Night). Six accent options including Muted. No required audio, no required motion. Keyboard-navigable controls.
Judgment. Inclusion is structural: look options and accent variety are first-class. No dark-pattern defaults.
Action · Keep the look variety. Add a reduced-motion audit when motion is introduced.
System coherence
Observation. Visual system aligns with VAI brand: dark default, VAI yellow accent #FFC400. The Designesy colours are deliberately kept out of the VAI surface. The tool follows the same deployment pattern as Continuity.
Judgment. Coherent within the VAI surface. The Designesy graduation path is documented: Lab feel on LE-VAI, then contract, then series production for Designesy public surfaces.
Action · Keep the VAI/Designesy separation explicit. When Tile graduates to Designesy /labs, switch from VAI yellow to Designesy tokens.
Durability
Observation. Full BRIEF documents intent, feel, parts, ratios, spine, export, and graduation path. STATUS.md tracks publication state. HOST.md records the live URL, repo, and OG image. The tool is self-contained and will not break from dependency drift.
Judgment. Durable as a shipped artifact. Documentation is complete enough for another builder to remix or maintain.
Action · Keep BRIEF and STATUS synchronized. When the tool changes, update both.
Delight
Observation. Re-harmonizing the whole set from one spine change is the delight moment. No glow, no bounce, no particle trail. The emotional quality is precision.
Judgment. Delight is earned. The tool feels good to use because the composition model is strong.
Action · Keep restraint. Reject proposals to add animations or effects that do not serve composition.
Responsibility
Observation. No dark pattern in the tool. Export is plain: ordered PNGs, set.json, README.txt, with no watermark or lock-in. Publication on X used a one-word root post with a screen recording.
Judgment. Export format shows the tool as it is. The publication format was chosen to show the tool honestly.
Action · Keep the publication format. Do not add engagement hooks to the tool or the post copy.