WebGLシェーダーをリアルタイムプレビュー付きのエディタで体験しながら、 段階的に学べるインタラクティブな学習プラットフォームです。
学習をはじめる全10章・40レッスンで基礎から発展まで
GPUの仕組みとシェーダープログラミングの基礎を学びます。最初のシェーダーを書き、座標系やUniform変数の使い方を理解しましょう。
デジタルカラーの基礎を学びます。RGB色空間、色の補間方法、HSBカラーモデルを使った表現力豊かな色彩制御を習得します。
数学関数を使って値を自在に変形する方法を学びます。step、smoothstep、fract など、シェーダーの基礎となる関数群を習得します。
符号付き距離関数(SDF)を使ってシェーダーで図形を描く方法を学びます。円、矩形、線など基本図形からブーリアン演算まで習得します。
座標変換を使ったパターン生成の技術を学びます。回転、スケール、タイリングなどの変換を組み合わせて美しいパターンを作ります。
時間とユーザー入力を使ったアニメーションの技術を学びます。イージング関数やマウスインタラクションで動的なビジュアルを作ります。
プロシージャルな自然表現の核となるノイズ関数を学びます。疑似乱数からパーリンノイズ、fBmまで段階的に習得します。
テクスチャの読み込みと画像処理の基礎を学びます。フィルタ、畳み込み、ディストーションなどのエフェクトを実装します。
レイマーチングやライティングなど、より高度なシェーダーテクニックを学びます。3D表現への入り口を探ります。
Three.jsやReact Three Fiberと組み合わせてシェーダーを活用する方法を学びます。実践的なWebGL開発の総仕上げです。