iPhoneアプリ開発:AR 目次

 

 前編からの続き。

 モーション書き出したはいいが、全然動いてくれねーんすよ状態。

 う〜ん、前回からCOLLADAの解釈からして怪しかったもんねえ。

 今回もドイヒ。

 

なんじゃこの変形状態はというね

 

 どうも変なんで、試しにCOLLADAファイルをSceneKitのネイティブファイルであるSceneファイル(拡張子.scn)に変換してみます。

 ナビゲーションエリアでaoi.dae項目を選んでおいて、Editor>Convert to SceneKit scene file format(.scn)メニューを選択。

 


 複製(デュプリケート:Duplicate)するか、そのまま変換(コンバート:Convert)か聞かれるんで、とりあえず元ファイルを残す複製の方で。

 

 

 うりゃ!

 うーん、複製されたsceneファイル開いてAOI_arm選んだら真っ黒になってしまった。

 やっぱ、なんかおかしい。

 

 

 こんな時はscntoolだ!

scntool

 scntoolはXcodeのバンドルの中に入ってる、COLLADAやSceneファイル間の変換用コマンドラインツールっす。バンドルわからん人は「見た目が大事」ね。

 

↓scntoolの解説

https://gist.github.com/matux/4a30c4b4b29d636fe6847b6a3234bc4f

 

 こいつはターミナルから使います。

ターミナル

 ターミナルはアイコンをダブルクリックで起動する通常のMacアプリ。アプリケーションフォルダのユーティリティフォルダに入ってます。

 

 Launchpadだと「その他」の中ね。

 

 

 起動するとこんなウィンドウが開きます。

 

ゆーても、私は環境設定でHomebrewプロファイルを

カスタマイズしてるんでそのまんまじゃないけど

 

 ただ文字を打ち込み、それに対応して文字が表示されるだけのウィンドウ。

 ま、一応マウスでの文字セレクトやコピー、ペーストには対応してくれてますが、基本キーボードからの入力のみを受け付けて、文字のみを表示する。

 40年ほど前、マウスのない時代は、みんなこんな感じでキーボードから色々文字を使ってコンピュータに命令してたわけだ。マウスがないならトラックパッドを使えばよくってよ。

 scntoolは、ここからでないと使えない。

 そういうのをコマンドラインツールって言います。

コマンドラインツール

 利用するにあたっては、コマンドラインツール(今回ならscntool)自身のファイルの場所を、ファイルパスで指定する必要があったりして結構面倒っす。

ファイルパス

 ファイルパスはこの前紹介したURLの祖先みたいなもんで、Macだと先頭のスキーム部file:が省かれて、その次の // が / になるだけでそれほど違いはありません。

 今回のscntoolはXcodeバンドル内にあるんで、例えばXcodeがアプリケーションフォルダに置かれてる場合、scntoolのファイルパスは

 

/Applications/Xcode.app/Contents/Developer/usr/bin/scntool

 

 となります。

 とても長い。

 よく使うコマンドラインツール群は、決まったフォルダに集められてて、そのフォルダを、ツールの名前だけ書かれた場合に検索する場所としてあらかじめ指定してるので、コマンド(ラインツール)名だけ書けば実行できるようになってんだけど、scntoolの置かれてる場所は、そこには含まれてないで、フルに書かないとダメなんですな。

 ただし、もうちょっとお手軽な方法として

 

 xcrun scntool

 

と打ち込むやり方があります。

 xcrunもコマンドラインツールで、これ自体はよく使うツール群が置かれてる場所にあって名前書くだけでOK。で、スペースを挟んで、その後に続くコマンドラインツール(今回ならscntoolね)をXcodeのバンドルから探して実行してくれる。

 私はこれを使ってる。

 チューことで、scntoolを実際にターミナルで使ってみましょう。

scntoolによるCOLLADAファイルの変換

 まず、aoi.daeファイルのあるaoiフォルダをカレントディレクトリにするためにcdコマンド使います。

カレントディレクトリ

 こいつは、ツールを検索するフォルダと同じで、ファイル名だけ書かれた時に、検索するフォルダのことっす。

 昔はフォルダと言わずディレクトリって言ってた。

 ツールを検索するフォルダとは別に1つだけ、cdコマンドで指定できる。

cd

 カレントディレクトリを設定するには、ターミナルで

 

