Brand and design · Stages
Hi-fi screens
Stage 4: one folder per screen with its contract, boards per state and data-binding map.
One folder per screen, named by its ID in ../screens.json (listed in ../lofi/screens.md):
hifi/S16/
screen.md contract (states, flows, API calls, local state), a board per state, tokens used, strings
bindings.md data-binding map: every field to its endpoint or local state, and the four state lines
The boards are not in these folders: they are the committed HTML in ../screens/<group>/<screen>--<state>.html
(zh-Hans) and ….en.html (en), drawn on the example data in ../../docs/api/examples/. screen.md links them. Both files are
generated from ../screens.json by pnpm design:index (botgumi's botgumi-design index); do not edit them by hand.
screens.json itself is exported from the gallery by python3 design/tools/hifi_index.py, which reads
../screens/manifest.json, ../data-binding.md, ../states.md, ../flows.md, ../strings.json and ../base.css.
A required state (loading, empty, error, offline) that has no board of its own is still a row in the Boards
table: it says so, quotes ../states.md and links the board that covers it where one exists.
Every screen is at stage hifi. After its retroactive gate passes, set its stage in ../screens.json to
approved and its gate to the issue (#12), then run pnpm design:index; the export keeps both. node design/check.mjs checks each folder.