クリペ(CLIPSTUDIOPAINT)からMoho12へ

CG技術・3D

タイトルを見て変な想像をしたひとは汚い大人です(笑)ソースネクストでMoho12(旧名:Animestudio)が安売りされてる関係で徐々にユーザーが増えてるようですし、ちょっとまた触ってみようかな的な覚書です。

MohoはFlashみたいに基本的にはベクター画像をソフト内で描いてそれをポイント・ボーンをいじってアニメつけるというソフトなんですが、別ソフトで描いたラスター画像を読み込んでパラパラさせてアニメすることもできます。その別ソフト部分をクリペ(アニメーション機能があるEX版)でやって、Mohoで使える形式にし、Mohoでボーンでアニメつけようというのが今回の趣旨です。興味のある方はどうぞ

またMohoをこちょこちょ未練がましく触ってたりする。今までMohoでベクターを描いてポイント移動でなんかこうアニメーションしようと思ってたのであるが、方針を多少変えて、CSPやCACANiで描いたのを取り込んでボーン仕込んでやったほうが早いんじゃないのという感じ。というわけでMohoとCSPとCACANiのやり取りとMohoのフレームバイフレームの話ができたらと思う

 まずはCSPで描いたのをMohoに取り込んでみるテスト

CSPでアニメーションを作る超基礎

ファイル>新規からテキトーにアニメーションドキュメントを作る(CSPでアニメ作るの久しぶりすぎて忘れた…)

すっと「アニメーションフォルダー」とその中に1という名前のレイヤーができる(タイムラインパレットが出てなかったらメニュー>ウィンドウから)
なんかこうテキトーに描く

アニメーションフォルダの中にレイヤーを新たに作るとアニメーションセルという扱いになる。アニメーションセルを表示切り替えしていくことでパラパラアニメを作る。このアニメーションセルを増やすことでパラパラ枚数が増えるというわけ

3フレーム目にこの2というセルを使いたいのでタイムラインパレット上部のフレーム番号並んでるとこで3んとこクリックして

その上の「セルを指定」をクリック(リンクボタンが付いてるやつ)

ダイアログでセル2を選ぶ

3フレーム目を境にセル2に切り替わる

しかしこのままじゃ前後フレームがわかんねえので描きづらいためメニューのアニメーション>オニオンスキンを有効化
前後の内容が別色で表示されるようになるので参照しながらセル2を描く

メニュー>アニメーション>オニオンスキン設定でこのように設定できるようになる

とりあえず3枚まるさんかくしかくと描いた
これをPSDで出力する(ファイル>複製を保存>PSD)

PSDをMoho用に変換

これをMohoドキュメントに変換する

水星工房さんとこでASPconvというツールを頂いてくる。だいぶ古くからあるHPなのでなかったらどうしようと思ったけどまだあって感謝

水星工房 - ツール&Tips

最新版をDLし、解凍しASPConv.exeを実行するとこんな画面になる

AddでさっきのPSDを指定し開く

アニメーションフォルダーとその中のセルが表示されている

CSPではセルをアニメーションフォルダに入れるという形なのだが、Mohoでも似たようなもんで、パラパラアニメを作る場合は「スイッチレイヤー(実際はフォルダなんだけど)」というもんに画像やベクターレイヤーやらを収納して同様にタイミングを指定していくという形になる。このツールはPSDのグループフォルダをMohoで扱えるスイッチレイヤーやボーンレイヤーに変換するという神ツールなんであるね

アニメーションフォルダの行にある「Type」でSwitchを指定する。ちなみにセルの行ではTypeを変えることはできない。当たり前といえば当たり前だ
一行無効になってるのが気になるがとりあえずSave


ファイル形式はanmeにしてセーブ。新参な方は「え、Mohoじゃねえの?」とお思いだろうが、このツールの場合Mohoの方が形式が古いのだ。

Mohoは12になってまたMohoという名称に戻ったのだけど、6から11まではAnimestudioという名前だった。(しかも日本国内ではすでにanimestudioというフリーの別ソフトがあったせいで当時日本代理店だったイーフロがつけたアニメクリエーターとかいうまた別の名前になってた)。このツールでは.mohoが1~5のバージョンでの形式で保存されるので、Moho12で読もうとするとエラーが出て読めない。ゆえにanmeを選ぶ。

      

Mohoで開く

Mohoを起動する。ファイル>開くからさっきの.anmeファイルを開く

なんか聞かれるが、これはanmeも現行バージョンにとってはすでに古い形式だからである。OKをクリック。

