？？？

やあ、ロボ子。今日はThree.jsを使った、まるでフォイルステッカーみたいなシェーダーの話をするのじゃ！

？？？

フォイルステッカーですか、博士？ 角度によって虹色に変化して、金属片が輝くようなものですよね。

？？？

そうそう！あの虹色のシマーは、表面の層間での光の干渉で生まれるらしいのじゃ。それを視野角を色相にマッピングして近似するってのが面白いところ！

？？？

なるほど。視野角で色が変わるんですね。金属箔の反射粒子も、動かすと輝くのが特徴的です。

？？？

そう！シェーダーでは、手続き型ノイズを使って、表面にランダムな明るさのパッチを作るのじゃ。これがキラキラ光る感じを出す秘密！

？？？

手続き型ノイズですか。ランダムに見えて、実は計算されたパターンなのですね。

？？？

その通り！実装では、Three.jsを使って、剥がれる虹色のステッカーをフォイルフレークでシミュレートするのじゃ。

？？？

剥がれる表現まで！ 頂点シェーダーとフラグメントシェーダーで処理を分担するんですね。

？？？

そう！頂点シェーダーは、剥離ジオメトリを処理して、必要な情報をフラグメントシェーダーに渡すのじゃ。

？？？

`uPeelAmount`（剥離の強さ）や `uPeelAngle`（剥離の角度）などのUniform変数がたくさんありますね。Rodriguesの回転公式を使って頂点を回転させるんですか。

？？？

さすがロボ子、よく見てるのじゃ！その通り！Rodriguesの回転公式を使うことで、よりリアルな剥がれ方を表現できるのじゃ。

？？？

フラグメントシェーダーは、ライティング、反射、虹色、フォイルフレークを全部処理するんですね。アルファカットオフで透明なピクセルを早期に破棄したり、背面シェーディングも行うと。

？？？

そう！フォイルフレークの計算、虹色の計算、環境反射の変調…全部やるのじゃ！

？？？

`uFlakeSize`（フレークサイズ）や `uFlakeBrightness`（フレーク輝度）など、フォイルフレークに関するパラメータもたくさんありますね。

？？？

そうじゃ！`uMetalness`（金属光沢）や `uRoughness`（粗さ）も調整できるから、金属の質感も自由自在なのじゃ！

？？？

環境光の強度（`uEnvIntensity`）や金属マスク（`uMetalmask`）まで！ かなり細かく調整できるんですね。

？？？

じゃろ？ 虹色の強さ（`uIridescence`）、最小値（`uIriMin`）、範囲（`uIriRange`）も調整できるから、虹色の出方も思いのままなのじゃ！

？？？

すごいですね、博士。まるで魔法みたいです。

？？？

まさに魔法じゃ！このコードはCreative Commonsで公開されてるから、みんなも試せるぞ！

？？？

試してみたいです！

？？？

ところでロボ子、ステッカーといえば…剥がした後のベタベタ、あれなんとかならんかのじゃ？

？？？

それ、シェーダーでは再現できません！