見出し画像

【無料作成可能】ChatGPT × Google AI Studioで作る「動くLINEスタンプ」！連続生成の壁とAPNG化の最適化を目指して・・・

Miyu(Ulf)_pinkursa

こんにちは、pinkursaです！

前回の記事では、静止画のLINEスタンプ制作を「ChatGPT × Google AI Studio」で自動化する手法について解説しました。

今回はその「応用編」として、以前から挑戦したかった「動くスタンプ（アニメーションスタンプ）」の生成ワークフローを構築し、ついに何とか形にすることができました！

AIでイラストを動かすのは静止画とは全く違う次元の苦労があり、予想外の「壁」にもぶつかりました。その制作プロセスと技術的な解決策をここに書き残しておこうと思います。

新キャラ「いかずきんちゃん」のご紹介

今回制作した動くスタンプの主役はこちら！

イカの着ぐるみを着たみゆの派生キャラ「いかずきんちゃん」が登場！シュールに動くアニメーションでトークを癒やします。

みゆ（ウルフ）にイカの着ぐるみを被せてみたところ、なんとも言えないシュールで可愛い動きを見せてくれました（笑）。

※今回の操作は、前回の「静止画スタンプ自動化」の環境をベースにした応用編となります。基礎となるワークフローについては、ぜひ前回の記事もあわせてお読みください。

💡 制作環境について（重要）
今回の制作において、ChatGPTは有料プラン（Plus）を使用しています。無料プランでも不可能ではありませんが、アニメーション制作は「連続した画像生成」が必須となるため、生成効率や回数制限の観点から、実用レベルで回すには有料プラン推奨（あるいはかなりの根気が必要）となりますのでご了承ください。

1. 静止画スタンプと動くスタンプの「絶対的な違い」

まず制作に入る前に、仕様の違いを理解しておく必要があります。静止画と同じ感覚で作ろうとすると、後で確実にエラーに泣かされます。

【LINEスタンプ仕様 比較表】

| 項目 | 静止画スタンプ | 動くスタンプ（アニメーション） |
| ファイル形式 | PNG | APNG |
| メイン画像 | 240 × 240 (PNG) | 240 × 240 (APNG) |
| スタンプ画像 | 320 × 320 以内 | 320 × 320 以内 |
| トークルームタブ | 96 × 74 (PNG) | 96 × 74 (PNG) ※静止画でOK |
| フレーム数（1個あたり）| 1枚 | 5〜20フレーム |
| 再生時間（ループ） | なし | 1スタンプにつき最大4秒、ループ制限あり |

この表から分かる通り、動くスタンプを作るには「連続したパラパラ漫画の素材（フレーム）」を生成し、それを「条件を満たしたAPNG形式」に変換するという、静止画にはない”ひと手間”が必要になります。
今回は1スタンプの画像を270×270pxの大きさで制作することにしました。

2. アニメ素材生成のキモ：「座標固定」と「連続参照」

素材作りのため、ChatGPTに投げる定義書（プロンプト）もアニメーション専用にアップデートしました。

# 指示
あなたはプロのLINEスタンプクリエイターおよびイラストレーターです。
以下の【制作ルール】と【キャラクター定義】に従い、ユーザーが指定する「セリフ」と「動作・着ぐるみ」の指示に基づいて、LINEスタンプ用の画像を1枚生成してください。

# 基本設定（厳守事項）
- 画像サイズ: 1254×1254の１枚の画像を一枚ずつ生成。
　アスペクト比 1:1の正方形（LINEスタンプに最適な高画質）
- 目的: 日常会話で使いやすい、中毒性のあるLINEスタンプの作成

# キャラクター定義（みゆ）
以下の特徴を**いかなる場合も必ず**維持して描画してください。
- 髪型: 黒髪ツインテール
- アクセサリー: ピアノのヘアピン、ハート型の鍵のネックレス
- 体型: マスコットキャラクターのため、胸の描出は禁止し、完全に平らにすること。
※着ぐるみやコスプレを着ている場合でも、上記の髪型とアクセサリーは障害物がない限りチラ見せなどで必ず維持すること。

# 制作ルール
1. 背景とレイアウト
   - 背景: 背景透過処理を容易にするため、純粋なグリーンバック（カラーコード: #00FF00）で完全に塗りつぶす。
   - 余白: キャンバスの上下左右に約50pxの余白（パディング）を設け、キャラクターや文字が絶対に見切れないようにする。
   - 構図: キャラクターは上半身のみを描画する。

