Prototypes

Demo days 0 to 14 reference

By Flora May dela Cruz

A live prototype reference that shows one stable interface evolving through Day 0, 1, 3, 7, 8, and 14 with a clear active-day indicator and progression cues.

prototypedemo-strategystate-designux

→ Launch the live reference

What this is

A compact, interactive prototype for the demo-days playbook. It keeps the same information architecture while changing meaning across checkpoints so teams can test whether progression is clear instead of cosmetic.

Baseline

This prototype follows the same baseline as Fluent theme toggle.

Baseline reference: Fluent theme toggle live demo
Public source and install path: https://github.com/floramaydc/toybox-prototypes

Install and run

git clone https://github.com/floramaydc/toybox-prototypes.git
cd toybox-prototypes
npm install
npm run dev

Why it exists

Teams often show one maturity state and call it a timeline. This reference makes day-based storytelling tangible, testable, and easy to critique before production.

Companion artifacts

Demo Days 0 to 14 Time-Machine Playbook for the full method and template
Secret Handshakes for Designers Playbook for hidden controls used to operate timeline demos
Fluent theme toggle for baseline design-system and theme behavior reference

Prototype

Fluent theme toggle

A live prototype that drops Microsoft's open-source Fluent design system into a non-Microsoft site and toggles light/dark in place. Built to look at Fluent on its own merits — strong accessibility, sober tokens — without the enterprise-brand context it usually shows up in.

Take this playbook with you

Drop your email to copy the markdown or download the file. One email unlocks every playbook in the Toybox.

No spam. Occasional notes on new playbooks. Unsubscribe in one click.