2025.11.02

Github:

https://github.com/sakkom/portfolio-kuhu/tree/main/app/kuhu/linearSinDistortion

uv座標の正弦波ディストーションでの揺らぎ


    precision mediump float;
    uniform sampler2D tDiffuse;
    uniform vec2 uResolution;
    uniform float uFreq;
    uniform float uAmp;
    in vec2 vUv;

    void main() {
      vec2 uv = vUv;
      uv.x += sin(vUv.y * uFreq) * uAmp;
      uv.y += sin(vUv.x * uFreq) * uAmp;
      gl_FragColor  = texture2D(tDiffuse, uv);
    }
  

どちらか一方で考える事から始めた。 y=0のときを想定しx軸[0, 1]を[0, freq]の入力にしてsin関数の出力によりいくつかの波が発生するようにパラメータを用意した。 uAmpはこの場合高さでありsin関数の出力[-1, 1]はuv座標に対しての操作であるため縮小して[-0.1, 0.1]が最大となるように調整した。 今回は正弦波で揺らぎを実装したがいろいろな波で試してみるのが応用になってくるのだと思った。