Digital Clock Redesign: (6) Final Design & Download Link

With just a few short hours to spare, I have completed my digital clock redesign! I'm very happy with the result. The divider between the hours and minutes changes from white to black based on whether the number of seconds detected by Processing's built-in second() function is odd or even. I've successfully created a method of fading from one number to the next, and the color of the cats changes every minute.

I've also included a download link: https://www.dropbox.com/s/q1c4k3sgj2t6nla/Digital_Clock.zip?dl=0. Since I've included images in my sketch, simply copying and pasting my code won't suffice; you'll need the vector files as well for it to work. This is something I hope my peers will consider including in their posts as well if they have also used external media in their piece.

Paige Ruka

Digital Clock Redesign: (5) Almost There

I feel like I've spent far more time on this than I should have to gain such a simple result visually. But, as you can see if you take a look at the code, a LOT is going into this. I just figured out the system for fading from one number to the next. That's cool. I also updated my vector for the number "1" since I'm incredibly picky and didn't like that it wasn't the same width as the others.

Not quite there yet... I'm still wanting to do something more with the color of the cats. I'm getting close to the end, though.

Paige Ruka

Digital Clock Redesign: (4) Coding In Progress

As shown above, I am currently in the process of completing the code for my clock to function properly. I've got all the variables corresponding with the cats working, which I'm very pleased with. As for what's left, I want to add some color, either randomly or based on a mapping of a different variable.

However, I have a few problems I'm running into as things are now. First, I set the frame rate to 1 because in Java mode (a.k.a. the Processing application itself), the two ellipses which separate the hours from the minutes seem to shift after one frame slightly to the right, then never again. I have no idea why this would be happening; the circles shouldn't move at all. Eventually I'll perhaps want a system where they blink once per second, but that's to be dealt with after this weird "shifty circle" issue. The other issue I have is with my vectors; even though I disabled the style on all of them, it looks to me like some have thicker outlines than others. I'm not sure if that's a global issue or just an issue with my personal computer; unfortunately, I have no way to check, as I won't have access to the school computers until Monday.

I think it's going alright otherwise, but these issues are strange, and I need to take a break for today because I don't know what's causing them and it's frustrating me ever so slightly.

Paige Ruka

Digital Clock Redesign: (3) Vector Showcase

Finally, all the cats have been turned into vector files! I want to do a bit of resizing before I import them into Processing; I could just as easily do the resizing in Processing, but I think it'll make my life just slightly easier if I do it beforehand. It shouldn't take too long, and it'll help me to make the final product a bit more uniform. I'm happy to report that progress is coming along nicely.

Paige Ruka

Digital Clock Redesign: (2) Getting Back Into Inkscape

Progress is underway in turning my pencil-and-paper sketches into vector files I can use with Processing. Currently, these are the three vectors I have completed. They are not locked into being the colors they are now; I chose the colors randomly for demonstration purposes only.

The current goal is to have all ten vector files prepped and ready for Thursday's class. My next update will showcase all ten completed files.

Paige Ruka

Digital Clock Redesign: (1) Project Proposal

For my digital clock redesign, I am planning to create a readout where, instead of traditional numbers, the display will use stylized cats which represent the numbers 0-9.

(click to zoom)

To prepare, I've sketched out a few cats for each of the 10 digits I'll need. The "9" remains unlabelled because it is simply the 6 upside-down. I plan to trace over these preliminary sketches in Inkscape to create a vector file for each digit (likely the majority of my work on Tuesday, 2/16). After that, I will be programming these numbers to display in Processing and adding color and embellishments as I see fit (Thursday, 2/18). This timeline should be sufficient in helping me complete this project by Tuesday, February 23rd as scheduled.

More updates to come throughout the week. Stay tuned!

Paige Ruka

Custom Functions

I wish I hadn't been so busy this past week, because I really wanted to make something great for this assignment. Unfortunately, I ran out of time; it happens, such is life.

Next time I'll do better!

Paige Ruka