Two-column magazine · Forest & sand · Libre Baskerville + Lato
Operations
A procedure is followed under pressure, often by someone doing it for the first time. Numbered steps, a check that closes each one, and the escalation route in the margin where it can be found at speed.
4 designs, each a separate take on the same document rather than a recolour of one layout: Two-column magazine, Side rail, Minimal, type-led and Boxed form planner. Every preview below is the actual compiled output, not a mock-up.
Open one in the editor and render it from your own JSON over the API — 1 page of A4 portrait, the same engine either way.
Two-column magazine · Forest & sand · Libre Baskerville + Lato
Side rail · Ochre & ink · Montserrat + Merriweather
Minimal, type-led · Charcoal & signal · Merriweather + Open Sans
Boxed form planner · Navy & brass · JetBrains Mono + Inter
Same document, same data model, 4 different arguments about how it should look on paper. Pick on layout and typography — the content behaves identically.
| Design | Layout | Palette | Typefaces | Pages |
|---|---|---|---|---|
| Column Guide | Two-column magazine | Forest & sand | Libre Baskerville + Lato | 1 · A4 portrait |
| Field Manual | Side rail | Ochre & ink | Montserrat + Merriweather | 1 · A4 portrait |
| Plain Procedure | Minimal, type-led | Charcoal & signal | Merriweather + Open Sans | 1 · A4 portrait |
| Step Cards | Boxed form planner | Navy & brass | JetBrains Mono + Inter | 1 · A4 portrait |
Each design is authored against an explicit reflow contract, so it is defined up front which blocks are emitted once per record and which fields absorb longer content. That is what stops the layout falling apart at a hundred rows.
| Design | Repeats per record | Grows with your data |
|---|---|---|
| Column Guide | numbered steps inside the column flow; the tolerance rows; the sign-off cells | every step's instruction; the caution; the closing note |
| Field Manual | numbered procedure steps; the check lines under each step; revision rows | every step's instruction and check; the safety note; the escalation note |
| Plain Procedure | numbered procedure steps; severity rows; escalation rows | every step's instruction and note; the severity definitions; the closing note |
| Step Cards | step cards; the tick lines inside each card; the stop-condition rows; sign-off rows | every card's instruction; the stop conditions; the hand-back note |
Open a design in the editor and the agent reshapes it around your schema — then render it from your own data over the API, or let your users edit it in the embedded editor.