Collection of Digital Clock Designs

For some really quirky/weird/cool physical clocks, the British Museum channel has a few great videos:

Curious Clocks and Watches through time with Oliver Cooke | Curator's Corner S8 E1

https://www.youtube.com/watch?v=ywD5kngMuYM

Nice inspiration for world building, especially Steampunk etc!

Oh I love these! It just reminded me of a small project I had in which I was creating experimental watchfaces using SVGs and JavaScript, this is before the AI boom so I made all of these by hand and, although there's nothing impressive here, I'm proud of them as a designer who learned basic code by myself.

https://watchface.netlify.app/

And I wrote about it here: https://72mena.medium.com/designing-watch-faces-using-svgs-a...

At this point it'd be worth creating an old-school webring [1] for all the HN clock enthusiasts. :)

The clock at: https://clocks.dev/clock/lock-screen

is kind of similar to one of my clocks: the Filling Digit clock [2], which fills the hollow digits with water from the bottom up to represent the seconds in a minute:

Another one that made the rounds here on HN was "Alphabetical Clock" [3] which is pretty amusing.

[1] - https://en.wikipedia.org/wiki/Webring

[2] - https://clocks.specr.net/filling-digits

[3] - https://news.ycombinator.com/item?id=47571401

[delayed]

Please add this one (my design) https://euclid.tulv.in/

This is awesome! I made a Soroban (Japanese abacus) version, but I couldn't add it to the collection since I used css-based animations. Published here: https://soroban-clock.netlify.app

Some of these seem subtly off. For example, on the orange "number field" clock (https://clocks.dev/clock/number-field), you can't distinguish between 12:10 and 10:12. On the "word field" one (https://clocks.dev/clock/word-field), there are "X"es in lieu of unused characters, which makes the emergence of words a lot less mystifying than in the original "word clock" design this is based on. The "temporal exposure" one (https://clocks.dev/clock/temporal-exposure) has weird off-center bands in the blurred area. The "figure hands" one has text sticking out of the drawing area, etc.

"Number field" felt like the best spacial representation of a numeric clock (would need to be 24h to be perfect but that's a small tweak)

There are plenty of them in a more linear style, but the 12 columns design really works well IMHO. It's really easy to roughly guess the time at a glance.

https://clocks.dev/clock/number-field

I'd really like an analog watch face for the lock screen of my iPhone.

Not a single 24-hour analogue face? That unexpectedly turned into one of the best reasons I keep carrying my smartwatch.

What would be the best device to put any of these ones over the desk? And old phone? Maybe an esp32?

I am not sure I want to use the API when it is not that hard to get the hands of a clock going with Javascript. I know I can do the latter, but the former poses a new learning challenge that doesn't guarantee a result.

My current SVG clock is modelled on a wall clock and it has the really small text that can normally found on a clock, for example 'Made in China' and 'Quartz'. I also have a fictional brand name, plus a bezel specified with 'pathLength="60"' and a dash array.

As a design exercise, a standard clock is interesting because you have to remember the stack order of the hands, and, despite looking at clocks many thousands of times, that detail requires a modicum of thought.

I think it is a good start to get a credible wall clock that tells the time at a glance before branching out into 'cool' clocks that put design before telling the time.

I now want to add a drop shadow that changes throughout the day, as if the clock is south facing, in the northern hemisphere, corresponding to my lat/lon.

This would be easy with three js because it could be modelled, along with the entire solar system, with the camera pointed at a 3D modelled clock, however, in SVG filters, could be a while.

Getting the hands to move is the easy bit, all considered. I really don't need another API for that, but I am not in the Svelte ecosystem.

I've seen and used some variations of these in my Pebble watch.

They're cool for one day or two. But, in the end, I will always go back to some boring but more information-dense one (with battery charge, weather, heart rate, steps, etc).