AI-Generated 2D Avatars — sprite-grid pseudo-Live2D, the landscape, and consistent multi-pose generation
Why this exists: NAO flagged rotejin/tomari-guruguru — a girl whose head turns in (what looks like) 8 directions — and asked: study it, and design our own "Live2D based on multi-step AI generation — char sheet / base frame / face collage → generation," for all products including Embed. This article is the grounded teardown: the exact technique, the wider playbook of its author, the competitive landscape, and the SOTA for the one genuinely hard part (keeping a character's identity stable across every generated pose). The OpenAlice build proposal lives in its companion doc — see [[AI-2D-AVATAR-PIPELINE-2026-06-29]].
>
Method: 5 parallel readers — repo deep-dive (read the actual source + prompt files), all 100 @rotejin tweets, the Live2D/PNGTuber/AI-portrait landscape, the multi-step-consistent-generation SOTA, and our own stack. Sources cited inline; what's unverified is flagged.
TL;DR for OpenAlice strategists
- It is NOT Live2D and not AI video. tomari-guruguru fakes Live2D with the cheapest trick that works: pre-generate 150 still frames and toggle which one is visible. 6 "expression sheets" (eyes open/closed × mouth closed/half/open) × a 5×5 grid of 25 head poses = 150 transparent WebP frames. At runtime the mouse picks the head-pose cell, audio amplitude picks the mouth, a timer blinks. Zero rigging, zero GPU, zero SDK.
- The whole asset set is AI-generated in minutes. You generate the six 5×5 grids with ChatGPT Images 2.0 (GPT native image-gen) from one reference image + a prompt template, upscale (Real-ESRGAN 4×), cut transparent background, and run a Python slicer (MIT) that handles the messy bits. NAO's "char sheet → face collage → generation" is exactly this, already working.
- The author is a one-man build-in-public lab. @rotejin (Fukuoka) ships a family of these — tomari-guruguru (sprite grid), MotionPNGTuber (video-loop + mouth sprite), EasyPNGTuber (2×2 Gemini grid) — and a bigger avatar OSS is due ~July 2026 (full parts, hair-sway, tracking). His real insight: one illustration → AI parts-split → AI expression variants → assemble in Codex. Worth monitoring.
- Where it sits: above PNGTuber, below Live2D. It wins on no-GPU-runtime, no-rigging, no-royalty (MIT), and instant asset iteration. It loses on motion smoothness, body physics, expression density, and camera face-tracking.
- The one hard problem is identity drift. Naive GPT-image gets only ~65–75% cross-pose consistency; the fixes are diff-prompting ("change only the eyes, nothing else"), batching ≤4 poses/call, and — at the high end — FLUX.1 Kontext (97% face consistency) or a ComfyUI PuLID+ControlNet+LoRA stack (85–92%, needs a 12 GB GPU).
- For us it's a "missing middle tier" we can mostly already build. We have a live image-gen endpoint that wraps this exact workflow, a Forge sprite generator, and an avatar interface (
setState/setMouth/setEmotion) that a sprite renderer drops straight into — plus an existinglive2d-rendererroadmap goal. The full build case is in [[AI-2D-AVATAR-PIPELINE-2026-06-29]].
1. The technique — tomari-guruguru's sprite-grid, exactly
Stack: React 18 + Vite 8, pure browser, no backend. MIT code; assets are non-commercial (SNS OK, no commercial use, no derivatives) — so we copy the method/code, never the art.
The asset model (150 frames):
- 6 expression sheets A–F: A = eyes-open/mouth-closed, B = open/half, C = open/wide, D = closed/closed, E = closed/half, F = closed/wide.
- Each sheet is one 4500×4500 px transparent PNG holding a 5×5 grid = 25 head poses. Columns c0→c4 = full-left → 45°-left → front → 45°-right → full-right. Rows r0→r4 = strong-up → slight-up → level → slight-down → strong-down.
- Sliced into
slices2/{A–F}/r{0–4}c{0–4}.webp— 150 files, each a 1200×1200 canvas with the character anchored center-x 600, foot-y 900.
The runtime (the cheap magic): all 150 <img> tags are in the DOM at once; only the active frame has opacity:1. Mouse position relative to the character center, divided by followRange (340 px) and clamped to −1..1, is exponentially smoothed (factor 0.3) → col = round((x+1)/2*4), row = round((y+1)/2*4). Audio drives the mouth: WebAudio RMS (fftSize 1024) with a fast-attack/slow-release envelope and thresholds thHalf 0.07 / thFull 0.2 → mouth 0/1/2 (70 ms debounce). Blink is probabilistic (72% normal 90–150 ms, 22% double, 6% slow; intervals 1.8–4.5 s typical). Frame = SHEETS[(blink?3:0)+mouth] then [row][col].
The generation recipe (the part NAO cares about):
- Base sheet (A): attach your character reference + the repo's
docs/01_画像生成用テンプレ.png5×5 layout template to ChatGPT Images 2.0, thinking = maximum, send the base prompt,n=3, hand-pick. The prompt insists (translated): "…create a 5×5 face-angle reference sheet of the SAME character… 25 head icons evenly in 5 columns × 5 rows, simple gray background, **same character, same art style, same line art, same hairstyle, same accessories, same outfit, same colors** — change ONLY the face angle in each cell." + an English tag string:chibi anime character head angle reference sheet, 5x5 grid, same character, same design… yaw and pitch matrix, consistent head scale, consistent face size, evenly spaced, gray background, clean line art, soft cel shading, no text, no logo, no extra objects. - Expression variants by diff-prompt (the key consistency trick — edit, don't regenerate): "make the eyes closed in ALL positions, change nothing but the eyes" → D; "open mouth to an 'あ' shape in all positions, change nothing but the mouth" → C/F; "small/half-open mouth… mouth only" → B/E.
- Premium tier: lock one base in Photoshop/GIMP, then composite eye/mouth regions from the variants — removes AI colour drift between sheets and stops jitter on expression switches.
- Upscale + cut: Real-ESRGAN-GUI 4×, then true-alpha background removal.
- Slice:
slice_character_sheets.py(ffmpeg + a union-find connected-component pass over alpha runs) assigns each blob to its grid cell by centroid — so long hair/accessories overflowing a 900 px cell don't get clipped or bleed into neighbours — and drops semi-transparent gray residue. Validatelarge=25, one blob per cell, 150 files.
The clever, copyable ideas: (a) generate the whole turnaround as one grid image (the model keeps style consistent within one image far better than across calls); (b) diff-prompt expressions instead of regenerating; (c) component-aware slicing so hair never clips; (d) an all-frames-in-DOM opacity swap so the runtime is a few hundred lines with no engine.
2. rotejin's wider playbook
He's not a one-trick repo — he's iterating a whole approach in public (Fukuoka indie, GitHub Sponsors):
- A family of repos:
tomari-guruguru(5×5 grid, MIT) ·MotionPNGTuber(an idle MP4 loop + a real-time mouth sprite overlaid via anime-face-detection + OpenCV; needs a GPU only for prep) ·EasyPNGTuber(a 2×2 Gemini grid → 4 expressions, the fast-prototype tier). A larger avatar OSS is promised ~July 2026 with full parts, tracking, breathing — "it only became real thanks to GPT-image2's adherence to instructions." - The real pipeline he's converging on: one illustration → AI parts-split ("See-through") → AI expression variants → assemble in Codex. He calls it "a pretty groundbreaking way to express avatars."
- The layer stack (deepest→top): back-hair → neck-and-below as a static back-layer PNG → face (the swapping grid) → eye-highlights (wobble + 2 sparkles) → front-hair (sway). Back-hair + eyes get a little manual touch-up — "a tiny bit of effort skyrockets the quality."
- Cheap-but-alive tricks: hair sway via a raster-scroll wave (a retro-game water-effect trick); idle breathing; pupil-highlight jiggle; beat-sync wobble; slightly-angled base + thicker line art read as more 3D. The hard, still-open part is animating a single PNG whose parts aren't separated — so he designs the generation to output separable parts from the start.
- His toolbox: GPT-image2 (the enabler) · gpt-5.5 / gpt-5.4-mini + local Qwen3.6-27B (pixel-art) · Real-ESRGAN (upscale before cutout — improves matting) · See-through (parts-split) · Shoost (emotional polish) · AITuberKit (tegnike's OSS AI-VTuber frontend — 13 LLM providers, 11 TTS, supports VRM/Live2D/PNG; he wires his avatars into it) · Stream Deck (live expression switching) · M5Stack (ran a 16-dir variant on a watch) · Codex as a bulk image generator (~450 images in a session).
3. The landscape — where the sprite-grid sits
| Approach | Rigging | Runtime cost | Realtime / browser | Licensing | Quality ceiling |
|---|---|---|---|---|---|
| Sprite-grid + AI-gen (tomari-guruguru) | none | zero GPU, static frames | yes, any browser | MIT code, you own the art | mid — discrete poses, no body physics |
| Live2D Cubism | human rigger per character | low (CPU) | yes | free <¥10M rev; SDK pre-approval + ¥20M royalty trigger | high — smooth, but head limited to ±30° (flat layers) |
| PNGTuber tools (Veadotube/PNGTuber+/VTube Studio) | none | low | yes | free/cheap | low — 2-state / coarse |
| AI talking-head (LivePortrait, SadTalker, AniPortrait, EMO, Hallo2, VASA-1) | none | heavy GPU, offline batch | no — not browser-embeddable | mixed (several research-only/NC) | high video — but not interactive |
| Hosted realtime avatar (Hedra Character-3) | none | server-side | yes, $0.05/min | commercial SaaS | high — but photoreal-focused, not anime |
Reads: Live2D is the smooth incumbent but needs an artist-rigger per character and carries SDK pre-approval + royalty exposure for "expandable" (tracking) apps — prohibitive for rapid multi-persona iteration. The AI talking-head models (LivePortrait at 12.8 ms/frame on a 4090, etc.) are impressive but GPU-bound and offline — useful only for pre-rendered reaction clips, never a live browser widget. The sprite-grid is the only approach that is simultaneously zero-GPU-at-runtime, zero-rigging, royalty-free, and instantly re-authorable — at the cost of motion smoothness and body physics.
4. The hard problem — consistent multi-pose generation (SOTA)
Generating one consistent character across 25 head angles × 6 expressions is the whole difficulty. The field, ranked by consistency vs cost:
| Method | Identity consistency | Cost / needs | Notes |
|---|---|---|---|
| GPT-image diff-prompt (tomari's way) | ~65–75% zero-shot | cheap, no GPU, API | batch ≤4 poses/call; always re-attach the reference; L/R limb-swap is the #1 failure — prompt angles as compass/clock, not "left/right" |
| FLUX.1 Kontext (API) | 97% face / 92% outfit across 20 edits | ~8 credits/2048 px image | breaks ~14% above 90° head-turn; a turnaround LoRA exists |
| ComfyUI: FLUX.1-dev + PuLID/IP-Adapter-FaceID + OpenPose ControlNet + char LoRA | 85–92% | 12 GB+ VRAM | IP-Adapter 0.75 / ControlNet 0.85 / LoRA 0.9; highest control |
| See-through (SIGGRAPH 2026, OSS) | n/a — it's a splitter | local models | decomposes 1 illustration into ~23 semantic layers (hair front/back, eyes, mouth, clothing) + depth; explicitly NOT image-to-Live2D (no rigging). License CC-BY-NC-SA → non-commercial; legal flag for paid use |
| StdGEN++ (3D path) | drift-free | ~3 min, 3D pipeline | builds a 3D semantic mesh from 1 image, render 25 angles — eliminates drift but loses the 2D illustration look unless style-transferred |
Recommended 5-stage pipeline (consensus across readers): (1) one clean master base-frame; (2) identity-locked pose grid — GPT-image diff-prompt for bootstrap, FLUX.1 Kontext or the ComfyUI stack for quality; (3) consistency repair — inpaint the drifted cells against the reference + good cells; (4) parts-split (See-through-style) for layered motion; (5) assemble sheets + slice. Failure modes to expect: identity drift past ~75–90°, L/R swap, back-view clothing collapse, and expression "leaking" from the reference into every pose.
5. Licensing & honesty
- tomari-guruguru: code MIT (reusable), assets non-commercial → we must generate our own art.
- See-through: CC-BY-NC-SA → its decomposed layers can't ship in a paid product without a license; either generate separable layers ourselves via prompt design, or treat See-through as dev-only tooling. Verify before any commercial use.
- Live2D SDK: free under ¥10M revenue, but "expandable/tracking" apps need pre-approval and trigger royalties at ¥20M — a reason to avoid it for our multi-persona automation.
- GPT-image / FLUX Kontext consistency numbers are third-party benchmarks (flixly.ai etc.), not vendor papers — directional, not gospel.
6. Sources & gaps
- Repo facts are read directly from
tomari-gurugurusource (docs/01_画像生成用プロンプト.txt,tools/slice_character_sheets.py,src/). Tweet facts are from the 100-post export (2026-06-11→29), already English-translated. - Unverified: the exact
See-throughproduct URL/license terms in production; whether GPT-image's L/R-swap improved in the 2026 model; rotejin's unreleased ~July OSS (monitor github.com/rotejin); whether AITuberKit's PNG mode natively supports multi-pose sprite-grids vs simple 2-state. - Related: [[AI-2D-AVATAR-PIPELINE-2026-06-29]] (our build proposal) · [[competitor-dossier-avatar-platforms-2026-06-21]] (3D/video digital-humans) · [[image-gen-mockup-workflow-2026-05-27]] (our anchor+variant image-gen workflow) · [[procedural-vrm-generation-2026-06-12]] ("AI suggests, math executes") · [[alice-persona]] · [[product-catalog]].