きしブロ

きしブロ

制作や勉強したことメインに書きます

「作って覚える!ZBrushでVtuberキャラ製作」に参加しました!

どうも、きっしーです。

学生から無事(?)就職し、SIerの卵になりました。

今、その研修で関東に来ています。

それで折角関東にいるので勉強会にでも参加しないともったいない!!

ということでタイトルのイベントに参加しました!

今回はその時の話です。

 

今回やったことはZbrushの機能であるZSphereを使ったモデリング方法です。

目標はVTuberの作成ということでまずローポリを目指します。

ZSphereを使って全体を作る手法は普段しないのでとても新鮮でした。

それでは以下内容です。

 

このイベントは二回目で第一回で頭を作ったそうなので今回は体を作ります。

基本的な流れはZSphereで大まかな形を作る→「Adaptive Skin」→作り込みの流れです。

まずはZSphereで大まかな形を作ります。

とりあえずこんな感じで

f:id:basane:20190414105715p:plain

実際は細かな操作説明や機能説明等々ありましたが今回は割愛します。

こんなに適当で大丈夫かな?という気持ちになりつつ次の工程へ。

 

お次はこれに「Adaptive Skin」という機能を使ってポリゴン化します。

設定は以下のように。

より少ないポリゴンにするために「Use Classic Skinning」をオンにして「Density」を1に、ダイナメッシュも必要ないので「DynaMesh Resolution」を0にします。

f:id:basane:20190414110434p:plain

結果はこんな感じ

f:id:basane:20190414110710p:plain

かなり少ないポリゴンになりました。

が、さすがに少なすぎて制御し辛いので少しポリゴン数を増やします。

そこで「Use Classic Skinning」をオフにして再度「Adaptive Skin」を実行します。

「Use Classic Skinning」は要はポリゴン化のアルゴリズムが以前のものを使用するかどうかというだけです。

基本的にオフにするとキレイな形になりますがポリゴン数が上がります。

f:id:basane:20190414112215p:plain

形はいい感じです。

脚と手に分割が多い気がするのでここから少し手でポリゴンを減らしてサブディバイドして作り込みます。

 

作り込んだ結果がこんなで感じです。

f:id:basane:20190414113113p:plain

時間があまりなかったので全然作り込めてないですが作業の流れはわかりました。

(足先にZSphere足してます^^;)

 

サブディビジョンレベル下げたらこうなりました。

f:id:basane:20190414122429p:plain

シルエットは良さげ(?)な感じになりました。

もう少し色々調整してやればいい感じのローポリモデルができそうです。

 

ZSphereは大まかな形を作るのに向いている感じがします。

ただ、個人的にはトポロジが好みではないので使い所は限られそうです。

大学を卒業しました

タイトル通り大学を卒業しました。

思えばこの4年間で自分は別人のようになった自覚があります。
入学前は典型的なコミュ障陰キャ。自己肯定感もなく、やりたい事も目標もなく空虚な日々を過ごしていた気がします。そのせいか大学以前の記憶はあんまりないです。

大学でサークルに入り、似た趣味を持つ人達に囲まれて手放しに優しくされるのにカルチャーショックを受けました。

そこでいい人たちに出会いつつ3DCGと出会い、僕の人生は加速したように思います。

リア充とは程遠い4年間でしたが人生最高の4年間でした。

これからも加速していけたらいいなぁ…

色んなことがありすぎてとても書ききれないので書きません。いい縁に恵まれた感謝しきりの4年間でした。

ありがとうございました。これからもよろしくお願いします。

A-FrameでWebAR開発

どうも、きっしーです。

久々に記事を書きます。ネタはたくさんあったのにサボってましたハイ。

まぁこれからも不定期でやっていきますが…

とりあえず本題に移ります。

はじめに

最近WebARのハンズオンに参加してきました!

今回はA-Frameというフレームワークを使用しました。

aframe.io

A-FrameはWebVRやWebARを開発するためのフレームワークでHTMLを使って開発します。

今回はハンズオンで得た知見をもとに挑戦したことを書いていきます。

挑戦したこと

  • カーソルの実装
  • レイとレイの当たり判定
  • クリックの実装
  • ボタンの作成

現状作りたいものがはっきり定まっていなかったので練習がてら汎用性の高そうなものに挑戦しました。

