Skip to content

Instantly share code, notes, and snippets.

@marcedwards
Created March 4, 2019 11:58
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 2 You must be signed in to fork a gist
  • Save marcedwards/da6292b5bc9ccf49bf8cb84a57a610df to your computer and use it in GitHub Desktop.
Save marcedwards/da6292b5bc9ccf49bf8cb84a57a610df to your computer and use it in GitHub Desktop.
Some sine wave timing fun, using 2 or 3 sections with separate ease-in-out curves.
//
// Some sine wave timing fun, using 2 or 3 sections with separate ease-in-out curves.
// Created using Processing 3.5.3.
//
// Code by @marcedwards from @bjango.
//
void setup() {
size(400, 400, P2D);
frameRate(60);
smooth(8);
noStroke();
}
void draw() {
background(#191030);
for (int i = 0; i < 8; i++) {
for (int j = 0; j < 8; j++) {
float x = (i * 80 - 160) + easeOverSin(timeLoop(60, j * 4), 0.45, 1.25) * 160;
float y = (j * 80 - 160);
if ((i + j) % 2 == 0) {
fill(#532a86); // Purple
ellipse(x, y, 20, 20);
} else {
if (j % 2 == 0) {
fill(#1fcd92); // Darker Green
} else {
fill(#97e365); // Lighter Green
}
ellipse(x, y, 40, 40);
}
}
}
}
float easeOverSin(float t, float split1, float split1amp, float split2, float split2amp) {
// Takes 3 sections of the time range, and normalizes them to 0-1.
float start = map(constrain(t, 0, split1), 0, split1, 0, 1);
float middle = map(constrain(t, split1, split2), split1, split2, 0, 1);
float end = map(constrain(t, split2, 1), split2, 1, 0, 1);
// Runs each section through an ease-in-out sin, then scales to the original section size.
start = easeInOutSin(start) * split1amp;
middle = easeInOutSin(middle) * (split2amp - split1amp);
end = easeInOutSin(end) * (1 - split2amp);
return start + middle + end;
}
float easeOverSin(float t, float split, float splitamp) {
// Takes 2 sections of the time range, and normalizes them to 0-1.
float start = map(constrain(t, 0, split), 0, split, 0, 1);
float end = map(constrain(t, split, 1), split, 1, 0, 1);
// Runs each section through an ease-in-out sin, then scales to the original section size.
start = easeInOutSin(start) * splitamp;
end = easeInOutSin(end) * (1 - splitamp);
return start + end;
}
float easeInOutSin(float t) {
return 0.5 - cos(PI * t) / 2;
}
float timeLoop(float totalframes, float offset) {
return (frameCount + offset) % totalframes / totalframes;
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment