shader入門から一年たったので、Shader周り濃い目で作ったものについてかく

3Dモデリングの話もしたいので、そちらも含めて辿っていきます。
作ったものの話を進めるうえで紹介不可欠な人は、こういう記事でどう扱えばいいか分からないため匿名での紹介にとどめます。
12月末~年明け
自作アバターがVRCで使えるということを知ったのと、当時友達がBlenderで遊んでいたという二つの要因が合わさって、Blenderで3Dモデルづくりを始めました。
一番最初に作ったのは、別のゲームで作成したキャラクターです。
#tonoSHAKE 0から始めたモデリングの歴史1 pic.twitter.com/EjiYkGr1Af
— tonoSHAKE🍶 (@TonoShake) January 21, 2019
大学の図書館で見つけたこの本を見ながら操作を覚えました。
Blender 3Dキャラクター メイキング・テクニック
僕が見たものは、ちょっとバージョンが古かったのとボーン構造がVRC用と違っていたことで苦労しました。
出来たものに納得がいかなかったのでアバターワールドから持ってきたアバターを使って、喋るタイヤとしてVRCパブリックを渡り歩いていました。
日本人とは会えてなかったですが、不思議空間に魅了されていたので気にならなかったです。
確かこれ作った少し後ぐらいに友達から中古で買ったHTC VIVEが届いたはず
1月半ば~末
Blenderでポリゴンを張るのに疲れたのでSteamで販売していたKodonというVRソフトでスカルプトに挑戦しました。
#tonoSHAKE 0から始めたモデリングの歴史2 pic.twitter.com/tN58QNakoI
— tonoSHAKE🍶 (@TonoShake) January 21, 2019
1時間かからないくらいで出来るし、形を気にすれば自動ウェイトでなんとなく動くものになったので2~3日の間は毎日アバター作ってはアップロードしてました。
The Great Pugでとった写真が残ってました。(左の犬)
。
一人で彷徨う中たどり着いた坪倉家で、日本語を話すMさんに会いました。
色んなワールドを見せてもらう中で、Treehouse in the Shadeへ行きました。
そこで出会ったHさんとANさんと、連れてきてくれたMさんの三人の会話の中で"シェーダー"って語が出てきます。
更に聞いていると、Mさんが持っていた虹色のケミカルなサンドウィッチがどうやらそのシェーダーってものによって表現されていることが分かりました。
その時撮った写真 (1月25日)
シェーダーが気になったので数日こねくり回してましたがよくわからなかったので資料を購入します。ここが1月28日です。
そして色を時間で変えるシェーダーを作りました。
扇子持って踊りはじめたのもこのころ
二月
大学に向かうバスの中で作ったヒヨコを使って回転を試しました。
何で回したのか覚えてないですが、ポケモン的な混乱状態の表現がしたかったのかなと思います。
アニメーションが分からなかったので回転行列使って実装しました。
僕は今感動している pic.twitter.com/FMwDTViGnb
— tonoSHAKE🍶 (@TonoShake) February 12, 2019
こんな感じの格好で扇子持って踊ったりマヨネーズ振り回したり色々してたらJapan TownでAWさんに出会います。
めちゃくちゃ面白いアバターを色々見せてもらって爆笑していたのを覚えています。
2月22日の夜に旅行先の鯖江のホテルでレイマーチングを試していました。
当時は距離をどれだけ進めるか決める手法を知らなかったのと、距離関数の扱い方が全然わかっていなかったので、正八面体を表示するために極小の固定長ですすめる方法で実装していました。
正直ぱっとしなかったので、これ以降しばらくレイマーチングから離れます。
3月
実物見ながらモデリングすれば楽にできるって気づいたので、持っていたベースのモデルを作ります。
27000△ pic.twitter.com/k09fXiaYbX
— tonoSHAKE🍶 (@TonoShake) March 5, 2019
頭おかしいくらい集中してたので二日で完成させられました。
このころAWさんやODさんに見せてもらったアバターから、ジオメトリーシェーダーというものの存在を知ります。
ジオメトリの名前に黒魔術かと思って畏れおののいてたけど、やっていることとしてはやはり数学なんだね
— tonoSHAKE🍶 (@TonoShake) March 7, 2019
全然わからん pic.twitter.com/6SmKX3lWeG
ちょっとやってみたもののこの時はよくわかりませんでした。
何となく竹を作りたくなります。
Blenderの配列複製モディファイアの利便性を知っていたのでガンガン使って伸ばしてましたが、長さ調整するためにBlenderを起動するのが面倒だと思います。
Unityで完結させるためにどうしたらいいかなって考えた時に、ポリゴン描画を増やせるジオメトリーシェーダーを思い出します。
出来たのがこれ
全然うまくいかんから同じものを書き直したらなんかうまくいった
— tonoSHAKE🍶 (@TonoShake) March 13, 2019
竹が90度曲がってるからZに入れてる pic.twitter.com/2y4sj6cIw6
楽しくなり竹林そのものを好きに作りたくなって、竹林シェーダーというものを作ります。
オートで作る竹林 とりあえず完成
— tonoSHAKE🍶 (@TonoShake) March 13, 2019
高さと本数は頂点数か何かで引っかかって同時には増やせないから、一節分をUnity上で適当な長さに積むかあらかじめ積んだものを使うのがよさそう
うにょうにょ動いて増えていくのが面白い pic.twitter.com/ZfOFvKlxH6
今見ても結構いい感じだと思います。
このシェーダーを使ってVRChat上に初の自作ワールド「tonoTAKE」をあげました。
このころHさんに見せてもらったシェーダーの状態保持機構が印象的で、いつか使ってみたいなと思い続けるきっかけになりました。
AWさんにもじゃもじゃ毛の生えたアバターを見せてもらい、ファーシェーダーというものがあることを知ります。
楽しそうだなって思ったので、まず毛を生やすためのモデルを作りました。
— tonoSHAKE🍶 (@TonoShake) March 17, 2019
そしてカビっぽくなったり毛根マップをもらったり色々あって、毛を生やすことに成功します。
— tonoSHAKE🍶 (@TonoShake) March 24, 2019
得た知識で色々遊んでたら三月は終わりました。
記憶があいまいですが、ODさんの岩みたいなアバターを見せてもらったのもこのころだったかもしれないです。そこからテセレーションの存在を知りました。
4月
AWさんの呟きからパーリンノイズというものを知り、記事を色々見ながらそれっぽいものが作れます。
RT先のを参考にちょっといじったらこんな感じ 凄い… pic.twitter.com/8lUyrkg5PC
— tonoSHAKE🍶 (@TonoShake) April 8, 2019
4月の残りはパーリンノイズを使って遊びます。
固定長レイマーチングで立体感を出してみたり、壁に張ったり、ファーシェーダーの毛根マップをノイズに変えたり。
tonosamaの作成は4月末の一週間で行いました。
大都会 pic.twitter.com/cokVYU1xlK
— tonoSHAKE🍶 (@TonoShake) April 28, 2019
作ったファーシェーダーと組み合わせて遊んでました。
5月
AWさんが見せてくれたベースをレンダリングしたものがかっこよかったので、Blender機能であるレンダリングを触り始めます。
— tonoSHAKE🍶 (@TonoShake) May 4, 2019
このころにカサゴのモデルとこの画像を作りました。
カサゴのボーンをアニメーションさせる時に、ボーンをAdd propertyしていくのが苦痛だったので、Unityのスクリプトで自動化させました。
https://t.co/hbI29Il1ed
— tonoSHAKE🍶 (@TonoShake) May 6, 2019
boneと紐づいているメッシュの名前と、ボーンの一番根元の名前を入れて実行すると、紐づいているボーン全部の回転と移動と拡大縮小の実行時点の値を入れたアニメーションファイルを作ってくれるスクリプトができた
動作確認をあんましてないので実行は自己責任で pic.twitter.com/IORXQV7QQL
講義でこの動画を見て、光が回るタイプのレーダーが作りたくなります。
途中まで普通に作っていましたが脱線してこうなります。
好きな雰囲気 pic.twitter.com/mCD0vjX718
— tonoSHAKE🍶 (@TonoShake) May 10, 2019
このころAWさんから視界ジャックに使われるのはGrabPassって話を聞いて、存在を知ります。
画像処理の勉強でやった3x3空間フィルタをGrabPass使ってかけられるようにしたシェーダーと、ドット絵シェーダーを作ります。使い方次第なので同じシェーダーです。
イマイチのってこないのでスイッチできるようにして遊んでた pic.twitter.com/zQt2vMvQrT
— tonoSHAKE🍶 (@TonoShake) May 19, 2019
ポスタリゼーションで色をいい感じにする部分でめちゃくちゃ凝りました。
VRChatに「Dotono」という名前のワールドとしてあげてあります。
このあと暫く空間フィルタ系シェーダーをぽつぽつと作ってました。
6月
映画「怪獣の子供」を見て深いプールが作りたくなり、波のシェーダーを作ります。
とりあえず波っぽいものを目指した結果ゲルストナー波にたどり着き、シェーダーに実装しました。
ゲルストナー波 pic.twitter.com/zfv7KBllZN
— tonoSHAKE🍶 (@TonoShake) June 6, 2019
「Y180」って名前でVRCワールドとしてあげてあります。
シェーダー作りが迷走していたので、自分の落書きをもとにカエルの3Dモデルを作り始めます。
7月
出来たカエルがこれ
#VRCSummer #VRChat pic.twitter.com/gixg0tr4l3
— tonoSHAKE🍶 (@TonoShake) July 6, 2019
夏の目標にレイマーチングの習得を掲げて、スフィアトレーシングを使いだします。
— tonoSHAKE🍶 (@TonoShake) July 31, 2019
8月
落選マーケットの締め切りが近かったので、ブースのモデルをつくりはじめます。
— tonoSHAKE🍶 (@TonoShake) August 7, 2019
この時は形までできました。
盆でお酒を飲んだときに、団扇の花火が動いたら楽しいなって閃いたので、勢いで花火の団扇を作りました。
これがやりたかった pic.twitter.com/jDa1FtH8W4
— tonoSHAKE🍶 (@TonoShake) August 15, 2019
良い思い付きでした。
落選マーケットの締め切りまであと数日になったので急いでブースを完成させます。
— tonoSHAKE🍶 (@TonoShake) August 18, 2019
色塗りが面倒だったので、全部シェーダーで色を塗りました。
僕の作業分が終わった後の待ち時間が暇だったので、紅葉を舞わせて遊んでました。
もみじ
— tonoSHAKE🍶 (@TonoShake) August 19, 2019
テクスチャ使ってないからそのままブースに突っ込める pic.twitter.com/AsqOeTedwg
ひらひらさせるようなものはシェーダーで描いたことないなってだけで書いたので特にこだわりはありません。
9月
季節のシェーダーを描こうと思い、紅葉シェーダーを発展させました。
いいね pic.twitter.com/oAoEhAawRf
— tonoSHAKE🍶 (@TonoShake) September 17, 2019
カメラを使った状態保持と物の検知を行って、積もったり掃除出来たりできるようにしました。
毎度毎度細かくメッシュを割りなおすためにBlender開くのがめんどくさかったので、テセレーションデビューしました。
「Autumn memory」って名前でVRChatにあげてあります。
9月末からレイマーチングをもりもりかき始めます。
https://t.co/RUtTWtKVEV pic.twitter.com/YparWaAFbx
— tonoSHAKE🍶 (@TonoShake) September 26, 2019
帰りの電車とか昼休みとか暇を見つけては書いてたので、数日で大体空でかけるようになりました。
10月
オブジェクトスペースレイマーチングに興味を持ち、少しずつ書きだします。
レイマーチングして出てきた物体の表面に、物体ごとに異なる絵を描く と、物体の位置関係に応じて画を変えるみたいなことをやろうとして頭抱えてました。
頭おかしくなりそう
— tonoSHAKE🍶 (@TonoShake) October 7, 2019
これがやりたかった pic.twitter.com/17c8K9SEnW
出来ました。
空間を駆使した片方の物体だけワールドスペースのものをシェーダーフェスに出展しました。
Gさんに紅葉シェーダーは結構需要ある って言われて、配布を始めました。
何でもひらひら舞わせられるシェーダー | さかなや https://t.co/KKV1IzlALR #booth_pm
— tonoSHAKE🍶 (@TonoShake) October 12, 2019
紅葉と雪と桜がいけます pic.twitter.com/hudMr0FmMW
配布用に真剣に調整したのでめちゃくちゃ疲れました。
フォントがベジェによって構成されてるってことを知ったので、ベジェ曲線の制御点を抽出すればどこでも文字表示できるのではと思い、フォントから制御点を抜き出してシェーダーにするスクリプト をPythonでかきました。
ぬるっと変形してて良い pic.twitter.com/8ddXqmLPfI
— tonoSHAKE🍶 (@TonoShake) October 18, 2019
「パーティクルライブとかで文字メッシュを毎度作らなくても、シェーダー内で文字指定すれば表示できる」というものが理想でしたが、思ったより重かったので服の模様にしました。
— tonoSHAKE🍶 (@TonoShake) October 27, 2019
結構気に入ってます。
31日からSTYLY Avater Diorama Award 2019に向けて急ピッチでジオラマ制作を始めました。
11月
6日でジオラマを完成させ応募しました。
https://t.co/Lu1KSTqYAl
— tonoSHAKE🍶 (@TonoShake) November 4, 2019
STYLY Avatar Diorama Awardsに応募しました
かわいいClambitくんとカエルが居るちょっと変わった庵です
是非見て下さい pic.twitter.com/5VICsYeNsN
Audience賞をいただけました。
シェーダーの方向性を見失い、ふて寝してたらゴジラの背中のとげがふと浮かんで、体から水晶はえたら面白いなって思ったので、なんにでも水晶を生やせるシェーダーをかきました。
https://t.co/fD6bhh2RjI
— tonoSHAKE🍶 (@TonoShake) November 17, 2019
なんにでも水晶をはやせるシェーダーの配布を始めました。
おまけでそのシェーダーを使って作った、雑貨屋とかで見る水晶の置物も公開しました。
置き物の画像はリプにぶら下げておきます。
よろしくお願いします。 https://t.co/tJn5JKXkTN pic.twitter.com/5jsP9CKoKo
ジオメトリーシェーダーで四角の板以外を作るのは初めてだったので、下書きしてから実装してました。
セルラーノイズを纏ったアバターをODさんに見せてもらって以降、ずっと気になってたセルラーノイズを実装しました。
いいかんじだから寝る pic.twitter.com/D9thzX5QEg
— tonoSHAKE🍶 (@TonoShake) November 21, 2019
今までにない見た目がたのしかったのでこねくり回して遊んでました。
12月
セルラーノイズの生々しい感じに中てられて、生々しいレイマーチングの画を描きたくなりました。
あとで自分がノートでも見れるように動画とった https://t.co/Rz9WJ0neAU pic.twitter.com/0IBjL0prqj
— tonoSHAKE🍶 (@TonoShake) December 2, 2019
良い具合の気持ち悪さが出て満足してました。
iq氏のHappy jumpingを解説したさやちゃんぐbotさんの記事を見て、ライティング意識したものを描きたくなっていろいろやってました。
sayachang-bot.hateblo.jp
shadowrayという考え方もここから知りました。
" Twisted" by "tonoSHAKE" https://t.co/lN8RGT8Mf5 #NEORT pic.twitter.com/KV2KmPR8NP
— tonoSHAKE🍶 (@TonoShake) December 8, 2019
fovをいじることの楽しさをこのシェーダーで知りました。
ハートが描きたくて描いたシェーダーです。
"Seabed" by "tonoSHAKE" https://t.co/Nqveme9hl3 #NEORT pic.twitter.com/xI4yaALEll
— tonoSHAKE🍶 (@TonoShake) December 11, 2019
レイマーチングのオブジェクト描画位置に移動させた座標を、一部軸成分だけ転用したことが自分のなかでは革新的でした。
人なんだけど細かく見ると不定形なアバターが作りたくて挑戦してました。
ビューティフォー pic.twitter.com/rGGucaMen4
— tonoSHAKE🍶 (@TonoShake) December 15, 2019
めちゃくちゃ重たいのと描画順の問題で没になりましたが、Unityの画面では最高です。
12月21日はxRTechNagoyaでShaderについての話で登壇しました。
人生初登壇でめちゃくちゃ緊張して記憶がほとんどないんですが、登壇者の凄さは理解できました。
docs.google.com
その時の資料です。
1月
序盤は自分の中で方向性がめちゃくちゃになってだいぶ苦しんでました。
自分が一番やばいと思うことをやろう って思い、水槽を作り始めました。
ゆるーく色塗ったのと影つけと泡のうつりこみを入れた
— tonoSHAKE🍶 (@TonoShake) January 24, 2020
物理ベースの反射を資料見ながら実装した pic.twitter.com/WbFZrzQCyE
以上が一年ほどでやってきたことの主だったことです。