Loops, shades and randomness
Create a grid of circle pairs. In each position in the grid there is a larger circle and maybe (50% chance) a smaller circle. The larger circle has a shade of pink (either brighter or darker). The smaller circle fill color is picked randomly from a set of 4 colors. That set contains white twice to make it more frequent.
Processing / Java
import java.util.Arrays;
int seed = 1111;
int PINK = #FFC0CB;
int WHITE = #FFFFFF;
int BLACK = #000000;
ArrayList<Integer> colors = new ArrayList<Integer>(Arrays.asList(
PINK, WHITE, WHITE, color(PINK, 128)));
void setup() {
size(900, 450);
}
void draw() {
randomSeed(seed);
background(WHITE);
for (int x=0; x<=15; x++) {
for (int y=0; y<=5; y++) {
PVector pos = new PVector(
map(x, 0, 15, 100, width - 100),
map(y, 0, 5, 100, height - 100)
);
stroke(PINK, 102);
float amount = noise(pos.x * 0.007, pos.y * 0.004) * 3 - 0.7;
fill(amount > 1 ? lerpColor(PINK, WHITE, amount-1) :
lerpColor(PINK, BLACK, 1-amount));
circle(pos.x, pos.y, 40);
if (random(1) < 0.5) {
fill(colors.get((int)random(colors.size())));
circle(pos.x, pos.y, 20);
}
}
}
}
OPENRNDR / Kotlin
Imports
// imports are added automatically by the IDE
import org.openrndr.application
import org.openrndr.color.ColorRGBa
import org.openrndr.extra.noise.Random
import org.openrndr.math.Vector2
import org.openrndr.math.map
fun main() = application {
configure {
width = 900
height = 450
}
program {
val colors = listOf(ColorRGBa.PINK, ColorRGBa.WHITE,
ColorRGBa.WHITE, ColorRGBa.PINK.shade(0.5))
extend {
Random.resetState()
drawer.background(ColorRGBa.WHITE)
for (x in 0..15) {
for (y in 0..5) {
val pos = Vector2(
map(0.0, 15.0, 100.0, width - 100.0, x * 1.0),
map(0.0, 5.0, 100.0, height - 100.0, y * 1.0)
)
drawer.stroke = ColorRGBa.PINK.opacify(0.4)
val amount = Random.simplex(pos.x * 0.004, pos.y * 0.003) + 0.5
drawer.fill = ColorRGBa.PINK.shade(amount)
drawer.circle(pos, 20.0)
if (Random.bool()) {
drawer.fill = Random.pick(colors)
drawer.circle(pos, 10.0)
}
}
}
}
}
}
Concept | Processing | OPENRNDR |
---|---|---|
flip a coin | random(1) < 0.5 |
Random.bool() |
pick a random item from a list | colors.get( (int)random(colors.size())) |
Random.pick(colors) |
reset the random number generator | randomSeed(value); //noiseSeed(value); |
Random.resetState() or Random.seed = "capybara"
|
get a random noise value | noise(x, y) |
Random.perlin(x, y) or Random.simplex(x, y) or Random.value(x, y) and even more
|
count from 0 to 15 |
for(int x=0; x<=15; x++) for(int x=0; x<16; x++) . |
for(x in 0..15) for(x in 0 until 16) (0..15).foreach
|
get a translucent variation of a color | fill(PINK, alpha) |
ColorRGBa.PINK.opacify(0.4) |
get brighter or darker variation of a color | if(amount > 1) lerpColorPINK, WHITE, amount-1) else lerpColor(BLACK, PINK, amount) |
ColorRGBa.PINK.shade(amount) |
Notes:
Different noise values are used to achieve similar color shades in both programs. Noise functions and their arguments produce different aesthetics, so you just need to play with the values to get what you want.
By resetting the random seed I avoid a flickering animation, because I obtain the same sequence of random numbers on each frame. But if you want it to flicker remove the randomSeed()
/ Random.resetState()
Share your questions and comments below | Find other OPENRNDR & Processing posts