The Broken Modernist Clock

Screen Shot 2561-09-20 at 02.00.42.png

Screen Shot 2561-09-20 at 02.00.52.png

Screen Shot 2561-09-20 at 02.00.59.png

I was inspired by the appearance of the project ‘Time in Color’ by Scott Thrift. Scott tries to create a clock which represents a 24 hour day using sunrise / sunset like colors.

https://timeincolor.com/

I wanted to take it further and make the gradient change according to time.

A sketch of what I wanted to make.

Top: AM
Bottom: PM

Screen Shot 2561-09-17 at 21.08.57.png

As I began to code, the gradient became too overwhelming so I focused on the changing of color based on the mouse position.

I did this by tracking the angle of the mouse in relation to the center of the circle. However, the top and bottom were the same. Therefore, I had to use the ‘if’ function to distinguish the two.

To present the function ‘random’, I made the background different in greyscale each time the code is run.

To make it more fun and aesthetically appealing I experimented with the tracing of the mouse. This resulted in a Kandinsky mobile feel.

Screen Shot 2561-09-17 at 21.23.16.png

This is the final output.

version 1: https://editor.p5js.org/embed/HywwAYpu7
version 2: https://editor.p5js.org/embed/SkeehRTuQ

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out /  Change )

Google+ photo

You are commenting using your Google+ account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s