【セミナー】Spineアニメーター向けイベント「Spiners MeetUp vol.1」レポート（提供：G2 Studios）

 


2020年5月15日、G2 Studios株式会社と株式会社ArtnerによるSpineアニメーター向けイベント「Spiners MeetUp vol.1」がYoutubeライブ配信で開催された。「Spine」はゲーム用2Dアニメーションソフトウェアとして、モバイルゲームを中心に広く採用されているツールだ。今回のような複数社が合同で行うイベントで、かつオンラインでの開催はSpine業界では初の試みとなったが、Peatixのイベントページには日本人だけでなく、海外からも多くの申し込みが集まり、当日も最大同時視聴者数100人を超える盛り上がりを見せた。


 
左： Artner 長沢 誠一氏
右： G2 Studios エマール 美咲氏

登壇したのは3DCGアニメーターとして業界歴23年のキャリアを持つArtner代表取締役の長沢 誠一氏と、G2 Studios 若手社員のエマール 美咲氏だ。両者とも、Spineが広く定着する前の時期からSpineを使用している。
各社の持つアニメーションの“こだわり”

はじめに、各社のワークフローの比較が行われた。まずArtnerの長沢 誠一氏による、Spineアニメーションの制作の受注から納品までの流れと、アニメーション制作においてこだわっているポイントなどの紹介が行われた。
まず、Artnerではイラストチームとアニメーションチームの2チームに分かれて分業していることや、アニメーションを制作する前には必ず動きのイメージを固めてから取り掛かる、という基本的なフローが紹介された。



 
また、アニメーション制作時には、「シルエットが大きく変わる動きの場合」と「シルエットがあまり変わらない場合」の2つのケースによってそれぞれ「ブロッキング」で進めるか、「レイヤードアプローチ」で進めるかを分類していると説明。



 
ブロッキングとは、まず主要なポーズ(キーポーズ)を作成し、タイミングなどところから始める手法のこと。分かりやすく、説得力のあるポーズ(シルエット)にすることを心がけているという。


 

レイヤードアプローチの場合は、まずベースとなる動き(例では上下にふわふわと浮く動き)を作成し、ベースから影響が大きい順に徐々に動きが伝わるようにアニメーションをつけていく。


 

具体的には、以下の6つの点に注意しているという。


 

リニアな動きになっていないか、また軌道が滑らかになっているかは、Spineのゴースト機能を使えば判別が容易になると解説した。



 
 
ゴーストを表示すると、正しい緩急がついているかが一目瞭然になる



 

また、力の伝わるタイミングが正しいかについては、再生速度をスローにして確認するという。スロー再生ならどこでズレが発生しているかがより分かりやすくなる。

▼スローにする前
 


▼スローにした後

 

次に、G2 Studiosのエマール 美咲氏からフローの紹介を行った。G2 Studiosでは主にアートチームというプロジェクト横断チームがSpine業務を担っているという。(一部を除く)

それから、社内チェックで見ていることとして、SDキャラでは第一に、キャラクターの性格を表現できているかを大事にしていると語った。G2 Studiosでは性格ごとの動きの差をあらかじめレギュレーション化してレビューしているという。


 

また、リアル頭身の場合には筋肉や骨格の繋がりの意識が重要であるという。口を閉じると顎全体が上がり、頬の位置も動くなど、動きの影響範囲に気を配る必要がある。


 

立体表現を使った走りモーション
次に、実際に先ほどのようなポイントを踏まえてどんなアニメーションを作っているのか？という実例が紹介された。Artnerからはこちらのキャラクターアニメーションを解説。


 

手前と奥で大きく動く手と足については、手前用、奥用でパーツを用意し、自然に見えるタイミングで切り替えている。


 

さらに切り替えを自然に見せるために、メッシュ変形により中間フレームを補間していると解説。


 

また、腕の前後の振りに合わせて袖口の変形を行っている。元絵ではまっすぐな袖口を、腕が手間に絵振られたら立体感に合わせて弧を描くように変形させている。


 

胸やスカートの立体感は、「出っ張る部分が大きく動く」ようにセットアップすることで作っているという。


 

全体的に、とても手間暇がかかっているように見えるが、実はスカートの「裏地」の部分は、素材を新たに描き起こしておらず、手前のスカートパーツを複製し、カラーで暗くすることで作成しているという。


 

