Shader之旅3:通道分離+抖動
阿新 • • 發佈:2019-01-04
書寫本文的初衷是為了自我反省記錄。如有表達不當,請批評指正
抖音上有類似的故障效果的拍攝特效。
其實就是利用通道分離,並將畫面進行震盪,產生類似的效果。如下效果。
這是我寫在shader上的效果
uniform float time; float rand(float co) { return fract(sin(dot(co,12.9898+78.233)) * 43758.5453); } void mainImage( out vec4 fragcolor, in vec2 fragCoord ) { vec2 uv = fragCoord.xy / iResolution.xy; vec2 uv1 = uv; uv1.x-=rand(uv.y*iTime)/30.; vec4 e = texture(iChannel0,uv1); vec4 bn = vec4(vec3(e.r+e.g+e.b)/3.,1.0); vec2 offset = vec2(sin(iTime)/30.,0.01*rand(iTime)); // 抖動 if(iTime<=1.){ fragcolor=e; } //抖動+分通道 if(iTime>1.&&iTime<=2.){ e.r = texture(iChannel0, uv).r; e.g = texture(iChannel0, uv-offset.xy).g; e.b = texture(iChannel0, uv+offset.xy).b; fragcolor=mix(e,bn,0.3); } // 分通道 if(iTime>2.&&iTime<=4.5){ e.r = texture(iChannel0, uv).r; e.g = texture(iChannel0, uv-offset.xy).g; e.b = texture(iChannel0, uv+offset.xy).b; fragcolor=e; } // 正常 if(iTime>4.5){ fragcolor=texture(iChannel0, uv); } }