RSS

スポンサーサイト

上記の広告は1ヶ月以上更新のないブログに表示されています。
新しい記事を書く事で広告が消せます。
トラックバック
トラックバック送信先 :
コメント
▼このエントリーにコメントを残す

   

Warabiで3Dデータから線画抽出:【3】実際の作業流れ+やや高度な機能


お絵かきソフトで作成しているイラストに合わせて、3Dモデルを線画書き出しする一連の作業流れを解説。
他に、一番外側の輪郭線だけ太く描画する方法も解説します。


mdiapp_0716_025.jpg  mdiapp_0716_010.jpg


●イラストに合わせて線画を書きだす流れ
イラスト作成 → Warabiに配置する下絵作成 → Warabiで線画書き出し → お絵かきソフトで合成

利用したい3Dモデルを線画書き出ししてから、それに合わせて手書きイラストを描き加えていくというなら
Warabiで線画書き出し  → PNGで保存 → お絵かきソフトで開いてそこにイラストを描き加える
でいいのですが、まずはキャラクターやセリフの位置に合わせて3Dモデルを位置調整しつつ線画書き出ししたい場合の作業流れです。

mdiappを使用し、はがきサイズ(10×14.8cm)、解像度600dpi でモノクロイラストを描いてみます。
(モノクロ印刷を想定しているので解像度は600dpiですが、WEBのみで公開するイラストなら300~150dpiでも問題ないと思います。サイズが変わってくるだけで作業の流れは変わりません)

まずはラフ書き。猫が縁台に座っていて、脇には湯呑。こんな感じの絵を描こうと思います。縁台と湯呑をWarabiを使って線画書き出しします。
mdiapp_0716_012.jpg

猫だけペン入れ。線の太さは20pixel程度。
mdiapp_0716_013.jpg

Warabiに配置する下絵を作成します。ラフ部分の縁台をアタリに使おうと思うので、ラフも表示したまま ファイル>ラスタライズ>新規画像として書き出す で別ファイルを作成。
実際のサイズを下絵にすると大きすぎるので高さ700pixel程度に縮小。(473×700pixel)JPG形式やPNG形式で保存します。この時、透過PNGだとWarabiで表示する際に不都合なので、PNG保存時には透過情報の保存のチェックは外しておいてください。
下絵はあとで線画書き出しの最終調整の際にも使います。下絵の大きさは、100%表示されたときにスクロールさせなくても画像全体がみられる大きさにしておくと便利です。

ここからはWarabiでの作業です。Warabiを開き、表示>下絵>下絵を選択 から、先ほど作成した下絵を選択します。
さらに、表示>下絵>下絵を表示 を選択すると、画面に下絵が表示されます。
mdiapp_0716_014.jpg

今回使用する3D素材は、縁台はsketch upを使って自分で作成したもの、湯呑はcomic studio3Dモデル配布所さんの「ゆのみ その2」を使用してみます。湯呑データはWarabiでも開けるOBJ形式でしたので利用が可能です。

●【超重要】OBJ形式の3DデータをWarabiに配置する際の注意点
どうしてかわかりませんが、OBJ形式のデータをWarabiに配置すると、左右が反転してしまったデータになってしまいます。
さまざまな場所で公開されている3D素材をいろいろ試してみましたが、たいてい反転してしまっています。
というわけで、オブジェクトを配置する際には、座標軸の項目の「X軸反転」を押してから配置します。
mdiapp_0716_037.jpg


ファイル>オブジェクトの挿入 で縁台と湯呑のデータを挿入。サイズがちぐはぐなので、正面・側面・上面表示を出して、サイズや位置を調整しました。
mdiapp_0716_015.jpg  mdiapp_0716_016.jpg

ためしにレンダリング。面も描画しています。
mdiapp_0716_017.jpg
いい感じなのであとはこれを位置調整。ただこれがちょっとやりづらい。表示>描画モード で、「フラットシェーディング」にしたり、「ワイヤーフレーム」にしたりでなんとか位置を調整。
(下絵が、3Dデータより手前に配置されて乗算で表示されればやりやすいのですが…。)
mdiapp_0716_018.jpg   mdiapp_0716_019.jpg

レンダリングオプションで書き出しサイズを下絵のサイズにし、背景タブで背景画像を下絵に選択、前景の描画方法を乗算にしておいてレンダリングしてみると、実際に描きだされたイメージがわかりやすいです。下絵サイズでレンダリング、微調整を繰り返して位置調整していきます。
mdiapp_0716_021.jpg  mdiapp_0716_022.jpg

さて、最終的な線画書き出しです。書き出しサイズはもともとのはがきサイズのデータのサイズにします。解像度600dpi、はがきサイズの画像は 2362×3496pixelでした。
今回のイラストの主線は20pixel程度でしたので、Warabiでの書き出しは10pixelにしてみます。ブラシの太さを10pixelにしました。最終調整で下絵を背景画像にしてレンダリングしていた場合は、背景画像は削除し、面の描画なし、線の描画のみでレンダリングしてみました。うちのパソコンで8.83秒で描画完了しました。
描画サイズがそこまで大きくなければクリップボードにコピーで直にmdiappへもっていけます。
なお、背景を透明にして書き出した場合はPNGで一旦保存してからお絵かきソフトで開くようになります。
mdiapp_0716_023.jpg  mdiapp_0716_024.jpg
もともとの画像サイズに書き出しているので、mdiappで開いてからの位置調整の必要はありません。あとは不要な線を削除して完成です。ちなみに猫は二値の線で描いています。縁台も二値の線にしたい場合は色調補正>トーンカーブで二値化させます。

★オブジェクトツリーの、オブジェクトの左側にあるチェックボックスをクリックすると、オブジェクトを表示/非表示が選択できます。今回の線画書き出しで、まずは縁台だけ書き出し、その後湯呑だけ書き出して別レイヤーにしていけば、修正作業も楽になります。今回は単純なので一気に書き出しでも特に問題ないですが、たとえば教室の背景と椅子を書き出して椅子に座っているキャラの線画レイヤー下にレイヤー配置し、机だけ別レイヤーで書き出してキャラの上にレイヤー配置とか、そういった細かい場合は別々に書き出したほうが便利です。







●一番外側の輪郭線を太く描きたい:太いブラシでシルエットラインを描画
sketch upで作成された電卓をWarabiで線画にしてみました。※電卓のモデルはこちらからお借りしました
mdiapp_0716_001.jpg
余計な線も出てしまってますすが、そこは後で修正するとして…。こういうのってボタン部分はこの線の太さでもいいんですが、一番外側の輪郭線はもうちょっと太く描きたいなーって思いますよね。

ウィンドウ左下、ブラシウィンドウのブラシの追加アイコンをクリックすると、ブラシリストに新しいブラシ「ブラシ2」がでてきます。ブラシ2をダブルクリックしてプロパティを開き、ブラシの太さを調整します。
mdiapp_0716_004.jpg
ブラシの太さはブラシ1より太く、色はわかりやすくするため、赤にしてみました。

オブジェクトツリーから、対象のオブジェクトをクリックしてプロパティを開きます。
mdiapp_0716_005.jpg  mdiapp_0716_006.jpg
輪郭線タブの 個別に設定 にチェックをいれ、シルエットのブラシにブラシ2を選択し、レンダリングすると外側の輪郭線だけブラシ2で描画されました!

★複数のオブジェクトがある場合は、オブジェクトの境界線も太いブラシで描画する
オブジェクトが重なっている場合、「シルエット」は重なっているオブジェクトの全体的な外側輪郭線が描画されます。
ノートのオブジェクトの上に電卓のオブジェクトを配置し、両方ともシルエットの描画にブラシ2を設定してみました。
mdiapp_0716_007.jpg
電卓は電卓で外側の輪郭線を太くしたい場合、「オブジェクト境界のブラシ」も太いブラシで描画します。
(わかりやすくするために、青色の別ブラシを作り、このブラシで電卓のオブジェクト境界を描画してみました。)
mdiapp_0716_008.jpg





●線の太さを10pixel以上にしたい
Warabiのブラシの最大径は10pixelです。自分の絵柄や画像のサイズによっては、もっと太い線で書き出したい時がでてきます。そういった時は、レンダリングオプションを利用します。
レンダリングオプション、輪郭線タブに「線幅の倍率」があります。
mdiapp_0716_026.jpg
たとえば、線の太さを20pixelで書き出したいなら、ブラシ径を10pixelにして、線幅の倍率を2 に指定。
通常の線と9pixel、外側輪郭の線(ブラシ2)を12pixelにしたいなら、それぞれブラシ径は4.5と6にして、線幅の倍率は2。
線幅の倍率の最大値が10なので、最大でも100pixelの線で書き出せるということになります。

 




●面を描画すれば、トーン処理の目安になるか?
結論からいうと、やれるとは思いますが調整は結構面倒だと思いますし、いろいろと研究しないといけないので実際に使えるようになるまでは長い道のりかも。
面を描画すれば、影のついた画像が書き出せます。線画を書き出したのちに、面だけを描画した画像を別に書き出して重ねれば、コミスタが持つ機能に多少は近づいた状態にすることは可能だと思います。
Warabiの画面でライトは上面、正面、側面でオレンジ色の●で表示されています。(図中、赤い○で囲んだところ)ここをクリックして選択すると、ライトの位置を調整できます。プレビュー画面では影の付き方は正直よくわかりませんが、ライトの位置を動かしながらレンダリングしていくと、影位置が変化していくのがよくわかります。なお、オブジェクトが床に落とす影を描画したい場合は、当然ながら「床」のオブジェクトを配置しておかなくては描画されません。sketch upで作成したオブジェクトに、メタセコイアで簡単に作った平面のオブジェクトと合わせて配置してみました。
mdiapp_0716_029.jpg  mdiapp_0716_031.jpg
レンダリングオプション 面の描画タブ 「影を描画」のチェック項目に、品質の選択があります。初期値は512で、影のラインはかなりがたがたしていますが、品質を最大の2048にすると、なめらかなラインで影を描画できます。(ただしレンダリング時間は増えます)
mdiapp_0716_032.jpg
解像度600dpi のはがきサイズ横(3496×2362pixel)にまずは線画(線の太さ10pixel)、続けて面のみを描画してみました。なお、床のオブジェクトは、オブジェクトのプロパティ、輪郭線タブでブラシを「なし」に選択し、輪郭線を描画しない設定にしています。
mdiapp_0716_033.jpg   mdiapp_0716_034.jpg
それぞれmdiappで開いて合成、8bppレイヤーに変換してみました。面のみのレイヤーをハーフトーン機能でスクリーントーン風に処理したものがこちら(見やすくするため、画像は縮小処理しています)
mdiapp_0716_035.jpg
影指定くらいには使えるのかな?と思います。ベストな方法はもっと回数を繰り返して試行錯誤する必要があるでしょう。

その後いろいろやってみたところ、まぁこんな感じかな? というやり方がわかってきましたので後日記事にします。





●Warabiの基本設定を保存しておきたい
複数のブラシで線画を書いておきたい場合、自分の絵に合わせたブラシを保存しておくと便利です。
Warabiを開き、新規作成でまだなにもオブジェクトを配置していない状態で、自分にとって必要な設定のブラシを作っておきます。このファイルを ファイル>上書き保存 で適当な名前で保存しておき、何か線画を作成したい際にはこのファイルにオブジェトを配置していくようにすれば、いちいちブラシを作らなくていいので便利です。
また、レンダリングオプションは、オプションの編集ボタンを押すと、複数の設定を保存できます。たとえば線だけ描画する設定と、面のみ描画する設定を作っておけば、面だけ描画して、トーン処理の参考にしたい時など設定を切り替えるだけで簡単です。
mdiapp_0716_009.jpg

次の記事では、3Dデータの入手やデータの加工などの補足を解説します。

Warabiとmdiappの連携解説の記事一覧
【2】Warabiの基本的使い方
【3】実際の作業流れ+やや高度な機能
【4】3D素材を集める、sketch upを学ぶのに便利なサイト集
【5】Warabiを使ってトーン指定補助+カメラの位置調整 (2014.8.20追加)
トラックバック
トラックバック送信先 :
コメント
▼このエントリーにコメントを残す

   
上記広告は1ヶ月以上更新のないブログに表示されています。新しい記事を書くことで広告を消せます。