*

Spineでエフェクトって付けれるの?Spine使い倒して頑張ってみた!

公開日: : 最終更新日:2015/10/21 , ,

フーモアピクチャーズ技術部の遠藤です。

今回のテーマはエフェクトです。
UnityやCocosなどのゲームエンジン側で実装する事もできますが、
折角なのでSpineを使い倒してみましょう。

エフェクトの基礎知識、アニメの基礎知識

以前、fps(FramePerScond)について触れました。詳しくは過去記事をごらんください。
https://whomor.com/whomorpictures/?p=39

日本のTVアニメを例にしてみると、24fpsで製作されています。
製作環境が24fpsですが、実はほとんどの場合において24fpsだからと言って1秒間に24枚の絵をで描かれていません。
コスト的な理由も勿論あります。アニメ製作はコストとの戦いでもあり、(昨今、アニメ製作の劣悪な制作環境がニュースとして取り上げられることもありますね、、)24fpsでの製作環境においても全てのコマを作画していては、コストがかかりすぎるので、言い方は悪いですが極力手をぬいていくのです。
例えば、キャラクター自体は全く動いていなくても、レイヤー分けされている口だけをパクパクと動かせば、キャラクターが喋っているように見えるのです。
その場合、キャラクターの絵が1枚と、開いた口、半開きの口、閉じた口。
たった4種類の素材だけでキャラクターが喋っているかのようなカットを作成できます。

24fps

いわゆる、「リミテッド・アニメーション」です。

技術的な面においても、8fpsや12fpsで十分にアニメーションさせる事が可能な事もあります。なにより、8fps12fpsの作画を見慣れているわけですから、目で観て、十分ならそれでいいんです。逆に捉えれば、「このアニメは作画がすごい!」「すごく綺麗にアニメーションしている!」と思った時は、24fpsのアクションシーンや、細かい作画をしていると言うことですね。
Pixirに代表される3DCG映画などでは、フル・アニメーションになっていますし、
近年ではテレビアニメにも3DCGが多様されており、合成やエフェクトだけでなくキャラクターまでもが3Dで製作されている事もあります。機動戦士ガンダムUC、マクロスFなどのロボットアニメに代表され、作画では困難なフルフレームの激しいアクションなどを実現していますし、蒼き鋼のアルペジオ、プリキュアシリーズのOP、団地ともお、などなど。アニメにおいて最重要とも言えるキャラクターが3DCGで製作されている作品も少なくありません。

だいぶ話しがそれてしまいましたが、Spineを利用したエフェクト製作に戻ります。

エフェクトを製作するには

方法としては、ひとつしかありません。

「描く」ことです。

大友克洋監督の「AKIRA」と言う作品があります。
1985年公開で、この頃はまだCGと言うものが実用的ではなかったので、全てのエフェクトが人の手で描かれています。画面全体の情報量や、煙、爆発などに圧倒された方も多いのではないでしょうか。

エフェクト製作を補助するソフトもたくさんありますので、紹介します。

CELSYS RETAS!
whomorPicturesBlog_140620I
CLIP STUDIOやCOMIC STUDIOで有名なCELSYSのアニメ作画総合ツール。アニメの現場でもよく使われいるようです。

PSOFT ComicStyle
whomorPicturesBlog_140620H
AfterEffects用プラグイン。エフェクト製作を簡単に行える強力なツール群

CACANI
whomorPicturesBlog_140620G
作画の中割補間ソフト。HPに作例などが乗っていますが、面白そうです。

BISHAMON
whomorPicturesBlog_140620J
ゲーム用エフェクト製作用のオープンハウスツール。ゲーム製作の現場で研究されています。

他にも作画補助ツールなど様々なソフトウェアがありますので、また機会があったら紹介していきたいと思います。

とりあえず、Photoshop、SAIがあれば

色々紹介してみましたが、筆1本でも描けるんです。
描いてみましょう。
ツールはphotoshop、もしくはSAIでもいいですね
モアちゃんが背負っているロケット。ここから火を噴き出して空を飛びたいと思います。

whomorPicturesBlog_140620A

炎を3枚のイラストでサイクルモーションします。
whomorPicturesBlog_140620B

いい感じになるように、と言うのが一番難しいのですが、いい感じになるまで何度も挑戦しましょう。

気流

炎だけでは寂しいので、気流も描いてみます。コマの送りによってスピード感がでます。

whomorPicturesBlog_140620C

いい感じになるように。
エフェクト素材ができたらSpineに読み込みます。
Imageフォルダに入れましょう。

