Design System

Pixel-art prototype

Representative pieces from the shared system, shown at their intended sizes. Unlinked preview route; nothing else is changed yet.

World accents

One persistent accent per world, from the live world registry.

Classroom Control

New Teacher Survival

Teacher Communication

Teacher Resilience

AI-Ready Classroom

Instruction Studio

Type

Pixel face for HUD labels only; readable sans-serif for everything learners read.

HUD label

Sans-serif mission title

Body copy in a readable sans-serif at 15–16px, line height 1.6.

World scene

Classroom Control, full-bleed plate at map-hero size.

Pixel-art classroom scene for the Classroom Control world

Mission scene

Live data from “The Noisy Entrance” — the real HUD, dialogue and choices. Nothing reveals an answer.

Classroom Control

Mission 1 of 6

0:4250

Coach Rivera

“The first minute sets the tone. A calm, visible first move beats a louder one.”

Decision

What is your strongest first move?

Quality tiers exist server-side only (A strong first move · Worth considering · Consider the tradeoffs); the list stays neutral.

Character portrait

Coach Rivera at dialogue size (48px) and portrait-card size (112px), with the letter-tile fallback beside them.

Level nodes

One node design, four states, on the map surface. Selected node responds; states come from real progress data in the app.

Badge

Real badges from the live catalog, drawn on the shared 24×24 pixel grid.

Classroom Control Cleared

First Simulation

Three-Day Streak

States

Loading, locked, and retryable error, exactly as learners see them.

Pro required

Continue Classroom Control, then unlock the next path.