Isometric People Scene — Style Prompt

A calm explainer of an everyday rule, set in one real place drawn in true isometric with flat colour: small faceless people seen from behind do the thing in order, while serif type lands on the ground, character by character, as if painted there. Whatever hides the action (a roof, a wall) is cut away or lifts off like a paper flap. The order of movement is the explanation. References (grammar only): isometric explainers about public manners (queues, platforms, crossings) and picture-book cutaways where a roof or a wall is lifted away to show the inside. Take the calm pacing, people as the diagram and type on the floor; never copy their characters, layouts, typefaces or music.

1. Essence, and what it is not

Not Isometric Infographic: that style builds a model on a floating board over a dot lattice and labels it with sans-serif pins, icon statistics and inset bubbles to trace a process; here there is no board edge, no pins and no icons: the place is real and full bleed, the labels are serif words lying on its floor, and the explanation is people obeying a rule. Not Low-poly Isometric Island: no lighting, no faceted terrain, no shadows or glow; solids are flat three-tone paper colours and the ground is a printed plane. Not a cartoon (no expressions, no gags), not a slide (no headers, no centred titles, no cards).

2. Materials & rendering

3. Colour logic

4. Type & subtitles

Narration & subtitles

When the film tells something, a narrator says it and the picture shows it at the same moment: one line per action or shot, each line starting as its action starts. A calm, quick reader in the film's language; the floor carries only that line's key word or number, never the sentence. Subtitles: one cue per narration line on a pale bar in the lower safe area, one Chinese line above (≈ 34 px) and one English line below (≈ 25 px, a translation of the whole sentence), switched hard, never two cues on screen. Numbers the viewer must remember: at most three, each said with what it compares to, and held on screen ≥ 2.5 s.

5. Motion quality

6. Camera grammar

Move What it expresses Can serve
slow drift and push (≈ 6–8 % zoom) calm attention on one rule a call, a waiting room, a hold to read
follow the head of a line the order of things a corridor, a boarding, a procession
travel along the ground at the subject's pace one place after another on the same road a delivery, a parade route, a line of workshops
rise to wide while a lid opens revealing a space whole an interior, a capacity, a grid of places
locked frame judging, reading a verdict, a comparison, the last frame
step back to frame one whole incident cause and effect in one view one person blocking, one door jamming
tilt down from outside to the people arrival, cause → people an opening, a change of place
scale jump (room → building → site) the result in context a verdict, an ending

The angle never changes (iso is fixed); camera moves are translation and zoom. Every move is motivated by the action, and text and subject stay inside the frame at both ends of it. Transitions: a continuous move, a lid opening, a run back along the same path, or a cut on the beat at the same angle. No page turns, wipes, black or blank frames; a pull-out shows its next subject (a mark being drawn) within half a second. A lid is a reveal only while it is seen: it finishes turning, paper side up, inside the frame before it glides off away from the camera.

7. Sound palette

Soft upright piano and vibraphone; a vibraphone note per landing character (keywords louder, the accent doubled on glockenspiel); pizzicato and shaker when people walk. Repeated actions become rhythm: a stuck queue is broken pizzicato stabs, an orderly one is one chord per group. Quiet place beds (hall air, cabin air, distant engines) and a sustained low string root overlap every cut so no scene change drops out; functional sounds of the place (a home-made chime, wheels on carpet and on metal, bin lids, a tug). A rewind plays the last second of music backwards. With narration, the music ducks about 16 dB under the voice and lifts between lines; mix ≈ −16 LUFS before mux, true peak under −1.5 dBFS.

8. Native moves

9. Pitfalls of the medium

10. Engine

Copy as they are into the project folder (they hold no demo content): demo/engine.js, demo/kit.js and demo/tools/motion_check.mjs. kit.js re-exports what you need from engine.js, so a film imports from kit.js. main.js and index.html are a short page shell (fonts loaded, then window.DUR, SHOTS, TEXTS, render, READY, as core/README.md describes) to rewrite with your own fonts and characters.

