Hacker News new | ask | show | jobs
by slmbrhrt 5303 days ago
Nice. I've got a minor obsession with alternative ways of displaying the time of day. I've made a canvas clock or two of my own, and I used http://www.let.rug.nl/kleiweg/abclock/ glued to my root window for the longest time.

I like that your clock simply displays the time of day as a visual ratio of time elapsed to time remaining. Of course, at the one-second-per-pixel scale, getting the precise time of day at a glance is a little tough.

Have you considered using color to earmark blocks of time? If it's 300 pixels wide, then a row is 5 minutes. Have you tried maybe some pinstriping on each sixth row to show hour marks? Maybe wider, like 2-hour blocks? I think it would give a lot more information in a single glance.

Do you think turning it 90 degrees and having it progress left to right would be easier or more intuitive? And what about the size? 300x288 has its advantages, but have you played with other aspect ratios?

I'm not trying to pick apart your work, I'm trying to suggest different ways to take it because I like what you've done. If you want to return fire, I made http://slumberheart.com/things/clock.html earlier this year and would love to hear some suggestions.

4 comments

Quick & dirty hour marks:

  --- pixelclock.html.orig	2011-12-06 16:40:56.000000000 +0000
  +++ pixelclock.html	2011-12-06 16:39:43.000000000 +0000
  @@ -23,6 +23,7 @@
           var inpos = (y*width*4);
           for (var x = 0; x < width; x++) {
               var color = (y*width)+x < elapsed ? low : high;
  +            if (y % (3600/width)) { color = (color+128)/2; }
               imageData.data[inpos++] = r;
               imageData.data[inpos++] = g;
               imageData.data[inpos++] = b;
With hour stripes, labels and adjustable width (see source).

http://dl.dropbox.com/u/136288/pixelclock.html

i made this clock 6 years ago that was just 2 pixels wide:

http://jcs.org/notaweblog/2005/06/28/pixelclock/

it draws little notches along the right side of the screen, one for every hour, with green ones for special times (lunch, or time to leave). a yellow square just moves down the side of the screen as the day progresses.

I also had the same idea: http://timesliceapp.com That is just a landing page, no product actually exists.
Not so keen on the pop-out box design, but I quite like the general idea. If you want some design help, let me know.

Picturing it shading hours in the office, after-hours appointments, approximate lunch times, reminders to move cars or do other things.

Thanks for the offer. I really don't have any plans to pursue this idea, for various reasons. I did this quite a while ago. It ended up being more an experiment in landing pages and google ads.
I too made a canvas clock (though with a heavier dose of existentialism) a little while ago if you're interested.

link: http://morrow.github.com/Life-Clock/

code: https://github.com/morrow/Life-Clock/

The other obvious thing to do is to shade it to represent day and night.

Though that would require geoip location and a sun rise/set calculator.