├── 20190202 Processing Community Day.pdf ├── README.md ├── animation_cds ├── Spring.pde └── animation_cds.pde ├── animation_exp └── animation_exp.pde ├── animation_exp_box └── animation_exp_box.pde ├── example ├── drawExample.pde └── example.pde ├── fractals_faster ├── addCube.pde ├── addFractals.pde └── fractals_faster.pde ├── fractals_shader ├── addCube.pde ├── addFractals.pde ├── data │ ├── color.vert │ ├── default.frag │ ├── default.vert │ ├── noise.vert │ ├── size.vert │ └── wave.vert └── fractals_shader.pde ├── fractals_slower └── fractals_slower.pde ├── fractals_wayslower └── fractals_wayslower.pde ├── noise └── noise.pde ├── postfx_bloom ├── data │ ├── gauss.frag │ └── preBloom.frag ├── drawExample.pde ├── postfx_bloom.pde └── prepareGaussTable.pde ├── postfx_color ├── data │ ├── barrel.frag │ ├── color.frag │ ├── gameboy.frag │ ├── glitch-ws.frag │ └── glitch.frag ├── drawExample.pde └── postfx_color.pde ├── postfx_gauss ├── data │ └── gauss.frag ├── drawExample.pde ├── postfx_gauss.pde └── prepareGaussTable.pde ├── postfx_gauss_slower ├── drawExample.pde └── postfx_gauss_slower.pde ├── quaternion_firststep ├── Quaternion.pde ├── Vector3.pde └── quaternion_firststep.pde ├── quaternion_interaction ├── Quaternion.pde ├── Vector3.pde └── quaternion_interaction.pde ├── quaternion_problem └── quaternion_problem.pde ├── quaternion_slerp ├── Quaternion.pde ├── Vector3.pde └── quaternion_slerp.pde ├── uv └── uv.pde └── uv_shader ├── data └── uv.frag └── uv_shader.pde /20190202 Processing Community Day.pdf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/fms-cat/20190202-pcd-workshop/6e56a6bc3db8cdb05a7c5c9be6224b26c86e4a2a/20190202 Processing Community Day.pdf -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | # 20180202-pcd-workshop 2 | 3 | https://pcd-tokyo.github.io/ 4 | 5 | https://docs.google.com/presentation/d/12y-hHiKzF8Qn4lzI_eRjd1fKN2-dyW6UGsQ-igbHFDo/edit?usp=sharing 6 | -------------------------------------------------------------------------------- /animation_cds/Spring.pde: -------------------------------------------------------------------------------- 1 | class Spring { 2 | float position = 0.0; 3 | float velocity = 0.0; 4 | float target = 0.0; 5 | float springFactor = 100.0; 6 | float dampRatio = 1.0; 7 | 8 | void reset() { 9 | position = 0.0; 10 | velocity = 0.0; 11 | target = 0.0; 12 | } 13 | 14 | void update(float deltaTime) { 15 | velocity += (-springFactor * (position - target) - 2.0 * velocity * sqrt(springFactor)) * deltaTime; 16 | position += velocity * deltaTime; 17 | } 18 | } 19 | -------------------------------------------------------------------------------- /animation_cds/animation_cds.pde: -------------------------------------------------------------------------------- 1 | Spring springX; 2 | Spring springY; 3 | 4 | void setup() { 5 | size(640, 480, P3D); 6 | springX = new Spring(); 7 | springY = new Spring(); 8 | } 9 | 10 | void draw() { 11 | float deltaTime = 1.0 / 60.0; 12 | springX.update(deltaTime); 13 | springY.update(deltaTime); 14 | 15 | background(0); 16 | 17 | ellipse(springX.position, springY.position, 50, 50); 18 | } 19 | 20 | void mousePressed() { 21 | springX.target = mouseX; 22 | springY.target = mouseY; 23 | } 24 | 25 | void mouseDragged() { 26 | springX.target = mouseX; 27 | springY.target = mouseY; 28 | } 29 | -------------------------------------------------------------------------------- /animation_exp/animation_exp.pde: -------------------------------------------------------------------------------- 1 | float x; 2 | float y; 3 | float xTarget; 4 | float yTarget; 5 | 6 | void setup() { 7 | size(640, 480, P3D); 8 | } 9 | 10 | void draw() { 11 | float deltaTime = 1.0 / 60.0; 12 | float k = 10.0; 13 | x = lerp(xTarget, x, exp(-k * deltaTime)); 14 | y = lerp(yTarget, y, exp(-k * deltaTime)); 15 | 16 | background(0); 17 | 18 | ellipse(x, y, 50, 50); 19 | } 20 | 21 | void mousePressed() { 22 | xTarget = mouseX; 23 | yTarget = mouseY; 24 | } 25 | 26 | void mouseDragged() { 27 | xTarget = mouseX; 28 | yTarget = mouseY; 29 | } 30 | -------------------------------------------------------------------------------- /animation_exp_box/animation_exp_box.pde: -------------------------------------------------------------------------------- 1 | float time = 0.0; 2 | 3 | void setup() { 4 | size(640, 480, P3D); 5 | } 6 | 7 | void draw() { 8 | time += 1.0 / 60.0; 9 | //float anim = constrain(time, 0.0, 1.0); 10 | float anim = 1.0 - exp(-5.0 * time); 11 | 12 | background(0); 13 | 14 | pushMatrix(); 15 | translate(width / 2, height / 2); 16 | rotateY(anim); 17 | rotateX(0.5 * anim); 18 | box(100 * anim); 19 | popMatrix(); 20 | } 21 | 22 | void keyPressed() { 23 | time = 0.0; 24 | } 25 | -------------------------------------------------------------------------------- /example/drawExample.pde: -------------------------------------------------------------------------------- 1 | void drawExample() { 2 | noLights(); 3 | noStroke(); 4 | directionalLight(255, 255, 255, 1, 2, -3); 5 | 6 | pushMatrix(); 7 | translate(width / 2, height / 2); 8 | for (int iy = 0; iy < 20; iy ++) { 9 | for (int ix = 0; ix < 20; ix ++) { 10 | pushMatrix(); 11 | translate( 12 | 20.0 * sin(0.4 * ix + 0.8 * iy + 0.03 * frameCount) + 12 * (ix - 9.5), 13 | 20.0 * sin(0.3 * ix + 0.5 * iy + 0.04 * frameCount) + 12 * (iy - 9.5), 14 | 20.0 * sin(0.7 * ix + 0.3 * iy + 0.05 * frameCount) 15 | ); 16 | rotateX(0.28 * ix + frameCount * 0.05); 17 | rotateY(0.22 * iy + frameCount * 0.03); 18 | 19 | fill(64, 75, 86); 20 | box(20, 50, 70); 21 | fill(255, 82, 141); 22 | box(30, 40, 60); 23 | popMatrix(); 24 | } 25 | } 26 | popMatrix(); 27 | } -------------------------------------------------------------------------------- /example/example.pde: -------------------------------------------------------------------------------- 1 | void setup() { 2 | size(640, 480, P3D); 3 | } 4 | 5 | void draw() { 6 | background(0); 7 | drawExample(); 8 | } 9 | -------------------------------------------------------------------------------- /fractals_faster/addCube.pde: -------------------------------------------------------------------------------- 1 | void addCube(PShape s, float x, float y, float z, float size) { 2 | float v = size / 2; 3 | 4 | s.fill(x, y, z); 5 | 6 | // x+ 7 | s.vertex(x + v, y - v, z + v); 8 | s.vertex(x + v, y - v, z - v); 9 | s.vertex(x + v, y + v, z - v); 10 | s.vertex(x + v, y + v, z + v); 11 | 12 | // x- 13 | s.vertex(x - v, y - v, z - v); 14 | s.vertex(x - v, y - v, z + v); 15 | s.vertex(x - v, y + v, z + v); 16 | s.vertex(x - v, y + v, z - v); 17 | 18 | // y+ 19 | s.vertex(x - v, y + v, z + v); 20 | s.vertex(x + v, y + v, z + v); 21 | s.vertex(x + v, y + v, z - v); 22 | s.vertex(x - v, y + v, z - v); 23 | 24 | // y- 25 | s.vertex(x - v, y - v, z - v); 26 | s.vertex(x + v, y - v, z - v); 27 | s.vertex(x + v, y - v, z + v); 28 | s.vertex(x - v, y - v, z + v); 29 | 30 | // z+ 31 | s.vertex(x - v, y - v, z + v); 32 | s.vertex(x + v, y - v, z + v); 33 | s.vertex(x + v, y + v, z + v); 34 | s.vertex(x - v, y + v, z + v); 35 | 36 | // z- 37 | s.vertex(x + v, y - v, z - v); 38 | s.vertex(x - v, y - v, z - v); 39 | s.vertex(x - v, y + v, z - v); 40 | s.vertex(x + v, y + v, z - v); 41 | } 42 | -------------------------------------------------------------------------------- /fractals_faster/addFractals.pde: -------------------------------------------------------------------------------- 1 | void addFractals(PShape s, float x, float y, float z, float size, int iter) { 2 | if (iter == 0) { 3 | addCube(s, x, y, z, size); 4 | return; 5 | } 6 | 7 | for (int iz = -1; iz <= 1; iz ++) { 8 | for (int iy = -1; iy <= 1; iy ++) { 9 | for (int ix = -1; ix <= 1; ix ++) { 10 | int abort = 0; 11 | abort += ix == 0 ? 1 : 0; 12 | abort += iy == 0 ? 1 : 0; 13 | abort += iz == 0 ? 1 : 0; 14 | if (2 <= abort) { 15 | continue; 16 | } 17 | 18 | addFractals( 19 | s, 20 | x + ix * size / 3, 21 | y + iy * size / 3, 22 | z + iz * size / 3, 23 | size / 3, 24 | iter - 1 25 | ); 26 | } 27 | } 28 | } 29 | } 30 | -------------------------------------------------------------------------------- /fractals_faster/fractals_faster.pde: -------------------------------------------------------------------------------- 1 | final int FRACTAL_ITER = 4; 2 | 3 | PShape myShape; 4 | 5 | void setup() { 6 | size(640, 480, P3D); 7 | 8 | myShape = createShape(); 9 | myShape.beginShape(QUADS); 10 | myShape.fill(255); 11 | myShape.noStroke(); 12 | addFractals(myShape, 0, 0, 0, 300, FRACTAL_ITER); 13 | myShape.endShape(); 14 | } 15 | 16 | void draw() { 17 | lights(); 18 | 19 | background(0); 20 | 21 | pushMatrix(); 22 | translate(width / 2, height / 2); 23 | rotateX(frameCount / 300.0); 24 | rotateY(frameCount / 100.0); 25 | shape(myShape); 26 | popMatrix(); 27 | 28 | text("FPS: " + frameRate, 20, 20); 29 | } 30 | -------------------------------------------------------------------------------- /fractals_shader/addCube.pde: -------------------------------------------------------------------------------- 1 | void addCube(PShape s, float x, float y, float z, float size) { 2 | float v = size / 2; 3 | 4 | s.fill(x, y, z); 5 | s.attrib("origin", x, y, z); 6 | 7 | // x+ 8 | s.vertex(x + v, y - v, z + v); 9 | s.vertex(x + v, y - v, z - v); 10 | s.vertex(x + v, y + v, z - v); 11 | s.vertex(x + v, y + v, z + v); 12 | 13 | // x- 14 | s.vertex(x - v, y - v, z - v); 15 | s.vertex(x - v, y - v, z + v); 16 | s.vertex(x - v, y + v, z + v); 17 | s.vertex(x - v, y + v, z - v); 18 | 19 | // y+ 20 | s.vertex(x - v, y + v, z + v); 21 | s.vertex(x + v, y + v, z + v); 22 | s.vertex(x + v, y + v, z - v); 23 | s.vertex(x - v, y + v, z - v); 24 | 25 | // y- 26 | s.vertex(x - v, y - v, z - v); 27 | s.vertex(x + v, y - v, z - v); 28 | s.vertex(x + v, y - v, z + v); 29 | s.vertex(x - v, y - v, z + v); 30 | 31 | // z+ 32 | s.vertex(x - v, y - v, z + v); 33 | s.vertex(x + v, y - v, z + v); 34 | s.vertex(x + v, y + v, z + v); 35 | s.vertex(x - v, y + v, z + v); 36 | 37 | // z- 38 | s.vertex(x + v, y - v, z - v); 39 | s.vertex(x - v, y - v, z - v); 40 | s.vertex(x - v, y + v, z - v); 41 | s.vertex(x + v, y + v, z - v); 42 | } 43 | -------------------------------------------------------------------------------- /fractals_shader/addFractals.pde: -------------------------------------------------------------------------------- 1 | void addFractals(PShape s, float x, float y, float z, float size, int iter) { 2 | if (iter == 0) { 3 | addCube(s, x, y, z, size); 4 | return; 5 | } 6 | 7 | for (int iz = -1; iz <= 1; iz ++) { 8 | for (int iy = -1; iy <= 1; iy ++) { 9 | for (int ix = -1; ix <= 1; ix ++) { 10 | int abort = 0; 11 | abort += ix == 0 ? 1 : 0; 12 | abort += iy == 0 ? 1 : 0; 13 | abort += iz == 0 ? 1 : 0; 14 | if (2 <= abort) { 15 | continue; 16 | } 17 | 18 | addFractals( 19 | s, 20 | x + ix * size / 3, 21 | y + iy * size / 3, 22 | z + iz * size / 3, 23 | size / 3, 24 | iter - 1 25 | ); 26 | } 27 | } 28 | } 29 | } 30 | -------------------------------------------------------------------------------- /fractals_shader/data/color.vert: -------------------------------------------------------------------------------- 1 | #define PI 3.14159265 2 | 3 | uniform mat4 transform; 4 | uniform mat3 normalMatrix; 5 | uniform vec3 lightNormal; 6 | uniform float time; 7 | 8 | attribute vec4 position; 9 | attribute vec4 color; 10 | attribute vec3 normal; 11 | 12 | varying vec4 vertColor; 13 | varying vec3 vertNormal; 14 | varying vec3 vertLightDir; 15 | 16 | vec3 catColor(float f) { 17 | return 0.5 + 0.5 * sin(f + PI / 3.0 * vec3(0.0, 2.0, 4.0)); 18 | } 19 | 20 | void main() { 21 | gl_Position = transform * position; 22 | 23 | float len = length(position); 24 | vertColor.rgb = catColor(10.0 * time - 0.1 * len); 25 | vertColor.a = 1.0; 26 | 27 | vertNormal = normalize(normalMatrix * normal); 28 | vertLightDir = -lightNormal; 29 | } 30 | -------------------------------------------------------------------------------- /fractals_shader/data/default.frag: -------------------------------------------------------------------------------- 1 | #ifdef GL_ES 2 | precision mediump float; 3 | precision mediump int; 4 | #endif 5 | 6 | varying vec4 vertColor; 7 | varying vec3 vertNormal; 8 | varying vec3 vertLightDir; 9 | 10 | void main() { 11 | float intensity = max(0.0, dot(vertLightDir, vertNormal)); 12 | vec3 diffuse = vertColor.xyz * intensity; 13 | gl_FragColor = vec4(diffuse, vertColor.w); 14 | } -------------------------------------------------------------------------------- /fractals_shader/data/default.vert: -------------------------------------------------------------------------------- 1 | uniform mat4 transform; 2 | uniform mat3 normalMatrix; 3 | uniform vec3 lightNormal; 4 | 5 | attribute vec4 position; 6 | attribute vec4 color; 7 | attribute vec3 normal; 8 | 9 | varying vec4 vertColor; 10 | varying vec3 vertNormal; 11 | varying vec3 vertLightDir; 12 | 13 | void main() { 14 | gl_Position = transform * position; 15 | vertColor = color; 16 | vertNormal = normalize(normalMatrix * normal); 17 | vertLightDir = -lightNormal; 18 | } 19 | -------------------------------------------------------------------------------- /fractals_shader/data/noise.vert: -------------------------------------------------------------------------------- 1 | #define PI 3.14159265 2 | 3 | uniform mat4 transform; 4 | uniform mat3 normalMatrix; 5 | uniform vec3 lightNormal; 6 | uniform float time; 7 | 8 | attribute vec4 position; 9 | attribute vec4 color; 10 | attribute vec3 normal; 11 | attribute vec3 origin; 12 | 13 | varying vec4 vertColor; 14 | varying vec3 vertNormal; 15 | varying vec3 vertLightDir; 16 | 17 | // == glsl-noise starts ================================================================================================ 18 | // retrieved from https://github.com/hughsk/glsl-noise/blob/master/simplex/4d.glsl (MIT License) 19 | 20 | vec4 mod289(vec4 x) { 21 | return x - floor(x * (1.0 / 289.0)) * 289.0; } 22 | 23 | float mod289(float x) { 24 | return x - floor(x * (1.0 / 289.0)) * 289.0; } 25 | 26 | vec4 permute(vec4 x) { 27 | return mod289(((x*34.0)+1.0)*x); 28 | } 29 | 30 | float permute(float x) { 31 | return mod289(((x*34.0)+1.0)*x); 32 | } 33 | 34 | vec4 taylorInvSqrt(vec4 r) 35 | { 36 | return 1.79284291400159 - 0.85373472095314 * r; 37 | } 38 | 39 | float taylorInvSqrt(float r) 40 | { 41 | return 1.79284291400159 - 0.85373472095314 * r; 42 | } 43 | 44 | vec4 grad4(float j, vec4 ip) 45 | { 46 | const vec4 ones = vec4(1.0, 1.0, 1.0, -1.0); 47 | vec4 p,s; 48 | 49 | p.xyz = floor( fract (vec3(j) * ip.xyz) * 7.0) * ip.z - 1.0; 50 | p.w = 1.5 - dot(abs(p.xyz), ones.xyz); 51 | s = vec4(lessThan(p, vec4(0.0))); 52 | p.xyz = p.xyz + (s.xyz*2.0 - 1.0) * s.www; 53 | 54 | return p; 55 | } 56 | 57 | // (sqrt(5) - 1)/4 = F4, used once below 58 | #define F4 0.309016994374947451 59 | 60 | float snoise(vec4 v) 61 | { 62 | const vec4 C = vec4( 0.138196601125011, // (5 - sqrt(5))/20 G4 63 | 0.276393202250021, // 2 * G4 64 | 0.414589803375032, // 3 * G4 65 | -0.447213595499958); // -1 + 4 * G4 66 | 67 | // First corner 68 | vec4 i = floor(v + dot(v, vec4(F4)) ); 69 | vec4 x0 = v - i + dot(i, C.xxxx); 70 | 71 | // Other corners 72 | 73 | // Rank sorting originally contributed by Bill Licea-Kane, AMD (formerly ATI) 74 | vec4 i0; 75 | vec3 isX = step( x0.yzw, x0.xxx ); 76 | vec3 isYZ = step( x0.zww, x0.yyz ); 77 | // i0.x = dot( isX, vec3( 1.0 ) ); 78 | i0.x = isX.x + isX.y + isX.z; 79 | i0.yzw = 1.0 - isX; 80 | // i0.y += dot( isYZ.xy, vec2( 1.0 ) ); 81 | i0.y += isYZ.x + isYZ.y; 82 | i0.zw += 1.0 - isYZ.xy; 83 | i0.z += isYZ.z; 84 | i0.w += 1.0 - isYZ.z; 85 | 86 | // i0 now contains the unique values 0,1,2,3 in each channel 87 | vec4 i3 = clamp( i0, 0.0, 1.0 ); 88 | vec4 i2 = clamp( i0-1.0, 0.0, 1.0 ); 89 | vec4 i1 = clamp( i0-2.0, 0.0, 1.0 ); 90 | 91 | // x0 = x0 - 0.0 + 0.0 * C.xxxx 92 | // x1 = x0 - i1 + 1.0 * C.xxxx 93 | // x2 = x0 - i2 + 2.0 * C.xxxx 94 | // x3 = x0 - i3 + 3.0 * C.xxxx 95 | // x4 = x0 - 1.0 + 4.0 * C.xxxx 96 | vec4 x1 = x0 - i1 + C.xxxx; 97 | vec4 x2 = x0 - i2 + C.yyyy; 98 | vec4 x3 = x0 - i3 + C.zzzz; 99 | vec4 x4 = x0 + C.wwww; 100 | 101 | // Permutations 102 | i = mod289(i); 103 | float j0 = permute( permute( permute( permute(i.w) + i.z) + i.y) + i.x); 104 | vec4 j1 = permute( permute( permute( permute ( 105 | i.w + vec4(i1.w, i2.w, i3.w, 1.0 )) 106 | + i.z + vec4(i1.z, i2.z, i3.z, 1.0 )) 107 | + i.y + vec4(i1.y, i2.y, i3.y, 1.0 )) 108 | + i.x + vec4(i1.x, i2.x, i3.x, 1.0 )); 109 | 110 | // Gradients: 7x7x6 points over a cube, mapped onto a 4-cross polytope 111 | // 7*7*6 = 294, which is close to the ring size 17*17 = 289. 112 | vec4 ip = vec4(1.0/294.0, 1.0/49.0, 1.0/7.0, 0.0) ; 113 | 114 | vec4 p0 = grad4(j0, ip); 115 | vec4 p1 = grad4(j1.x, ip); 116 | vec4 p2 = grad4(j1.y, ip); 117 | vec4 p3 = grad4(j1.z, ip); 118 | vec4 p4 = grad4(j1.w, ip); 119 | 120 | // Normalise gradients 121 | vec4 norm = taylorInvSqrt(vec4(dot(p0,p0), dot(p1,p1), dot(p2, p2), dot(p3,p3))); 122 | p0 *= norm.x; 123 | p1 *= norm.y; 124 | p2 *= norm.z; 125 | p3 *= norm.w; 126 | p4 *= taylorInvSqrt(dot(p4,p4)); 127 | 128 | // Mix contributions from the five corners 129 | vec3 m0 = max(0.6 - vec3(dot(x0,x0), dot(x1,x1), dot(x2,x2)), 0.0); 130 | vec2 m1 = max(0.6 - vec2(dot(x3,x3), dot(x4,x4) ), 0.0); 131 | m0 = m0 * m0; 132 | m1 = m1 * m1; 133 | return 49.0 * ( dot(m0*m0, vec3( dot( p0, x0 ), dot( p1, x1 ), dot( p2, x2 ))) 134 | + dot(m1*m1, vec2( dot( p3, x3 ), dot( p4, x4 ) ) ) ) ; 135 | 136 | } 137 | 138 | // == glsl-noise ends ================================================================================================== 139 | 140 | void main() { 141 | vec4 noiseCoord = vec4(0.01 * origin, time); 142 | vec3 noise = vec3( 143 | snoise(noiseCoord), 144 | snoise(noiseCoord + 10.0), 145 | snoise(noiseCoord + 20.0) 146 | ); 147 | 148 | float size = length(noise); 149 | vec3 shape = position.xyz - origin; 150 | vec3 p = origin + size * shape + 30.0 * noise; 151 | 152 | gl_Position = transform * vec4(p, 1.0); 153 | vertColor = vec4(abs(noise), 1.0); 154 | 155 | vertNormal = normalize(normalMatrix * normal); 156 | vertLightDir = -lightNormal; 157 | } 158 | -------------------------------------------------------------------------------- /fractals_shader/data/size.vert: -------------------------------------------------------------------------------- 1 | #define PI 3.14159265 2 | 3 | uniform mat4 transform; 4 | uniform mat3 normalMatrix; 5 | uniform vec3 lightNormal; 6 | uniform float time; 7 | 8 | attribute vec4 position; 9 | attribute vec4 color; 10 | attribute vec3 normal; 11 | attribute vec3 origin; 12 | 13 | varying vec4 vertColor; 14 | varying vec3 vertNormal; 15 | varying vec3 vertLightDir; 16 | 17 | void main() { 18 | float size = 1.0 + sin(time); 19 | vec3 shape = position.xyz - origin; 20 | vec3 p = origin + size * shape; 21 | 22 | gl_Position = transform * vec4(p, 1.0); 23 | 24 | vertColor = color; 25 | vertNormal = normalize(normalMatrix * normal); 26 | vertLightDir = -lightNormal; 27 | } 28 | -------------------------------------------------------------------------------- /fractals_shader/data/wave.vert: -------------------------------------------------------------------------------- 1 | #define PI 3.14159265 2 | 3 | uniform mat4 transform; 4 | uniform mat3 normalMatrix; 5 | uniform vec3 lightNormal; 6 | uniform float time; 7 | 8 | attribute vec4 position; 9 | attribute vec4 color; 10 | attribute vec3 normal; 11 | attribute vec3 origin; 12 | 13 | varying vec4 vertColor; 14 | varying vec3 vertNormal; 15 | varying vec3 vertLightDir; 16 | 17 | vec3 catColor(float f) { 18 | return 0.5 + 0.5 * sin(f + PI / 3.0 * vec3(0.0, 2.0, 4.0)); 19 | } 20 | 21 | void main() { 22 | float len = length(position); 23 | float phase = fract(time - 0.01 * len); 24 | float wave = 0.5 - 0.5 * cos(2.0 * PI * exp(-4.0 * phase)); 25 | 26 | float size = 4.0 * wave; 27 | vec3 shape = position.xyz - origin; 28 | vec3 p = origin + size * shape; 29 | 30 | gl_Position = transform * vec4(p, 1.0); 31 | vertColor.rgb = catColor(3.0 - 3.0 * wave); 32 | vertColor.a = 1.0; 33 | 34 | vertNormal = normalize(normalMatrix * normal); 35 | vertLightDir = -lightNormal; 36 | } 37 | -------------------------------------------------------------------------------- /fractals_shader/fractals_shader.pde: -------------------------------------------------------------------------------- 1 | final int FRACTAL_ITER = 4; 2 | 3 | PShape myShape; 4 | PShader myShader; 5 | 6 | void setup() { 7 | size(640, 480, P3D); 8 | 9 | myShape = createShape(); 10 | myShape.beginShape(QUADS); 11 | myShape.fill(255); 12 | myShape.noStroke(); 13 | addFractals(myShape, 0, 0, 0, 300, FRACTAL_ITER); 14 | myShape.endShape(); 15 | 16 | myShader = loadShader("default.frag", "default.vert"); 17 | } 18 | 19 | void draw() { 20 | myShader.set("time", frameCount / 60.0); 21 | 22 | directionalLight(255, 255, 255, 1, 2, -3); 23 | 24 | background(0); 25 | 26 | pushMatrix(); 27 | translate(width / 2, height / 2); 28 | rotateX(frameCount / 300.0); 29 | rotateY(frameCount / 100.0); 30 | shader(myShader); 31 | shape(myShape); 32 | resetShader(); 33 | popMatrix(); 34 | 35 | text("FPS: " + frameRate, 20, 20); 36 | } 37 | -------------------------------------------------------------------------------- /fractals_slower/fractals_slower.pde: -------------------------------------------------------------------------------- 1 | final int FRACTAL_ITER = 4; 2 | 3 | void drawFractals(float x, float y, float z, float size, int iter) { 4 | if (iter == 0) { 5 | pushMatrix(); 6 | fill(x, y, z); 7 | translate(x, y, z); 8 | box(size); 9 | popMatrix(); 10 | 11 | return; 12 | } 13 | 14 | for (int iz = -1; iz <= 1; iz ++) { 15 | for (int iy = -1; iy <= 1; iy ++) { 16 | for (int ix = -1; ix <= 1; ix ++) { 17 | int abort = 0; 18 | abort += ix == 0 ? 1 : 0; 19 | abort += iy == 0 ? 1 : 0; 20 | abort += iz == 0 ? 1 : 0; 21 | if (2 <= abort) { 22 | continue; 23 | } 24 | 25 | drawFractals( 26 | x + ix * size / 3, 27 | y + iy * size / 3, 28 | z + iz * size / 3, 29 | size / 3, 30 | iter - 1 31 | ); 32 | } 33 | } 34 | } 35 | } 36 | 37 | void setup() { 38 | size(640, 480, P3D); 39 | noStroke(); 40 | } 41 | 42 | void draw() { 43 | lights(); 44 | 45 | background(0); 46 | 47 | pushMatrix(); 48 | translate(width / 2, height / 2); 49 | rotateX(frameCount / 300.0); 50 | rotateY(frameCount / 100.0); 51 | drawFractals(0, 0, 0, 300, FRACTAL_ITER); 52 | popMatrix(); 53 | 54 | text("FPS: " + frameRate, 20, 20); 55 | } 56 | -------------------------------------------------------------------------------- /fractals_wayslower/fractals_wayslower.pde: -------------------------------------------------------------------------------- 1 | final int FRACTAL_ITER = 4; 2 | PShape test; 3 | 4 | void drawFractals(float x, float y, float z, float size, int iter) { 5 | if (iter == 0) { 6 | pushMatrix(); 7 | translate(x, y, z); 8 | //box(size); 9 | shape(test); 10 | popMatrix(); 11 | 12 | return; 13 | } 14 | 15 | for (int iz = -1; iz <= 1; iz ++) { 16 | for (int iy = -1; iy <= 1; iy ++) { 17 | for (int ix = -1; ix <= 1; ix ++) { 18 | int abort = 0; 19 | abort += ix == 0 ? 1 : 0; 20 | abort += iy == 0 ? 1 : 0; 21 | abort += iz == 0 ? 1 : 0; 22 | if (2 <= abort) { 23 | continue; 24 | } 25 | 26 | drawFractals( 27 | x + ix * size / 3, 28 | y + iy * size / 3, 29 | z + iz * size / 3, 30 | size / 3, 31 | iter - 1 32 | ); 33 | } 34 | } 35 | } 36 | } 37 | 38 | void setup() { 39 | size(640, 480, P3D); 40 | test = createShape(); 41 | test.beginShape(TRIANGLES); 42 | test.noStroke(); 43 | test.vertex(0, 0, 0); 44 | test.vertex(0, 1, 0); 45 | test.vertex(1, 0, 0); 46 | test.endShape(); 47 | noStroke(); 48 | } 49 | 50 | void draw() { 51 | lights(); 52 | 53 | background(0); 54 | 55 | pushMatrix(); 56 | translate(width / 2, height / 2); 57 | rotateX(frameCount / 300.0); 58 | rotateY(frameCount / 100.0); 59 | drawFractals(0, 0, 0, 300, FRACTAL_ITER); 60 | popMatrix(); 61 | 62 | text("FPS: " + frameRate, 20, 20); 63 | } 64 | -------------------------------------------------------------------------------- /noise/noise.pde: -------------------------------------------------------------------------------- 1 | size(100, 100); 2 | 3 | loadPixels(); 4 | for (int iy = 0; iy < height; iy ++) { 5 | for (int ix = 0; ix < width; ix ++) { 6 | float v = 256.0 * noise(0.1 * ix, 0.1 * iy); 7 | pixels[ix + iy * width] = color(v, v, v); 8 | } 9 | } 10 | updatePixels(); 11 | -------------------------------------------------------------------------------- /postfx_bloom/data/gauss.frag: -------------------------------------------------------------------------------- 1 | #define GAUSS_TABLE_LENGTH 64 2 | 3 | uniform bool isVert; 4 | uniform vec2 resolution; 5 | uniform sampler2D texture; 6 | uniform float gaussTable[GAUSS_TABLE_LENGTH]; 7 | 8 | void main() { 9 | vec2 uv = gl_FragCoord.xy / resolution; 10 | vec2 dp = (isVert ? vec2(0.0, 1.0) : vec2(1.0, 0.0)) / resolution; 11 | 12 | vec4 sum = vec4(0.0); 13 | for (int i = -GAUSS_TABLE_LENGTH + 1; i < GAUSS_TABLE_LENGTH; i ++) { 14 | vec2 sampleUV = uv + dp * float(i); 15 | float weight = gaussTable[i < 0 ? -i : i]; 16 | sum += weight * texture2D(texture, sampleUV); 17 | } 18 | 19 | gl_FragColor = sum; 20 | } -------------------------------------------------------------------------------- /postfx_bloom/data/preBloom.frag: -------------------------------------------------------------------------------- 1 | uniform vec2 resolution; 2 | uniform sampler2D texture; 3 | 4 | void main() { 5 | vec2 uv = gl_FragCoord.xy / resolution; 6 | vec4 tex = texture2D(texture, uv); 7 | 8 | gl_FragColor = vec4(clamp((2.0 * tex.xyz - 0.5), 0.0, 1.0), 1.0); 9 | } -------------------------------------------------------------------------------- /postfx_bloom/drawExample.pde: -------------------------------------------------------------------------------- 1 | void drawExample(PGraphics g) { 2 | g.beginDraw(); 3 | 4 | g.background(0); 5 | g.noLights(); 6 | g.noStroke(); 7 | g.directionalLight(255, 255, 255, 1, 2, -3); 8 | 9 | g.pushMatrix(); 10 | g.translate(width / 2, height / 2); 11 | for (int iy = 0; iy < 20; iy ++) { 12 | for (int ix = 0; ix < 20; ix ++) { 13 | g.pushMatrix(); 14 | g.translate( 15 | 20.0 * sin(0.4 * ix + 0.8 * iy + 0.03 * frameCount) + 12 * (ix - 9.5), 16 | 20.0 * sin(0.3 * ix + 0.5 * iy + 0.04 * frameCount) + 12 * (iy - 9.5), 17 | 20.0 * sin(0.7 * ix + 0.3 * iy + 0.05 * frameCount) 18 | ); 19 | g.rotateX(0.28 * ix + frameCount * 0.05); 20 | g.rotateY(0.22 * iy + frameCount * 0.03); 21 | 22 | g.fill(64, 75, 86); 23 | g.box(20, 50, 70); 24 | g.fill(255, 82, 141); 25 | g.box(30, 40, 60); 26 | g.popMatrix(); 27 | } 28 | } 29 | g.popMatrix(); 30 | 31 | g.endDraw(); 32 | } 33 | -------------------------------------------------------------------------------- /postfx_bloom/postfx_bloom.pde: -------------------------------------------------------------------------------- 1 | final int GAUSS_TABLE_LENGTH = 64; 2 | 3 | PShader preBloomShader; 4 | PShader gaussShader; 5 | float[] gaussTable; 6 | PGraphics bloomContext; 7 | 8 | void setup() { 9 | size(640, 480, P3D); 10 | preBloomShader = loadShader("preBloom.frag"); 11 | gaussTable = new float[GAUSS_TABLE_LENGTH]; 12 | prepareGaussTable(gaussTable, 10.0); 13 | gaussShader = loadShader("gauss.frag"); 14 | bloomContext = createGraphics(width, height, P3D); 15 | } 16 | 17 | void draw() { 18 | blendMode(BLEND); 19 | background(0); 20 | drawExample(bloomContext); 21 | 22 | image(bloomContext, 0, 0); 23 | filter(preBloomShader); 24 | 25 | gaussShader.set("resolution", float(width), float(height)); 26 | gaussShader.set("gaussTable", gaussTable); 27 | 28 | gaussShader.set("isVert", false); 29 | filter(gaussShader); 30 | gaussShader.set("isVert", true); 31 | filter(gaussShader); 32 | 33 | blendMode(ADD); 34 | image(bloomContext, 0, 0); 35 | } 36 | 37 | void mouseMoved() { 38 | prepareGaussTable(gaussTable, mouseY); 39 | } 40 | -------------------------------------------------------------------------------- /postfx_bloom/prepareGaussTable.pde: -------------------------------------------------------------------------------- 1 | float gaussian(float x, float s) { 2 | float s2 = 2.0 * s * s; 3 | return 1.0 / sqrt(s2 * PI) * exp(-x * x / s2); 4 | } 5 | 6 | void prepareGaussTable(float[] table, float sigma) { 7 | if (sigma <= 0.0) { 8 | for (int i = 0; i < table.length; i ++) { 9 | table[i] = i == 0 ? 1.0 : 0.0; 10 | } 11 | } else { 12 | float sum = 0.0; 13 | for (int i = 0; i < table.length; i ++) { 14 | float y = gaussian(i, sigma); 15 | table[i] = y; 16 | sum += (i == 0 ? 1.0 : 2.0) * y; 17 | } 18 | 19 | for (int i = 0; i < table.length; i ++) { 20 | table[i] = table[i] / sum; 21 | } 22 | } 23 | } 24 | -------------------------------------------------------------------------------- /postfx_color/data/barrel.frag: -------------------------------------------------------------------------------- 1 | #version 120 2 | 3 | #define BARREL_ITER 10 4 | 5 | #define PI 3.14159265 6 | #define saturate(x) clamp(x,0.,1.) 7 | 8 | uniform vec2 resolution; 9 | uniform sampler2D texture; 10 | 11 | vec2 barrel(vec2 uv, float amp) { 12 | float corn = length(vec2(0.5)); 13 | float a = min(3.0 * sqrt(amp), corn * PI); 14 | float zoom = corn / (tan(corn * a) + corn); 15 | return saturate( 16 | (uv + normalize(uv - 0.5) * tan(length(uv - 0.5) * a)) * zoom + 17 | 0.5 * (1.0 - zoom) 18 | ); 19 | } 20 | 21 | void main() { 22 | vec2 uv = gl_FragCoord.xy / resolution; 23 | 24 | vec3 col = vec3(0.0); 25 | for (int i = 0; i < BARREL_ITER; i ++) { 26 | float fi = (float(i) + 0.5) / float(BARREL_ITER); 27 | vec3 a = saturate( vec3( 28 | 1.0 - 3.0 * abs(1.0 / 6.0 - fi), 29 | 1.0 - 3.0 * abs(1.0 / 2.0 - fi), 30 | 1.0 - 3.0 * abs(5.0 / 6.0 - fi) 31 | ) ) / float(BARREL_ITER) * 4.0; 32 | col += a * texture2D(texture, barrel(uv, 0.1 + 0.1 * fi)).xyz; 33 | } 34 | 35 | gl_FragColor = vec4(col, 1.0); 36 | } -------------------------------------------------------------------------------- /postfx_color/data/color.frag: -------------------------------------------------------------------------------- 1 | #version 120 2 | 3 | uniform vec2 resolution; 4 | uniform float blend = 1.0; 5 | uniform sampler2D texture; 6 | 7 | // ------ 8 | 9 | void main() { 10 | vec2 uv = gl_FragCoord.xy / resolution; 11 | vec2 p = (2.0 * gl_FragCoord.xy - resolution) / resolution.y; 12 | 13 | vec4 tex = texture2D(texture, uv); 14 | 15 | vec3 col = tex.xyz; 16 | col *= 1.0 - 0.5 * length(p); 17 | col = vec3( 18 | smoothstep(0.0, 1.0, col.x), 19 | col.y, 20 | 0.1 + 0.8 * col.z 21 | ); 22 | col = mix(tex.xyz, col, blend); 23 | 24 | gl_FragColor = vec4(col, 1.0); 25 | } -------------------------------------------------------------------------------- /postfx_color/data/gameboy.frag: -------------------------------------------------------------------------------- 1 | #version 120 2 | 3 | #define PIX_SIZE 4.0 4 | 5 | uniform vec2 resolution; 6 | uniform sampler2D texture; 7 | 8 | float ditherThreshold(vec2 coord) { 9 | vec2 c = floor(mod(coord, 2.0)); 10 | return c.x + 2.0 * mod(c.x + c.y, 2.0); 11 | } 12 | 13 | float gray(vec3 c) { 14 | return 0.299 * c.r + 0.587 * c.g + 0.114 * c.b; 15 | } 16 | 17 | vec3 gbColor(float v) { 18 | return mix( 19 | vec3(0.0, 0.1, 0.2), 20 | vec3(0.8, 1.0, 0.2), 21 | v 22 | ); 23 | } 24 | 25 | float pix(vec2 coord) { 26 | vec4 pixCoord = vec4( 27 | (floor(coord.xy / PIX_SIZE) * PIX_SIZE) / resolution, 28 | mod(coord.xy, PIX_SIZE) / PIX_SIZE 29 | ); 30 | if (1.0 / PIX_SIZE < pixCoord.z && 1.0 / PIX_SIZE < pixCoord.w) { 31 | vec4 tex = texture2D(texture, pixCoord.xy); 32 | float val = 4.0 * gray(tex.xyz); 33 | val += 0.25 * ditherThreshold(floor(coord.xy / PIX_SIZE)); 34 | return 0.1 + 0.8 * pow(floor(val) / 4.0, 0.8); 35 | } else { 36 | return 1.0; 37 | } 38 | } 39 | 40 | void main() { 41 | float p = pix(gl_FragCoord.xy); 42 | 43 | vec3 col = gbColor(p); 44 | 45 | float shadow = 0.0; 46 | for (int iy = 0; iy < 3; iy ++) { 47 | for (int ix = 0; ix < 3; ix ++) { 48 | shadow += ( 49 | (ix == 0 && iy == 0) ? p : pix(gl_FragCoord.xy + vec2(ix, iy)) 50 | ) / 9.0; 51 | } 52 | } 53 | col *= mix(1.0, shadow, p); 54 | 55 | gl_FragColor = vec4(col, 1.0); 56 | } -------------------------------------------------------------------------------- /postfx_color/data/glitch-ws.frag: -------------------------------------------------------------------------------- 1 | uniform vec2 resolution; 2 | uniform sampler2D texture; 3 | 4 | float rand(vec2 co) { 5 | return fract(sin(dot(co.xy ,vec2(12.9898,78.233))) * 43758.5453); 6 | } 7 | 8 | void main() { 9 | vec2 uv = gl_FragCoord.xy / resolution; 10 | vec2 lofiUv = floor(uv * 10.0) / 10.0; 11 | uv += 0.1 - 0.2 * vec2( 12 | rand(lofiUv), 13 | rand(lofiUv + 0.7) 14 | ); 15 | uv = fract(uv); 16 | vec4 tex = texture2D(texture, uv); 17 | gl_FragColor = tex; 18 | } -------------------------------------------------------------------------------- /postfx_color/data/glitch.frag: -------------------------------------------------------------------------------- 1 | #version 120 2 | 3 | uniform vec2 resolution; 4 | uniform float threshold = 0.1; 5 | uniform float amp = 0.5; 6 | uniform sampler2D texture; 7 | 8 | // ------ 9 | 10 | float seg( vec2 uv, vec2 s ) { 11 | return floor( s.x * uv.x ) + s.x * floor( s.y * uv.y ); 12 | } 13 | 14 | float random( float v ) { 15 | return fract( sin( 691.43 * v ) * 571.54 ); 16 | } 17 | 18 | // ------ 19 | 20 | void main() { 21 | vec2 uv = gl_FragCoord.xy / resolution; 22 | 23 | vec2 displace = vec2( 0.0 ); 24 | for ( int i = 0; i < 4; i ++ ) { 25 | float m = pow( 2.0, float( i ) ); 26 | float id = seg( uv + 0.7 * float( i ), vec2( 3.0, 8.0 ) * m ); 27 | bool b = random( 0.2 + id ) < threshold; 28 | displace += b ? vec2( 29 | random( 0.5 + id ) * 2.0 - 1.0, 30 | random( 0.8 + id ) * 2.0 - 1.0 31 | ) / 2.0 / m : vec2( 0.0 ); 32 | } 33 | displace = amp * displace; 34 | 35 | vec3 col = vec3( 36 | texture2D( texture, uv + 1.00 * displace ).x, 37 | texture2D( texture, uv + 1.05 * displace ).y, 38 | texture2D( texture, uv + 1.10 * displace ).z 39 | ); 40 | gl_FragColor = vec4( col, 1.0 ); 41 | } -------------------------------------------------------------------------------- /postfx_color/drawExample.pde: -------------------------------------------------------------------------------- 1 | void drawExample() { 2 | noLights(); 3 | noStroke(); 4 | directionalLight(255, 255, 255, 1, 2, -3); 5 | 6 | pushMatrix(); 7 | translate(width / 2, height / 2); 8 | for (int iy = 0; iy < 20; iy ++) { 9 | for (int ix = 0; ix < 20; ix ++) { 10 | pushMatrix(); 11 | translate( 12 | 20.0 * sin(0.4 * ix + 0.8 * iy + 0.03 * frameCount) + 12 * (ix - 9.5), 13 | 20.0 * sin(0.3 * ix + 0.5 * iy + 0.04 * frameCount) + 12 * (iy - 9.5), 14 | 20.0 * sin(0.7 * ix + 0.3 * iy + 0.05 * frameCount) 15 | ); 16 | rotateX(0.28 * ix + frameCount * 0.05); 17 | rotateY(0.22 * iy + frameCount * 0.03); 18 | 19 | fill(64, 75, 86); 20 | box(20, 50, 70); 21 | fill(231, 247, 255); 22 | box(30, 40, 60); 23 | popMatrix(); 24 | } 25 | } 26 | popMatrix(); 27 | } 28 | -------------------------------------------------------------------------------- /postfx_color/postfx_color.pde: -------------------------------------------------------------------------------- 1 | PShader colorShader; 2 | 3 | void setup() { 4 | size(640, 480, P3D); 5 | colorShader = loadShader("glitch-ws.frag"); 6 | } 7 | 8 | void draw() { 9 | background(0); 10 | drawExample(); 11 | 12 | colorShader.set("resolution", float(width), float(height)); 13 | filter(colorShader); 14 | } 15 | -------------------------------------------------------------------------------- /postfx_gauss/data/gauss.frag: -------------------------------------------------------------------------------- 1 | #define GAUSS_TABLE_LENGTH 64 2 | 3 | uniform bool isVert; 4 | uniform vec2 resolution; 5 | uniform sampler2D texture; 6 | uniform float gaussTable[GAUSS_TABLE_LENGTH]; 7 | 8 | void main() { 9 | vec2 uv = gl_FragCoord.xy / resolution; 10 | vec2 dp = (isVert ? vec2(0.0, 1.0) : vec2(1.0, 0.0)) / resolution; 11 | 12 | vec4 sum = vec4(0.0); 13 | for (int i = -GAUSS_TABLE_LENGTH + 1; i < GAUSS_TABLE_LENGTH; i ++) { 14 | vec2 sampleUV = uv + dp * float(i); 15 | float weight = gaussTable[i < 0 ? -i : i]; 16 | sum += weight * texture2D(texture, sampleUV); 17 | } 18 | 19 | gl_FragColor = sum; 20 | } -------------------------------------------------------------------------------- /postfx_gauss/drawExample.pde: -------------------------------------------------------------------------------- 1 | void drawExample() { 2 | noLights(); 3 | noStroke(); 4 | directionalLight(255, 255, 255, 1, 2, -3); 5 | 6 | pushMatrix(); 7 | translate(width / 2, height / 2); 8 | for (int iy = 0; iy < 20; iy ++) { 9 | for (int ix = 0; ix < 20; ix ++) { 10 | pushMatrix(); 11 | translate( 12 | 20.0 * sin(0.4 * ix + 0.8 * iy + 0.03 * frameCount) + 12 * (ix - 9.5), 13 | 20.0 * sin(0.3 * ix + 0.5 * iy + 0.04 * frameCount) + 12 * (iy - 9.5), 14 | 20.0 * sin(0.7 * ix + 0.3 * iy + 0.05 * frameCount) 15 | ); 16 | rotateX(0.28 * ix + frameCount * 0.05); 17 | rotateY(0.22 * iy + frameCount * 0.03); 18 | 19 | fill(64, 75, 86); 20 | box(20, 50, 70); 21 | fill(255, 82, 141); 22 | box(30, 40, 60); 23 | popMatrix(); 24 | } 25 | } 26 | popMatrix(); 27 | } 28 | -------------------------------------------------------------------------------- /postfx_gauss/postfx_gauss.pde: -------------------------------------------------------------------------------- 1 | final int GAUSS_TABLE_LENGTH = 64; 2 | 3 | PShader gaussShader; 4 | float[] gaussTable; 5 | 6 | void setup() { 7 | size(640, 480, P3D); 8 | gaussTable = new float[GAUSS_TABLE_LENGTH]; 9 | prepareGaussTable(gaussTable, 5.0); 10 | gaussShader = loadShader("gauss.frag"); 11 | } 12 | 13 | void draw() { 14 | background(0); 15 | drawExample(); 16 | 17 | gaussShader.set("resolution", float(width), float(height)); 18 | gaussShader.set("gaussTable", gaussTable); 19 | 20 | gaussShader.set("isVert", false); 21 | filter(gaussShader); 22 | gaussShader.set("isVert", true); 23 | filter(gaussShader); 24 | } 25 | 26 | void mouseMoved() { 27 | prepareGaussTable(gaussTable, mouseY); 28 | } 29 | -------------------------------------------------------------------------------- /postfx_gauss/prepareGaussTable.pde: -------------------------------------------------------------------------------- 1 | float gaussian(float x, float s) { 2 | float s2 = 2.0 * s * s; 3 | return 1.0 / sqrt(s2 * PI) * exp(-x * x / s2); 4 | } 5 | 6 | void prepareGaussTable(float[] table, float sigma) { 7 | if (sigma <= 0.0) { 8 | for (int i = 0; i < table.length; i ++) { 9 | table[i] = i == 0 ? 1.0 : 0.0; 10 | } 11 | } else { 12 | float sum = 0.0; 13 | for (int i = 0; i < table.length; i ++) { 14 | float y = gaussian(i, sigma); 15 | table[i] = y; 16 | sum += (i == 0 ? 1.0 : 2.0) * y; 17 | } 18 | 19 | for (int i = 0; i < table.length; i ++) { 20 | table[i] = table[i] / sum; 21 | } 22 | } 23 | } 24 | -------------------------------------------------------------------------------- /postfx_gauss_slower/drawExample.pde: -------------------------------------------------------------------------------- 1 | void drawExample() { 2 | noLights(); 3 | noStroke(); 4 | directionalLight(255, 255, 255, 1, 2, -3); 5 | 6 | pushMatrix(); 7 | translate(width / 2, height / 2); 8 | for (int iy = 0; iy < 20; iy ++) { 9 | for (int ix = 0; ix < 20; ix ++) { 10 | pushMatrix(); 11 | translate( 12 | 20.0 * sin(0.4 * ix + 0.8 * iy + 0.03 * frameCount) + 12 * (ix - 9.5), 13 | 20.0 * sin(0.3 * ix + 0.5 * iy + 0.04 * frameCount) + 12 * (iy - 9.5), 14 | 20.0 * sin(0.7 * ix + 0.3 * iy + 0.05 * frameCount) 15 | ); 16 | rotateX(0.28 * ix + frameCount * 0.05); 17 | rotateY(0.22 * iy + frameCount * 0.03); 18 | 19 | fill(64, 75, 86); 20 | box(20, 50, 70); 21 | fill(255, 82, 141); 22 | box(30, 40, 60); 23 | popMatrix(); 24 | } 25 | } 26 | popMatrix(); 27 | } 28 | -------------------------------------------------------------------------------- /postfx_gauss_slower/postfx_gauss_slower.pde: -------------------------------------------------------------------------------- 1 | void setup() { 2 | size(640, 480, P3D); 3 | } 4 | 5 | void draw() { 6 | background(0); 7 | drawExample(); 8 | 9 | filter(BLUR, 10); 10 | } 11 | -------------------------------------------------------------------------------- /quaternion_firststep/Quaternion.pde: -------------------------------------------------------------------------------- 1 | class Quaternion { 2 | float w; 3 | Vector3 v; 4 | 5 | // Instantiate a new Quaternion. 6 | Quaternion(float _w, Vector3 _v) { 7 | w = _w; 8 | v = _v; 9 | } 10 | 11 | // Instantiate a new Quaternion. 12 | // It's an identity quaternion (represents "no rotation"). 13 | Quaternion() { 14 | w = 1.0; 15 | v = new Vector3(0.0, 0.0, 0.0); 16 | } 17 | 18 | // Stringify the quaternion informations. 19 | public String toString() { 20 | return "Quaternion(" + w + "; " + v.x + ", " + v.y + ", " + v.z + ")"; 21 | } 22 | 23 | // Multiply this quaternion by given quaternion. 24 | Quaternion multiply(Quaternion _q) { 25 | Vector3 tv = new Vector3(0.0, 0.0, 0.0); 26 | tv = tv.add(_q.v.scale(w)); 27 | tv = tv.add(v.scale(_q.w)); 28 | tv = tv.add(v.cross(_q.v)); 29 | return new Quaternion( 30 | w * _q.w - v.dot(_q.v), 31 | tv 32 | ); 33 | } 34 | 35 | // Invert this quaternion. 36 | Quaternion inverse() { 37 | return new Quaternion( 38 | w, 39 | v.neg() 40 | ); 41 | } 42 | 43 | // Convert this quaternion into Matrix. 44 | PMatrix3D toPMatrix3D() { 45 | Vector3 x = new Vector3(1.0, 0.0, 0.0).rotate(this); 46 | Vector3 y = new Vector3(0.0, 1.0, 0.0).rotate(this); 47 | Vector3 z = new Vector3(0.0, 0.0, 1.0).rotate(this); 48 | 49 | return new PMatrix3D( 50 | x.x, x.y, x.z, 0.0, 51 | y.x, y.y, y.z, 0.0, 52 | z.x, z.y, z.z, 0.0, 53 | 0.0, 0.0, 0.0, 1.0 54 | ); 55 | } 56 | } 57 | 58 | // Create a new quaternion by given angle and axis. 59 | Quaternion quaternionByAngleAxis(float _t, Vector3 _a) { 60 | return new Quaternion( 61 | cos(_t / 2.0), 62 | _a.scale(sin(_t / 2.0)) 63 | ); 64 | } 65 | -------------------------------------------------------------------------------- /quaternion_firststep/Vector3.pde: -------------------------------------------------------------------------------- 1 | class Vector3 { 2 | float x, y, z; 3 | 4 | // Instantiate a new Vector3. 5 | Vector3(float x, float y, float z) { 6 | this.x = x; 7 | this.y = y; 8 | this.z = z; 9 | } 10 | 11 | // Stringify the vector informations. 12 | public String toString() { 13 | return "Vector3(" + x + ", " + y + ", " + z + ")"; 14 | } 15 | 16 | // Add two vectors. 17 | Vector3 add(Vector3 v) { 18 | return new Vector3(x + v.x, y + v.y, z + v.z); 19 | } 20 | 21 | // Substract this vector by a vector. 22 | Vector3 sub(Vector3 v) { 23 | return new Vector3(x - v.x, y - v.y, z - v.z); 24 | } 25 | 26 | // Scale this vector by a scalar. 27 | Vector3 scale(float s) { 28 | return new Vector3(x * s, y * s, z * s); 29 | } 30 | 31 | // Negate this vector. 32 | Vector3 neg() { 33 | return new Vector3(-x, -y, -z); 34 | } 35 | 36 | // Return its length, in float. 37 | float len() { 38 | return sqrt(x * x + y * y + z * z); 39 | } 40 | 41 | // Normalize the vector (make its length = 1). 42 | Vector3 normalize() { 43 | return scale(1.0 / len()); 44 | } 45 | 46 | // Return a dot product of this vector and given vector. 47 | float dot(Vector3 v) { 48 | return x * v.x + y * v.y + z * v.z; 49 | } 50 | 51 | // Return a cross product of this vector and given vector. 52 | Vector3 cross(Vector3 v) { 53 | return new Vector3(y * v.z - v.y * z, 54 | z * v.x - v.z * x, 55 | x * v.y - v.x * y); 56 | } 57 | 58 | // Rotate this vector by a quaternion. 59 | Vector3 rotate(Quaternion _q) { 60 | Quaternion p = new Quaternion(0.0, this); 61 | Quaternion r = _q.inverse(); 62 | return _q.multiply(p).multiply(r).v; 63 | } 64 | } 65 | -------------------------------------------------------------------------------- /quaternion_firststep/quaternion_firststep.pde: -------------------------------------------------------------------------------- 1 | Quaternion myQuat; 2 | 3 | void setup() { 4 | size(640, 480, P3D); 5 | myQuat = new Quaternion(); 6 | } 7 | 8 | void draw() { 9 | background(0); 10 | 11 | Vector3 v = new Vector3(1, 0.2, 0).normalize(); 12 | Quaternion q = quaternionByAngleAxis(0.1, v); 13 | myQuat = myQuat.multiply(q); 14 | 15 | pushMatrix(); 16 | translate(width / 2, height / 2); 17 | applyMatrix(myQuat.toPMatrix3D()); 18 | box(100); 19 | popMatrix(); 20 | } 21 | -------------------------------------------------------------------------------- /quaternion_interaction/Quaternion.pde: -------------------------------------------------------------------------------- 1 | class Quaternion { 2 | float w; 3 | Vector3 v; 4 | 5 | // Instantiate a new Quaternion. 6 | Quaternion(float _w, Vector3 _v) { 7 | w = _w; 8 | v = _v; 9 | } 10 | 11 | // Instantiate a new Quaternion. 12 | // It's an identity quaternion (represents "no rotation"). 13 | Quaternion() { 14 | w = 1.0; 15 | v = new Vector3(0.0, 0.0, 0.0); 16 | } 17 | 18 | // Stringify the quaternion informations. 19 | public String toString() { 20 | return "Quaternion(" + w + "; " + v.x + ", " + v.y + ", " + v.z + ")"; 21 | } 22 | 23 | // Multiply this quaternion by given quaternion. 24 | Quaternion multiply(Quaternion _q) { 25 | Vector3 tv = new Vector3(0.0, 0.0, 0.0); 26 | tv = tv.add(_q.v.scale(w)); 27 | tv = tv.add(v.scale(_q.w)); 28 | tv = tv.add(v.cross(_q.v)); 29 | return new Quaternion( 30 | w * _q.w - v.dot(_q.v), 31 | tv 32 | ); 33 | } 34 | 35 | // Invert this quaternion. 36 | Quaternion inverse() { 37 | return new Quaternion( 38 | w, 39 | v.neg() 40 | ); 41 | } 42 | 43 | // Convert this quaternion into Matrix. 44 | PMatrix3D toPMatrix3D() { 45 | Vector3 x = new Vector3(1.0, 0.0, 0.0).rotate(this); 46 | Vector3 y = new Vector3(0.0, 1.0, 0.0).rotate(this); 47 | Vector3 z = new Vector3(0.0, 0.0, 1.0).rotate(this); 48 | 49 | return new PMatrix3D( 50 | x.x, x.y, x.z, 0.0, 51 | y.x, y.y, y.z, 0.0, 52 | z.x, z.y, z.z, 0.0, 53 | 0.0, 0.0, 0.0, 1.0 54 | ); 55 | } 56 | } 57 | 58 | // Create a new quaternion by given angle and axis. 59 | Quaternion quaternionByAngleAxis(float _t, Vector3 _a) { 60 | return new Quaternion( 61 | cos(_t / 2.0), 62 | _a.scale(sin(_t / 2.0)) 63 | ); 64 | } 65 | -------------------------------------------------------------------------------- /quaternion_interaction/Vector3.pde: -------------------------------------------------------------------------------- 1 | class Vector3 { 2 | float x, y, z; 3 | 4 | // Instantiate a new Vector3. 5 | Vector3(float x, float y, float z) { 6 | this.x = x; 7 | this.y = y; 8 | this.z = z; 9 | } 10 | 11 | // Stringify the vector informations. 12 | public String toString() { 13 | return "Vector3(" + x + ", " + y + ", " + z + ")"; 14 | } 15 | 16 | // Add two vectors. 17 | Vector3 add(Vector3 v) { 18 | return new Vector3(x + v.x, y + v.y, z + v.z); 19 | } 20 | 21 | // Substract this vector by a vector. 22 | Vector3 sub(Vector3 v) { 23 | return new Vector3(x - v.x, y - v.y, z - v.z); 24 | } 25 | 26 | // Scale this vector by a scalar. 27 | Vector3 scale(float s) { 28 | return new Vector3(x * s, y * s, z * s); 29 | } 30 | 31 | // Negate this vector. 32 | Vector3 neg() { 33 | return new Vector3(-x, -y, -z); 34 | } 35 | 36 | // Return its length, in float. 37 | float len() { 38 | return sqrt(x * x + y * y + z * z); 39 | } 40 | 41 | // Normalize the vector (make its length = 1). 42 | Vector3 normalize() { 43 | return scale(1.0 / len()); 44 | } 45 | 46 | // Return a dot product of this vector and given vector. 47 | float dot(Vector3 v) { 48 | return x * v.x + y * v.y + z * v.z; 49 | } 50 | 51 | // Return a cross product of this vector and given vector. 52 | Vector3 cross(Vector3 v) { 53 | return new Vector3(y * v.z - v.y * z, 54 | z * v.x - v.z * x, 55 | x * v.y - v.x * y); 56 | } 57 | 58 | // Rotate this vector by a quaternion. 59 | Vector3 rotate(Quaternion _q) { 60 | Quaternion p = new Quaternion(0.0, this); 61 | Quaternion r = _q.inverse(); 62 | return _q.multiply(p).multiply(r).v; 63 | } 64 | } 65 | -------------------------------------------------------------------------------- /quaternion_interaction/quaternion_interaction.pde: -------------------------------------------------------------------------------- 1 | Quaternion myQuat; 2 | 3 | void setup() { 4 | size(640, 480, P3D); 5 | myQuat = new Quaternion(); 6 | } 7 | 8 | void draw() { 9 | background(0); 10 | 11 | pushMatrix(); 12 | translate(width / 2, height / 2); 13 | applyMatrix(myQuat.toPMatrix3D()); 14 | box(100); 15 | popMatrix(); 16 | } 17 | 18 | void mouseDragged() { 19 | float dx = mouseX - pmouseX; 20 | float dy = mouseY - pmouseY; 21 | Vector3 v = new Vector3(dy, -dx, 0); 22 | 23 | Quaternion q = quaternionByAngleAxis(v.len() * 0.01, v.normalize()); 24 | myQuat = myQuat.multiply(q); 25 | } 26 | -------------------------------------------------------------------------------- /quaternion_problem/quaternion_problem.pde: -------------------------------------------------------------------------------- 1 | float rotX = 0.0; 2 | float rotY = 0.0; 3 | 4 | void setup() { 5 | size(640, 480, P3D); 6 | } 7 | 8 | void draw() { 9 | background(0); 10 | 11 | pushMatrix(); 12 | translate(width / 2, height / 2); 13 | rotateX(rotX); 14 | rotateY(rotY); 15 | box(100); 16 | popMatrix(); 17 | } 18 | 19 | void mouseDragged() { 20 | float dx = mouseX - pmouseX; 21 | float dy = mouseY - pmouseY; 22 | 23 | rotX -= dy * 0.01; 24 | rotY += dx * 0.01; 25 | } 26 | -------------------------------------------------------------------------------- /quaternion_slerp/Quaternion.pde: -------------------------------------------------------------------------------- 1 | class Quaternion { 2 | float w; 3 | Vector3 v; 4 | 5 | // Instantiate a new Quaternion. 6 | Quaternion(float _w, Vector3 _v) { 7 | w = _w; 8 | v = _v; 9 | } 10 | 11 | // Instantiate a new Quaternion. 12 | // It's an identity quaternion (represents "no rotation"). 13 | Quaternion() { 14 | w = 1.0; 15 | v = new Vector3(0.0, 0.0, 0.0); 16 | } 17 | 18 | // Stringify the quaternion informations. 19 | public String toString() { 20 | return "Quaternion(" + w + "; " + v.x + ", " + v.y + ", " + v.z + ")"; 21 | } 22 | 23 | Quaternion clone() { 24 | return new Quaternion(w, v.clone()); 25 | } 26 | 27 | // Multiply this quaternion by given quaternion. 28 | Quaternion multiply(Quaternion _q) { 29 | Vector3 tv = new Vector3(0.0, 0.0, 0.0); 30 | tv = tv.add(_q.v.scale(w)); 31 | tv = tv.add(v.scale(_q.w)); 32 | tv = tv.add(v.cross(_q.v)); 33 | return new Quaternion( 34 | w * _q.w - v.dot(_q.v), 35 | tv 36 | ); 37 | } 38 | 39 | // Return its length, in float. 40 | float len() { 41 | return sqrt(v.dot(v) + w * w); 42 | } 43 | 44 | // Normalize itself. 45 | Quaternion normalize() { 46 | float l = len(); 47 | 48 | if (l == 0) { 49 | return new Quaternion(1, new Vector3(0, 0, 0)); 50 | } else { 51 | return new Quaternion(w / l, v.scale(1.0 / l)); 52 | } 53 | } 54 | 55 | 56 | // Interpolate between this quaternion and given quaternion. 57 | Quaternion slerp(Quaternion _q, float _t) { 58 | Quaternion q = _q.clone(); 59 | float cosHalfTheta = w * q.w + v.x * q.v.x + v.y * q.v.y + v.z * q.v.z; 60 | 61 | if (cosHalfTheta < 0) { 62 | q.w = -q.w; 63 | q.v = q.v.neg(); 64 | cosHalfTheta = -cosHalfTheta; 65 | } 66 | 67 | if (1.0 <= cosHalfTheta) { 68 | return this.clone(); 69 | } 70 | 71 | float sqSinHalfTheta = 1.0 - cosHalfTheta * cosHalfTheta; 72 | if (sqSinHalfTheta <= 1E-9) { // EPSILON 73 | float s = 1.0 - _t; 74 | q.w = s * w + _t * q.w; 75 | q.v = v.scale(s).add(q.v.scale(_t)); 76 | return q.normalize(); 77 | } 78 | 79 | float sinHalfTheta = sqrt(sqSinHalfTheta); 80 | float halfTheta = atan2(sinHalfTheta, cosHalfTheta); 81 | float rS = sin((1 - _t) * halfTheta) / sinHalfTheta; 82 | float rT = sin(_t * halfTheta) / sinHalfTheta; 83 | 84 | q.w = rS * w + rT * q.w; 85 | q.v = v.scale(rS).add(q.v.scale(rT)); 86 | return q; 87 | } 88 | 89 | // Invert this quaternion. 90 | Quaternion inverse() { 91 | return new Quaternion( 92 | w, 93 | v.neg() 94 | ); 95 | } 96 | 97 | // Convert this quaternion into Matrix. 98 | PMatrix3D toPMatrix3D() { 99 | Vector3 x = new Vector3(1.0, 0.0, 0.0).rotate(this); 100 | Vector3 y = new Vector3(0.0, 1.0, 0.0).rotate(this); 101 | Vector3 z = new Vector3(0.0, 0.0, 1.0).rotate(this); 102 | 103 | return new PMatrix3D( 104 | x.x, x.y, x.z, 0.0, 105 | y.x, y.y, y.z, 0.0, 106 | z.x, z.y, z.z, 0.0, 107 | 0.0, 0.0, 0.0, 1.0 108 | ); 109 | } 110 | } 111 | 112 | // Create a new quaternion by given angle and axis. 113 | Quaternion quaternionByAngleAxis(float _t, Vector3 _a) { 114 | return new Quaternion( 115 | cos(_t / 2.0), 116 | _a.scale(sin(_t / 2.0)) 117 | ); 118 | } 119 | -------------------------------------------------------------------------------- /quaternion_slerp/Vector3.pde: -------------------------------------------------------------------------------- 1 | class Vector3 { 2 | float x, y, z; 3 | 4 | // Instantiate a new Vector3. 5 | Vector3(float x, float y, float z) { 6 | this.x = x; 7 | this.y = y; 8 | this.z = z; 9 | } 10 | 11 | // Stringify the vector informations. 12 | public String toString() { 13 | return "Vector3(" + x + ", " + y + ", " + z + ")"; 14 | } 15 | 16 | // Copy itself. 17 | Vector3 clone() { 18 | return new Vector3(x, y, z); 19 | } 20 | 21 | // Add two vectors. 22 | Vector3 add(Vector3 v) { 23 | return new Vector3(x + v.x, y + v.y, z + v.z); 24 | } 25 | 26 | // Substract this vector by a vector. 27 | Vector3 sub(Vector3 v) { 28 | return new Vector3(x - v.x, y - v.y, z - v.z); 29 | } 30 | 31 | // Scale this vector by a scalar. 32 | Vector3 scale(float s) { 33 | return new Vector3(x * s, y * s, z * s); 34 | } 35 | 36 | // Negate this vector. 37 | Vector3 neg() { 38 | return new Vector3(-x, -y, -z); 39 | } 40 | 41 | // Return its length, in float. 42 | float len() { 43 | return sqrt(x * x + y * y + z * z); 44 | } 45 | 46 | // Normalize the vector (make its length = 1). 47 | Vector3 normalize() { 48 | return scale(1.0 / len()); 49 | } 50 | 51 | // Return a dot product of this vector and given vector. 52 | float dot(Vector3 v) { 53 | return x * v.x + y * v.y + z * v.z; 54 | } 55 | 56 | // Return a cross product of this vector and given vector. 57 | Vector3 cross(Vector3 v) { 58 | return new Vector3(y * v.z - v.y * z, 59 | z * v.x - v.z * x, 60 | x * v.y - v.x * y); 61 | } 62 | 63 | // Rotate this vector by a quaternion. 64 | Vector3 rotate(Quaternion _q) { 65 | Quaternion p = new Quaternion(0.0, this); 66 | Quaternion r = _q.inverse(); 67 | return _q.multiply(p).multiply(r).v; 68 | } 69 | } 70 | -------------------------------------------------------------------------------- /quaternion_slerp/quaternion_slerp.pde: -------------------------------------------------------------------------------- 1 | Quaternion myQuatA; 2 | Quaternion myQuatB; 3 | 4 | void setup() { 5 | size(640, 480, P3D); 6 | myQuatA = new Quaternion(); 7 | myQuatB = quaternionByAngleAxis(PI / 2, new Vector3(1, 1, 1).normalize()); 8 | } 9 | 10 | void draw() { 11 | Quaternion q = myQuatA.slerp(myQuatB, float(mouseX) / width); 12 | 13 | background(0); 14 | 15 | pushMatrix(); 16 | translate(width / 2, height / 2); 17 | applyMatrix(q.toPMatrix3D()); 18 | box(100); 19 | popMatrix(); 20 | } 21 | -------------------------------------------------------------------------------- /uv/uv.pde: -------------------------------------------------------------------------------- 1 | size(256, 256); 2 | 3 | loadPixels(); 4 | for (int iy = 0; iy < height; iy ++) { 5 | for (int ix = 0; ix < width; ix ++) { 6 | float r = ix * 256.0 / width; 7 | float g = iy * 256.0 / height; 8 | float b = 127.0; 9 | pixels[ix + iy * width] = color(r, g, b); 10 | } 11 | } 12 | updatePixels(); 13 | -------------------------------------------------------------------------------- /uv_shader/data/uv.frag: -------------------------------------------------------------------------------- 1 | uniform vec2 resolution; 2 | 3 | void main() { 4 | vec2 uv = gl_FragCoord.xy / resolution; 5 | gl_FragColor = vec4(uv.x, uv.y, 0.0, 1.0); 6 | } 7 | -------------------------------------------------------------------------------- /uv_shader/uv_shader.pde: -------------------------------------------------------------------------------- 1 | size(256, 256, P3D); 2 | PShader shader = loadShader("uv.frag"); 3 | shader.set("resolution", float(width), float(height)); 4 | filter(shader); 5 | --------------------------------------------------------------------------------