Demo-only, read for technique, don't reuse as props: plane.js (a lofted fuselage, a cut-away cabin, a hinged flap lid / lidMap), places.js (apron markings, a glass wall that drops to a parapet, painted lanes, signs, chairs), film.js (a timeline built from narration line lengths, a deterministic queue simulation sampled with interpolation, sitting and stowing, texts() for readcheck).

What the kit gives: - World: metres; x runs down-right on screen, y down-left, z up; depth toward the viewer is x + y + z. kit.js exports one shared iso: set iso.g = g and iso.cam = { x, y, z, k } each frame (k = pixels per metre; the camera only translates and zooms). - Solids: queued iso.box(x, y, z, w, d, h, tri(c), o), prism(footprint, z, h, …), cyl(…, { axis }), cone, roof, drawn by iso.flush(); *Now versions draw at once (inside a cut-away, between back and front walls). o.bias corrects the sort: the queue sorts by the box's centre, people by their feet, so a solid that should sort by its footprint gets bias = −(z + h/2 − floor height). o.faceColor, o.decal for a lit face or markings on it. - facet(g, pts3, tri, { out }): any flat polygon in metres, toned by its normal (out points outward), for curved bodies and lids. - onPlane(g, x, y, z, plane, fn): draw in metres on a plane: 'xy' floor (u = −y, v = +x), 'yz' wall facing +x (u = −y, v = −z), 'xz' wall facing +y (u = +x, v = −z). Markings, signs, windows and screens go through it. - Floor type: phraseLayout(P) with P = { x, y, z, t0, t1, step, scale, lines: [[[text, kind], …], …] } (kinds: B big ink, A big accent, s small, n / na / ns numerals, e / en Latin), then floorType(g, t, P, L) every frame. The first line's baseline lies along x = P.x and reads from y = P.y toward −y (up-right); its glyphs fill x ∈ [P.x − size, P.x], and later lines step toward +x. phraseWorld(P, L) returns the floor rectangle (keep it clear, §4 and §9), phraseBox(P, L) the screen box for texts(). - People: iso.bill(x, y, floor z, gg => drawPerson(gg, p, pose)) with p = { h, top, legs, skirt?, hairLong?, bagc? } (tops and legs from TOPS / LEGS) and pose = { walking, phase, bag, lift } (walk, rolling case, case raised overhead); drawSeated(gg, p) for shoulders and head above a seat back. Push globalThis.__POS?.push({ i, k: 'w' | 's', x, y, a }) where each person is drawn, for the motion check. - subtitles(g, t, cues) (two lines, hard switch) and subtitleBox() for the margin check; tri(), C, mix, easing (ss, eo, eio, seg).

What a new topic builds itself: the place (its ground, markings, cut-away buildings), its vehicles and machines (§2), and any pose beyond walking, carrying a case and sitting. A pose is made like drawPerson: a billboard in metres, back view, no face or hands, parts as flat shapes in the top's three tones (a rider, for example, is the seated torso raised to the saddle with two leg quads that swap with the pedal phase). A lid on any building is a facet roof turned about its far edge, as lidMap does.

Motion check: in the copy of motion_check.mjs, point the page.mjs import at the library's core/render/page.mjs (from films/<name>/tools/ that is ../../../core/render/page.mjs; outside a clone, an absolute path), then node <project>/tools/motion_check.mjs <project> --fps 30 from the library root.

Minimal example, not in the demo: a lift lobby with two painted lanes, floorType() with 先下後上 on the floor, people billboards stepping out of a box car before the waiting line steps in.

11. Variation space

The agent decides the place, its cut-aways, the cast size, the rules and their order, the narration, the camera path, the pacing and the palette within the colour logic.


How our demo was made (story, shots, narration, score, end card, build): DEMO.md. Read it after your treatment exists.