cd /Users/kunii/Desktop/mmd/mmd/art.scnassets/aoi/

 

 てな風に、cdの後にスペース入れてからカレントにしたいフォルダのファイルパスを書きます。今書いたのは、私のマシンでのaoiフォルダのファイルパス。

 こうしてaoiフォルダをカレントディレクトリにしておくと、aoi.daeって書くだけで、aoiフォルダの中にあるaoi.daeというファイルを指定したことになって、長いファイルパスを書かなくて済む。

 と言っても、自分のaoiフォルダのファイルパスなんてパッと思いつかんよね。

 ということで、簡単な指定方法教えます。

 まずターミナルで「c」キー、「d」キー、スペースキーと打ち込んでcdとカーソルの間があいてる状態にしましょう。

 

 

 この状態でaoiフォルダをターミナルのウィンドウにドロップ。

 

 

 これでaoiフォルダのパスが表示されるので、そのままenterキーを打ち込んで実行。これでaoiフォルダがカレントディレクトリに指定されるので、この長ったらしい文字列を打ち込む必要がなくなる。

 

 

 もちろん、ドラッグ&ドロップなんかせずに全部キーボードから入力してもOK。

 ここら辺興味のある人は「mac ターミナル」で検索だ。

 あとは

 

xcrun scntool --convert aoi.dae --format scn --output x.scn --asset-catalog-path /Users/kunii/Desktop/mmd/mmd/art.scnassets/aoi/ --force-y-up --verbose

 

と入力してenterキーで実行。

 

 --convert aoi.dae

 

はカレントディレクトリのaoi.daeってファイルを変換(コンバート:convert)希望って意味。ここでaoi.daeのフルパス書けば、上のcd処理は必要ないけど長くなるしね。

 

 --format scn

 

はsceneファイル形式(フォーマット:format)に変換してねという意味。

 

 --output x.scn

 

は変換した出力(アウトプット:output)ファイルはx.scnて名前にするよって意味。

 

 --asset-catalog-path /Users/kunii/Desktop/mmd/mmd/art.scnassets/aoi/

 

は、テクスチャファイルといった資産群(アセットカタログ:asset catalog)のあるフォルダのパス(path)の指定。今回ならaoi.daeと同じ階層なんで . でもいいかと思ったんだけど /(スラッシュ)からのフル記述のパスが必要でした。

注意)「.」はカレントディレクトリて意味になるが、今回は通じなかった。

 

 aoi.daeで使う資産、つまりテクスチャファイルは、aoi.daeと同階層にあるんで、これは、カレントディレクトリのことになります。なので--asset-catalog-pathの後ろに指定するファイルパスは

 

pwd

 

と入力してenterキー打つことで調べることができます。

pwd

 現在のカレントディレクトを表示せよという命令。

 つまり表示されるのは、さっきのcd で指定したパスなんですけどね。

 

 --force-y-up

 

は例の「見た目が大事」で話したBlenderはz軸を上にする問題への対応。必ずy軸を上下軸にせよという指定。SceneファイルはSecneKit Catalogフォルダに入ってても、補正の対象外なので。

 

 --verbose

 

は、冗長(バボース:verbose)なメッセージを依頼。

 とにかく、事細かに今なにやってるか伝えろって指示です。これを指定することで、何のトラブルがわかるかもしれないわけっす。

 で、うりゃっと実行。

 冗長なメッセージを依頼したんで、ブワーとメッセージが流れてく。終わったところで上にスクロールしていくと…

 

 

 あ〜、もうねえ、これっぽい。

 ボーン名が文字化けしてる。

 で、ターゲットが見つからないと…

 やっちゃたねと。

 

でも一応の変換はしてくれてた。アニメーションしないけど

 

 MMDは日本生まれなんで、日本語使うのになんの遠慮もないんですが、アメリカ生まれのXcodeやscntoolは日本語読めないんすよ。本来UTF-8なんで、読めないにせよ問題なく作業できそうなんだけど、やっぱ理想と現実は違うっすな。

 これが原因かなっと…

 どうしよこれ、ねえ、どうしたらいい?

 Blender戻ってアウトライナーで手動でボーン名を英語に直す?

 頭抱えつつBlenderのMMDタブ画面よくみたら、Translationってボタンがあるじゃなーい。

MMDタブ画面

 MMDタブはmmd_toolsアドオンによって提供されるコントロール画面っす。3Dビューの左にあります。

 

 

 ビンゴでした。

 指定したパートのオブジェクト名を日本語から英語に変換してくれるっぽい。

 とりあえず変換辞書は内部版(Internal Dictionary)を指定して、Types、Modesの項目はshiftキー押しながらのマウスクリックで全選択、下の3つの項目も全部チェック入れてOKボタンクリック。

 

注意)この内部版の変換辞書はmmd_toolsフォルダ内のtranslations.pyというpythonファイルに直接書き込まれてました。Blenderのアドオンはpythonで書けるんですな。で、pythonファイルなんでプログラムが読めるんですが、どうもtranslations.pyと同じ階層にtranslations.csvて名前のファイルを置けば、外部提供辞書として利用してくれるらしい。で、そこらへん踏まえて検索して以下のリポジトリ見つけますた。

 

https://github.com/Hogarth-MMD/mmd_tools_translation

 

