見出し画像

ChatGPTの1枚絵から、動くLINEスタンプを作る完全手順

ChatGPTでキャラ画像は作れても、動くスタンプで手が止まる理由

ChatGPTで気に入ったキャラクターができた瞬間って、けっこうテンション上がりますよね。

「これ、LINEスタンプにできそう」って思う人、多いと思います。

しかも今は、静止画だけじゃなく「動くスタンプ」も普通に作れる時代です。

同じキャラクターでも、動いたほうが目立つし、静止画スタンプより圧倒的に数が少ないから選んでもらいやすい。 だったら動かしたい、と考える人も増えているはずです。

でも、そこからが問題なんです。

このキャラを動くLINEスタンプにしたい」と思っても、作り方がわからず止まる。

作り方がわかっても、どのルートが効率がいいのかわからない。

実は私もそうでした。

普通の静止スタンプなら、1枚の画像がそのまま1個のスタンプになります。作って、切り抜いて、申請するだけです。

でも動くスタンプは仕組みがまったく違います。


少しずつポーズが違うコマを何枚も用意して、背景を透過して、申請用のAPNGというファイル形式で作る必要があるんです。
ただの「動きそうな画像」を作るだけでは、完成しません。

じゃあAI動画を使えばいいんじゃないか、と考える人もいると思います。私も最初はそっちを検討しました。 でも、正直言うと動画生成には別の壁があるんですよね。

まず、お金がかかります

無料枠で作れる動画の本数はかなり少なくて、1本の動画から1個のスタンプしか作れないとなると、正直割に合いません

アニメーションスタンプは1セット8個・16個・24個の3種類。 1動画1個のペースだと、あっという間に無料枠を使い切ってしまいます。

じゃあ1枚の画像に16マスのグリッドを並べて、まとめて動画にすればいいんじゃないか。そう思って試したこともあります。

動画から切り出しているところ

でも今度は、各マスのスタンプごとに動きをコントロールするのが難しいんです。 ある1マスだけ動きを直したいのに、他のマスまで一緒に崩れてしまう。 結局、思った通りの動きに仕上げるのは無理でした。

つまり、AI動画生成はコスト面でもコントロール面でも、動くスタンプ作りとはあまり相性が良くないんです。

ここで発想を変えました。

動画を「生成」するのではなく、静止画のコマを「並べる」ほうに寄せる。

動画も動くLINEスタンプも、実は同じ構造です。

たとえば、今話題のSeedance2.5で作った実写と見分けがつかないようなAI動画も、スマホで気軽に撮影した動画も、動くLINEスタンプも、画像を1枚1枚順番に見せているだけなんです。

だから、静止画で1枚ずつ、パラパラ漫画のように動きが違う画像を用意すればいい

そして、1枚1画像じゃなくても、1枚のに複数画像でも作れる。

つまり、スプライトシート(少しずつ状態の違うコマを並べた1枚絵)から動くスタンプを作る方法です。

この方法なら、動画生成のようなコストもかからず、コマ単位で動きを調整できるので、ハードルもコストもだいぶさがります

そこで今回、2つをセットにした制作環境を作りました。 動くスタンプ向けのスプライトシートを作る専用GPTsと、そのスプライトシートを申請用データに仕上げるアプリ「うごかし君」です。

ちなみに、このGPTsとアプリを使わず、ChatGPTだけでアニメーションスタンプを作る方法もお伝えしますので、今すぐこの記事をブックマークしておいてくださいね。

このGPTsとアプリで作った柴犬のアニメーションスタンプは、LINE Creators Marketの審査を通過して、現在販売中です。

公開後には、実際に1件購入していただけました🎉✨

売れたのはまだ1件です。 それでも、自分で作った動くスタンプを、知らない誰かがお金を払って選んでくれた。 この1件はかなりうれしい出来事でした。

柴犬スタンプ:

https://store.line.me/stickershop/product/35139767/ja

この記事では、キャラクター画像からスプライトシートを作り、動くスタンプへ仕上げる流れを、実際にやった手順のまま紹介します。

本文へ行く前に、こちら ↓ もチェックしてね!

