Design Artifacts — Inspired Applied Learning Platform

Everything produced by /design-consultation → /design-html for the “Warm Field Notebook” system. The canonical design spec lives at ../DESIGN.md; this folder holds the working artifacts and the production HTML.

design/
├── v1-dashboards/          ← PRODUCTION: Pretext-native HTML for the v1 screens
│   ├── finalized.html        Participant mobile (Practice + Apply nudge) + IS desktop (cohort weather)
│   ├── pretext.js            vendored Pretext layout engine (inlined import, 30KB, zero network deps)
│   └── finalized.json        build metadata (tier, mode, source)
├── previews/
│   └── warm-field-notebook-preview.html   the /design-consultation preview (font switcher + lamplight)
├── research/               ← competitive visual research
│   ├── edthena.png           direct competitor (edu-SaaS norm we broke from)
│   └── betterup.png          adult-coaching reference (warmth we borrowed)
├── verify/                 ← QA screenshots of finalized.html
│   ├── v1-desktop.png        1440×980
│   └── v1-mobile.png         390×844 (sidebar collapses, phones stack)
└── approved/
    └── approved.json         the approved design-system decision record

Run the production HTML locally

The page imports pretext.js as an ES module, so it needs to be served over HTTP (not opened as a file://):

cd design/v1-dashboards
python3 -m http.server 8754
# open http://localhost:8754/finalized.html

Then: resize the window (text reflows, heights recompute via Pretext), click any headline or prompt (contenteditable — layout recomputes on input), toggle ☾ Lamplight.

What the design enforces (design law — see DESIGN.md)

Warm paper, soft ink, terracotta accent (one CTA), sage for done/received.
Type: Fraunces (display) + Hanken Grotesk (body) + IBM Plex Mono (data).
No scores / bars / percentages / completion rings — progress is narrated.
IS view is cohort weather, not a watchlist; individual reveal is one logged click away.
Nudges are care language, not countdowns.

Provenance

/design-consultation (3 voices: Claude + Codex + research) → “Warm Field Notebook”, font pairing C chosen. /design-html → Pretext-native finalized.html. AI image-mockup backend was unavailable (timeouts), so previews are hand-built HTML — higher fidelity for this stationery aesthetic anyway.