ここで提供されるtranslations.csvをtranslations.pyと同じ階層に置くと、より多くの日本語を英語に変換してくれます。もし変換しきれない日本語のボーン名なんかがつけられてた場合は、このtranslations.csvに「対象の日本語, その日本語に対応する英語」の順で行を追加してやればいいみたい。

 

 

 

 何個か変換できなかったよーとエラーレポートされたけど、大半はできたっぽい。

 

 とりあえず、これで再度COLLADAを再出力してXcodeでRunだ!

 うりゃ!

 

 

 動きましたー。

注意)とにかく極力日本語は避ける方向が正解っぽい。これ以外に、MMDのファイルによってはメッシュ名やアーマチュア名に日本語使ってて、それが悪さして動かない場合もあった。ハッカドールなんかのMMDがこれ。

 

 で、前回から見えてた半透明のカプセル、物理計算用の剛体(リジッドボディ:rigidbody)。

 こいつは、物体同士の衝突による反発などを計算して動作させるためのもんで、MMDでは髪なんかを揺らすのに使ってます。なんだけど、今のところ役に立たないので見えないようにしときます。

 

 

 アウトライナービューでAOIの下にいるrigidbodiesってのがそれなんで、SCNNodeとして読み込んだAOIノードをwithName:"rigidbodies"で検索すれば見つかるはず。

 見つかったら、removeFromParentNodeメッセージで親離れしてもらいます。

removeFromParentNodeメッセージ

 登録の場合、親となるSCNNodeにaddChildNodeメッセージを送るんですが、その登録された親から離れる場合は、子供側のSCNNodeにこのメッセージを送ります。

 

