463한글 모션 쇼릴 — 이름 하나로 15초 키네틱 타이포 영상

Make a 15-second Korean motion-design showreel as one self-contained HTML file and render it to MP4. It must look like the reel a top motion designer would put on a résumé: dense, layered, every frame moving, nothing static or template-like. Go all out. Do the whole job now without asking questions.

[Inputs (use the default when empty)]
Name (the wordmark): "【이름】" — default 프롬프트판
Tagline: "【소개 한 줄】" — default 칸만 채우면 프로급 결과
Kinetic words (slash-separated, 4): "【키네틱 단어】" — default 칸 채우고 / 복사하고 / 붙여넣으면 / 끝
End-card small line: "【끝 화면 작은 글】" — default promptpan.com · 2026
Palette: "【색 조합】"
  주황 · 파랑 · 라임 = ink #121212, paper #EFEBE3, orange #F04B37, electric blue #2B35F0, lime #DDF542
  먹 · 종이 · 주홍 = ink #1A1714, paper #F3EEE4, vermilion #E2452B, indigo #23305E, ochre #E3B23C
  밤 · 네온 = night #0B0B14, mist #E9E9F2, magenta #FF2E88, cyan #19E3FF, acid #C6FF3D
Tempo: "【박자】" — default 128 BPM. Aspect ratio: Output size 1080x1920 pixels, 9:16 portrait story. Keep all text inside the central 80% of the height: compress every zone percentage below into the 10-90% range..

[Structure — the beat is the blueprint]
8 bars of 4 beats. Length = 8 bars at the tempo (128 BPM = 15 s). One chapter per bar; every chapter change lands on a bar's first beat and every big move on a beat. Each chapter switches the whole background to another palette color and shows off one technique:
1. 01 — 정체: a single dot inside a thin ring; the ring grows, strokes shoot out one per beat into a starburst symbol; rotating circular micro-text orbits it.
2. 01 — 정체: an iris wipe floods the screen; the name rises into place in a very wide, heavy Korean display face, each letter squashing and stretching in width on the beat; the tagline writes itself underneath in a thin serif, slightly italic and wobbling; the letters shrink into dots and drop.
3. 02 — 자모: the dots become the name's consonant and vowel pieces (decompose Hangul with Unicode arithmetic) that race in on different easing curves — label each lane with its easing name and a tiny curve icon — and snap into full syllables on the last beat.
4. 03 — 변형: the name collapses into one shape that morphs circle → triangle → star → square, one per beat, with an onion-skin trail of outlines in the accent color, an orbit of small particles that morph with it, and degree ticks around the orbit.
5. 04 — 무늬: the square becomes a grid of quarter-circle (Truchet) tiles that reads like a field of ㅇ · ㅡ · ㅣ strokes; a wave of the accent color sweeps across and tiles rotate in a ripple on each beat.
6. 05 — 깊이: the tiles become a dot grid tilted in perspective, then a rotating 3D point cloud sampled from the name's own glyph pixels, which swells into a sphere and ends in a burst of warp-speed streaks.
7. 06 — 키네틱: the four kinetic words, one per beat, each with its own background color and treatment: a smash cut with horizontal motion blur, letters dropping in one by one, a repeating outlined row of the word scrolling in alternating directions, and a stroke-by-stroke outline draw then fill.
8. 07 — 끝: a blurred color wipe, a thin ring, the starburst symbol from chapter 1 reforms with a particle pop, the name unfolds beside it, the tagline under it and the end-card line as small monospace credits. The last frame holds the logo; the very first frame is the dot, so the story closes.

[Always-on layers]
A HUD over everything in a small monospace face, recolored to stay readable on each background: four thin corner brackets; top-left the name in bold plus a dim "MOTION REEL — 2026"; top-right the chapter number and name; bottom-left a running timecode with frames (00:00:02:35), dim fps, and a thin progress line; bottom-right the BPM, four beat squares with the current one filled, and "BAR n/8". Add subtle film grain. Use real motion blur on fast moves (average several sub-frame samples), overshoot and settle on arrivals, particles on impacts. Three typefaces only: a very wide heavy Korean display face (Black Han Sans stretched horizontally), a thin serif for the tagline (Nanum Myeongjo with a slight skew), and a monospace for the HUD (IBM Plex Mono, IBM Plex Sans KR for Korean labels); load them from Google Fonts. Keep everything inside a 6% safe margin and never crop a Korean syllable mid-glyph unless it is a deliberate wipe.

[Sound]
If you can generate music, add a background track at the given tempo whose accents land on the beats and chapter changes, and mux it into the MP4 as AAC. If you cannot generate audio files with a music model, write the backing track yourself in code instead: synthesize an original instrumental (kick, snare, hi-hats, bass, a chord pad and a light arpeggio, no vocals) at the given tempo with a simple chord loop, sample by sample into a WAV, with the drums entering where the video's main section starts, then mux it into the MP4 as AAC. Never use a placeholder or someone else's recording.

[Build]
One HTML file, everything drawn on a single canvas. The first thing in the script is a `const CONFIG` object with every input above plus fps 60 and the seed. All drawing comes from a pure function `seek(t)` that draws the exact frame for time t in seconds — no timers, no CSS animation, randomness only from the fixed seed — so any frame renders identically. Put a settings panel above the preview (hidden with ?render=1) with Korean labels: text inputs for name, tagline, kinetic words and end line, selects for palette, tempo and ratio, play/pause, a scrubber, and a "설정 복사" button that copies CONFIG as code. Edits re-render instantly.
Write render.mjs: open the page with ?render=1 in headless Chromium (Playwright), wait for document.fonts.ready, step seek(frame / 60) through every frame, screenshot the canvas at 1080 px on the short side, and pipe into ffmpeg (libx264, yuv420p, crf 18) to make motion.mp4. Close the browser at the end. Accept an optional JSON file argument that overrides CONFIG, so a new video never needs another AI request.

[Check before finishing]
Render, then export one frame from the middle of every bar into a contact sheet and look at it. Every bar must look clearly different, the background must change color every bar, the HUD must be readable everywhere, no Korean syllable is broken or clipped, and the last frame shows the full logo. If any bar looks flat or empty, add layers and re-render. Finish by telling me the file paths and the single command to re-render after editing settings.

[Final output format]
Output size 1080x1920 pixels, 9:16 portrait story. Keep all text inside the central 80% of the height: compress every zone percentage below into the 10-90% range.
This selected output format takes priority over any fixed canvas size or aspect ratio elsewhere in this template. Adapt the composition, text zones and margins to the selected canvas without stretching or cropping essential content. Device safe areas apply only when a device is selected. Never print these format instructions on the image.