メイキング【2D骨格アニメーション】 ムラサキセブン

3 weeks ago

3 weeks ago


メイキング、2D骨格アニメーション

開発チームは、ムラサキセブンを数あるパズルゲームの中でも特に魅力的なゲームにするため、各ゲームモードやガチャから手に入るキャラクター達のデザインを、日本のアニメにならったものとしました。

そして、ストーリーやキャラクターデザイン、音楽、ゲーム性が決定した後も、より生き生きとした表現はないかと模索していました。

そこで、各画面上で表示されるキャラクターをアニメーションで動きをつけることにしたのですが、そこには大きな課題がありました。

ムラサキセブンでは、すでに3Dモデルを使用したアニメーションが用意されていましたが、そのアニメーションの分量を増やし、また動きを滑らかなものにしようとすると、より高いフレームレートが必要となり、どうしてもゲームの処理が重くなってしまうのです。

その解決策として、2D骨格アニメーションと呼ばれる技法を使用することとなりました。

2D骨格アニメーションの作成にはSpineという非常に直感的なツールを使用しています。 


それでは、2D骨格アニメーションの仕組みとその作業工程を簡単にご紹介しましょう。


ステップ1:キャラクターを部位ごとに別データ化する

2D骨格アニメーション制作過程1、部位ごとに別データ化する

アニメーション制作するには、まずキャラクターの手や脚、髪の毛といった身体の部位をそれぞれ分割してから、Spineに組み込みます。


ステップ2:分割した身体を一つに組み上げる

2D骨格アニメーション制作過程2、キャラクターを再構築する

部位ごとに分割してSpineに組み込んだキャラクターのイラストを、元々のイラストと同じように組み上げます。


step3:骨格を設定する

2D骨格アニメーション制作過程3、骨格を設定する

骨格アニメーションというからには、骨格が必要となります。 

キャラクターの動き方に応じて、ここは肘、ここは膝、といったように、骨格と関節を追加していきます。

当然、関節部が多いほど、複雑で細かい動きをつけることができるようになります。


ステップ4:動きをつける

2D骨格アニメーション制作過程4、動きをつける

最後に、動きの角度や方向、動作の時間を設定してキャラクターに動きをつけていきます。

また、キャラクターの表情を変えたり、瞬きさせたりすることもできます。


ナオミ、2D骨格アニメーション完成

すると、こんな風にキャラクターが動き出します。

手首や肘、そして肩がそれぞれ異なる動き方をしているのが確認できると思います。

以上、簡単ではありましたが、2D骨格アニメーションの仕組みをご紹介しました。



最新情報は こちら▼

Twitter: https://twitter.com/Murasaki7JP

YouTube: https://www.youtube.com/channel/UCZb1eWeZu2mALTs709n6Ofw

Instagram: https://www.instagram.com/murasaki7__jp