class ViewController: UIViewController {
	・・・
    override func viewDidLoad() {
		・・・
        guard let mmd = mmdscene.rootNode.childNode(
        	withName: "AOI", recursively: true) else {
            return
        }
        if let rigidbodies = mmd.childNode(
        	withName: "rigidbodies", recursively: true)  {
            rigidbodies.removeFromParentNode()
        }

 

 これでパーペキ。

 

 

サンプル:

 http://tetera.jp/xcc/book-sample/mmd-motion.zip

 

 ところで、さっきのMMDタブにある運動をインポートするボタンは、アウトライナービューでAOI項目を選んでるとクリックできるんだが、こいつは世に出回ってるミックミックダンスのモーションデータファイル(拡張子.vmd)を読み込むためのもんです。

 

 

MMDモーションデータファイル

 例えば「WebGLでいきますぜい」で紹介したthree.jsサイトからダウンロードできるthree.js-masterのexamples/models/mmd/vmdsに入ってるモーションデータファイルのうち、MMDモデル用のモーションファイルwavefile_v2.vmdを読みこまして、こいつをCOLLADAで出力してARで使うと〜

 

↓three.jsサイト

http://threejs.org

 

 こうなります。

 

左側は、同じモーションを初音ミクモデルに埋め込んだもの

このモデルもthree.js-masterに入ってる

 

サンプル:

 http://tetera.jp/xcc/book-sample/mmd-dance.zip

 

 イエェエェェスッ!

 総統!歩けます!!

 物理演算できてないから髪が体に食い込むとか、揺れないとかはあるし、モーフィングっていう機能もサポートできてないんで、まばたき一つしないけど、まずはめでたい。Blender、COLLADA、SceneKitで剛体運動やモーフィングをどう扱うかとか、そういうのはもうちょっと単純なサンプル作って調べてかないとね。

 とりあえずはダンスダンスダンス!

 

 ということで、次回は油圧ショベルに戻ります。

 

iPhoneアプリ開発:AR 目次

 

 AOIちゃんにアーマチュアもあるんでモーションも入れちゃいます。

 前回言ったようにアーマチュアは、3Dキャラなんかのポージングに利用するためのもの。

ポージング

 キャラの姿勢を決めるのがポージングなわけですが、AOIちゃんの形状を構成する頂点の数は「お気楽極楽Blender[1]後編」でやった立方体やトーラスの比じゃないっす。五芒星なんて鼻で笑われるレベル。

 なので、この前のように頂点を選択して直接移動や回転させたりするやり方だと、かなり大変そうだというのは想像つくんじゃないかと思われ。

 せっかくポーズ取らせた後で、うーんちょっと違うねぇ、いったん元に戻してとか言われたらブチ切れるレベル。

 で、そこらへんを解決するために用意されてるのがアーマチュアなわけでして、柔らかい素材の人形の中に入ってる骨組みをイメージしてもらえればと思うわけですよ。

 実際、体験するのが早いっす。

 まずは、前回、邪魔だって隠したアーマチュアを表示しちゃってください。

 前回と同じく、アウトライナービューで"AOI"って項目内にある"AOI_arm"って項目の表示/非表示アイコンをクリックすれば、今度は表示されます。

 

 MMDのモデルは髪の毛にもアーマチュア入れてるみたいで、かなり複雑なんだけど、腕のあたり見ると、骨組みが透けて見えてる感じがするんじゃないかと…

 で、このアーマチュアを、3Dビューで直接右クリックするか、アウトライナービューで"AOI_arm"の左のアイコンをクリックするかで選択します。

 そうすっと黒かったアーマチュアがオレンジになるんすよ。つまり選択状態ね。

 

 アーマチュアを選択すると3Dビュー側でポーズモードが選べるようになる。

ポーズモード

 オブジェクトモード、編集モードときて、今回はポーズモードっす。

 

 このモードで、アーマチュアの各節を移動したり回転させたりして、キャラにポーズを取ってもらうわけですな。

 この節それぞれをボーン(bone:骨)と呼んだりします。

ボーン


 で、例えば、上腕あたりのボーンを、頂点動かした時のように右ボタンでのドラッグで引っ張ると〜

 

 

 腕が、肘の関節で曲がるみたい動いたりするわけっす。

 

 

 適当な場所で左クリックで確定させたら、右腕も同じように動かしてポーズつけてやってください。

 

ま、適当に…

 

 アーマチュアでは、それぞれのボーンごとに、AOIちゃんの形状を構成する頂点群のどれが追随して動くかを決められるんで、こんなことができるんですな。

 で、例えば、今動かした右腕のボーンに関連付けられた頂点がどれかをみたい、もしくは関連付けを変更したい場合は、このポーズモードで右腕のボーンを選択した状態で、AOIちゃんの形状側を右クリック(shiftキー付きじゃなく単独クリックで切り替える)して選択します。

 そうすっと、選択物がアーマチュアじゃないんで、モードが自動でポーズモードから別のモードに切り替わるんですな。特に指定してなければオブジェクトモードになります。

 

 つまり「お気楽極楽Blender[1]後編」で、3D形状を選んだ状態と同じ状態に戻ってるわけっす。

 選んだオブジェクトを編集モードにする時、編集モード以外にいろいろな項目が並んでたの覚えてるかな?

 今回は、編集モードじゃなくウエイトペイントに変更する。

 

 

 

 これで、ポーズモードで最後に選んでいたボーンに追随する頂点、というより、頂点で構成される平面がどれくらい、そのボーンに影響受けるかを色で表現されることになります。

ウエイトペイント

 赤いところほど、ボーンと一緒に動き、青いところは、一緒に動かない。その中間が黄色なわけです。

 

 

 で、ここでAOIちゃんの形状平面を赤色にどんどん塗り広げていくと、右腕のボーンと一緒に動く頂点が増える(右腕のボーンの位置に合わせて形状が変形する)し、青色を増やせば、あまり動かなくなるわけですよ。

 この調整をするのがウエイトペイント。

 この状態で、右クリックでボーンを選べるようになってるんで、いろいろなボーンを選んで、どこに影響するのか見てみるといいです。

 

 

 とりあえず今回は見るだけね。

 色付けとかやるのは自分でボーンをつける時にでもやりましょう。

 さっきやった腕のボーンをドラッグしたら関節曲がるように動く仕掛けも、ボーン同士のコンストレイン(制約:constrain)設定によるんだけど、そこらへん説明しだすと長いからね。

 今回は確認できたらオブジェクトモードに戻す。

 ちなみに、ウエイトペイント移行には、この手順以外にも、アウトライナービューで "AOI_arm" の中にある "AOI_mesh" 左のアイコンを選んでオブジェクトモードにしてからウエイトペイントに切り替えるって方法もあります。

 そもそも、ボーンを選んでおく必要もないっす。話の流れ場、腕を選んだ状態で切り替えただけで、3D形状選んでれば、いつでもウエイトペイントに切り替えられるし、その後で、ウエイトを編集したいボーンを選んだっていい。

 ここらへんは好き好きで。

 

 とにかく、こんな風に3D形状は、アーマチュアという骨格に追随して表皮が動くようなイメージがあるんでスキン(皮:skin)と呼ばれるわけですよ。

 こうやって3D形状を調整するのをスキニングと言います。

 1990年前後には、すでにあったような…

 ジェラシックパークなんかは、これでやったんじゃないかと思うんだけど、確証はない。

 

 告知

 これまでは3D形状を全てスキンと言ってたけど、これからは、こういったアーマチュアに割り当てられたものだけスキンといって、そのほかはメッシュ(網目:mesh)と呼ぶようにします。

 最初紹介した時、メッシュ・スキンなどと呼ばれますって言って、私は中身がないんだから全部、皮でいいじゃんって軽い気持ちでスキンて呼んでたけど、やっぱ区別した方が良さげ。過去のブログもスキンのところをメッシュに直す。


 で、ポージングができるようになったので、一つのポーズから別のポーズへの変異を指定してみます。

 

 

 これがモーションす。Blenderではアクションって言ってる。

モーション

 まずは、今のポーズをモーションの初期ポーズとして登録。

 そのためには、まず3Dビューの下のタイムラインビューで、現在(current:カレント)のフレームを1にします。

タイムラインビュー

 

 というか、何も触ってないならカレントフレームの表示は1になってるはず。

 

 そうなってないならタイムラインビューのボトムバーにある頭出しボタンクリックしてください。直接カレントフレームにフレーム値として1を入力も可。

 

フレーム

 フレームとはフィルムの1コマって意味。

 前に言ったように、動画は高速な静止画の切り替えによって、見ている者に動いているように錯覚させている。映画で、その1つ1つの静止画像をフレームと呼んでたのが慣例になって、ビデオやデジタルアニメーションでも、動画中の高速に切り替えられていく静止画1つ1つをフレームと呼んでいるんす。

 前も言ったように秒間何枚のフレームで構成するかで動きの滑らかさが決まる。

 FPS(Frame Per Second:フレーム/秒)て単位で、値が大きい方が滑らかに動く。この値がフレームレート。

フレームレート

 映画だと24FPSで、これがBlenderのデフォルトになっているみたい。

 もちろんフレームレートは変更可能だけど、今はこのまま24FPSで進めます。

 ということで、モーション動画の初期位置である第1フレームに、現在のポーズを登録しましょう。

フレームへのアーマチュアポーズ登録

 タイムラインビューでカレントフレームが1なのを確認したら、今度は3Dビューをポーズモードにしてアーマチュアを全選択。3DビューでAキー使っても良いし、アウトライナービューでポーズ項目選ぶでも良いです。

 オブジェクトモードでメッシュを選んでる状態だとメッシュの状態を登録することになっちゃうんでね。

 

 

 登録したいのはアーマチュア側の全ボーンの状態なわけですよ。

 

 

 この状態で3Dビューのボトムバーからオブジェクト>アニメーション>キーフレーム挿入…を選ぶ。

 

 

 ショートカットはIキー。なので透視画面上でIキー打ちでも良いです。

 選ぶと、何を挿入したいのか聞いてくるので位置/回転を選ぶ。

 

 

 これで第1フレームにアーマチュア全ボーンの位置と回転情報が登録される。

 位置/回転/拡張を選んでスケーリングまで登録しちゃうと、AR側のスケーリングがリセットされるんじゃないかと思われるんで位置と回転だけにしときました。確認してないけど。どうでも良いけど、メニューの中、スケーリング、拡張、拡大縮小の単語が入り乱れてますな。

 とにかく、これでタイムラインビューのタイムラインに黄色い線が追加されたはず。これで、モーション開始時は、アーマチュア全ボーンの位置と回転がこの状態になるわけですよ。で、ボーンに各頂点が追随するので、勝手にメッシュも変形する。

 

 

 次にカレントフレームを1秒後あたりに設定。タイムラインビューの24フレームあたりをクリック。もしくは値を直接入力。

 

ファック!外れた、まあいいや

 

 で、3Dビューでポージングしてください。私は首を傾げさせます。頭のボーンを選んでドラッグ、は、やりにくいので選んでからGで動かした。

 

 

 嘘じゃ、ボケェえ。

 ここまで傾けるわけないやろ。首折れるわ。

 傾けは、ほどほどにね。

 で、またまた登録。今度は首のボーンの回転情報だけ登録ね。

 これで、モーションの初期状態のアーマチュアの状態から、1秒後に首のボーンの回転だけ変更することになる。いわゆる差分です。もちろん全ボーンの移動/回転を登録してもいいけど、他のボーンは初期位置・回転ともに同じで無駄だからね。

 

首の傾げはこれくらいにしといたほうがいいあるよ

 

 最後に2秒後、48フレーム目あたりに1フレーム目と同じポーズを登録しようと思うんだけど、ポーズをきっちり戻すために、カレントフレームを1フレーム目に戻してから、3Dビューのボトムバーのポーズ>現在のポーズをコピーを選んでポーズをコピっときます。もちろん首のボーンが選ばれた状態ね。

ポーズをコピー/ペースト

 

 で、タイムラインビューでカレントフレームを48フレーム目あたりに移動させてから

 

 1)3Dビューのボトムバーのポーズ>現在のポーズを貼り付けを選ぶ

