夏の記事に海上花火の動画を入れたいなと思って、AIのClaudeに「このモデルを使えば、海上花火の動画が作れますか？」と聞いてみました。
答えは「動画は作れません」。
……なのですが、そこで終わらなかったのが今回の話です。Claudeが代わりに提案してきたのは、HTML + CSS + JavaScriptで花火のアニメーションを作って、WordPressのカスタムHTMLブロックに貼るという方法でした。
動画じゃなくてコードで花火を打ち上げる
言われてみればなるほど、という発想でした。動画ファイルと比べたメリットはこんな感じです。
- ファイル容量がほぼゼロ（動画なら数MB〜数十MBかかるところ、テキスト数KB）
- ページの読み込みが軽い
- 何度でもループするし、画質が劣化しない
- 記事の横幅に合わせて自動でサイズが変わる
「作ってください」とお願いしたら、コードが一式出てきました。それをWordPressの「カスタムHTML」ブロックに貼り付けただけで、夜の海に花火が上がるアニメーションが記事内で動きました。
できあがったものの中身
出てきたコードをざっと眺めると、けっこう芸が細かいです。
花火の動き：打ち上げの光が海面からスーッと上がっていき、上空で破裂して70〜110個の火花が放射状に広がります。火花には重力と空気抵抗がかかっていて、ふわっと落ちながら消えていきます。色は金・青・桃・緑・藤の5色がランダム。
海面の反射：ここが一番気に入っているところです。水平線より上で光ったものは、海面に反射して映ります。しかも反射はただの上下反転ではなく、縦に圧縮されて、暗めになって、波でゆらゆら揺れる。ちゃんと「水面に映る花火」に見えます。
背景：星が60個またたいていて、水平線にはうっすら光の帯が入っています。
貼り付け方（WordPress）
やることは本当にこれだけです。
- 記事の編集画面でブロックを追加して「カスタムHTML」を選ぶ
- もらったコードを丸ごと貼り付ける
- プレビューで確認して公開
プラグインの追加もテーマの編集も不要でした。
まとめ
「動画を作って」という最初のお願い自体は断られたわけですが、目的（記事に動く花火を入れたい）に対して別のルートを提案してもらえたのが今回の収穫でした。AIに何かを頼むときは、手段を指定するより「やりたいこと」を伝えたほうがいい結果になることがある、というのを実感した一件です。
色や打ち上げ頻度も「変えたい」と言えば調整してくれるそうなので、秋になったら色数を絞って落ち着いた花火にしてみようかと思っています。
コメント