Last active
January 18, 2020 04:35
-
-
Save marcedwards/f477483fcfdd99a67c5e50e936b6432e to your computer and use it in GitHub Desktop.
A squiggly line that becomes less squiggly, in Processing
This file contains hidden or 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
// | |
// Squiggly Line. | |
// Created using Processing 3.5.4. | |
// | |
// Code by @marcedwards from @bjango. | |
// | |
// This was a response to a tweet :) | |
// https://twitter.com/WalterStephanie/status/1218183269361049600 | |
// | |
// A GIF of this code can be seen here: | |
// https://twitter.com/marcedwards/status/1218391139566288896 | |
// | |
void setup() { | |
size(800, 400, P2D); | |
frameRate(30); | |
smooth(8); | |
noiseSeed(8); | |
} | |
void draw() { | |
background(240); | |
float step = 0.001; | |
float pad = 40; | |
float drawfrom = 0.1; | |
float drawuntil = Ease.hermite5(timeBounce(360)); | |
float x = pad; | |
float y = height / 2; | |
float amount = 0; | |
noFill(); | |
stroke(50); | |
strokeWeight(2); | |
beginShape(); | |
curveVertex(x, y); | |
curveVertex(x, y); | |
for (float i = drawfrom; i < drawuntil; i += step) { | |
amount = constrain(1 - Ease.hermite5(i, 2), 0.001, 1); | |
x = pad + (width - pad - pad) * i; | |
curveVertex(x + xsquiggle(i, amount), y + ysquiggle(i, amount)); | |
} | |
vertex(x + xsquiggle(drawuntil, amount), y + ysquiggle(drawuntil, amount)); | |
endShape(); | |
fill(50); | |
noStroke(); | |
ellipse(pad + xsquiggle(drawfrom, 0), (height / 2) + ysquiggle(drawfrom, 0), 16, 16); | |
ellipse(x + xsquiggle(drawuntil, amount), y + ysquiggle(drawuntil, amount), 16, 16); | |
} | |
float ysquiggle(float i, float amount) { | |
return (timeNoise(360, 0.05, i * 47) * height * 2 - height) * amount; | |
} | |
float xsquiggle(float i, float amount) { | |
return (timeNoise(360, 0.05, i * 49 + 1) * width - (width / 2)) * amount; | |
} | |
// | |
// | |
// | |
static class Ease { | |
static public float hermite5(float t) { | |
return t * t * t * (t * (t * 6 - 15) + 10); | |
} | |
static public float hermite5(float t, int repeat) { | |
for (int i = 0; i < repeat; i++) { | |
t = hermite5(t); | |
} | |
return t; | |
} | |
static public float tri(float t, float repeat) { | |
return t * repeat * 2 % 2 <= 1 ? t * repeat * 2 % 2 : 2 - (t * repeat * 2 % 2); | |
} | |
static public float tri(float t) { | |
return t < 0.5 ? t * 2 : 2 - (t * 2); | |
} | |
} | |
float timeNoise(float totalframes, float diameter, float zoffset) { | |
return noise(cos(timeLoop(totalframes) * TAU) * diameter + diameter, | |
sin(timeLoop(totalframes) * TAU) * diameter + diameter, | |
zoffset); | |
} | |
float timeLoop(float totalframes, float offset) { | |
return (frameCount + offset) % totalframes / totalframes; | |
} | |
float timeLoop(float totalframes) { | |
return timeLoop(totalframes, 0); | |
} | |
float timeBounce(float totalframes, float offset) { | |
return Ease.tri(timeLoop(totalframes, offset)); | |
} | |
float timeBounce(float totalframes) { | |
return timeBounce(totalframes, 0); | |
} |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment