Manga Panels — our demo

One example among many. Don't reuse its story, arc, shots, props or timings.

Demo: KOMA ONE: Thirty Frames a Second (KOMA ONE · 一秒三十格, 48.0 s) · manga-panels.mp4 · source in demo/

The picture is cut to a score synthesized in code (demo/mix.py, 160 BPM). To cut it to a sung version, re-measure demo/beats.json (bpm, offset, cuts, lyric lines); every time below follows from that file.

A music video for a fictional pocket camera. A street photographer chases a running light across a dusk crossing, waits, focuses in 0.02 s and presses the shutter as the pigeons rise; the camera splits that one second into thirty panels; she lowers the camera and smiles, then turns the lens on the viewer: "把你留在 這一頁" (I'll keep you on this page). The camera is drawn in the design language of a classic rangefinder-style retro digital camera, the type people recognise at a glance: a slim flat-topped body, a brushed-silver top and bottom plate, a vermilion leatherette wrap (the film's one spot colour), a short prime lens on one side, a viewfinder window in the opposite top corner, a knurled speed dial with the shutter button in its centre, an exposure dial and strap lugs. It is an original design: no real brand, model, logo, badge, lettering or numbers. The brand KOMA, the KOMA ONE camera, its specs and the photographer are all fictional; コマ (koma) is Japanese for both a manga panel and a film frame, and that pun is the film's spine: every shutter press adds a panel.

Story & structure

Shape: one second, told in eleven different ways of drawing panels. Every lyric line brings a new panel grammar instead of a new idea, and the lyric lettering itself changes register: narration boxes (verse, her inner voice) → hand-lettered shouts (chorus) → speech balloons (the last line, said to the viewer).

• Intro (0–6 s): the shutter blades open on the street (hook in the first 0.15 s); four panels slam in one per beat (street, splash, camera grip, eye); a chapter title page (扉頁) with the full-figure key art breaking the frame, "第1格 決定性瞬間", "KOMA ONE"; it splits along a slanted gutter into the verse.
• Verse (6–18 s): a light runs down the street and she runs after it, her camera hand breaking the panel border; the same overhead crowd three times, blurring panel by panel until only she is left (シーン); ready → raise → eye, an anticipation triptych; an over-the-shoulder panel beside an empty dashed panel that is filled with rising pigeons on "現在".
• Pre-chorus (18–24 s): time stops: the tone wipes away, the speed lines retract, a vermilion focus bracket hunts and locks in 0.02 s; a heartbeat beside the finger on the shutter; パシャッ fills the page; 0.75 s of silence on one quiet panel (間): the camera at rest just after the press, settling, one glint on the lens, no lettering.
• Chorus (24–43.5 s): the burst (one panel splits 1→2→4→8→16→30 on six beats, each cell one frame of her leap through the pigeons); the thirty cells merge into one spread and everything freezes (ピタッ) while the camera pans, a small insert of her hand on the camera; the camera glides through the gutters of a page of nine numbered panels, her photos of the day; the quiet beat: she smiles over the camera on emotion tone (bubbles, sparkles); a flip book turns thirty pages in one second and the drawing comes alive; she aims the camera at the viewer, the vermilion brackets land on the four corners of the screen, two linked balloons.
• End (42–48 s): the last spread: right page the camera breaking out of a black focus-line panel with KOMA ONE, 口袋相機 and the slogan; left page the colophon (奧付) inked on the last shutter.

Native moves spent: panel = cut, panel ink-in in reading order, the shutter iris, chapter title page, break the frame (×4), same-composition panels, anticipation triptych, the empty panel, the quiet panel (間), time stop, the burst split (signature), panels merging into a spread, gutter travel, emotion tone, flip book, impact frames, colophon, narration box → shout → balloon.

Shots (grid: 160 BPM, 1 beat = 0.375 s, 1 bar = 1.5 s)

Score structure

• 160 BPM, E minor, numpy synthesis: distorted power chords, bass, drums, a square-wave lead standing in for the vocal line, and the shutter as percussion (every beat of the intro, sixteenths through the burst).
• Intro riff with shutter clicks and four chord stabs under the four panels; verse in muted eighths; pre-chorus drops the kit for held chords and a heartbeat kick, a snare build, the shutter hit and 0.75 s of true silence; chorus four-on-the-floor; "都是決定性瞬間" in half time; two full-band hits on "KOMA ONE"; the last shutter and a ringing chord.
• Foley (procedural, driven by window.EV): ink brush before every panel, paper for camera travels, shutter, iris blades, focus beeps, heartbeat, wings, footsteps, puddle splash, wind, crowd murmur, the freeze, chimes, the flip book.

Palette & props

