16 motion graphics shorts made with Claude Opus 5.5
Someone made 16 HTML/SVG motion graphics with Opus 5.5 in Claude Code and published the step-by-step prompts and method.
【速報｜Claude Code でモーショングラフィックスが作れる】 ついに来ました！ https://x.com/charliejhills/status/2103893708550914076/video/1 Claude Opus 5.5 で、動くグラフィックを16本作った人が作り方ごと公開😳 地味に見えて、資料やSNSの見せ方が一段変わるやつです。 どう作るのか？解説していきます👇 これまで 「動くグラフィック＝モーションデザイナーに頼むか、After Effects で作るもの」 でしたが── その前提、崩れました。 【今回公開された16本】 ボタンが開いて動画プレーヤーになる、棒グラフが折れ線に変わる、見出しの文字に絵が流れ込む…… 16本が1つの画面で、8秒の動きをくり返します。 PDF ガイドには、マーケティングでの使い道が16通り。 つまり👇 ・作ったのは Claude Code の Opus 5.5 ・できあがりは HTML と SVG（Web用の画像形式）のファイル ・16本それぞれにコピペ用のプロンプト付き ・編集できる HTML ボードと PDF ガイドも無料配布（メール登録制） 【作り方（3ステップ）】 ① 動きを1つに絞る（例：グラフが形を変える） ② Claude に参考の動きを見せて、最初・途中・最後などの見た目それぞれに名前を付ける ③ HTML と SVG で作らせ、何回かに分けて直す これで 「決める → 見せる → 直す」 が Claude Code の中で完結します。 1回の指示で終わらせず、 細かく直していくのがコツです。