Android用𓅿𓈒𓂂𓏸アニメーションスタンプ＆絵文字の作り方

３月１７日。何故か記事が消えてしまいましたので、少し直しました。悲しい…。でも、手順は分かるように復旧してるので、良ければご活用下さい★

こんにちは。

初心者LINEスタンプクリエイターの茶碗蒸しモイ子です。

この記事では『 Androidスマホユーザー向けのアニメーションスタンプ、アニメーション絵文字の作り方 』を書きたいと思います。

今回この記事を書こうと思ったのは、わたしがAndroidユーザーだからです。

と、言うのもiPhone用の『アニメーションスタンプの作り方』は沢山あります。

何度も挑戦はしてみたものの、アプリがAndroid非対応だったりと、正直アニメーション作品は諦めていました。

しかし、今回何人かの方に教えてもらいながら模索しつつ１つの作品を完成させることができたのでここに書き記して誰かの役に立てればと思いました。

完全に私独自のやり方なので、もっと上手にできる方いらっしゃったらご指導お願いします🙏

★用意するもの★

☾ ibisPaint ☽

https://play.google.com/store/apps/details?id=jp.ne.ibis.ibispaintx.app

お絵描きアプリです。わたしはibisPaintでしたが、他に愛用されているものがあればそちらで構わないと思います★

☾ APNGメーカー☽

https://play.google.com/store/apps/details?id=jp.skapp.apngmaker

アニメーション化するアプリです。

詳しいことはわからないのですが、LINEスタンプやLINE絵文字にするにはAPNG(エーピング)という画像形式にしないとならないのです。

☾ LINE Creators Market ☽

ここからLINEスタンプや絵文字を申請します。

LINE Creators Marketは説明サイトや動画も他に沢山あるので割愛します🙏

●作ってみましょう●

イラストを描くところやアニメーションにするイラストを複数用意するところまで解る💡という方もしばしお付き合い下さいね。

⚠注意事項です⚠

ガイドライン - LINE Creators Market

⬆こちらにしっかり書いてありますが、わたしが特に大事だと思うことを少し書き出しますが、全てしっかり読んだほうが良いです⚠

①アニメーション用に用意した複数枚のイラストの最初の１枚目が静止画になります。

複数枚設定した最後のシーンが静止画になるわけでは無いのでご注意!!!!

更に

静止画になる１枚目のコマと類似するコマ(１枚目になっているもの)が同パッケージ内に複数あるとリジェクトの対象になります!!!!

忘れがちなので気をつけましょう。

②アニメーション画像を300KB以下に抑える

これはアプリでやってみないとわかりませんので、うまくいかない場合はそこも確認してみて下さい。

③アニメーションは１〜４秒ぴったりで作らなければなりません。

1.5秒や半端があるとエラーになってしまいます。ぴったり１〜４秒で作ります。

わたしが苦労したのはこの辺でしょうか…。

人それぞれだとは思いますが、注意事項はしっかり読んで作ったほうが二度手間を防げます★

●早速作ってみましょう●

①イラストを描く

ibisPaintで基本のイラストを描いていきます。(ibisPaintの使い方は割愛します🙏)

このイラストを３つの動きを入れて動かしてみます。

②アニメーションにしたい画像を複数枚用意する

わたしはレイヤーを使い透過して、少しずつずらしてアニメーションにする手法を取っています。

『まばたき』も途中に加えました★

ここまで来たら１枚１枚順番に𓊆 透過PNG保存 𓊇していきます。

繰り返しますが最初のシーンが静止画になります。

保存した画像を今度は☾ APNGメーカー☽に落としていきます。

③保存した画像をAPNGメーカーに取り込む

アプリを開くと…

この様な画面が出てきます。

まずは画像を取り込むために下の方の『画像』を選択します。

最初探すのがちょっと大変ですが、私の場合なぜかここの一番下に新規登録されます…

少しだけスクロールした⬇の所…

みなさま探してみて下さい。

(すみません、自分自身で描いたイラスト以外はボカシてます。)

保存した画像を順番に選択します。

選択したら下の『追加』を押します。

このまま登録しても『１秒ぴったり』『２秒ぴったり』『３秒ぴったり』『４秒ぴったり』になりません。

画像の☾ ディレイ☽を操作します。

…すごく申し訳ないのですが、このディレイの考え方は独学でここまで来てしまった為、間違えがあるかもしれません。

しかし、エラーにならないように作成することが出来るので問題はないはずです!!!!(本当にすみません)

1/60秒

ぴったりにするにはここをトータルで60/60秒にする必要があります。

1/60秒　1/60秒　1/60秒　1/60秒　1/60秒

1/60秒　1/60秒　1/60秒　1/60秒　1/60秒

画像は１０枚あるのでそれぞれを6/60秒にすれば

6/60秒　6/60秒　6/60秒　6/60秒　6/60秒

6/60秒　6/60秒　6/60秒　6/60秒　6/60秒

トータルで60/60秒になります★

なので

こうすることで

全て6/60秒で統一されました★

数字を合わせた後は下の▷を押します。

絵文字であれば180×180のまま『オフ』を押します。