こんなかんじで取り込まれる。しかしなんかおかしい。用紙レイヤーがないのだ(絵も○△□じゃねえじゃんとお思いかもしれないがそこは流してほしい)。上のチェックが入ってなかった行以降が読み込めてない。

チェックを入れ直して別名で保存し開き直してみる。ちゃんと開くことができた。

     

Mohoでのスイッチレイヤーの指定

読み込んだ時点ではタイムラインを動かしてもなにもアニメーションが付いていない。これを切り替えてタイミングをつけていく。

タイムラインを1に合わせ、レイヤーパレット(出てなかったらこれもメニューのウィンドウ>レイヤー)のアニメーションフォルダ上で右クリック


ここから、そのフレームで使いたいセル名を指定する

1にする。無事○が表示された。同様にフレーム3で2、フレーム6で3…と指定していく。再生すればちゃんとこれでパラパラ動くようになる。

 

ボーンを入れてみる

さらに、このパラパラにボーンを入れて動かしてみる

タイムラインを0にする(基本的にレイヤーを追加したり削除したり新たなオブジェクトを追加したりするときはタイムライン0で行うほうが無難。1以降でもできなくはないがキーフレームに余計なものが打たれて管理が面倒)

レイヤーパレットの左上隅にある+のついたボタン(新規レイヤー)を押すと、以下のような選択肢が出る。ここでボーンを選択する

ボーンレイヤーができる。ソフト上ではレイヤーって名前になってるけど、フォルダーみたいに別のレイヤーを収納することができる。このボーンレイヤーにボーンをつくり、そのボーンで動かしたいベクターレイヤーや画像レイヤーやスイッチレイヤーを収納するのだ。

ドラッグして、ボーンレイヤーの中にさっきの(セルの入っている)スイッチレイヤーを収納する

ボーンレイヤーを選択して、ツールパレットからボーンを追加ツールを選択する(骨の上に+と描かれたやつ)

    

こんなふうにテキトーにボーンを3つドラッグして描く。続けて描くと、あとに描いた方のボーンはその前に書いたボーンの子扱いになる。この場合、3つめのボーンが赤で選択状態、2つ目のボーンは水色で今選択しているボーンの親であることを示している。

タイムライン上でこのボーンにも動きをつけていく

フレーム6と12で以下のように変形した。今回はボーンを変形で動かす。ボーンを変形(C矢印がついてるボタン)の右の「ボーンを操作」ツールでIKオン状態のボーンを動かすと、一番しっぽのボーンを動かすだけで全体がグネグネ動く。
Mohoのボーンは基本的にはIK(インバースキネマティクス)で、「ボーンを操作」で後ろの方の子ボーンを動かすと前の方のボーンに動きが連鎖していく。だがボーンの変形ツールで動かすとIK追従は発生しない。設定でIKはオフにできる

フレーム6

フレーム12

 

このようにボーンの影響を受けて画像が変形移動するようになる

ボーンの影響範囲は個別に設定することができる。タイムラインを0にもどし、ボーンを選択してツールから「ボーンの強度」を選択。

ちなみにその他のへんにいろいろ見慣れないツールが出てて「?」と思われるかもしれないが、米国本家のフォーラムで配布されてたりするのをいろいろ入れてるのだ

こんなふうにボーンの影響範囲が可視化される。3つまとめて設定しようとしてるのでこんな感じ

ツールプロパティに出ている数値ボックスに入力するか、数値ボックスの上で上下ドラッグ、ボーンの上で左右ドラッグで数値を増減する

      

影響範囲を狭めることができた。ここに記したボーンの使い方はほんの基本なので(このボーンだけこのレイヤーには反映させるとかも設定できる)あしからず。ボーン変形だけじゃなくMoho12ではメッシュ変形アニメーションをすることもできる。もちろん普通にレイヤーの移動・拡縮・回転アニメーションだって可能

応用すればCSPでアニメーションを描き、Mohoでボーンを仕込んで髪揺れだのスカート揺れだのをつくることができるだろう。できればCSPでアニメ作ってタイミングつけしたのそのままMohoに持ってければ楽なんだが…せっかくMohoを開発してるSmithMicroでCSP扱ってるんだしなんかこうもっとうまく連携できないもんか。

Mohoで最初にボーンとフレームバイフレームを使って簡単なあたりラフを描き、CSPで原画下書きを描き連番出力、CACANiで画像シーケンスとして取り込んで自動中割で清書し吐き出し→Mohoにもどすというのが今考えてる流れ。
フレームバイフレームとCACANi周りはまた後日できれば。CACANiはsvgを吐き出せるのでMohoにベクター読込できる。Moho上でそれをさらにポイント移動アニメーションということも可能だ

 

Copied title and URL