45秒のAIアニメを作るだけのはずが、UI設計で沼りました

Pollo AIさんのゲーム世界動画チャレンジに応募しました。

作ったのは、プリンを1個買いに行くだけの45秒です。

冷蔵庫を開けたら空だった。
それだけのことが、こうなりました。

動画そのものより、UIの設計でいちばん時間を使いました。

最後にたどり着いた手順を、そのまま置いていきます🌙

※この記事はPollo AIさんのPR記事です。
でも、内容は全部私の正直な感想です💫

作ったもの

MAIN MISSION は「プリンを買って帰れ」。

夜道を走って、自転車をよけて、赤信号で足止めされて、
コンビニで最後のひとつを確保して、セルフレジと戦います。

クリアすると「プリンを買って帰った！」と出ます。

それだけの話です💫

どう作ったか

45秒を一気に作ってはいません。15秒を3本です。

• ①　冷蔵庫を見る → プリンがない → 外へ出る → 走り出す

• ②　自転車を回避 → 赤信号 → 進路再開 → コンビニ到着

• ③　プリン発見 → 確保 → セルフレジ → 帰宅して食べる

順番は、こうなりました。

1. キャラクターを決める

2. 絵コンテを作る

3. 15秒の動画を3本つくる（リファレンスから動画へ）

4. 3本をつなぐ

5. できた映像を見て、UIを決める

6. UI素材を作って、載せる

7. 最後に、音をつける

5番が大事です。 UIを先に作らない。

先に作って、やり直しました

最初は逆でした。

動画ができる前に、UIの一覧表と、どの場面に何を出すかの表を
かなり作り込んでいたんです。

でも映像のシーンが変わるたびに、
「このUIは合わない」「これはもう要らない」となって、
資料のほうを直すことになりました。

できた映像を見てから決めれば、この手間は減ります。

ただ、それでもぴったりは合いませんでした。
その話は最後に書きます。

絵コンテも同じでした。

カメラ ／ 動き ／ UI ／ 音 ／ 秒数 ／ セリフ ／ 説明。

最初は全部を1枚に詰め込んでいました。

人が見るには分かりやすいんです。
でもAIは、絵コンテの中の文字まで読んでしまいました。

関係のない日本語が画面に出たり、
絵コンテに描いたUIが映像に混ざったり。

最後は、カットの中には映像だけを置いて、
番号と短い見出しは外側へ出しました。

AIに渡したのが、こちらです。

自分が見ていたのは、こちらです。

先に書いておくと、これは映像ができる前に作ったものです。

実際の動画とは、けっこう違います。

というより、違ってしまったので直しました。
その話は、このあとに書きます。

同じ場面の資料が、2枚あります。

カメラ ／ 動き ／ 音 ／ UIの中身。

下のほうには、全部書いてあります。

でもそれをAIに渡すと、読んでしまう。

AIに渡す絵コンテと、人が読む資料を、同じものにしない。

これが今回いちばんの反省でした。

赤信号で、何度もやり直しました

②でいちばん手こずったのが、信号です。

青になったあと横へ歩くだけになったり、
信号が2つ出たり、横断歩道の向きがおかしくなったり。

説明を足すほど、画面が複雑になっていきました。

書き方を変えて、何度も作り直しました。

それで、どうなったか。

いちばん最初に作ったものを、そのまま使いました。

採用した映像にも、横断歩道の向きは合っていません。

でも、作り直すほど、ほかがおかしくなっていって。
いちばんマシだったのが、最初のものでした。

やり直せば良くなる、とは限らないんですね。

ここは時間をかけたわりに、進みませんでした🌙

UIを載せるのにも、時間がかかりました

文字が崩れるので、UIは透過の素材として別に作って、
Pollo AIさんのエージェントに配置してもらいました。

一度では終わりませんでした。

• UIがキャラクターの顔や手に重なる

• キャラを避けると、今度はUI同士が重なる

• ITEM GET! と FINAL BOSS が同時に出る

• コンビニに着いたあとも、ミニマップが残っている

そこで、優先順位を先に決めました。

キャラクターを隠さない → UI同士も重ねない → 元の位置に近づける。

イベントの表示も、同時に出すのをやめて、
物語の順番に合わせて切り替える形にしました。

最後に、使うUIを1枚にまとめました。

色も決めました。青は案内、赤は危険、緑は再開、金は達成。

これも設計のための資料です。
並べた全部が、そのまま映像に出ているわけではありません。

場面ごとに、必要なものだけを出しています。

ひとつ、直しきれなかったところがあります。

HPを 100/100 → 95/100 に変えたら、数字は95なのに、
ゲージだけ大きく減って見えるようになりました。

何度か頼んでも変わらず、これ以上さわると別の場所が崩れそうだったので、
そのままにしています。

最後に残ったのは、音でした

生成した映像に、意味の分からない言葉をしゃべり続ける箇所がありました。

最初は「声だけ消して、足音や環境音は残そう」と思ったのですが、
声だけをきれいに消すのが難しくて、謎の言葉が残りました。

なので、元の音を全部ミュートして、作り直しました。

ゲーム風のBGMと、UIの効果音。
そこへ、冷蔵庫を開ける音、自転車が通る音、
自動ドアの音、セルフレジの「ピッ」を足しました。

音は、最後にまとめてやるほうが早かったです。

正直に書くと、完成版にも失敗は残っています

順番の話を書いてきましたが、
先に作らなくても、合わなかったと思います。

UIの位置。音のタイミング。
映像に後から合わせてもらうこと自体が、まだ難しい。

今回は、映像をつなぐところから全部エージェントに頼みました。

手で編集すれば、たぶん合わせられます。
でも、それをやるならAIに頼む意味が薄くなる。
それはそれで、大変です。

だから、どこかで線を引きました。

HPのゲージもそうですし、ほかにも残っています。
直しきれないまま出したところが、いくつもあります。

どこまで任せて、どこで妥協するか。

今回いちばん考えたのは、そこでした🌙

それでも、変えてよかったこと

AIに渡す情報は、多いほどいいわけではありません。

詰め込んだ絵コンテより、映像だけの絵コンテのほうが扱いやすい。
UIも、全部出すより場面ごとに絞るほうが見やすい。

エージェントには「変えないもの」も伝える。

「これを直して」だけだと、ほかが動きます。
「キャラクターは隠さない」と先に言っておくと、そこは守ってくれました。

プリンを買うだけの夜が、ちょっとしたクエストになりました。

冷蔵庫が空だった、というだけの話です。

でも作ってみたら、いつもの夜道が
少しゲームに見えるようになりました🌙

コンテストの応募方法と賞品は、
こちらにまとめました。

あなたの日常も、たぶん何かのミッションです💫

📚 関連マガジン

🐦 Pollo AI 公式X（旧Twitter）

最新情報やキャンペーン情報は、
公式Xで随時発信中✨

👉 Pollo AI 公式X（@PolloAIJP）

Pollo AIのホームページはこちら

私の専用リンクです。
ここから飛んでもらえるとうれしいです🌙

👉 Pollo AIを今すぐ試す