Shader

shader-dev は、ShaderToy 風のリアルタイム表現に使える実用的な GLSL シェーダースキルです。ray marching、SDF シーン、ライティング、パーティクル、流体表現、ポストプロセス、そして UI Design 向けの shader-dev を、汎用的なプロンプトよりも少ない試行錯誤で構築・デバッグしたいときに役立ちます。

threejs-shaders は、GLSL、ShaderMaterial、uniforms、頂点変形、フラグメント効果を使って Three.js のシェーダーを書くための実践ガイドです。フロントエンド開発で、動くシェーダーの基本形が必要なとき、マテリアル選びを明確にしたいとき、汎用的なプロンプトよりも迷いを減らしたいときに役立ちます。

threejs-materials は、メッシュのマテリアルを選定・設定・トラブルシュートするための Three.js マテリアル向けスキルです。リアルな PBR、アンライトのフラットシェーディング、トゥーン表現、デバッグ用ビュー、テクスチャ主導のスタイリング、カスタムシェーダーに使えます。より速く、より一貫したマテリアル判断が必要なフロントエンド開発チームに有用です。

フロントエンド開発向けの threejs-postprocessing 技能です。EffectComposer のパイプライン構築、bloom、被写界深度、blur、カラーグレーディング、独自のスクリーンスペースパス追加に対応します。このガイドでは、レンダー処理の流れを組み立て、エフェクトを調整し、既存の Three.js シーンに composer の描画を組み込む方法を確認できます。

threejs-lighting は、Frontend Development 向けの実践的な Three.js ライティングスキルです。ライトの種類選び、影の設定、環境光の追加、そして平坦に見える・暗すぎる・白飛びするシーンの調整に役立ちます。より速く、より一貫性のあるシーンライティングが必要なときに threejs-lighting ガイドを活用してください。

makepad-2.0-shaders は、Makepad 2.0 の shader code を書き、デバッグするための Frontend Development スキルです。pixel: fn() と vertex: fn() ブロック、Sdf2d の形状、カスタム widget の描画、premultiplied alpha、そして実践的な導入・使用ガイダンスに、この makepad-2.0-shaders スキルを活用してください。