跳到主要内容
← Noise

Noise

Shape Distortion

shader-learning 自学第 9 课:Shape Distortion

实时渲染 · 纹理 GLSL

第 9 课:Shape Distortion

实现

uniform vec2 iResolution;
uniform float iTime;
uniform sampler2D iChannel0;

vec3 random3(vec3 st){
  float d1 = dot(st, vec3(12.3, 32.1, 21.3));
  float d2 = dot(st, vec3(45.6, 65.4, 54.6));
  float d3 = dot(st, vec3(78.9, 98.7, 87.9));

  st = vec3(d1, d2, d3);
  return fract(sin(st) * 14.7) * 2.0 - 1.0;
}

float noise(vec3 st) {
  vec3 i = floor(st);
  vec3 f = fract(st);

  vec3 u = smoothstep(0.0, 1.0, f);

  float d1 = dot(random3(i + vec3(0.0, 0.0, 0.0)), f - vec3(0.0, 0.0, 0.0));
  float d2 = dot(random3(i + vec3(1.0, 0.0, 0.0)), f - vec3(1.0, 0.0, 0.0));
  float d3 = dot(random3(i + vec3(0.0, 1.0, 0.0)), f - vec3(0.0, 1.0, 0.0));
  float d4 = dot(random3(i + vec3(1.0, 1.0, 0.0)), f - vec3(1.0, 1.0, 0.0));

  float d5 = dot(random3(i + vec3(0.0, 0.0, 1.0)), f - vec3(0.0, 0.0, 1.0));
  float d6 = dot(random3(i + vec3(1.0, 0.0, 1.0)), f - vec3(1.0, 0.0, 1.0));
  float d7 = dot(random3(i + vec3(0.0, 1.0, 1.0)), f - vec3(0.0, 1.0, 1.0));
  float d8 = dot(random3(i + vec3(1.0, 1.0, 1.0)), f - vec3(1.0, 1.0, 1.0));

  float m1 = mix(mix(d1, d2, u.x), mix(d3, d4, u.x), u.y);
  float m2 = mix(mix(d5, d6, u.x), mix(d7, d8, u.x), u.y);

  float result = mix(m1, m2, u.z);
  result = result * 0.5 + 0.5;

  return result;
}

void main() {
  vec2 aspect = vec2(iResolution.x / iResolution.y, 1.0);
  vec2 uv = gl_FragCoord.xy / iResolution.xy;

  uv *= aspect;
  vec2 center = vec2(0.5) * aspect;

  float distortion = noise(vec3(uv * 5.0, iTime));

  float proteinR = 0.2;
  float yolkR    = 0.1;

  float protein = 1.0 - step(0.0, distance(center, uv) - (proteinR + distortion * 0.4));
  float yolk    = 1.0 - step(0.0, distance(center, uv) - (yolkR + distortion * 0.1));

  vec3 egg = vec3(1.0) * protein - vec3(0.0, 0.2, 1.0) * yolk;

  gl_FragColor = vec4(egg, 1.0);
}