- 運営しているクリエイター
記事一覧
🎡three.js ShaderMaterialとBufferAttributeの違い シェーダーを導入するための究極のテクニック Three.js バリアリングとユニフォーム
ビルトインマテリアルに含まれていないエフェクトの実装
パフォーマンスを向上させるために、多数のオブジェクトを 1 つの BufferGeometry に結合する。
昔はShaderMaterial使ってた、今はInstancedBufferAttribute各マテリアルには2種類のシェーダーを指定できます。
シェーダーの変数には、ユニフォーム、アトリビュート、バリアリングの3種類があります
・
🎡MixamoのリグキャラクターをThree.js上で動かす glTFとfbxの違い
https://tympanus.net/codrops/2019/10/14/how-to-create-an-interactive-3d-character-with-three-js/
(function() {// Set our main variableslet scene, renderer, camera, model,
🎡アニメーションfbxファイルをthree.jsライブラリで読み込む mixamoとかCROS対策も考える
はじめに、three.jsの推しフォーマットはglTF一択、fbxはあくまでサブ、であるが未だにue,unityに強い影響力が発揮出来るfbx
Three.jsで動くデモ
立ちはだかる5MBの上限値mixamにたくさんキャラクターがいるが、ダウンロードすると7MBくらいあってp5.jsのファイル5MB上限にひっかかってしまう。
Pixivで投稿できるようだが、フォーマットがVRMなのでFBX
🎡10秒で3D Monster Meshからのp5.js 全部ブラウザで
ツイートでご紹介いただいた、メッシュが作れるらしい。
10秒で作ってみた
おおう、できーた。
objでのエクスポートもできた。すごい、なんか、腹のほうがうつってしまっているが
おお、こちらもすぐ連携。ブレンダーさんはどうだろうか?
最初箱にうまっておりびっくりしたが、ずらしたらちゃんと取り出せた。背中からみるとなんかゆるキャラっぽい?大きさもこないだの石像みたいにばか大きくなってなくて好
🎡全く解説読まないでUE/Unityのテクスチャマッピングに挑戦する マテリアルの気持ちになってみる
マテリアルの変更をUEとUnityでやっておく。
UEのマテリアルそれぞれのノードは、特定のタスクの実行を意図した HLSL code のスニペットを格納します
木目が作れるようだからこのまま作ってみよう
まあなんか、待ってたらレンダリングされて出た
何かが失われている. たぶん光的なやつ
UnityいまやThreeで使いどころがないのプラスチックのおもちゃ箱化しているががんばろう。
🎡ジオメトリとマテリアルを、メッシュとしてシーンにぶちこんだあと、レンダラをDOM上にきれいに構成する。 WEBGLとGLSLもすこし
glTFチートシート
https://github.com/KhronosGroup/glTF/blob/main/specification/2.0/figures/gltfOverview-2.0.0b.png
ここのチートシートが3D入門によさそうなので左上から見ていく
1-1 コンセプト長年のもやもやしたものがすっきりしてきた。
1-2 M=T*R*Sノードごとにマトリクスがあって
🎡OBJファイルBlenderのDecimate Geometry ツールで頂点を減らしてサイズ縮小、でかめの石像データなどを手軽に扱えるようにする
こいつをgithubにあげたいが、重すぎてあげられない問題。Blenderで解決できないかとおもった。
こ、これは後頭部?
引きでとってみたが、中央の海王星よりはるかにでかいおひとのようだ
なるほど、ちょうでかい
TRSの法則はglTFで覚えた。こんかいはscaleの術をつかう
まだでかいが、だいぶ小さくなった。
ようやっと人並みのサイズに。
しかし、大きさを小さくしても、OBJのサ
🎡メッシュは3d印刷できる、マテリアルは3d印刷できない、シェーダーも印刷できないだろ、そういうことだ。では パーティクルは?
3Dにおける炎やエフェクト、そのやりとりを知るため、実際に炎を出しているサンプルを方々で探っててみることにした。
こんなのがあった。ずいぶんとてもきれいだな。すごい
サンプルソースをp5で動くようにさせてもらった。バージョンr88だったので、そこだけ気を付けて、奥さん
ジオメトリとマテリアルで実現しているようだった。pointsというのが気になる
ちなみにUnityだとどうすればいいの?
🎡Blender アニメーション unityとの違い NLA Tracks
Threeでちゃんと動くのはこのデータなので、まずはこいつを丁寧に見ていって、動かないやつとの比較をしていく。playcanvasでもサクサク動いている。Blenderでも見てみる。
NLA Tracksというのが記録されているようだ。ちなみにUnityに同じファイル読み込んでも発情期の孔雀みたいになってだめだった。
VRM -> glbに拡張し書き換え後 Blender
FBXの読み込み