Color Blocks: How it Works!


Welcome back for another post! Here I’ll go into detail as to how my first coded series (Color Blocks, using software called Processing) is created.

What are Color Blocks?

Color Blocks is an NFT series I recently posted, where I mimicked a gradient but in discrete chunks. But what does that mean?

Let’s say we have two colors that are represented by the numbers 0 and 10, say yellow and green. The numbers in between them represent their intermediate colors, so 5 would be lime. A gradient tries to mimic as close to a smooth transition as possible, taking the smallest steps that can be rendered on a computer screen.

If you have a really big screen/area to cover, this might look like 0, 0.01, 0.02, all the way to 10. This is 1,000 colors, so if you have a screen 1000 pixels wide it will fill it up, and you get a smooth gradient. Although it is not 100% smooth, the screen is unable to show that. It still looks the part!

Now, Color Blocks does the equivalent of this, but instead of doing steps of 0.01, it’s more like 0, 1, 2. There are jumps in the color, but it doesn’t move from the starting color to the ending color in one burst.

How are Color Blocks Made?

The code generates Color Blocks similar to the image above. Each of them has a four-by-four grid of squares. The top-left one starts with a randomly generated color (in this case it’s black for simplicity). Then, the color of each square, in RGB color formatting, goes up by a given number each square. In this case, blue goes up by 64 to the right, and red goes up by 80 downwards.

The code randomizes the numbers each time. Also, to be more specific, the code fills the squares with a function of x and y, but the mechanic is the same. Similarly, each direction might increase the color in several places, like turning (0, 0, 0) into (30, 50, 20) and then (60, 100, 40).

That’s all for today’s post. The Color Blocks aren’t too complicated, but still give off a very abstract and simple look. Check them out here if you want one!

I hope you learned something! (The boiling point of water at the top of Mount Everest is 160 degrees, if you needed something to learn.) That’s all!

,

Leave a Reply

Your email address will not be published. Required fields are marked *