• Page: paper #F3F0E8, ink #121212, 10 % paper grain; every grey is dots or line tone. The spot colour, vermilion #F03C1E, is spent only on the camera and what speaks for it: its leatherette, the focus brackets (AF boxes, AF LOCK), the frame-number tags on the nine-panel page, the brand underlines on the title page and end card, the screen-corner brackets when she aims at the viewer.
• The KOMA ONE pocket camera (fictional, original design): slim flat-topped body, silver top and bottom plates, vermilion leatherette, short prime lens on one side, viewfinder window in the opposite top corner, speed dial with the shutter button in its centre, exposure dial, hot shoe, strap lugs; no logo, lettering or numbers.
• The photographer (fictional): drawn in every pose from one character reference, her camera always the same one (see Images).
• The world: a dusk crossing with wet asphalt and puddles, an overhead crowd, a flock of pigeons, a running wedge of light drawn by removing tone.

End card

The colophon (奧付) on the last page, inked on the last shutter: 《KOMA ONE》一秒三十格 / KOMA ONE · Thirty Frames a Second / rule / 黑白漫畫分格 Manga Panels / LemoLab × Claude Opus 5.5 / credits ("畫面 Codex 生圖 · 音樂 代碼合成", "Images: Codex · Music: made in code") / "Fictional brand, product and character." The "LemoLab × Claude Opus 5.5" line exists only in this library demo.

Images

All drawings come from an image generator (OpenAI image generation through the Codex CLI, core/image/gen_image.py), re-printed as screentone by demo/tools/prep.py; none is a photo or an existing artwork. They belong to this demo only: a film in this style generates its own characters, products and panels for its own topic (STYLE.md §9), and never reuses, recolours or edits these. The images are not in git (demo/gen/, demo/img/ stay local); the prompts are. Fifteen images in demo/gen/, prompts in demo/prompts/:

• References: the photographer (char_shoot) and the camera alone (prod_hero, also the end-card view). prod_hero fixes the camera's design for every other image.
• With the camera (eleven): prod_hero, char_shoot, char_jump, char_eye, key_title, run, ready, aim_you, smile, finger, over. The camera's design was changed after the first pass, so each is an edit (--edit): the first drawing of the same pose as the image to change, the new prod_hero as the second reference, "replace only the camera, keep everything else" (demo/tools/gen_camswap.sh, prompts prompts/prod_hero_redesign.txt and prompts/_camswap*.txt). This keeps faces, poses and framing while the prop changes; the anchors that sit on the camera (the lens in aim, the shutter button in finger) are measured on these images.
• Without the camera, or with it too small to read (four): bg_city, pigeons, feet, crowd.

Build notes

demo/
  build.sh       one command: screentone (gen/ → img/) → fonts (if missing) → events → score + foley → picture 30 fps → master −14 LUFS → readcheck → poster, styleframe
  index.html     one canvas, the five font subsets
  kit.js         the manga engine: panel, tone, lineTone, focus, speed, rings, star, sfx, narration, shout, balloon, afBox, halo, put, cover, cam, flash, text registry for readcheck
  film.js        render(t): one function per section (S_intro … S_end), lyrics, buildEvents() for the foley
  beats.json     the whole cut grid: bpm, offset, cuts (bars), lines (seconds), silence, fade_out, colophon
  mix.py         score and foley in numpy (uses core/audio/sfx.py)
  tools/         prep.py + prep_all.sh (screentone at display size), fonts.sh (Google Fonts subsets),
                 gen_all.sh, gen_camswap.sh (both through core/image/gen_image.py), style_suffix.txt
  prompts/       one text file per generated image, and the camera-change edit (README.md)

sh demo/build.sh from the style folder (or with LIB=<library root>) rebuilds the film from the generated images, with no new generation: tools/prep_all.sh, tools/fonts.sh, core/render/events.mjs → events.json, mix.py, core/render/video.mjs at 30 fps (WORKERS, default 2), core/render/mux.sh → manga-panels.mp4, then core/render/readcheck.mjs, poster.jpg and demo/stills/styleframe.jpg at 40.2 s. SKIP_PREP=1 keeps the screened images already in img/. Everything about timing is in demo/beats.json; to cut the picture to another song, re-measure only that file. A fresh clone needs only the core tier (Node, ffmpeg, the Python venv with numpy and soundfile); no tools/fetch.sh pack. The fonts are downloaded by tools/fonts.sh. The fifteen generated images are not in git, so a clone cannot rebuild this film as it is; build.sh stops and says so. demo/tools/gen_all.sh, then demo/tools/gen_camswap.sh (after moving the first drawings that show the camera into demo/gen/before/) draw a new set through core/image/gen_image.py, which needs the Codex CLI; new drawings mean re-measuring the anchors and crops in film.js and tools/prep_all.sh.