やよい公式LINEにご登録で、今回紹介したスプライトシート作成専用GPTsと「うごかし君」セットを、割り引き購入できるURLをご案内します(準備ができ次第)

忘れないうちに今すぐ → https://x.gd/7LhhB


第1章:画像生成でスプライトシートを作る

動くスタンプの元になるのが、スプライトシートです。

少しずつ状態の違う画像を並べて、パラパラ漫画のように順番に表示することで動いているように見えます。
昔、教科書の隅にパラパラ漫画を描きましたよね?あれと全く同じです。

8コマ(フレーム)のスプライトシート

この「あつい〜」というスタンプでは、最初は汗が少なく、だんだん耳が下がり、汗が増え、舌を出すところまでを8コマで表現しました。

最初に画像生成したときは、短冊が激しく揺れるスプライトシートでした。
「そよ風に吹かれているように揺らして」と修正。

「風鈴いいね」では、柴犬の前で風鈴の短冊が左右に揺れる様子を8コマにしています。

完成したスプライトシートだけを見ると、ただの静止画のです。

でも分けて1枚ずつ順番に見ていくと、汗が増えたり風鈴が揺れたりする動きになる。 この「動きのコマ(フレーム)をどう作るか」が、動くスタンプ制作の最初の壁でした。

実は、ChatGPTに直接「このキャラでパラパラ漫画のように8コマで動きを描いて」と頼むだけでも、スプライトシートは出てきます。

ただこの指示だと、動きがおかしかったり、不要な動きを入れたり。 指示が短いとAI側も意図をくみ取れないんです。

スプライトシート専用GPTsは、「何コマで」「どの状態からどの状態へ変化させるか」「コマ間の変化量をどれくらいに抑えるか」といった、動くスタンプ特有の条件をプロンプトに落とし込んでくれます。

そのプロンプトでスプライトシート画像を生成する、という流れです。

生成結果に気になる部分があれば、動きや表情を伝え直して作り直せばいいんです。 完璧な1枚を一回で出すことより、実際に動かして確認できる素材をまず用意する。

これが最初のゴールです。

第2章:切り分け・透過→動くスタンプ(APNG)にする

スプライトシートができたら、ここから動くスタンプ作成のために制作した「うごかし君」というアプリの出番です。

うごかし君は、スプライトシートをコマごとに切り出して、LINE用の動くスタンプや絵文字を作るブラウザアプリです。

画像処理はブラウザ内で行われるので、読み込んだ画像を外部へ送信せずに編集できます。 キャラクターの画像って、地味に人に見られたくない試作段階のものも多いので、ここが自分の中では地味に安心できるポイントです。

使い方はシンプルです。

開発中のアプリ「うごかし君」

まず、スタンプ用か絵文字用を選び、「スプライトシート」画像を読み込みます。 続いて、画像に並んでいる列数と行数を合わせます。
今回の作例は4列×2行なので、8つのコマ(フレーム)として切り出します。

背景は自動で透過し、スタンプの背景を透明にします。
手動で1コマずつ透過処理をするのは地味に時間がかかる作業なので、ここが自動でできるのはかなり助かります。

ここまで進むと、それまで静止していたスプライトシートが、アニメーションとして再生できるようになります。

「うごかし君」の編集画面で再生

1枚の絵が動き出す瞬間は、テンションが上がるポイントです!

ChatGPTだけで作る方法は、第3章でお伝えしますね。

第3章:動かして初めてわかる「ズレ」を直す

スプライトシートの段階ではきれいに見えても、実際に再生すると気になる部分が出てきます。

キャラクターが左右に揺れる、動きが不自然、文字や顔の位置がずれる。

こういうのは、静止画を並べて眺めているだけでは気づけなくて、動かしてみて初めてわかるものなんですよね。

うごかし君では、切り出したコマを見ながら、コマの順番を入れ替えたり、キャラクターの位置・大きさ・回転を調整したり、必要なコマを複製・削除したりできます。

背景の抜け残りを追加で透過したり、文字や画像、手書きの装飾を加えることも可能です。

前のコマを薄く表示して位置を合わせる機能もあるので、「このコマだけ少し右にずれてるな」というのも視覚的に確認しながら直せます。

