Feature

Visual Countdown

With A Simple Digital Hourglass

Tim Roberts

Issue 15, September 2018

When a regular hourglass didn’t cut it in the classroom, the idea for a digital hourglass was born.

The hourglass is almost as old as time itself. OK, perhaps not - but they’ve been around for thousands of years. Tim has created a stunning digital hourglass which has some fun accelerometer-driven functions inside too! We wanted to find out more behind this eye-catching creation.

Your digital hourglass timer is very cool - what spawned the idea for this project?

My wife is a prep teacher and was looking for easy ways to set a visual countdown for the students. Not being able to read yet, we looked at sand and liquid hourglasses, but obviously there was no way to change the duration. So I thought, how hard can it be. I looked around and found only 1 other, rather expensive, digital hourglass, so I decided to make one.

Fantastic! Nothing like an actual problem to drive the quest for a solution! How did you approach the accelerometer integration, and why was it chosen over a simple switch for instance?

While a simple tilt switch would work for turning the hourglass over, I wanted a more reactive animation. By using an accelerometer I was able to have the ‘sand’ fall vertically as the hourglass was off axis. Due to the use of timers within the Adafruit library for the LED matrix, both timers within the Arduino Uno were already used, however there were still 3 unused analogue input pins available. By using an accelerometer with an analogue output, it reduced the complexity of the design, code, and I was able to have tilt work for the hourglass.

Software wise, each time through the loop, accelerometer values are read and the Z angle is calculated. This angle is passed to an update_gravity function which manipulates the velocity of each grain.

cicrular clamp
Cicular clamp makes assembly easier.
inside unit

Did you need to tackle any vector maths or anything for the hourglass display, or is the animation a little more rudimentary than that?

The animation is fairly rudimentary. As I was dealing with single LEDs, I found no reason to work beyond the integer grid of points. Initially I considered a physical model where grains would have position, velocity and acceleration, however I very quickly ran out of processing power. As a result I used an array to hold the xy and velocity of each grain. Each time the screen was redrawn, the position of the grain would be modified based on the velocity of the grain. If the grain was at position {3,2} with a velocity {1,0}, the grain would move to position {4,2}. This allows the grain to move in the x direction. This became a source of confusion, as the portrait, rather than landscape, orientation of the hourglass meant that a positive move in the x direction translated to the grain ‘falling’.

I limited the number of grains to 6 as it gave a good amount of flexibility and animation, while keeping data requirements low. Different animations use different numbers of grains as needed. Grains fall until reaching a ‘floor’, which increments the floor, and are then reset to fall again. This removes the tracking of the grains once they have finished falling. It also means I don’t need to track collisions between grains.

That’s true - we need to keep within the limitations of the microcontroller! The laser-cut case looks great! Can you tell us a little more about it and what got you into laser cutting in the first place?

Thanks, I designed it in Solidworks, exported dxf files, imported into Inkscape to tidy, before laser cutting. I spent a lot of time figuring out the best way to make the case. I wanted a clean look, but I also wanted the distance between the LED matrix and the diffuser to be adjustable. The diffuser sits in a channel engraved in the side pieces allowing it to ‘float’ within the case. Assembly was a little tricky, but the circular clamp made things much easier. I was given the clamp, so I have no idea where it came from. I think it’s for holding picture frames together.

inside

I started laser cutting in 2016, using a K40 to create bunting for my engagement party. Since then I’ve completed a whole range of projects including baubles, Peppa pig fridge magnets, cufflinks, coasters, a holder for electric toothbrush heads and family celebration wall hangings. I’m probably most proud of my wedding invitations, which I designed and lasercut. A selection of projects can be found on my Instagram page @zygurt.

The different visual modes are are quite mesmerising to watch! It’s difficult to choose a favourite. What’s the thing you like the most about this project?

I always enjoy the problem solving in a project. Figuring out how to make something work. I made multiple versions of the case design before settling on the final version. Having the adjustable height of the RGB matrix was quite satisfying, as was the moment the insert went into the surrounding case.

That sense of achievement can feel great. Is there anything else you would like us to know about this project?

