462제품 · 서비스 소개 모션 광고 — 문제 한 줄에서 단추 누르기까지 15초

Make a 15-second vertical product launch ad as one self-contained HTML file and render it to MP4. It must feel like a polished app-store launch video from a top studio: calm, premium, every element moving with purpose. Do the whole job now without asking questions.

[Inputs (use the default when empty)]
Name: "【이름】" — default 프롬프트판
Problem line: "【문제 한 줄】" — words wrapped in *asterisks* are the emphasis word
Solution line: "【해결 한 줄】" — same *emphasis* rule
Three features (slash-separated): "【기능 3개】"
Two numbers (slash-separated, each "value=label", e.g. 457=공개 카드): "【숫자 2개】" — if empty, skip the numbers bar and give the extra bar to the features
End button text: "【끝 단추】" — default: the name
Palette: "【색 조합】"
  크림 · 주황 = paper #F6F1E8, ink #1A1814, accent #F05A2A, second #2F5BFF, highlighter #FFD24A, card #FFFFFF
  흰 · 파랑 = paper #F3F5FA, ink #0F1630, accent #2F5BFF, second #FF5C8A, highlighter #7CE0A0, card #FFFFFF
  밤 · 라임 = paper #0F1013, ink #F2F2EE, accent #C8F43C, second #7C5CFF, highlighter #FF7A3D, card #1B1D23
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. (default 9:16).

[Structure — 8 bars of 4 beats, one idea per bar, every move on a beat]
1. Problem: the problem line types itself in a heavy Korean sans (Noto Sans KR 900), the emphasis word in a bold serif italic (Nanum Myeongjo 800, slight skew) in the accent color; on a vertical canvas use big type and break into two lines at the space nearest the middle rather than shrinking. A blinking cursor, then a hand-drawn red strike line wobbles across each line, and the whole block tips over and falls off the screen.
2. Solution: the solution line types in, a highlighter swipe paints under the emphasis word, then the line squeezes into a single accent dot.
3. Name: the dot pops into a rounded-square app icon with a starburst mark; the name assembles from its Hangul consonant and vowel pieces (decompose with Unicode arithmetic) flying in from all sides and snapping on the beat; a small grey "무료 AI 프롬프트"-style sub line fades in; the icon and name shrink up into a small header that stays for the next bars.
4–6. One feature per bar: the feature title rises through a mask with a small monospace number (01, 02, 03); a white card UI floats in with a soft shadow and demonstrates that feature with a real-looking micro-interaction — a cursor clicking into input fields and typing values with check marks, a big pill button pressed with a ripple and a "복사됐어요 ✓" toast, language chips flipping while the sample sentence slides through Korean, English and Japanese. Invent a fitting demo for whatever features are given; keep it believable, never a fake brand.
7. Numbers: an ink circle floods the screen, both numbers count up from zero and land with a small pop, labels and thin rules draw under them, then a paper circle wipes back.
8. End: the icon pops back with a burst of small colored particles, the name rises through a mask, the solution line types under it, the end button grows in with a soft colored shadow, a cursor clicks it and a ripple spreads. Hold the final frame.

[Always-on details]
A thin 8-segment story progress bar along the top (like Instagram stories) fills with time and recolors to stay readable. Subtle film grain. Real motion blur on fast moves (average several sub-frame samples). Overshoot and settle on arrivals. Three typefaces only (Noto Sans KR, Nanum Myeongjo, Black Han Sans stretched 1.3x wide for the name), loaded from Google Fonts. Keep a 6% safe margin; never clip a Korean syllable.

[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 on a single canvas. The script starts with a `const CONFIG` object holding every input plus fps 60 and a seed. All drawing comes from a pure `seek(t)` — no timers, no CSS animation, randomness only from the seed — so any frame renders identically. A settings panel above the preview (hidden with ?render=1) with Korean labels: text inputs for every text input, 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.

[Check before finishing]
Render, export one frame from the middle of every bar into a contact sheet and look at it: every bar reads at phone size, the problem line is crossed out, each feature demo clearly shows its feature, numbers end on the exact values, nothing is clipped, the last frame shows icon, name and button. Fix and re-render if anything fails. Finish with 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.