11
16

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 5 years have passed since last update.

QuillのアニメーションをUnityで再生する

Posted at

え?Unityのアニメーションも作れるんですか!?

 ここ最近、Unity で使用するリソースを Quill で作成する。という事をやっています。主に背景素材作成として。 Quill とは、OculusTouch 用 VR お絵かきツールで、手書き感覚で VR 空間に直接絵を描く事ができます。また、FBX にもエクスポートする事が出来、モデリングツールとしても優秀です。また、Quill はアニメーションを作成する事が出来ます。アニメーションもオニオンスキンで前後フレームが確認できるため、割ときめ細かな動きが設定できます。ものすごく魅力的ですね!

で、つい最近まで Quill はそのアニメーションを Unity にエクスポートできないと思ってました。 FBX で出力してもアニメーションの一コマだけ出力されていて落胆していたのですが、よくよく本家サイトのドキュメントを見ると、エクスポート時に FBX ではなくて、Alembic 形式でエクスポートすれば良いとの事でした。

というわけで、さっそくですがアニメーションさせてみましょう!

まずは、Quillでアニメーションを作る

 スクリーンショット撮るのが割とアレなので、ここはひとつ、メイキング動画をどぞー

Quill でアニメを作る #001

次はインポータパッケージをゲットする

 次は、GitHub にインポータパッケージが用意されているので、それを取得してきます。

  • ファイルを保存します
  • Unity を起動
  • New
  • プロジェクト名を適宜入力して Create project
  • プロジェクトが作成されたら、先ほどダウンロードした unitypackage を開く
  • Import
  • Quill のシェーダーをダウンロード(左のリンクを右クリックしてURLのファイルを保存してください)
  • ダウンロードしたシェーダを Project ビューにドロップしてインポートする
  • Project ビューの何もないところを右クリックし、Create → Material をクリック
  • マテリアル名を QuillMaterial とする
  • Project ビューの QuillShader を QuillMaterial にドロップする
  • Quill で作成した abc ファイルを Unity の Project ビューにドロップし、インポートする
  • 追加すると上記のようなファイルが生成される(ファイル名が若干違うのは実は一度失敗して別のファイル名でやり直したから)
  • Project ビューのインポートしたプレハブをクリックし、Inspector ビューの Scale Factor を 10 に設定し、Apply をクリック
  • Project ビューのインポートしたプレハブを Hierarchy ビューにドロップする
  • 真っ白な何かがシーン内に配置されます
  • Hierarchy ビューのオブジェクトのノードを展開する
  • Project ビューの QuillMaterial を Hierarchy ビューのオブジェクトのメッシュにドロップする
  • 先ほどの白いオブジェクトに色が付きます
  • Project ビューの何もないところを右クリックし、Create → Animator Controller をクリック
  • 名前を QuillAnimator に設定する
  • Project ビューの QuillAnimator をダブルクリック
  • プレハブ内のアニメーションクリップを Animator ビューの中にドロップする
  • Hierarchy ビューのオブジェクトをクリック
  • Project ビューの QuillAnimator を Inspector の中へドロップし、AnimatorController コンポーネントとしてアタッチする
  • Window → Timeline をクリック
  • Hierarchy ビューのオブジェクトをクリックし、Timeline ビューの Create をクリック
  • ファイル名を適宜入力して保存
  • Timeline ビューで右クリックし、Add From Animation Clip をクリック
  • アニメーションクリップをクリックして閉じる
  • Hierarchy ビューのオブジェクトをクリックし、Inspector ビューの Wrap Mode を Loop に設定する
  • 実行する
  • うごいた!!!!!!

無事アニメーションできました

 Quill で作成したアニメーションがそのまま Unity で無事動きました。ということは、簡単お手軽に作成した手描きアニメが Unity のアニメーション素材として使えるというわけですね、素晴らしい!!! Quill は VR 空間でお絵かきできるわけですから、 VR アプリの演出素材としてサクサク作るという事もできちゃいますね。また、シューティングゲーム等の爆発エフェクト等、ちょっと一味違った雰囲気のゲームにも使えそうです。

トラブルシューティング

 今回、Quill でエクスポートした Alembic ファイルがうまく Unity にインポートできず、ランタイムエラーが発生していたのですが、開発元に Facebook のチャットで問題の発生したファイルを送って質問してみたらほんの2、3時間で回答を送ってくれました!! なんという対応の早さ!! すいません、ほんとありがとうございます!!!

で、ランタイムエラーが発生するパターンは下記の2つでした。

  1. 一番細いラインブラシを使用した場合
  2. 空のレイヤーが含まれている場合

まず、一番細いラインブラシですが、これは体積が無いため、正常に読み込めないそうです。つまり、一番細いラインブラシを使用してアニメーションを作ってはいけないという事になります。

2つ目の空のレイヤーについては、次回の Quill のリリースで空のレイヤーをエクスポートしないように修正してくれるそうです。それまでは空のレイヤーは削除するか、非表示にして、Export Curves と Export Hidden のチェックを外す事が必要です。

やっぱ疲れた

 なんだこれ、インポータパッケージを導入してそのままファイルを突っ込むだけじゃないですか、簡単じゃないですか、余裕じゃないですか。 とか思ってたら解決に丸々一日かかってしまいました。しかも、全く違う理由でランタイムエラーが発生したため、これは Quill の問題では? と思ってレポートをあげたものの、実際はやってはいけない事をしてエラーの発生するデータを作ってしまってたというオチでした。(でもまぁ、エラーのでるパターンのデータをエクスポート時にブロックする処理が必要という意味では無駄でな無い報告だったと思います)

開発元に質問するまでは GitHub から C++ のソースを落としてビルドしてみたりと色々試してみて全くわからなかったわけですが、諦めずに色々試す事で最後は目的を達成できるというのは非常に良い経験だと思います。と、偉そうな事をいいつつ今日はここまで。

ではまた!

11
16
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
11
16

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?