 2)首のボーンの回転を登録

 

とやって登録作業完了。今度は、うまいこと48フレームが選べた。

 ここでタイムラインビューのボトムバーからフレーム>終了フレームを設定を選んで、最後の登録フレームをモーションの終わりに指定。

 

 これで、モーションは1〜48フレーム、2秒間のモーションてことになる。

 厳密にしたい人はカレントフレームや終了フレームに直接、値48を入力でやってください。

 

 用意したポーズは、最初と中間と最後の3つだけど、その間の変化はコンピュータが勝手に計算して滑らかに繋いでくれる。

 人間は、最低限、この時間には、このポーズになってないと困るてのを指定するわけっす。

 この人間が指定するポーズのあるフレームのことをキーフレームって言います。

キーフレーム

 首かしげる程度なら、3枚で十分すよ。

 竜巻旋風脚みたいなダイナミックな動きなら、もう少しキーフレームを増やして、ポーズを指示してやらないと、コンピュータもどうしたらいいかわからなくなるわけだが…

モーションのプレビュー

 ここまでできたらタイムラインビューのボトムバーにあるプレイボタンをクリック。

 

 

 3Dビューでアニメーションしてくれます。ほっとくと永遠に繰り返す。

 もっかいクリックで停止ね。

 

 

 確認できたら、COLLADAファイル書き出してアプリで読み込ませてみましょー

 作業は前回と同じ、というか書き出し先を、先に設定したプロジェクトフォルダにあるart.scnassetsフォルダ内のaoiフォルダにして、ファイル名をaoi.daeで上書きしちゃえば手間が省けてよくってよ。

 書き出したら、XcodeでRun。

 