こうした解説を聞いてから改めて最初のモーションを見ると、「走る」というシンプルな動きながらたくさんの工夫が詰まっていることがよく分かるだろう。



多方向を向けるセットアップ
G2 Studiosからは2Dアクションゲームの研究開発プロジェクトの例を紹介。多方向を向けるセットアップの事例が紹介された。



 
各方向を切り替えるアニメーションを作成し、その中にスロットの表示/非表示の情報を記録し、アニメーション制作時にそこからキーをコピーして制作していると解説。

また、武器などは特定のボーンの子ボーンにせずに「トランスフォームコンストレイント」を使用して各方向の手の位置に合わせて移動させて流用しているという。


 

こちらの研究開発プロジェクトについてはG2 Studiosのブログhttps://note.g2-studios.net/n/n6c639dfec920でも紹介されているので、詳細はこちらを見てほしいと語った。


各社が思うSpineの良さと、工夫している点
次に、vol.1のテーマの１つでもあるディスカッションが行われた。ArtnerとG2 Studios、両社社員のアンケートにより決定したテーマに沿って、様々なことを取りあげて語り合った。本レポートではそのやりとりの一部を紹介する。

・Spineを使うメリット/デメリット
エマール 美咲氏(以下、エマール)：私としては、Spineはすごく「速い」というのが一番メリットになっています。私も少し3DCGツールとか動画編集を学んでいたので、色んなアニメーションツールも触ってきたのですが、Spineが一番「とりあえず動かす」が出来るまでが速いと思います。

長沢 誠一氏(以下、長沢)：そうですね。うちのスタッフもやっぱり3Dと比べても軽いなぁというのがあるので、それがメリットになるのかなということと、3Dだとモデリングが必要なんですけれど、Spineだと絵をそのまま動かせちゃうというところがやっぱりメリットだなと思います。

エマール：では逆にデメリットについて長沢社長からどう思われますか？

長沢：やっぱり3Dと比較してしまうんですけれども、3Dのように360度ぐるっと回転するってことができないのが、デメリットになるのかなと思いますね。

エマール：うーん、デメリットはやっぱりそういう制限はどうしても生まれるというところですかね。

長沢：まあそのデメリットの中でもどうやって表現していくかというところが面白いかなと。先ほど走っているアニメーションのところでも手の切り替えとかやっていたんですけれども、振り返りのアニメーションもやったことがあるので、そういうのもやろうと思えば出来ちゃいますけどね。

・どのくらいのスピード感で作っているか
エマール：私の場合は、SDキャラは1日でセットアップして、歩くとか簡単なアニメーションであれば30分～1時間くらいで作れる感じでやっています。ワークフローで出した卵商人の絵画については、セットアップが1日で、動かすのは2時間くらいとかでした。

長沢：Artnerでもセットアップは大体1日くらいかかります。スペシャル技とかになってくると3日ほどかかる場合もあります。振り返り、背中見せて前見せてというセットアップだと時間がかかりますね。ただ単に攻撃するとかだけだったら1日か、1日もかからないくらいの場合もありますね。結構幅はあります。

エマール：やっぱり何を作るかによるっていうのはあるかと思いますが…でも、１つのアニメーションに対して1週間2週間かかるというのは、あまり無いですよね。

長沢：そうですね。

・作業効率化のためにやっていること
エマール：私の方でいうと、例えばArtnerさんのワークフローで紹介されたレイヤードアプローチで作る場合にはSpineの「オフセット」機能を使うと簡単に作れまして、まずザッとタイムラインの揃ったキーを打ちまして、別アニメーションで複製をして、そこからオフセットでガーッとずらしていくというようなことをしています。そうするとふわふわした感じのアニメーションはあっさり作れるので、そんな感じで機能を使っていますね。

長沢：弊社でも基本同じような感じなんですけれども、たとえばボーンの表示とかで右側は赤にするとか左側は青とかにして、選択するときに迷わないように色分けを使って効率化しています。あとは人によっては予備動作をカーブの編集だけでやってしまう人もいますね。

エマール：あー！カーブを少し突き抜けさせて…。

長沢：そうですね、ちょっと突き抜けさせて…というのをやる人もいます。

