ＬＩＮＥアニメーションスタンプ作成の流れ
こんにちは、サラです。
今回はLINEのアニメーションスタンプを作成するためのソフトの紹介と、プロセスの記録になります。
LINEは今では沢山の人が使っているコミュニケーションツールですよね。
スタンプを使うと、自分の感情をより楽しく相手に伝えることが出来ます。
クリエイターの人であれば、自分も作ってみたいな・・・と思ったことがあるのでは？
サラも数年前からLINEのスタンプを作ってみたいな・・・・と思っていました。
それも、静止画のスタンプではなくて、アニメーションで！！
そのために使用するソフトはAdobeの
Illustrator（イラストレータ）とAnimate（アニメイト）
また、フリーソフトの
アニメ画像に変換する君（無料）です。
◆【コンセプト】は、
「誉め言葉」や「ねぎらいの言葉」で、大切な人の自己肯定感を上げる。
◆【ユーザー対象（ペルソナ）】は、
人を褒めて伸ばしたい人。対象年齢は問わない。
◆【デザイン要素】は、
サラの水彩画のモチーフ、「花」と「蝶」。変化後「朱印」
手順１）Illustratoでアニメーションにする素材を作成する
ＬＩＮＥのアニメーションスタンプの秒数は最大４秒。フレーム数は最大２０枚。という規定があります。
なので、イラスト制作ソフトのIllustrator（イラストレーター）で作成するにあたって、
パラパラ漫画を作成するノリで、レイヤー数（コマの枚数）を２０枚としました。
アニメーションを作成するのであれば、最初からアニメーション制作ソフトを使うという方法もありますが、きれいなデザイン（デフォルメやシンボライズ含む）のものを作成しようとすると、画像（イラスト）の段階ではillustratorで作り、後でアニメーションソフトに取り込む方法が最善だと思います。
桜の花に限らず、花は回転ツールを使うと早く出来ます。
1つだけ花びらを作って、３６０度を５枚の花びらで割ると７２度。なので７２度でコピーを回転させると、あっという間に出来上がり！
また、蝶々などの左右対称のキャラクターはリフレクトツールを使うとバランスよくデザインできます。
参考）素材を集める。実物をスケッチしてデザイン化する。
「たいへんよくできました」印の元になっている桜の花は、実際の桜の花を摘んできて、簡単にスケッチした後、それをレイヤーに取り込んでデザイン化しました。
実際に花が手に入らない時は、ネットで写真やイラストなどを集めて、そこからデフォルメして、美しい線、美しい形を探っていくのもおススメです。
▼追記。初心者の方へ。
イラストを描くソフトは他にも沢山ありますが、サラの場合は、Adobe社のソフトをデザインの仕事などで利用しているので、作品作りにおいては、Adobe系のソフトで統一しています。
今は誰でもイラストを描いたり、写真や動画作成をしたり出来る時代です。
無料ソフトなどの利用もできますが、写真や動画編集などにも興味を持っている方、クリエイティブな仕事で作品を作りたい方は、最初からAdobe社のソフトを学ぶのがおススメです。
プロの方も使っているソフトなので敷居は高く感じると思いますが、Adobe系のソフトで統一しておくと、イラストなどの素材の流用がスムーズです。
１つの静止画イラストを、アニメ化したり、動画素材に使ったり・・・と拡張することで別の作品に作り変えることもできます。
また、互換性の面からも問題が起こりにくいという点でもおススメです。
１カ月間の無料お試し期間があるので、気軽に学んでみるといいですよ。詳しくはネットで調べてみて下さい。
手順２）Animateにイラスト素材を読み込みアニメ化する。
アニメーション制作ソフトAnimate（アニメイト）を立ち上げて、Illustratorで作成したイラスト（20枚）を読み込みます。
その後、タイムラインという時間軸パネルに、静止画イラストを並べて、アニメーションを作成します。
それに加えて、ここでは、「トゥイーン」という機能を使いました。
これは、動きをつける時に、よりスムーズな動きになるように、コンピューターに計算させて自動排出で動きのあるコマ（フレーム）を作り出してくれる便利な機能です。
ここでは、桜の花をパラパラ漫画風にフレームに並べ、蝶の動きを「トゥイーン」で作成しました。
トゥイーンにはモーショントゥイーンとクラシックトゥイーンの 2 種類があるので、用途によって使い分けます。
Animateのタイムラインの概念は、動画編集ソフトのPremiere Pro（プレミア プロ）やAfter Effects（アフターエフェクツ）にも通じます。
Adobeのソフトを１つ学ぶと他のソフトも理解しやすくなります。
また、サラは水彩画でも「透明感」を表現することに心地よさを感じます。
今回のスタンプ作成においても八重桜の花が 「たいへんよくできました」の朱印に変化する時に、透明感を伴った、ふわりの心地よさを感じて欲しいな・・・と思いエフェクト（効果）を付けました。
手順３）PINGファイルで書き出す。
タイムラインで制作したフレーム（コマ）をPNGファイトで書き出します。PNGはイラストを描き出す時のよく使われる形式です。
LINEのアニメスタンプは、最初のコマに完成されたイラストが出るので、最初のコマと最後のコマのイラストが同じになります。
規定通りの２０枚のイラストで完成です。
手順４）PINGファイルを APNGファイルに変換する。
PNGで２０枚のファイルを制作した後に、重要なのがAPNGファイルに変換し、
１枚のファイルにすること！
LINEのアニメスタンプは、このAPNGで納品するのが規定となっています。
そこで活躍するのが
アニメ画像に変換する君（無料） というソフトです。
このソフトの使い方は以下のWebページで詳しく解説していますので、
アニメーションスタンプを作成したい方は以下からアクセスしてみて下さいね。
▼ アニメ画像に変換する君（無料）↓↓
https://ics.media/entry/12746/
このソフトでAPNGの作品が出来上がります。
それをＬＩＮＥのクリエーターズマーケットにアップロードすると完了です。
まとめます。
手順１）Illustrator（イラストレーター）でアニメーション用イラストを作成。
手順２) Animate（アニメイト）にイラストを読み込んでタイムラインで構成。
手順３) PNGファイルで書き出し。枚数２０枚。
手順４) アニメ画像に変換する君（無料） というソフトでPNGファイルをAPNGに変換。
以上です。
Illustratorを使わず、Animateでイラストを描く方法をおススメしない理由は、
AIファイルで保存した作品の場合、今回のアニメーションスタンプという作品だけでなく、素材としても売れる作品になるからです。
サラは、今回のアニメーションスタンプの前段階のAIイラストを、
素材として、以下の３つの素材提供サイトにアップロードしています。
１）Adobe・stock（アドビストック） Adobe製品を作っている会社。
２）Sutter・stock（シャッターストック）世界最大級の素材提供会社。
３）PIXT（ピクスタ）日本で最大級の素材提供会社。
自分の作品を１度アップロードしておけば、そのイラストや写真がダウンロードされるたびに、収入になります。ある程度まとまった金額になれば、自分の預金通帳に振り込まれるシステムです。
サラは水彩画作品もデジタル化してアップロードしています。
▼以下は、シャッターストックでの購入者情報です。
世界地図が表示されていて、購入者がドットで示されます。
▼ピクスタの購入者画面
なにか作品を作る時は、そのプロセスでの成果物（ここではIllustratorで作ったイラスト）も、自分の作品としてどこかに提供できるかも・・・と考えてみて下さい。
デザインなどの仕事をしていると、上質な「素材」を提供してもらえるのは、とても有難いものです。
自分が作成し、アップロードしたイラストが、誰かの役に立っているのは嬉しいですよね。その上、収益としても制作者の自分に返ってくるのですから・・・二重に嬉しくなりますね。