2. テキスト（セリフ）の配置とデザイン
   - 配置: キャラクターの頭上（中央上部）に配置。キャラクターと文字が重ならないようバランスを調整する。
   - フォント: 温かみのある手書き風の日本語文字にする。
   - 文字色: 黒。

3. テーマ：キャラ『いかずきんちゃん』。日常の会話を動くいかずきんちゃんのスタンプを使って表現。シュールに動くアニメーションでトークを癒やします。

# 入力フォーマットの読み方
ユーザーからは、以下の形式で40種類のアイデアの中から1つずつ指示が出されます。

【 セリフ ↲ セリフ ※ 動作や着ぐるみの指定 】
- 「※」の前：頭上に配置するセリフ文（「↲」がある場合は、そこで改行し2段で表示する）
- 「※」の後：キャラクターの見た目、着ぐるみの種類、動作、表情の指定


アニメーション用指示（例）
1 おはよう
おはよう※朝日に向かって触手を伸ばして伸びをする。
①目をこすりながら立つ
②触手が上にぐーっと伸びる
③イカの頭の先もつられて上に伸びる
④口を大きく開けてあくびをする
⑤ピアノのヘアピンがキラッと光る
⑥触手がだらんと下がる
⑦鍵のネックレスが揺れる
⑧最初に戻る

このように表記するので、静止画での作成方法を維持しつつ、⓵～⓼は動きを付けるようにして、変化させて。その際のセリフ文字は完全固定するために、座標単位で位置を完全に同一固定すること。ただし、必ず手書き文字のフォントにすること。

また生成の際は直前の画像を参照すること。例えば、⓶の生成時は⓵で生成したときの画像を参照し、連続性を意識すること。→極端に違う場面にしてしまうと繋げたときにカクカクしてしまうのを防ぐため。

アニメーション用プロンプトにおける最大のポイントは以下の2点です。

  1. セリフ文字の完全固定：
    1コマ目（①）から最終コマ（⑧など）まで、頭上のセリフ文字は「座標単位」で完全に同一位置に固定するよう指示します。

  2. 直前画像の参照（連続性）：
    ②のコマを生成する際は①の画像を、③を生成する際は②の画像を参照させ、「連続した動き」であることをAIに強く意識させます。

静止画では全く気にしなかった項目ですが、これを怠ると「ガタガタと文字がブレる」「急にデザインが変わる」といった放送事故が起きます。

この手法を試行錯誤して見えてきた「利点」と「欠点」は以下の通りです。

【利点】

  • 文字に目が散らない： セリフの位置が固定されているため、ユーザーはキャラクターのシュールな動きそのものに注目しやすくなります。

  • アニメーションの破綻防止： 連続性を担保することで、コマとコマの間の違和感が減り、スタンプとしての完成度が上がります。

【欠点】

  • 文字デザインの硬直化： 座標固定を厳密に指示すると、AIが手書き風フォントの揺らぎを捨ててしまい、テキストが固い活字のようなフォントになりがちです。

  • 画質の劣化（スタイルドリフト）： 直前の画像を参照し続ける（伝言ゲームをする）性質上、コマが進むごとに細部の描写が崩れたり、画質が劣化しやすいというAI特有の弱点が出ます。

色々と課題はありますが、これらの条件をコントロールして生成し、まとめた素材がこんな感じです。

１シリーズに8枚のカット
２４シリーズ

3. Google AI Studioで「APNG化」ツールを構築。「できたようで、できていない」壁の到来

素材が揃ったら、次はこれを動く形式（APNG）に変換します。
今回も手作業は避け、Google AI Studioの自作アプリ（仕様書）にAPNG変換の項目を追加アップデートしました。

APNG（動くスタンプ）自動生成ツールの追加。
入力画像は、1254×1254pxの画像の入ったZIPファイルとし、背景透過処理→270×270pxにリサイズ処理→任意のアニメーション再生設定に準じてAPNGの生成→出力。を一発で実現できるツールの生成。
APNG出力時、ループ回数エンドレスを禁止。設定したループ回数のみしかしないようにする。
APNG自動一括生成の出力ファイルの名前について、ZIPファイルの名前と同じになるように変更すること
APNG自動一括生成について、アップロード時、ZIPファイルの中にZIPファイルが入っていた場合、最小単位のZIPファイル（階層が一番深いZIPファイル）を処理の対象として扱うこと。
出力時は、処理を行ったZIPファイルの分だけAPNGを生成すること