I'm pleased with how the case came out too. I designed it in Solidworks, exported dxf files, imported into Inkscape to tidy, before laser cutting. I spent a lot of time figuring out the best way to make the case. I wanted a clean look, but I also wanted the distance between the LED matrix and the diffuser to be adjustable. The diffuser sits in a channel engraved in the side pieces allowing it to ‘float’ within the case. Assembly was a little tricky, but the circular clamp made things much easier. I was given the clamp, so I have no idea where it came from. I think it’s for holding picture frames together.

Display Modes

Gravity Ball: A single large grain starts in the middle of the display. The user calibrates the hourglass by rotating it to set the maximum and minimum values used in angle calculation. (Calibration could be removed by hardcoding the calibration values).

Flash Red: The display flashes the entire Matrix Red 3 times to signify that the timer has finished. (A beeper could be added here).

Change timer duration: This display allows for the duration of the timer to be set from 1 to 60 minutes. Buttons on the back are used to do this.

Hourglass: Standard hourglass shape. Grains fall 2 at a time and are added to the ‘sand’ at the bottom. The sand fills right to left, down to up. Each time a grains starts falling the number of grains at the top is decremented by 1.

Random Colour Fill: This gradually fills the entire display with random coloured pixels, left to right, bottom to top. This was to give a very simple way to see how much time was remaining.

random fill

Blue Fill: This does the same as the Random Colour Fill, but only uses Blue. I realised that it could all be quite distracting to a 5 year old, so this is just a simpler display.

Adaptive Raindrops: 6 blue grains fall at a constant rate to the bottom of a ‘bucket’. If the hourglass is tilted, the raindrops fall against the side of the bucket and flow down. The water at the bottom of the bucket doesn’t move however. I put that in the too hard basket.

Helium Ball: This is similar to the Gravity Ball, however it floats up, rather than falling down. Balancing this with the matrix parallel to the ground is quite difficult as we are used to objects rolling off a surface.

Raindrops: This i s the same as Adaptive Raindrops, but uses random coloured grains, and doesn’t fill up.

Default - Bubbles: This is the ‘screen saver’ that the hour glass defaults to after timing finishes. Large circles fall at different rates, but nothing fills up.

bubbles

To view different modes in action on YouTube visit: https://youtu.be/xBAZLqb7FoQ

The project doesn’t use interrupts for the timing as they are used by the RGBmatrix library, instead I have a scaling value. I set the hourglass time to 1 minute and timed how long each display took. I then repeated this at a range of values. By graphing and inserting a trendline, I was able to determine the scaling factor. The end result is timing that is accurate to a second or two. It works for the context it was designed for, but I would use it for anything super time critical. Also, the code and design files are on my github at https://github.com/zygurt/DIY-Projects along with design files for most of my other laser cutting adventures.

Fantastic. We’re sure DIYODE readers will like checking that out! If you started from scratch, would you change the approach, or was it about as successful as you wanted it to be?

I would make a couple of changes if I were starting from scratch. I would use a more powerful microcontroller, like an Arduino Mega, so I could use interrupts for the buttons and timer interrupts to give more accurate timing. I would also write more consistent code. I use functions for some display modes, but not others. I would make it so that each display mode takes the same input arguments, so that the code is easier to read. Finally, I would design and mill a pcb shield for connecting everything to the microcontroller.

We all want more processing power at some point or another! What is the biggest thing you’ve learnt, having developed the timer?

Etching materials to a consistent depth is tricky. While lasers are great for engraving and cutting through material, a CNC mill would have been a much better choice for cutting the grooves for the diffuser.

That, and maybe give yourself more time than you think you’ll need, and don’t try to make a cool new thing in the week or two before your wedding.

Oh, good advice! Now that you’ve completed your Digital Hourglass Timer (and wedding), what amazing new project are you working on now?

My PhD takes up most of my time working on Time-Scale Modification of Audio, but I’m also working on two player arcade cabinets and a lap timing system for FPV RC cars with the electronics club at uni.

They sound like some fun projects. Thanks for taking us through your build! We look forward to hearing about your future builds when they are complete.

The display and circitry fit neatly within the laser-cut case.
The display and circitry fit neatly within the laser-cut case.