ふぁっ?

 

 前回と変わってねーんすけど。

 動かね〜んすけど…

 

 後編に続く。

iPhoneアプリ開発:AR 目次

 

MMD

 WiKiによるとMMD(MikuMikuDance:ミックミックダンス)は樋口優さんという方が、自分自身で初音ミクにダンスさせたいという目的で作ったツールで、当初は公開を予定したものではなかったんだそうです。

 で、これを公開したら同好の士が集まってきて、初音ミク以外のVOCALOIDに対応するわ、東方ProjectやTHE IDOLM@STER、その他既存商業作品のキャラクターなんかを元にしたユーザーモデルは出るわで、MMD対応の3Dモデルが多数公開されるに至って、VOCALOIDだけでない、より汎用的な3Dツールとしての発展をとげちゃったわけですな。

 そのせいで、日本ではちょっと検索すれば、ダウンロードフリーで加工自由な3Dキャラモデルがわんさか出てくるんですよ。

 

↓こことか

商用利用可能なMMDモデル【マナーは守ろう】

 

 前回、インポートするって言ってたのは、このMMD用のファイル(拡張子.pmd、.pmx)。

 正直、外国の3DmaxやMaya、Blender用に出回ってるフリーの3Dキャラはちょっと〜、基本ごついし〜、可愛くないというか〜、特にMakeHuman、オメーはダメだ!な皆さんを名指しで呼んでるような3Dモデル形式なんすよ。

注意)いや、私はいいと思うよMakeHuman。お手軽だし。ただ真正ヲタには合わないかな。

 

 乗り遅れるな!このムーブメント!

 

 って十分古いわ。公開2008年だわ。10年前からみんな活動してるわっ。

 んでも、やろうと思いついた時が某月吉日。

 遅い早いは関係ないっす。

 モデルを作成してくれた製作者さんに感謝しつつ、ARアプリに組み込んで自宅でお気に入りのキャラとの日々を愉しんじゃったりしましょう。

 

 というわけで、今回のポケモンもといMMDモデルは上のリンクで紹介されてる銀獅さんがモデリングしたAOIちゃんだ!君に決めた!

 

 ↓飛んだ先の注意書き読んで承知したらdownloadボタンをクリックね

 https://aoichan.amivoice.com

 

 

 早速、情報ビューのファイル>インポートでMikuMikuDance Modelを選んで読み込みいってみよ〜。ふーんふふーん。

 

 

って、待てやああ。

 わしのBlenderのインポートリストにMikuMikuDance Modelとか出てこんチューねん。

 な皆さん、残念。Blenderの初期状態にはMMDインポートはありません。

 初音ミク、サンフランシスコには上陸したがオランダはまだのようだな。

 私も最初、どーしようかと思ったんだけど、試しに「MMD Blender」で検索かけると解決策がサクッと見つかったりしたわけですよ。

 

https://blender-cg.net/mmd-pmd-pmx-vmd/

 

 って、ここ最初に紹介したBlenderの使い方を日本語で解説してくれてるとこじゃん。

 ふむふむ。アドオン使え、つまり追加機能でインポートできるようになるよと。MMDの場合はmmd_toolsがおすすめ。

mmd_tools

 Blenderは機能を拡張するための取り決めを公開してるんで、プログラムできるなら誰でも、仕様を読んで色々な機能をBlenderに追加できるんすよ。

注意)オープンソースなんで、それでも無理な機能を実装したい場合はBlender自体を変更しちゃうこともできる。

 

 で、教えられたMMD拡張機能のある場所はGitHubでした。

 