エマール：これを聞いてカーブが頭に思い浮かんだ人と、浮かばなかった人がいるかもしれないですけれども…突き抜けさせるとマイナスやプラスの値に出来るのを利用されているということですよね。

長沢：そうですね、いったん沈んでからジャンプするなどの予備動作で使います。
あと「調整」機能はよく使いますね。

エマール：複数のキーを一気に変えられる機能ですね。

長沢：そうですね、全体的にちょっと腰を落とすとか上げるとかいうのは「調整」機能を使ってやっていることが多いですね。これは本当に効率化のために絶対かかせないところで、みんなが使っていますね。

・描画負荷軽減について
長沢：弊社の場合は請負でやることが多いので、クライアント様からいただいた情報を元にIKの使う数を制限してくれとか、あとスロットの透明度のアニメーションを使うと結構重くなってしまって処理が落ちてしまうという話があって、そういうのは無くしてほしいという要望があれば無くすようにしています。案件によっては、たくさんキャラクターが出てくる場合は「このキャラクターはボーンの数は150本まで」など、具体的な数字がある場合もありますね。

エマール：G2 Studiosはボーンの数まで制限したことは無いですけれど、最終的にメッシュの無駄な頂点が無いかなどはチェックして、あとはキーもクリーンアップしてから書き出すとか、そういうところはレギュレーションにも入れていたりしますね。

長沢：ボーンについては、前に一回実験していっぱい複製をして出してみたのですけれど、そんなに重くならなかったんですよね。だからどこまでをクライアントさんによって重視するかで変わってくるのかなと。

エマール：多分キーの方が描画負荷には影響しているのかなと思います。単純にセットアップにたくさんのボーンがあるのはそんなに影響していなくて、ボーンのキーが多いとなると描画負荷に繋がるのかと。ただ、G2 Studiosはたまに外注使っているんですが、外注するとすごい数のキーを打たれるところとかもあって。ゼロフレームに全部のキーを打つとかレギュレーションになっている会社さん多いじゃないですか。弊社はそれやっていないんですけれど、やったとしても使われているキーだけなのに、一切使っていない「シアー」のキーが打たれていたりとかもあって…。

長沢：それ、最終的にクリーンアップで消えないんですか？

エマール：あー、それでとりあえず入れとくかという感じなんですかね…。

長沢：納品の時はクリーンアップしてデータを出すというのはうちではやっていますが、それを知らないとそういう状態で来るのかもしれないですね。

エマール：そうですね。

長沢：あとは、画像の透明な部分を出さないようにメッシュを切っておいた方が良いというのも聞いたことがありますね。

エマール：あー！「ハル制御線」をできるだけ小さくした方が良いというのですよね。

長沢：たしか公式にもありますよね。

エマール：そうですね。(メッシュを設定するときは)できるだけ無駄な余白を切った方が良いですね。

・エフェクトについて

エマール：TEPPENとかどうしてるんですか？

長沢：絵の素材をAfter Effectsに持っていって、それを連番で書き出して動かしていますね。
パーティクルに関しては、粒がたくさんある画像を拡大縮小・回転しながら動かすっていうのを複数やって複雑な感じを出していますね。

エマール：結構単純に枚数が必要という感じなのですね。G2 Studiosは基本的にUnityで後乗せっていう形が多いですね。チーム内にエンジニアがいるのでエンジニアと協力して進めています。エフェクトの発生位置とかは基準になるボーンを作ってここからエフェクトが出てほしいというのは指定して、Unityの方でBoneFollowerを使って位置を取得してもらっています。あとはEventキーを打って、エフェクトがこのタイミングで出てほしいというのは指定してUnityの方で合わせてもらっています。

・開発側からアニメーター側への要望について
エマール：開発側からの要望ってArtnerさんの方では来るんですか？

長沢：うちは開発側と発注するところで全部話し終わってから発注されるのであんまり要望は来ないですね。でも案件によっては開発段階から入る場合もあるので、工数を削減するにはどうすればいいですかとか、そういう質問に対してこういう風にやると良いですよとか提案を出したりはしていますね。

エマール：G2 Studiosもあまり開発側から何か言われることはないですね。まあ命名規則はちゃんとするとかですかね。あと、1回だけメッシュが重いって言われたことはあります。

長沢：やっぱりメッシュって切りすぎると重くなりますか？