これで、静止画の時と同じように素材を投げ込めば、背景を透過しつつAPNGとして書き出してくれるシステムの完成です！
※`main`画像（240×240）もAPNGにする必要があるため、それ専用の出力ルートも組んでいます。`tab`画像は静止画で良いので前回のツールを流用しました。

⚠️ ここで注意！APNGの罠

① プレビュー環境の罠
Windows環境の方、要注意です。出来上がったAPNGファイルをデフォルトの「フォト」アプリで開いても、静止画のままで動いてくれません。
APNGが正しく動いているか確認するには、ファイルを右クリックし、「プログラムから開く」→「Google Chrome」などのWEBブラウザを選択して表示させる必要があります。

GIFです。APNGではありません
GIFです。APNGではありません

（※ちなみにこの記事の冒頭に貼った画像は、noteの仕様上APNGがうまく表示されなかったためGIFで代用しています。GIFで背景透過させると輪郭に白い残像（ジャギー）が残りやすいので、LINEスタンプ本番の提出には必ずAPNGを使いましょう）

素材が揃ったら、次はこれを動く形式（APNG）に変換します。 静止画の時と同じように、Google AI Studioに指示を投げて「連番画像を背景透過してAPNG化するツール」を作成しました。出力までは無事に終了。ローカル環境でのアニメーション再生も確認できました。

意気揚々とLINEクリエイターズマーケットにアップロードしてみると……

弾かれる。
「あれ、おかしいな？ APNG化は確認できたのに、なぜ？」

そこで頼みの綱として、ChatGPTのAIエージェント機能「Codex（Advanced Data Analysis）」にエラーファイルを見せて聞いてみました。「これなんだけど、どうしてアップロードできないの？」と。

対象のAPNGファイルを解析して彼が出した答えは……
**「ループ設定が0（無限ループ）になっています」**

いやいや、そうならないように（上限をつけるように）AI Studio側に指示したよ！ 一時的なエラーかと思い、もう一度「ループ設定」について強く伝えてアプリを再生成し、検証を繰り返しましたが、結果は同じでした。

ここで一つの仮説に辿り着きました。
『APNGのメタデータ（ループ回数）の厳密な制御は、現状のGoogle AI Studioで手軽に制御できる範囲を超えているのではないか』

何でもできると思っていたAIツールにも、ギリギリできないラインがある。これはクリエイターとして非常に大きな、そして面白い発見でした。

4. Codexの底力。3つのツールを巡るリレー

では、無限ループになってしまったこのファイルたちをどうするか。 そのままCodexに泣きついて「ループ回数を修正できる？」と聞くと、「できるよ」とあっさり修正版を出力してくれました。 Codexが「4回ループ固定」に書き換えてくれたAPNGファイルをアップロードしたところ、見事にLINE側のシステムを通過！無事に登録することができました。

終わりに：全自動化に向けて

結果として今回のワークフローは、

1. ChatGPT (画像生成)
2. Google AI Studio (背景透過・APNG化)
3. Codex (ループ回数制御のエラー修正)

という、3つのツールを跨ぐことになりました。
３つのツールを使用ため、効率化としては微妙なラインかもしれません。しかし、Codexの「ファイル解析と直接修正」という恐ろしいほどのポテンシャルを知ることができたので、この経験は次に大いにイカせるはずです。

アニメーションスタンプの第一作目ということで、なんとか形にはなったものの、「AIに意図したアニメーションを作らせる」という点ではまだまだ改善の余地があると感じています。

ただ、AIの進化スピードを考えれば、近い将来「上手に指示を出せば、アイデア出しからAPNGパッケージの完成まで一瞬で終わる」時代が来るのは間違いありません。

これからも技術の波に乗り遅れないよう、そして「みゆ」の様々な表現を広げていけるよう、試行錯誤を続けていきたいと思います！

最後までお読みいただき、ありがとうございました。
いかずきんちゃんのリリース、楽しみにお待ちください！

いいなと思ったら応援しよう！