Artbot Says Hello

My latest project

Jon Bell
Apr 7 · 7 min read

It started with a challenge to myself: what if I wrote some code that would automatically make a square of art every hour? How could I make it interesting? I got to work and called the experiment ArtBot.

My first idea focused on randomisation. I could pick some random shapes and colours, throw them on the canvas, and repeat it once an hour. But going 100% random could get boring. I set a new challenge for myself: if you could go back in time and run the whole thing again, I’d want ArtBot to have the same results. That meant purely random numbers were disallowed. So I’d need to find real world events to inspire the visuals. How about the weather?

Defining colours with RGB
It’s possible to define a colour by describing how much Red, Green, and Blue it should contain. You use a number from 0 to 255. So rgb(255,0,0) would mean pure red, and rgb(0,200,200) would mean a blend of blue and green, making teal. Like so:

Defining RGB with weather in three cities
I picked three cities from around the world, one in the southern hemisphere and two in the northern hemisphere, and analysed their temperature ranges. Let’s say a city hits an annual high of 30 degrees Celcius (86 Fahrenheit) and a low of 3 degrees Celcius (38 Fahrenheit). That means if it’s ever 30 degrees, that’s 100% as hot as it gets, and if it’s 3 degrees, that’s 0%.

If you figure out the current temperature in three cities, then compare it to its annual range, you end up with a handy percentage. Maybe in city one it’s a really hot day and they’re at 94% of their hottest temp. Maybe in city two it’s an average day, so they’re down at 61%. And maybe in city three it’s the middle of winter in a snowstorm, so they’re at 9%. Here’s how the math works: 94% of 255 is 240, 61% of 255 is 156, and 9% of 255 is 23. So if you put those numbers together, you’d end up with this:

Testing out the algorithm

I let it run for 12 hours, and was presented with a lovely gradient. The temperature changes slightly every hour, as you can see here. But there’s a little bit of variation since each city has a different sunrise and sunset. That means the gradient isn’t perfectly uniform and smooth, which is nice.

That was a pretty good start. I had some variation, but not randomness. I was pulling from three cities in a way that told a story over time. I looked forward to seeing what would happen when my “R” city moved from summer to winter. Less red, more blues and greens. And on the rare hours when all three of the cities were experiencing an average temperaure, I’d probably see something more neutral like the browns and dusty purples seen here:

Notice how it jumps from ochre straight to an earthly brown. That happened at dawn on January 24th, causing the temperature in one city to rise and come more in line with the other cities. That’s the kind of real-world randomness I was hoping for. Next I wanted to see if I could “paint” a bit more onto the canvas.

The ugly era

It didn’t go very well at first. I sketched out a series of “triggers” and “actions.” For example “If the stock market rises more than 1%” is a trigger, and “draw a green circle” is an action. I got everything ready to go and this happened:

Yuck. First, I didn’t mean to make it a right angle, so this was a bug. Second, I just don’t like how it looks. The move from beautiful swatches of colour to beautiful geometric shapes was not going well. Then it got worse. This subtle treatment looks sort of interesting at small sizes:

But it looks pretty gross at higher resolutions because I used a retro effect that isn’t particularly pleased. Lesson learned! Some things look better when your eye can’t see all the details. And if I have a long term goal of making this a coffee table book or something, this visual treatment isn’t going to work.


Then things got even worse when the textured background and the strange angles combined to make this. Which is when I realised I had a problem on my hands. I had gone from something lovely to something … not. The only thing I liked about this 16 hours was those two pixelated moments. They were still interesting without being gross.

The four square pixelated effect
I really like how this looks. A bunch of solid colours slowly changing as time goes on, then sometimes there’s a little throwback like this little guy in the top right corner. Isn’t that nice? I think so.

I started tracking the pixelation to see if it would ever double up twice, as shown here. Second from the bottom, second from the right. I saw this after lunch one day and the serendipity made me smile. Just a fun little gift from my automatic hourly art bot.

Repeating Patterns
I spoke with good friend William Van Hecke about repeating patterns. Maybe I could have a certain visual treatment happen every X days, and do that on different rotations. He had lots to say on the topic. Check out this amazing newsletter he put together that explains how he uses repeating patterns in his own life.

So I set to work making some visual treatments. Here are the three I came up with. Dots, angles, and circles.

And periodically they’ll overlap on each other, which results in things like this:

Some tweaks and lots and lots of repeating

I made some other adjustments over time, but the biggest change in ArtBot’s results was how often it was pixelating. Instead of one or two pixelations happening in a day, it started to be most hours in the day, one after the other. Which meant when those days repeated, there was a bit of a fractal effect.

The day I was preparing to go into the woods on a retreat, my domain expired and everything failed over the course of a weekend. I put in some of black squares to represent and remember the outage, but not the same number of hours the bot was down. That would be a bit too much.

Changing seasons
Now that it’s April, two of my cities are entering into spring, which means more blues and greens. It’s been fun seeing the changes come through while the pixelated squares are still referring back to when there was a lot more red. It’s a fun kind of echo effect, and the bot seems to alternate between lots of echo and not as much.

My daily kaleidoscope
A few weeks ago I started sending myself a kaleidoscope image once a day based on the latest ArtBot visuals.

Final thoughts
I’ve had a lot of fun with this project, and I’m looking forward to seeing what it comes up with over the course of the year. It’s turned into a bit of a sounding board. Ideas go in, art pops out, then I’m inspired to try another idea. ArtBot is a perpetual inspiration machine. That, more than any single square it comes up with, is the beauty of it. Thank you, ArtBot! :)

Jon Bell

Written by

Jon Bell

I love building things.

Welcome to a place where words matter. On Medium, smart voices and original ideas take center stage - with no ads in sight. Watch
Follow all the topics you care about, and we’ll deliver the best stories for you to your homepage and inbox. Explore
Get unlimited access to the best stories on Medium — and support writers while you’re at it. Just $5/month. Upgrade