エマール：いえ、多分ですけどもあの時の要因は違くて、ちゃんとボーンに全部のメッシュを繋げずに頂点を直での変形を使っていたんですけれど、それがすごい重いらしいんですよね。

長沢：頂点を直で変形というと？

エマール：「アニメ化」モードで頂点を1個1個つまんで動かすことが出来るのですが…

長沢：あー、あの水色のキーがつく？

エマール：そうです！水色のキーがつくやつです。


 

長沢：じゃあウェイトをつけて動かした方が良いと？

エマール：そうです。ちなみになんでかというと、あれで動かすと、頂点1個動いただけでも「全頂点が動いた」という扱いで計算されるらしいんですよ。ボーンにウェイトをつけてだと、ウェイトをつけている頂点だけが動いたってことになるんですけれど。まあそう言う風に全頂点が動いたっていうアニメーションをたくさん作ってしまったので、すごく重くなってしまったということがありました。

Spineを使っていて悩んでいること
また、各社の社員から集められたSpineの悩みに関する質問の回答も行われた。


悩み1.目的のスロットを探すのに時間がかかる
エマール：こちらについては動画でお答えしたいのですが…１つはツリーのフォーカス機能を使用するのが良いです。


 

ショートカットでやる場合はキーボードの「/」で出来ます。これだとアニメーションを作るビューで選択したものもツリーですぐ探せるようになるので便利かと思います。
ただそもそも絵が重なりすぎて目的の画像を選択できない場合もあるかと思いますので、その場合は「右クリック非表示」をオススメします。


 

ボーン名横の白丸を右クリックすると、そのボーン以下の要素すべてを非表示にしてくれるので、いっきにたくさんのものを非表示にしたいときに便利です。

悩み2.グラフが扱いづらい
長沢：3DのMAYAっていうソフトを使っていたので、MAYAだと先ほどお話したようなSpineの「調整」で全体の腰を下げるとかもグラフで全て制御できるので、それがSpineで出来れば良いなぁと思いますね。

エマール：そうですね。でも私的にはSpineのグラフビューも好きでして、「プリセット」という機能がありまして、これ結構便利だなと思っています。このgifは私のプリセットの欄なのですが、よく使うカーブの形はプリセットに登録しています。私の場合はカーブのキツさによってlv1、lv2...などつけて使っています。


 

悩み3.アニメーション時にセットアップのやり直しが発生してしまうことが多い
エマール：長沢社長はこれはよくありますか？

長沢：いや、3Dと比べるとだいぶ戻るのがやりやすいですね。3Dだと他のアニメーションもおかしくなってしまうとかあるので、Spineはざっくりセットアップしてアニメーションをつけて、後から直すとかでも気軽にできるかなと思います。

エマール：私もそう思います。実際アニメーション動かしてからセットアップに戻るってままあるんですけれど、全てに影響してしまう形でセットアップやり直すことは無いので、上手い具合にちょっとずつ修正できるかなと思いますね。

長沢：ただまぁ、関節の位置がちょっと違っていたりすると…いや、でもそれもどうにかできますね。

エマール：そうですね。ボーンを動かしてもアニメーションは保持するので、(子要素の)画像が動かないようにロックして、ボーンの位置だけズラして…ということが出来ますね。

長沢：3Dだとそこはあんまり柔軟じゃなくて。「リガー」っていう専門の職種の人がいるくらい複雑なので、リガーの人に戻すってなってくると、じゃあ他のやり方で直したほうが速いよねってなることもあって。でもSpineは自分で色々とカスタマイズできるので、そういうフットワークは軽いかなという気がしますね。


Spiners MeetUpの展望
最後に、Artnerが作った最新のアニメーションが紹介された。

動画


今後のSpiners MeetUpでこちらの解説も行っていきたいという両者。vol.2についてはまだ具体的な開催日時が決定していないが、次回についてはDiscordなどでも宣伝するとのことなので、興味があれば加入することをオススメする。




異なるフローでSpineアニメーションを制作している２つの企業が、それぞれどんな風に考えて制作に当たっているかという視点でトークするというのは、なかなか見ない形式だったので新鮮な気持ちで見れるのではないかと思う。

本レポートではディスカッションや質疑応答は一部の紹介のみとなったが、配信の内容はYoutubeに掲載されているので、さらに他の内容も見たい方はこちらから確認してほしい。