Spineボーンに関連付けし、位置を決めてこのような状態に。
whomorPicturesBlog_140620D

ここからキーを打っていきます。
イメージにキーを打つ際は、Treeメニューのスイッチを利用します。
一番左のスイッチをフレーム毎に切り替えます。

whomorPicturesBlog_140620E

1f1枚目
2f1枚目
3f2枚目
4f2枚目
5f3枚目
6f3枚目
7f1枚目
8f…以下コピー&ペースト

whomorPicturesBlog_140620F
と言った具合に「1フレーム抜き」のリミテッド・アニメーションにします。
キーを1フレーム抜くので、2コマ毎にキーを打つことになります。
Spineのシステムは30fpsですが、アニメーションは事実上15fpsになっています。

このようにして製作したエフェクト&モーションがこちら

それらしく見えますね。
ゲームでよく使われる斬撃や、炎のブレスエフェクトなども同様に作成できます。

結局は、デザイナーさんに描いてもらうしかないのですが、冒頭で紹介したソフトや、3DCGソフトなどを上手に利用してクオリティとスピードのバランスを取っていきましょう。

次回はエフェクトの続きと、モーションについてももう少し触れていきたいと思います。

フーモアでは一緒に働いきたいメンバーを募集しています。一緒に面白いコンテンツを創っていきましょう!!
その他お仕事のご依頼はこちらから

株式会社フーモア 遠藤 有
HP:https://whomor.com/
Blog:ソシャマノートブログ
書籍:MAYA LT 3D‐CG キャラクター講座 (I・O BOOKS) [単行本]

Comments

comments

  • このエントリーをはてなブックマークに追加
  • LINEで送る

イラストレーター大募集中!!

漫画家大募集中!!

イラスト制作依頼ならフーモア!

プロの漫画制作ならフーモア!

関連記事

icatch_animate

【Adobe Animate CC】デザイナー視点で使いやすくなった新機能を解説!

こんにちは、CG開発室のOTKです。 今回は、2016年に名称変更された「Adobe Anim

記事を読む

3_Synfig Studio1.0

今、注目のスプライトアニメーションツールSpineとSynfig Studioを比較してみた。

はじめまして、フーモアでスプライト系ツールを担当している吉村と申します。 趣味でMMDを触っていた

記事を読む

icatch

「Spine」の使い方をおさらいしよう!IKボーン入れ方講座

こんにちは、フーモアCG開発室のCGアニメーターです。 フーモアでは2Dアニメーションツール「Sp

記事を読む

0

最近注目されているUnityアセット、「Puppet2D」を検証してみました

フーモアCG開発室の遠藤です。 先日「Puppet2D」の書籍を執筆しました。これで3冊目の書籍と

記事を読む

whomorPicturesBlog_140901C

Live2D風モーション、Spineの限界に挑め part3~モデリングちょい足しレシピ~

フーモアDCCツール研究開発局局長の遠藤です。 隔月ペースの記事投稿になってしまいまして、不甲斐な

記事を読む

whomorPicturesBlog_140604D

Spineで2Dアニメーション制作には事前にイラストの仕様をしっかりと作らないと、手戻りに…

フーモアピクチャーズ技術部の遠藤です。引き続きEsotericSoftwareのSpineについて解

記事を読む

whomorPicturesBlog_140517B

これからはspine!?操作性のあるソーシャルゲーム向けキャラ制作のニーズに答えて使ってみた。その1「イラスト制作~スケルトン組み立て」

読了時間3分 初めまして、フーモアピクチャーズ技術部の遠藤です。ビジネス的側面から切り込んで行

記事を読む

whomorPicturesBlog_140523C

spineでキャラに命を吹き込め!アニメーションで個性を出す!その2「2Dにアニメーションを付ける」

フーモアピクチャーズ技術部の遠藤です。引き続きEsotericSoftwareのSpineについて解

記事を読む

whomorPicturesBlog_140901C

Live2D風モーション、Spineの限界に挑め~spineをLive2D風にしてみました~

ご無沙汰しておりました。フーモアDCCツール研究開発局局長の遠藤です。 7月11日からブログ記事が

記事を読む

MAblog_005

モーションコミックは流行るのか?「MotionArtist」さわってみた

CG開発室の遠藤です。   前回に引き続き SmithMicroSoftwar

記事を読む


  • 「おもしろいMANGAを創る」をビジョンに今までになかった新しい価値観を創造する会社。イラストや漫画制作のディレクター集団。
    お問合せはこちらからお気軽にどうぞ
  • ブログ最新記事とクリエイティブに役立つ情報を日々配信しています。

PAGE TOP ↑