また、今回はスマホからブラウザで開くことを目標にしています。

※プログラムに関してはド素人でHTMLもJaveScriptも触ったことない人間なので至らない点はご容赦ください。

カーソルの実装

<a-camera position="0 8 8" collider-check>
    <a-cursor></a-cursor>
    <a-entity raycaster="objects: .collidable" position="0 0 0" rotation="0 0 0"></a-entity>
</a-camera>
<a-box class="collidable"
       position="-1 0.5 -3"
       rotation="0 45 0"
       color="#4CC3D9"
</a-box>

カーソルは常に画面の中心に来るようにa-cameraの子にしてあります。指定はしていませんが色なんかも設定できます。また、今回は検知する対象(box)を「collidable」クラスにしています。

レイとレイの当たり判定

<script>
      AFRAME.registerComponent('collider-check', {
      dependencies: ['raycaster'],

      init: function () {
      this.el.addEventListener('raycaster-intersection', function () {
      console.log('Hit');
        });
      }
    });
</script>

レイを飛ばすのにはJavaScriptを利用しました。飛ばすこと自体は最初の2行で行っています。当たり判定の方はthis~の部分です。レイが当たるとコンソールに「Hit!」と表示されます。

クリックの実装

 

<a-box class="collidable"
         position="-1 0.5 -3"
         rotation="0 45 0"
         color="#4CC3D9"
         event-set__click="_event: click; color: #5A67A6">
</a-box>

クリックにはevent-setコンポーネントを利用しました。A-Frame便利ですね。参加したハンズオンではJavaScriptを使ってクリックしていましたがどちらがいいのかは自分にはわからなかったです。

ボタンの作成

<div style="position: fixed; bottom: 150px;">
        <button type="button" id="recenter" button>recenter</button>
</div>
<script>
        $('#recenter').click(function(){
          document.querySelector("a-scene").emit('recenter',{})});
</script>

 

ボタン部分です。ただ押すだけでも良かったのですが折角なのでrecenterしてみました。画像をボタンにできたら良さそうですね。できるかは知りませんが。Jqueryを使用しています。

おわりに

とりあえずレイ飛ばしたり、クリックしたりボタン出したりとできたので作るものが決まった後も操作系は問題ないかな?

ほとんどプログラム触ったことない自分でも「なんかできそう」と思えたのでA-Frameはすごいです。しかもWebブラウザで動くっていうのが見せやすいしとてもいいですね。

A-Frameはいいぞ。

【Maya】MayaでUVエディターが出なくなったときの対処法

こんにちは、きっしーです。

特に話題もないので早速本題にいきます。

 

本題

さて、前置きはこれくらいにして本題です。

皆さん、

Maya使っててUVエディタ出てこなくなったことってあります?

まぁ僕はUVエディタにかぎらずアウトライナとかもあるんですが…

なので今回はMayaでUVエディターが出なくなったときの対処法を紹介したいと思います。

 

経緯

僕はハッカソンや制作会に参加するのが趣味でなんですが家ではデュアルディスプレイで作業してて、ハッカソンなんかでノーパソからリモートして作業してるときなんかによくなります。

最近まではプリファレンス削除してやってたんですが家に帰って「またUIの配置し直すのめんどくせぇ」ってなりまして今回ちゃんと勉強してみました。

ちなみにバージョンはMaya2018です。

 

実際の作業

結論からざっくりいうとプリファレンス内の該当箇所のスクリプトをちょちょっといじります。

 

実際にUVエディタが出てこなくなったときの画面がこちら

f:id:basane:20180131132453p:plain

UVエディタのアイコンを押してもUVツールキットしか出てきません。

困った…

 

ということでMayaを一旦閉じて早速プリファレンスを見ていきます。

念のために書いておくとプリファレンスは

[C:\Users\ユーザー名\Documents\maya\2018\ja_JP\]

の中にある"prefs"ってやつです。

"prefs"の中には"userPrefs"や"windowPrefs"といった いかにも な物がありますが今回のお目当てはこれらではありません。

ということで"workspaces"というフォルダを開きます。

こっちも いかにも って感じですね。

この中には"Maya_Classic.json"というものが入りますね。

今回のお目当てはこいつです。

MELや.pyではないので戸惑うかもしれません。

でも恐れずいじってやりましょう。

 

とりあえず適当なテキストエディタで開きます。

もちろん頑張ればメモ帳でできますが大変なので普通にサクラとかVSとかでやるのをおすすめします。

ちなみに僕は今回Visual Studio 2015でやりました。

f:id:basane:20180131133936p:plain

開くとこんな感じ。

何書いてんのかさっぱりですね。僕もです。

細かく見ていくとキリがないのでさっさと結論からいっちゃいます。

このファイルの結構下の方にある

f:id:basane:20180131134549p:plain

この部分を見ます。

僕の方だと356行目~の部分ですね。

まぁ無かったら "objectName": "polyTexturePlacementPanel1Window"ってのを探してみて下さい。

"title": "UV Editor"とか書いてあるからわかりやすいかも。

こいつの

"uiscript": "if(!"panel~…

を消します。

以上!!

すると

f:id:basane:20180131142038p:plain

出ましたー!

ちなみにソースコードの"controlWidth":~ と"controlHeight":~ を両方消すと他のレイアウト情報なんかも消えてしまうので注意。

 

このへん理解できればUI周りもっと面白いことできるんじゃないかなー

なんて思ったりしてます。

 

最後まで読んでいただきありがとうございました。

 

 

 

最後に注意点として2つほど

①これはあくまで僕の環境、事例での解決方法であり、同じ症状の全ての場合で解決できると断言するものではありません。あくまで参考程度にお願いします。

②この記事を見て実際に試した場合なにか予期しない事が起きても当方は一切の責任を取ることができませんので自己責任でお願いします。

【Zbrush】基本のキホン-ダイナメッシュって?

Zbrushの基本

Zbrushを購入してはや3ヶ月あまり、ユーザーマニュアルが届いたぜ!

結構詳しく色々のってるー♪

Zbrushを初めて最初に「ん?」となる部分「ダイナメッシュ」

僕に書けるのはその上澄みくらいだけど今から始める誰かの参考になればいいかな

ダイナメッシュって?

まず簡単にダイナメッシュの特徴についてまとめてみます

  • Zbrush特有の機能(僕は他で聞いたことない)で低~中解像度のベースメッシュをモデリングするときにつかうモード」←ここ重要
  • ベースメッシュを作る用なので細かいディティールを作るのには向いておらず細かい部分はサブディビジョンして作り込むのが基本
  • 仕様上トポロジーが何度も変化するのでUV情報を持てない

操作について

機能が多くて色々書いていくとスペースが足りないので簡単に操作のキホンだけをを紹介

  • 解像度の指定
  • ダイナメッシュボタンを押す
  • 再計算
    「Ctrl+何もない所をドラッグ(マスクのクリアと同様)」で再計算
    マスクがかかっている場合はマスクのクリアになるのでこの操作を2回行う
    再計算は作業中にトポロジが崩れるごとに行う

解像度について

  • ダイナメッシュの解像度はZbrush内の基本グリッドにもとづいて決まる
    よって大きなモデルだと低解像度でも細かく分割され、小さいモデルだと粗く分割されてしまう

    f:id:basane:20171203163848p:plain

  • ダイナメッシュのための最適化
    モデルをダイナメッシュ用のサイズに最適化するには「ツール>変形>ユニファイ」を実行する

フローの話

ダイナメッシュの使い所の一例です

  • プリミティブにダイナメッシュを適用して変形し、トポロジが崩れたら再計算
  • あくまでもスカルプトの初期段階で使うことを想定したツールなので細かい部分はサブディビジョンで作り込む

注意点

ダイナメッシュを使う上であった注意点です

  • ダイナメッシュは体積(ボリューム)のないサーフェス(閉じていないポリゴン)には適用できない
  • また、極端に薄い場所もダメ
    まだらに細かい穴が空いたようになる
    対処法はInflatブラシで厚みを付けるかCurveFill系のブラシで板を作って薄い箇所にかぶせて再計算する
  • ダイナメッシュは「モード」なので終了させなくてはいけない
    例えば終了しないままディバイドしてディティールを作り込んでも再計算してしまうとディティールが失われる

 

色々書きましたがダイナメッシュはまだまだこんなもんじゃない!
僕も日々勉強です
※間違い等ございましたらコメントなどでご指摘いただけると幸いです