https://github.com/powroupi/blender_mmd_tools

 

 GitHubは「iPhoneアプリ開発、号外 GitHubを使おうぜい」で紹介したやつ。基本、開発者有志が共同して開発を進めるための基盤を提供してくれてる場所。

 つまり、このMMD読み書き用のBlenderアドオン自体もオープンソースなわけで、みんなで作ってこうぜって立ち位置みたいっすね。俺、プログラマじゃないし、使いたいだけなんすけどな人は、GitHubのアカウント作らずにダウンロードだけすることも可能。

 上のリンクで案内されたGitHubのページの右側にあるClone or downloadボタンをクリックして、表示される画面のDownload ZIPをクリックすれば、ダウンロードフォルダにプロジェクト一式がzipでダウンロードされます。

 

 

 ま、Xcode触ってるならGitHubのアカウントは取っといて損はないです。他人に見られていいプロジェクトなら無料で使えるし〜

 とにかくこれで、ダウンロードフォルダにはzipファイルが解凍されてblender_mmd_tools-dev_testてフォルダができてるはず。必要なのはこの中のmmd_toolsというフォルダ。こいつをBlenderのscripts/addonsフォルダの中に丸ごと置きます。

Blenderのアドオン

 Blenderのscripts/addonsフォルダてのは、Blenderアプリバンドルの中にあります。なのでFinder上でBlender探して右クリックで「パッケージの内容を表示」メニュー選択だー!

 

 

 ごめん何言ってるのかよくわかんない、な人は「見た目が大事」を読みましょう。

 で、開かれたバンドルのContents/Resources/2.79/scripts/addonsてのが目的のフォルダっす。ちなみに2.79ってフォルダはBlenderのバージョンによって変わる。この中にmmd_toolsフォルダを置いてやれば準備完了。

 

 

 あとはBlenderを起動して「ユーザー設定」の「アドオン」タブ画面でmmd_toolsを探してチェックを入れるだけ。私は一応、ユーザー設定画面左下にある「ユーザー設定の保存」もクリックしておいた。

 

 

 これでインポートメニューにMikuMikuDance Model項目が出るんで、先にダウンロードしておいたAIOちゃんモデルMMDファイルを選んでインポートだ。

 AOI.pmxってやつね。

 

 

 とりあえず、今回はインポートのオプションは特にいじらずに読み込んでみます。

 こんな感じ。

 

 

 なんかデカそうなの出た。

 

 

 ちなみに私は、前回「新規作成時のプリセット」で紹介したように、新規作成時の画面から立方体を削除した状態を、ファイル>スタートアップファイルを保存メニュー使って新規作成時の初期画面に設定してます。なのですでに立方体はありません。

 立方体残したまま読み込んじゃった人は、立方体は必要ないんで削除しちゃってください。削除の仕方わからん人は「お気楽極楽Blender[1]前編」あたりから読み直しましょう。というか、この後の話、呪文の連続だろうからちゃんと読むように。

 ま、それはいいとしてズームアウト。

 でもってソリッド表示だと味気ないんで、3Dビューでシェーディングをテクスチャ表示に変更してみます。

 

 

テクスチャ

 テクスチャてのは「光あれ」のSCNMaterialPropertyのところで話した、立体平面上の色や値の分布を2D画像として表現したもののことです。これを割り当てることで、例えば顔全体が単色の肌色になるのを、頬のあたりだけうっすら赤みがさすなんてことができる。で、ソリッド表示では立体平面には単色の色しか表示してくれない。割り当てられたテクスチャの状態を確認できるのがテクスチャ表示。

 ま、形状を調整中には単色の方がわかりやすいとか、作る人の好みで使い分けます。

 いいけど、なんか暗い。

 

 

 光量が足りないんすな。

 ソリッド表示と違って、テクスチャ表示や、その上のマテリアル、レンダー表示は空間内に配置した光源を使って表示するんで、光源の明るさとかの調整も必要になるんすよ。

 ただ〜し、マテリアル、レンダー表示と違ってテクスチャ表示の場合は、手っ取り早く光源を全て消しちゃうって手も使えます。どうせXcodeでモデルしか使わないんで、これでやっちゃいます。光源がないんで「光あれ」で話した陰影処理がされなくなりますが、MMDの場合はもともとアニメよりだし、テクスチャが割り当てられてるので、それほど違和感はないっすね。

 ということで、他にも方法はあるんだけど、今回は手っ取り早く光源消しちゃいましょう。

 3Dビューで光源選んでxで削除でもよし、アウトライナービューで光源の項目を右クリックでコンテキストメニュー出して削除を選択でもいいっす。

 

 

 出た。

 って、なんじゃこのキャラを覆う黒い鎖みたいなのは?バグ?

 

 

 って思った人もいるんじゃないかな。バグじゃないっす。

 この、黒い鎖みたいなのはアーマチュア(armature:骨組み)といってキャラのポーズとかを操作するのに使うやつっす。

