Created
December 28, 2018 19:38
-
-
Save danamuise/91f261ac2ee0576403e341914d230c7c to your computer and use it in GitHub Desktop.
This is a GLSL post processor frag shader used in AR Spark (Facebook Messenger AR effects). It creates a random UV shaking effect.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
varying vec2 hdConformedUV; | |
varying vec2 uv; | |
uniform sampler2D inputImage; | |
uniform int passIndex; | |
uniform vec2 uRenderSize; | |
uniform float uTime; | |
float random (in vec2 st) | |
{ | |
return fract(sin(dot(st.xy, vec2(12.9898,78.233)))* 43758.5453123); | |
} | |
float noise(in vec2 st) | |
{ | |
vec2 i = floor(st); | |
vec2 f = fract(st); | |
float a = random(i); | |
float b = random(i + vec2(1.0, 0.0)); | |
float c = random(i + vec2(0.0, 1.0)); | |
float d = random(i + vec2(1.0, 1.0)); | |
vec2 u = f * f * (3.0 - 2.0 * f); | |
return mix(a, b, u.x) + (c - a)* u.y * (1.0 - u.x) + (d - b) * u.x * u.y; | |
} | |
#define octaves 3 | |
float fbm(in vec2 p) | |
{ | |
float value = 0.0; | |
float freq = 1.13; | |
float amp = 0.57; | |
for (int i = 0; i < octaves; i++) | |
{ | |
value += amp * (noise((p - vec2(1.0)) * freq)); | |
freq *= 1.61; | |
amp *= 0.47; | |
} | |
return value; | |
} | |
float pat(in vec2 p) | |
{ | |
float time = uTime*0.75; | |
vec2 aPos = vec2(sin(time * 0.035), sin(time * 0.05)) * 3.; | |
vec2 aScale = vec2(3.25); | |
float a = fbm(p * aScale + aPos); | |
vec2 bPos = vec2(sin(time * 0.09), sin(time * 0.11)) * 1.2; | |
vec2 bScale = vec2(0.75); | |
float b = fbm((p + a) * bScale + bPos); | |
vec2 cPos = vec2(-0.6, -0.5) + vec2(sin(-time * 0.01), sin(time * 0.1)) * 1.9; | |
vec2 cScale = vec2(1.25); | |
float c = fbm((p + b) * cScale + cPos); | |
return c; | |
} | |
vec2 Shake(float maxshake, float mag) | |
{ | |
float speed = 20.0*mag; | |
float shakescale = maxshake * mag; | |
float time = uTime*speed; // speed of shake | |
vec2 p1 = vec2(0.25,0.25); | |
vec2 p2 = vec2(0.75,0.75); | |
p1 += time; | |
p2 += time; | |
// random shake is just too violent... | |
//float val1 = random(p1); | |
//float val2 = random(p2); | |
float val1 = pat(p1); | |
float val2 = pat(p2); | |
val1 = clamp(val1,0.0,1.0); | |
val2 = clamp(val2,0.0,1.0); | |
return vec2(val1*shakescale,val2*shakescale); | |
} | |
void main() | |
{ | |
float maxshake = 0.1; // max shake amount | |
float mag = 0.5+sin(uTime)*0.5; // shake magnitude... | |
// *temp* , We will calc shakexy once in the vertex shader... | |
vec2 shakexy = Shake(maxshake,mag); | |
vec2 uv_ = uv; | |
uv_ *= 1.0-(maxshake*mag); | |
vec3 col = texture2D(inputImage, uv_ + shakexy).xyz; | |
gl_FragColor = vec4(col, 1.0); | |
} |
yeah, unfortunately Spark is now restricting shader access to internal devs for security reasons. They are pushing for the new patch based 'visual shader' format in the graph editor. There's several good tutorials around.
I think that's a bad decision because a lot of really good shaders could be ported to spark in few minutes
Nice! Thanks for sharing @danamuise :)
MANUEL FERIA | Marketing & SEO Specialist | MAIL: manuel@yordstudio.com | WEB: yordstudio.com
MAIL: manuel@yordstudio.com
WEB: yordstudio.com
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Me too, i can't find it