スタンプなら320×270のまま『オフ』を押します。

(⬇画像の数値が違うのすみません…)

そして、透過します。

ここまで来たら保存するだけです!!!!

シンプルに言えばここで完成です。

完成ですが、この状態では一定のリズムのアニメーションです。

もちろんアニメーションによっては一定のリズムが可愛い場合もありますが、ディレイの調整で、スピードにメリハリを付けたアニメーションや工夫次第で２コマアニメーションを作ったりできます。

○APNGメーカー応用編○

①スピードの調整

スピードは秒数でも変更できますが、60/60秒を倍の120/60秒にすることで更にゆっくりな動きにすることができます。

②動きにメリハリのあるアニメーション

それぞれのコマの秒数を変えて、合計60/60秒になれば少し動きのある動画になります。

1/60秒　3/60秒　3/60秒　3/60秒　30/60秒

30/60秒　3/60秒　3/60秒　3/60秒　1/60秒

これでも合計値を60/60秒にすることができます。

コマに対応した所がアニメーションでは長くなったり短くなったりするので仮にステップを踏んだりするアニメーションだとしたら躍動感が出てとっても面白いです★

１コマ目が静止画になるので、最後のコマを頭に入れなければならないのでこの考え方で1コマ目を１秒に設定すれば、さほど気にならずに画像を入れ込む事が出来ます。(最後のシーンで秒数調整して、その１秒を誤魔化します)

やり方は、開始コマと終了コマの秒数を個別に設定することができます。

例で言えば、画像⬇だと個別に１コマ目と２コマ目を10にするという設定が出来ます。

③２コマアニメーション

注意事項にあるように

１つのアニメーションを作るには画像を５枚〜２０枚用意する必要があります!!!!

⬇のように、大小の２コマアニメーションを作りたい場合、２枚の画像を…というわけにはいきません。

大３枚、小３枚、計６枚の画像保存します。

そして、APNGメーカーに画像を移します。

このように同じ画像を繰り返す事で、２コマアニメーションを作ることが出来ます★

おっと!!!!!!

大切なことを書き忘れてしまいました。

●ループ回数の調整●

です。

LINE Creators Marketに登録する場合、たまにエラーになることがあるのですが、実は

ここがループ回数の調整です。

画像サイズにより変わると思うので、はっきりとは言えませんが、わたしは２〜４ループで上手く行きました★

せっかくなら４秒目一杯使う動画にするために自分でカウントしながら『１〜４ループ』で調整しながらやってみるのもいいと思います♡

もしLINE Creators Marketに登録してみて時間が合わないとエラーになった場合はこちらを調整してみてくださいね。

④LINE Creators Marketに登録する

アニメーションが完成したらいよいよ登録です。

LINE Creators Marketへの登録方法は申し訳ありませんが割愛します🙏

他のサイトでもっと詳しくあったりするからです★

登録完了したら、いよいよ申請です☆

さて、アニメーションスタンプ、絵文字を作る上で必ずぶち当たる、もう１つのハードル『エラー』のご紹介です。

出来たら出会いたくないですが、出会った時に何が悪いのかを知っておくと対処が簡単です☆

エラー✘一覧

さぁ、いよいよ登録!!!!

となったときに弾かれてしまう悲しいエラー。　

どこが悪いのか見極めて、すぐに対処しちゃいましょう!!!!

⬇こちらエラーもなく登録できた場合♡

すんなり行くと嬉しいですね。

①APNGメーカーで300KB以上になってしまった場合に出るエラー

②APNGメーカーで使うアニメーションイラストが４枚以下、２１枚以上になってしまっていた場合に出るエラー

③同パッケージ内に同じアニメーションが既に登録されている場合に出てくるエラー

④APNGメーカーで作ったアニメーションかの秒数が規定に合わなかった場合に出るエラー

これはループ数の調整や、ディレイの見直しですぐ直せると思います★

以上、ここで書いたエラーは表示されて分かりやすいのですが…

最初の１コマ目が同パッケージ内に重複してしまった場合のエラーはリジェクトされないとわからないのでご注意くださいね!!!!

●最後に●

今回初めてのアニメーション絵文字を１週間くらい掛けて試行錯誤作り完成することができました*:ﾟ☆.

正直、もう作らないって思いました…

初回から１つのアニメーションにイラストを１２枚〜２０枚位使ったりしてたせいだと思います…

しかし、申請していざ承認されたものを見ると…

感動!!!!!

とにかく感動。そして振り返ってみると

めっちゃ楽しい!!!!また作りたい!!!!

最終的には

大変だったからこそ、すごく思い入れのある作品になりました♡

とっても大変ですが、これからも作り続けるんだろうなーって思っています。

このnoteが少しだけでも、私のようにアニメーションスタンプや絵文字を作りたいけど作れなかった人の役に立てればいいなと思っています。

長文読みにくかったと思いますが、お付き合いありがとうございました*:ﾟ☆.

茶碗蒸しモイ子の作品はこちらです𖤣𖥧𖥣𖡡𖥧𖤣

https://store.line.me/emojishop/author/4540219