アーマチュア

 ちなみに、このアーマチュアの関係で、キャラクタをモデリングする時には、今表示されているポーズでモデリングするのが一般的っす。いずれ、この領域に踏み込まないといけないわけだけど、とりあえずは無視で。

 今は邪魔なんで隠します。

 アーマチュアを隠したければ、アウトライナービューで"AOI"って項目内にある"AOI_arm"って項目の表示/非表示アイコンをクリックして非表示にしちゃえばいいです。

 上で教えたコンテキストメニューを使ってもよろしあるよ。

 

 スッキリした。

 

 

 んじゃあ、スッキリしたところでAR表示だ!

 今度はこいつをエクスポートでCOLLADAファイルとして書き出してXcodeプロジェクトで取り込みだ〜。COLLADAのエクスポートオプションもデフォルトのままいじらずに書き出してみます。

 

 

 書き出す時の注意点として、書き出し先のフォルダを用意しときましょう。

 というのも、今回のMMDデータは服とかに上で紹介したテクスチャを使っていて、COLLADAで書き出した時に別個の画像ファイルとして保存されるんですよ。なので今回、結構いっぱいファイルができる。私はaoiってフォルダ作って、そこにaoi.daeで書き出しました。

 こんな感じ。まあAOI-mmdフォルダに入っているのとほぼ同じです。AOI.pmxがaoi.daeになってるくらいの違い。

 で、これをaoiフォルダごと、新しく用意したARアプリプロジェクト、名称mmdのSecneKit Catalogフォルダに放り込んで読み込みました。

 SecneKit CatalogフォルダやARアプリプロジェクトがわからん人は「iPhoneアプリ開発:AR 目次」を参照し、これまでの道のりを最初から読むように。

 

 

 前は、読み込む時に、わざわざBundle使ってURL作ってたけど、実はSCNSceneのイニシャライザのnamed:にリソースフォルダ内を起点にした相対パスで指定可能みたいっす。"art.scnassets/aoi/aoi.dae"て指定するだけなんでこっちの方が簡単。

        let mmdscene = SCNScene(named: "art.scnassets/aoi/aoi.dae")!
        guard let mmd = mmdscene.rootNode.childNode(
        	withName: "AOI", recursively: true) else {
            return
        }

 目的のSCNNodeを取り出す時に使ってる、SCNNodeの名前"AOI"は、当てずっぽうじゃなく、ナビゲータエリアでaoi.daeを選んで表示される画面から見つけます。

 こんな感じでCOLLADAファイルの中身を見ることができるんだけど、3D形状の表示が、なんかバグってるぽい。触るとXcodeが強制終了しちゃう場合もあるんで眺めるだけにしときましょう。

 

 とにかく、この表示される項目のScene graphってところにSCNNodeの一覧が名前で表示されるんで、これで決定できます。

 "Camera"と"AOI"てのが見つかると思う。"Lamp"は消したんで無い。

 

 プロジェクトでは、お約束のARSCNViewを用意(ストーリーボード使ってる)してSCNSceneを指定。そのSCNSceneにaoi.daeから読み込んだAOIちゃんモデルを追加。

 あと、今回はこっちも光源はつけずにそのまま表示させてみるっす。

 アニメっぽくね。

        let scene = SCNScene()
        
        // ARシーンを表示するビューへの仮想シーン環境の登録
        sceneView.scene = scene
        
        let mmdscene = SCNScene(named: "art.scnassets/aoi/aoi.dae")!
        guard let mmd = mmdscene.rootNode.childNode(
        	withName: "AOI", recursively: true) else {
            return
        }
        scene.rootNode.addChildNode(mmd)

 おりゃあ!

 

 

 

でかくね?

 

 でかいです。推定マジンガーZ級。MMDに詳しくないんで単位系がイマイチ謎。

 そんな時は適当にスケーリングだ!

 とりあえず1/10にすることにした。

 ついでにカメラの手前1mに出現させることにする。あと、そのままだと空中に浮いちゃうんで1m下におろす。厳密に床の平面を検知してそこに配置することもできるんだけど、それはいずれ。今は-1mで。

        mmd.scale = SCNVector3(0.1, 0.1, 0.1)
        mmd.position = SCNVector3(0, -1, -1)

 おりゃああああ。

 

サンプル:

 http://tetera.jp/xcc/book-sample/mmd.zip

 注意)ちょっと今回プロジェクトの容量でかいです。60MB以上ある。あと、実機で動かす時はTeamを自分のApple IDにしてね。お約束。

 

 

 身長2mくらいのAOIちゃんになったし、足元も10cmくらい浮いてるけどオッケー牧場。物理演算用の仮想領域まで表示されちゃってますな。アーマチュアとか、物理演算とか、先はまだまだ長いぞ。

 

 じゃまた。