1コマずつ直すだけでなく、位置や大きさを全コマへまとめて反映することもできるので、全体をえてから、動かしたい部分だけを個別に整えると、作業がぐっと進めやすくなります。

最初の1コマも大切です。

LINEスタンプストアや、スマホのスタンプ選択画面では、動くスタンプの1コマ(フレーム)目が表示されます。

たとえば、何もない所からキャラが現れるスタンプなら、1コマ目はまっさらな何も無い状態ですね。このままではスタンプを選択する画面で真っ白で何もない状態に見えます。目的のスタンプが見つけられなくなります

1コマ目が点のように小さい、動くスタンプ。審査が通ったのでこちらも販売中です😅
https://store.line.me/stickershop/product/34875437/ja

スタンプショップでも、同じく真っ白な状態で表示されるはずです。(審査が通るかどうかわかりませんが…)
なんの、どんな絵柄の、なんという言葉が書かれているスタンプなのか、何も見えない。これでは渾身の動くスタンプでも売れることはないでしょう。

絵柄やポーズ、書いてある言葉など、なんのスタンプかわかるコマを1コマ目に置く。これはLINE Creators Marketの公式ガイドラインにも明記されています。

そして、動きがよくても、申請規格に合っていなければアップロードできません。
公式ガイドラインでは、アニメーションスタンプ1個につき5〜20フレーム、再生時間は1〜4秒の整数、ループを含む合計再生時間は4秒以内と定められています。
この規格を満たしているかも都度自分で確認する必要がありますが、うごかし君では再生時間とループ回数を設定でき、基本的には何も考えなくても規格に合ったスタンプになります。

さて、ChatGPTだけで動くスタンプを作るには、画像を添付して「PythonでLINEアニメーションスタンプ申請できるAPNGにして」と頼めば動くスタンプを作ってくれます。

意外と簡単でびっくりしますよね。

ただし変換に少々時間がかかるのと「apng」という拡張子になることが多いので修正が必要です。APNGの拡張子は「png」ですので、ダウンロード後に手動で拡張子を変更すれば大丈夫です。

で、実際にChatGPTが作った動くスタンプ(APNG)をLINE Creators Marketにアップロードすると、「申請できる形式」と指定したはずなのに、エラーで弾かれることがあります。

ループの指定なのか、1コマ(フレーム)の秒数なのか、ファイルサイズなのか、それともガイドラインには記載されていない細かい設定が違うのか… 自分で原因を突き止める必要があります。

ChatGPTでも動くスタンプ(APNG)はできる

仮にアップロードが通っても、動きがズレていた場合の直し方には限界があります。 位置や大きさを直すには、チャットで指示てはまた実行し直す、を繰り返すしかありません。

ドラッグして「あ、ここだ」と直感的に合わせる、ということができないので、細かく調整しようとすればするほど時間がかかっていきます。

「うごかし君」ではこの調整を手動で行います。

アプリと画像生成プロンプトである程度そろえているのですが、画像生成で前のコマと1ピクセルもズレずにピッタリ同じ位置と大きさで描くことができないため、キャラや文字は揺れたりズレたりします。

専用GPTsと「うごかし君」で作った、動くスタンプ(APNG)

でもこれが、いい意味で「アナログ感」というか「手作り感」になります。「AI感」が薄くなる。

とてもパラパラ漫画っぽいアニメーションスタンプになります。

公式ガイドライン:

https://creator.line.me/ja/guideline/animationsticker/detail/

第4章:申請から販売、そして1件の購入まで

調整が終わったら、申請用の動くスタンプ(APNG)を一括で書き出します。

申請するには、各スタンプに加えて、メイン画像(APNG)とタブ画像(静止PNG)というものも必要です。

この「メイン画像(APNG)」は、LINEストアでの看板になる重要な1枚です。
うごかし君ではスタンプ番号を指定するだけで簡単作れます。 必要なデータは、申請用ZIPにまとめられて、一括アップロードできます。

ひとつずつ手作業でファイル名をそろえたり、個別でアップロードする負担がなくなるのは、実際にやってみると思っていた以上にストレスが無くなります。

さらに、動くスタンプを動画(MP4)でも保存できます

