[ Video ]
[ About ]
GLSL Tech Night 2018で聞いてきた事を試してみた。Noiseで文字をずらし + expで減衰。
I tried what I heard at “GLSL Tech Night 2018”.
[ Source ]
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 |
#pragma once #include "ofMain.h" class ofApp : public ofBaseApp { public: void setup(); void update(); void draw(); void keyPressed(int key) {}; void keyReleased(int key) {}; void mouseMoved(int x, int y) {}; void mouseDragged(int x, int y, int button) {}; void mousePressed(int x, int y, int button) {}; void mouseReleased(int x, int y, int button) {}; void mouseEntered(int x, int y) {}; void mouseExited(int x, int y) {}; void windowResized(int w, int h) {}; void dragEvent(ofDragInfo dragInfo) {}; void gotMessage(ofMessage msg) {}; ofFbo fbo; ofTrueTypeFont font; ofShader shader; }; |
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 |
#include "ofApp.h" //-------------------------------------------------------------- void ofApp::setup() { ofSetFrameRate(60); ofSetWindowTitle("openframeworks"); this->font.loadFont("fonts/Kazesawa-bold.ttf", 180, true, true, true); this->fbo.allocate(ofGetWidth(), ofGetHeight()); this->shader.load("shader/shader.vert", "shader/shader.frag"); } //-------------------------------------------------------------- void ofApp::update() { this->fbo.begin(); ofClear(0); ofTranslate(ofGetWidth() * 0.5, ofGetHeight() * 0.5); ofSetColor(255); string word = "SCATTER"; this->font.drawString(word, this->font.stringWidth(word) * -0.5, this->font.stringHeight(word) * 0.5); this->fbo.end(); } //-------------------------------------------------------------- void ofApp::draw() { this->shader.begin(); this->shader.setUniform1f("time", ofGetElapsedTimef()); this->shader.setUniform2f("resolution", ofGetWidth(), ofGetHeight()); this->shader.setUniformTexture("tex", this->fbo.getTexture(), 1); ofDrawRectangle(0, 0, ofGetWidth(), ofGetHeight()); this->shader.end(); } //-------------------------------------------------------------- int main() { ofGLWindowSettings settings; settings.setGLVersion(3, 2); settings.setSize(1280, 720); ofCreateWindow(settings); ofRunApp(new ofApp()); } |
|
1 2 3 4 5 6 7 8 |
#version 150 uniform mat4 modelViewProjectionMatrix; in vec4 position; void main(){ gl_Position = modelViewProjectionMatrix * position; } |
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 121 122 123 124 125 126 127 128 129 130 131 132 133 134 135 136 137 138 139 140 141 142 143 144 145 146 147 148 149 150 151 152 153 154 155 156 |
#version 150 uniform float time; uniform vec2 resolution; uniform sampler2DRect tex; out vec4 outputColor; // // Description : Array and textureless GLSL 2D/3D/4D simplex // noise functions. // Author : Ian McEwan, Ashima Arts. // Maintainer : stegu // Lastmod : 20110822 (ijm) // License : Copyright (C) 2011 Ashima Arts. All rights reserved. // Distributed under the MIT License. See LICENSE file. // https://github.com/ashima/webgl-noise // https://github.com/stegu/webgl-noise // vec4 mod289(vec4 x) { return x - floor(x * (1.0 / 289.0)) * 289.0; } float mod289(float x) { return x - floor(x * (1.0 / 289.0)) * 289.0; } vec4 permute(vec4 x) { return mod289(((x*34.0)+1.0)*x); } float permute(float x) { return mod289(((x*34.0)+1.0)*x); } vec4 taylorInvSqrt(vec4 r) { return 1.79284291400159 - 0.85373472095314 * r; } float taylorInvSqrt(float r) { return 1.79284291400159 - 0.85373472095314 * r; } vec4 grad4(float j, vec4 ip) { const vec4 ones = vec4(1.0, 1.0, 1.0, -1.0); vec4 p,s; p.xyz = floor( fract (vec3(j) * ip.xyz) * 7.0) * ip.z - 1.0; p.w = 1.5 - dot(abs(p.xyz), ones.xyz); s = vec4(lessThan(p, vec4(0.0))); p.xyz = p.xyz + (s.xyz*2.0 - 1.0) * s.www; return p; } // (sqrt(5) - 1)/4 = F4, used once below #define F4 0.309016994374947451 float snoise(vec4 v) { const vec4 C = vec4( 0.138196601125011, // (5 - sqrt(5))/20 G4 0.276393202250021, // 2 * G4 0.414589803375032, // 3 * G4 -0.447213595499958); // -1 + 4 * G4 // First corner vec4 i = floor(v + dot(v, vec4(F4)) ); vec4 x0 = v - i + dot(i, C.xxxx); // Other corners // Rank sorting originally contributed by Bill Licea-Kane, AMD (formerly ATI) vec4 i0; vec3 isX = step( x0.yzw, x0.xxx ); vec3 isYZ = step( x0.zww, x0.yyz ); // i0.x = dot( isX, vec3( 1.0 ) ); i0.x = isX.x + isX.y + isX.z; i0.yzw = 1.0 - isX; // i0.y += dot( isYZ.xy, vec2( 1.0 ) ); i0.y += isYZ.x + isYZ.y; i0.zw += 1.0 - isYZ.xy; i0.z += isYZ.z; i0.w += 1.0 - isYZ.z; // i0 now contains the unique values 0,1,2,3 in each channel vec4 i3 = clamp( i0, 0.0, 1.0 ); vec4 i2 = clamp( i0-1.0, 0.0, 1.0 ); vec4 i1 = clamp( i0-2.0, 0.0, 1.0 ); // x0 = x0 - 0.0 + 0.0 * C.xxxx // x1 = x0 - i1 + 1.0 * C.xxxx // x2 = x0 - i2 + 2.0 * C.xxxx // x3 = x0 - i3 + 3.0 * C.xxxx // x4 = x0 - 1.0 + 4.0 * C.xxxx vec4 x1 = x0 - i1 + C.xxxx; vec4 x2 = x0 - i2 + C.yyyy; vec4 x3 = x0 - i3 + C.zzzz; vec4 x4 = x0 + C.wwww; // Permutations i = mod289(i); float j0 = permute( permute( permute( permute(i.w) + i.z) + i.y) + i.x); vec4 j1 = permute( permute( permute( permute ( i.w + vec4(i1.w, i2.w, i3.w, 1.0 )) + i.z + vec4(i1.z, i2.z, i3.z, 1.0 )) + i.y + vec4(i1.y, i2.y, i3.y, 1.0 )) + i.x + vec4(i1.x, i2.x, i3.x, 1.0 )); // Gradients: 7x7x6 points over a cube, mapped onto a 4-cross polytope // 7*7*6 = 294, which is close to the ring size 17*17 = 289. vec4 ip = vec4(1.0/294.0, 1.0/49.0, 1.0/7.0, 0.0) ; vec4 p0 = grad4(j0, ip); vec4 p1 = grad4(j1.x, ip); vec4 p2 = grad4(j1.y, ip); vec4 p3 = grad4(j1.z, ip); vec4 p4 = grad4(j1.w, ip); // Normalise gradients vec4 norm = taylorInvSqrt(vec4(dot(p0,p0), dot(p1,p1), dot(p2, p2), dot(p3,p3))); p0 *= norm.x; p1 *= norm.y; p2 *= norm.z; p3 *= norm.w; p4 *= taylorInvSqrt(dot(p4,p4)); // Mix contributions from the five corners vec3 m0 = max(0.6 - vec3(dot(x0,x0), dot(x1,x1), dot(x2,x2)), 0.0); vec2 m1 = max(0.6 - vec2(dot(x3,x3), dot(x4,x4) ), 0.0); m0 = m0 * m0; m1 = m1 * m1; return 49.0 * ( dot(m0*m0, vec3( dot( p0, x0 ), dot( p1, x1 ), dot( p2, x2 ))) + dot(m1*m1, vec2( dot( p3, x3 ), dot( p4, x4 ) ) ) ) ; } void main() { vec2 p = (gl_FragCoord.xy * 2.0 - resolution) / min(resolution.x, resolution.y); vec3 color = vec3(1.0); float r_x_noise = snoise(vec4( 0.0, p.x, p.y, time)) * exp(-3.0 * fract(time * 0.5)); float g_x_noise = snoise(vec4(10.0, p.x, p.y, time)) * exp(-3.0 * fract(time * 0.5)); float b_x_noise = snoise(vec4(20.0, p.x, p.y, time)) * exp(-3.0 * fract(time * 0.5)); float r_y_noise = snoise(vec4(30.0, p.x * 10.0, p.y * 10.0, time)) * exp(-3.0 * fract(time * 0.5)); float g_y_noise = snoise(vec4(40.0, p.x * 10.0, p.y * 10.0, time)) * exp(-3.0 * fract(time * 0.5)); float b_y_noise = snoise(vec4(50.0, p.x * 10.0, p.y * 10.0, time)) * exp(-3.0 * fract(time * 0.5)); float drift = 200; float r = texture(tex, vec2(gl_FragCoord.x + r_x_noise * drift, resolution.y - gl_FragCoord.y + r_y_noise * drift)).r; float g = texture(tex, vec2(gl_FragCoord.x + g_x_noise * drift, resolution.y - gl_FragCoord.y + g_y_noise * drift)).g; float b = texture(tex, vec2(gl_FragCoord.x + b_x_noise * drift, resolution.y - gl_FragCoord.y + b_y_noise * drift)).b; outputColor = vec4(color - vec3(r, g, b), 1.0); } |