すべて · モーショングラフィック · ショーリール・キネティック
569縦モーションショーリール — 点ひとつが15秒間すべての場面をつなぎ、名前で終わる縦動画
名前と4つの言葉を入れると、点ひとつが分かれ、図形やドットの場に変わり、言葉を積み上げて名前のピリオドに着地する15秒の縦リールができます。
受け取れるもの
- 縦型MP4(15秒、60fps、コードで作るビート)
- 文字と色を変え、コマンド1行で新しい動画を作るconfig.json
- 場面ごとに何が次へつながるかを書いたplan.md
GPTで生成
- GPT-6 Astra このAIで作りました
項目を入力
- 1項目を入力します
- 2プロンプトをコピーします
- 3コードを実行できるAI(Claude Opus 5.5・GPT-6 Astra・Gemini Argon)に貼り付けます
- 4AIがHTMLを作って自分でレンダリングし、MP4ができます
- 5直すときはHTML上部の設定欄を変えて、レンダーのコマンドを1行 再依頼なし
プロンプト全文を見る 5,379文字
Make a 15-second vertical motion design showreel for my name and render it to MP4. Do the whole job now without asking questions. [Inputs (use the default when empty)] Name: "【名前】" — default Promptpan Four short words, shown one by one (slash-separated): "【4つの言葉】" — default 埋めて / それで / 完成 / プロ級 Closing line: "【締めの一文】" — default 埋めるだけでプロ級 Palette: "【配色】" 基本 = orange #FF4B2B, ultramarine #2B3FFF, yellow #FFC93C, black #0A0A0A, off-white #F1EDE4 ネオン = acid lime #D7FF3E, hot pink #FF3E9A, cyan #3EE6FF, black #0A0A0A, off-white #F1EDE4 落ち着き = terracotta #D96B4B, deep teal #1F5B5B, sand #E8C88A, ink #121417, paper #F4F0E8 [What makes it good] - One hero: a single accent-colored dot. It splits, orbits, stamps, wipes, and finally lands as the period after the name. No scene starts from an empty frame; something from the previous moment always causes the next one. - Every moment takes over the whole phone screen with a full-bleed color or one graphic idea. Never a small card floating in the middle. - Type has weight: each word lands like a heavy object, stacks under the previous one, and the layout rebuilds itself to make room instead of cutting. Words never overlap or touch while moving. - One pure idea at a time: a dot splitting into an orbit; a shape morphing circle → rounded square → triangle → cluster; a field of large dots with a color wave that folds into a sphere, a ring and a wire cube; a single ribbon drawing a loop; the words riding a large spinning ring. - Rhythm with one real rest: around 9.5 to 11 s, one calm full-screen moment with a single slow ribbon. The music keeps playing there. - Nothing but the motion: no corner labels, no frame counter, no year, no captions or watermarks. [Storyboard — follow these times and grounds exactly] Palette roles, in the order listed above: ACCENT, SECOND, THIRD, DARK, LIGHT. 0.00–1.75 · DARK ground. One ACCENT dot splits into children that orbit on a tall ellipse. 1.75–2.00 · ACCENT grows from their center and covers the whole screen. 2.00–3.75 · ACCENT ground. Word 1 lands huge with weight; word 2 swings in beneath it; thin corner brackets snap around them; both rise to make room as word 3 drops in below; then everything contracts into the ACCENT dot. 3.75–5.50 · DARK ground. The dot grows into a circle, morphs to a rounded square (SECOND), a triangle (THIRD) and a grainy cluster, inside thin corner guides. 5.50–7.25 · LIGHT ground. The cluster spreads into a tall field of large dots; an ACCENT wave climbs through it. 7.25–9.50 · SECOND ground. The same dots fold into a surface, a sphere, a ring and a wire cube; the camera pushes through the cube. 9.50–11.25 · THIRD ground, the calm moment. One ACCENT ribbon slowly draws a tall loop and withdraws. No text. 11.25–13.25 · DARK ground. The loop becomes a large elliptical track; words 1 to 4 ride it upright and readable, rotate, then contract into the ACCENT dot. 13.25–15.00 · LIGHT ground. The dot moves to the end of the name, which resolves very large; the closing line settles beneath it and holds. Every one of these grounds must fill the entire screen. Do not keep one background color for the whole film. [Layout for a phone] 1080×1920, 60 fps, exactly 15 seconds. Keep everything that matters inside 90 px from the sides and 180 px from top and bottom; nothing important is ever cut by the screen edge, including rotating text. Big words are at least 220 px tall and single short words at least 320 px; ring words at least 110 px and always upright enough to read, never mirrored; the final name fills about 86% of the width and the closing line is at least 64 px. Dot fields use dots big enough to read on a phone. Use a heavy Japanese display font that supports every character you use (for example Dela Gothic One from @fontsource/dela-gothic-one, SIL Open Font License) and check every glyph renders. Print each input exactly once and add no other words. [Sound] Compose an original beat in code at about 120 BPM: tight kick, soft clap, simple bass line, clean synth stab; cut the picture to the same beat data. During the calm moment remove only the drums and keep bass and a soft chord about 6 dB lower, so it stays one continuous song with no gap. Measure loudness in 0.5-second windows; no window may fall more than 8 dB below the average. Integrated about -14 LUFS, true peak below -2 dB. [Build] Node.js, @napi-rs/canvas and FFmpeg; no browser needed. All drawing comes from a pure seek(t). Keep all inputs and colors in config.json. Write render.mjs so `node render.mjs` makes a new MP4 (H.264 + AAC, yuv420p). [Check before finishing] Write plan.md first: the three great moments, the calm moment, and for every transition the object that carries across. After rendering, export frames every 0.25 s in 5×4 strips stamped with time, open them, and fix any step that looks like an unrelated new picture, any overlap, any text cut by the edge, and any dead hold. Then render again. Deliver motion.mp4, render.mjs, config.json and plan.md. [Final output format] 出力サイズは1080×1920ピクセル、9:16の縦型にしてください。文字は中央の安全な範囲に収めてください。 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.
結果はどうでしたか?
使い方・よくある質問
点ひとつが最後までつなぎます
場面はただ切り替わりません。点ひとつが分かれて回り、言葉を押し、図形に変わり、最後は名前のピリオドに着地します。話題のモーション動画を0.25秒ずつ分解して学んだ流れを入れました。
入力のコツ
4つの言葉は/で区切って短く書きます。一語が画面いっぱいに出るので、短い言葉ほど力強く見えます。名前は最後の場面で横幅いっぱいに出ます。
休む瞬間もあります
9〜11秒ごろ、静かな画面でリボンひとつだけが動きます。音楽は途切れず、ドラムだけが抜けます。
作り方
例はこのプロンプトでGPT-6 Astraが作り、重なり・小さな文字・音楽の途切れを一度直した映像です。同じプロンプトでも実行ごとに少しずつ変わります。Claudeではまだテストしていません。
必要なPC環境
映像を作る間、PCが少し重くなることがあります。Claude CodeやCodexのようにコードを書いて実行できるAIに貼り付けるプロンプトなので、画像AIでは映像は出ません。外部サービスの料金や規約は各サービスでご確認ください。

