*

[Spine研究]Spineでクォータービューアクションはできるのか?

CG開発室の遠藤です。

久しぶりのSpine研究記事になります。

横スクロールなどに比べて、表現方法が広がるクォータービュー(俯瞰)は、

狭くなりがちなスマホアプリのUIに最適です。

http://dic.pixiv.net/a/%E3%82%AF%E3%82%A9%E3%83%BC%E3%82%BF%E3%83%BC%E3%83%93%E3%83%A5%E3%83%BC

3Dであればなんの問題もないのですが、

2D系でクォータービューの表現はとても難しいのです。

SpineやSpriteStudioは2Dスプライトなので、X軸(横)Y軸(縦)の二軸で制御するため、

Z軸(奥行き)の表現ができません。

XY軸で疑似的な奥行きを表現することはできますが、イラストの性質上、「捩れ」に対応ができません。

 

歩く、よろこぶ、程度のアニメーションであれば、

パースに合わせたキャラ素材を必要な方向に合わせて用意すればすんなりとできますが、

はてさてアクションとなるとどうでしょう。今回の課題として検証してみたいと思います。

■前置き

3D2D問わず専門用語のオンパレードですので、良く分からない方は画像と、動画だけみてください。

 

結論から言うと、

要件を絞って1枚1枚描いた方が早いし安いハズ

 

■必要な要件を考える

 

俯瞰なので、前後左右4方向にキャラクターが移動すると考えます。(+XY-XY)

なので、必要なキャラ素材は4方向。

デザインが左右対称であれば、フリップ(Spine ver3未満)で対応できるので、2方向で済みます。

それに加えて、アクション時に捩れを加えた場合、捩れ用のテクスチャが必要になります。

 

1・方向x捩れ補正に必要分のキャラクター素材を用意し

2・Spineでモデリング→アニメーションをつける

3・プロダクトとして成立するクオリティを担保する

 

3を目標に進めていきます。

 

■準備

Mayaを使ってデータを準備しました。

ガイドモデルを作成後、パーツの数だけレンダーレイヤーを作成し、ファイル名だけオーバーライドした状態。

今後必要になる、パースのガイドはメンタルレイの輪郭レンダリングを使いたいので、pfxToonはオフセットメッシュです。

将来的に、捻れ素材用にポーズを付け直す必要がでてくる(ことを予想している)ので、

3Dツールで物理的に正しいモデル、パースを作成するのはマストだと考えます。

160516_01

■カメラ

・Focal Length 300

・斜め45度

・カメラの高さは適当

■キャラ(ガイドマン)

・4頭身くらい

・必要最低限の関節

・ボックスで、メッシュのガイドにもなるように

■ボーン用のガイド

160516_02

・地面に対して垂直になるように骨を配置

・ガイドマンの関節位置にぴったり合うようにガイドボーンを配置

 

以上をババっとレンダリングして、Spineでモデリングしてみました。

160516_03

 

今にも動き出しそう。

Y軸の骨は地面から垂直になるように。

左右の骨は、地面から平行になるように作成しています。

160516_05

 

さらにさらに、

160516_04

関節に必要なボーンに加えて、捩れ用のボーンを追加。

ガイドマンのパーツの側面のど真ん中を狙って配置します。

これは、身体のパーツを捻るための補助ボーンで、これを使って最低限のねじれを表現します。

本当は、各Verticesの位置にボーンを用意したいのですが、極力省略するために、面(face)ごとのボーンにしました。

■動かしてみる

・クランチ

膝の方向に注目したいのですが、XYしかないので、-Xに曲がります。

160516_06

赤方向に動いちゃう

でも青方向に動かしたい

 

Z方向に補正します。

160516_07

まぁ、、ちょっとマシになったかな、、

・ロール(ねじり)

02_roll

ひとつの素材ではこれくらいの捻れが限界になります。

Live2Dのように、立ち絵に立体感を出すのであればこれで十分です。

捻れ補助の骨をパースに合わせて前後に移動します。

・アイドル

03_idle

 

160516_09

 

こんな感じで捩れてます。

腕、上半身などが特に、ポーズに対して捻れがケアできていません。

 

・攻撃してみた

 

160516_08

こんな感じで捩れます。

前後の移動もパースに合っていません。

「設定したパースの、-X方向に正拳突きをする」つもりですが、2D的なXYの軸に引っ張られてしまいます。

160516_10

これでは感謝ができないので、捩れ素材で補正していきます。

 

つづく

 

あ!

検証が一通り終わったらデータをどこかにアップする予定です!

夢を追いかけて散っていった遠藤の骨(Spineだけに)を誰かに拾ってもらいたいのです。

 

Comments

comments

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

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

漫画家大募集中!!

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

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

関連記事

0

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

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

記事を読む

icatch

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

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

記事を読む

3_Synfig Studio1.0

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

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

記事を読む

1_DMMmake

3Dフィギュアを作ってみる 序

ご無沙汰しております。CG開発室の遠藤です。 フーモアは11月より5期目を迎えました。このタイミン

記事を読む

whomorPicturesBlog_140517B

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

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

記事を読む

whomorPicturesBlog_140901C

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

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

記事を読む

e14d883a2a6efd80446f6cad692a716b

第一回spine勉強会〜Mastache x フーモア共同開催(会場mixi)のお知らせ

フーモアピクチュアズの遠藤です。 さて、このたびMustasche × フーモア 共同開催

記事を読む

160311Fsicon

【第1回】Adobe Fuse CC(プレビュー版)を活用しよう!【モデリング編】

こんにちは、CG開発室の三木です。 今回は3Dの知識がなくても人型の3Dキャラクターを簡単に制

記事を読む

icon_part3

【第3回】Adobe Fuse CC(プレビュー版)を活用しよう!【Photoshop編】

こんにちは、CG開発室の三木です。 今回の記事でAdoebe Fuse CC(プレビュー版)の

記事を読む

MA_002

モーションコミックは流行るのか?「MotionArtist」紹介

CG開発室の遠藤です。   弊社では代表の芝辻をはじめ「マンガを世界に届ける」

記事を読む


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

PAGE TOP ↑