いやいやAPNGだって動くんでしょ?
だったら動画にする必要ないよね?

って思いますよね。

動くスタンプのAPNGファイルは、環境によっては開いても動きを確認しにくいことがあるので、完成確認にはMP4のほうが扱いやすいですし、XやThreadsなどのSNSで制作例を紹介するときにもそのまま投稿できます。

動画で保存すると、いろいろ使いまわせて便利なんです

申請用ZIPを用意できたら、あとはLINE Creators Marketへ登録するだけです!

今回の「動く▶柴犬マロン暑い夏にやりたいこと」も、この流れで作成しました。

審査を通過し、現在はLINE STOREで販売されていて、公開後には実際に1件購入されました!

今回の事例で使った柴犬の動くスタンプ販売ページ:

https://store.line.me/stickershop/product/35139767/ja

大きな販売数ではありません。 それでも「自分のキャラクターを動かしたい」から始まって、制作、申請、販売、その先の購入までつながった1件です。

AI動画生成のようにコストを気にしながら本数を絞ることもなく、グリッド画像の動き制御に頭を抱えることもなく、完成データを作れるだけでなく、販売できる形まで持っていけることを確認できました。

最後に、今回の流れをチェックリストにまとめておきます。

動くLINEスタンプ制作チェックリスト

  • 元になるキャラクター画像を用意する

  • 動くスタンプ向けスプライトシートのプロンプトを組み立てる

  • 画像生成でスプライトシートを生成する

  • スプライトシートからAPNG(動くスタンプ)ファイルを作る

  • 実際の動きを見て、ズレ・不自然な動きをチェック&調整

  • 1コマ目に「スタンプの表紙」になるコマを置く

  • フレーム数・再生時間などがガイドライン(5〜20フレーム/1〜4秒/合計4秒以内)を満たしているか確認する

  • 申請用APNG・メイン画像(APNG)・タブ画像をZIPで書き出す

  • LINE Creators Marketへ申請する

ChatGPTでも、たしかに動くスタンプは作れます。

でも、コマの絵の繋がりを整えたり、ズレを直したり、申請エラーをつぶす作業には、地味に時間がかかります。

作る時間を短縮したい
毎回スプライトシート用プロンプトを書くのは正直しんどい
難しそうであきらめていた…

でも動くスタンプが作りたい!!!

と思った方は、ぜひ専用GPTsと「うごかし君」を使って、時短で動くスタンプを作ってくださいね!

ただいまリリース準備中です!!!

やよい公式LINEにご登録で、スプライトシート作成専用GPTsと「うごかし君」セットを、割り引き購入できるURLをご案内します(準備ができ次第)

今すぐ → https://x.gd/7LhhB


動かない方のスタンプ・絵文字の申請データを、AIを使わず爆速で作る「スタンプ切り出しくん」をお持ちの方は、切り出しくんユーザー様専用のめっちゃお得価格でご案内します。こちらは「ご購入者様専用オープンチャット」でお知らせをお待ちくださいね✨

うごかし君は、スタンプ切り出しくんの編集画面とほぼ同じです

覚えることが少なくていい!

動かない方の、販売中のLINEスタンプ・絵文字アプリセットはこちら!

==「スタンプ切り出しくん」ワークフローセット==

  • スタンプ切り出しくん(アプリ)

  • 絵文字切り出しくん(アプリ)

  • 映えチェッカーくん(スマホ画面シミュレータ

  • タグ管理マネージャー

  • タグ付けリスト作成GPTs

  • 申請お助けツール

  • 購入者様専用オープンチャット

PR

「スタンプ切り出しくん」をご購入いただくと、上記のアプリ・ツール全てが使えるようになります。
*画像生成は、アプリ内では行いませんので、ご自身でスタンプにしたい画像をご用意ください

アプリやツール内でAIを使うことはほぼない無いので、買い切りでずっと使用することができます。

パソコン、スマホ(iPhone・Android)、iPad、全ての環境で使用OK! (パソコン⇔スマホで同期はできません)

購入特典の画像生成プロンプトは専用オープンチャットにて随時配布しています。

「スタンプ切り出しくん」ワークフローセットはこちら


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