Clock IO Panel

A project log for easy-alarm-clock

Improvements for the ubiquitous alarm clock

Christoph TackChristoph Tack 01/11/2019 at 21:040 Comments

Block diagram

First layout idea
IO panel with two times two concentric LED rings

Nothing to be really happy with.  This design is too large.  There are three rotary encoders with an internal switch.  The high switch actuation force of these switches prevents the panel from being used in a vertical position.  You would top over the clock when you push the switch of a rotary encoder.

The three rotary encoders will each be replaced by a push button switch.  There will be one encoder for general change of values.  You push the switch to select that functionality.  Using the rotary encoder you can then change the value at will.  This kind of user interface is used on the R&S RTO200O series oscilloscopes.

The double rings of WS2812B LEDs are also eating up too much space.  Let's replace these by LED bar graphs.

Second layout idea

LED rings replaced by LED bar graph

The space consuming LED rings have been replaced by LED bar graphs.  Each one needs 10 inputs, so it will take some effort to get these routed properly.

The button for setting the brightness of the LED array and the light sensor are not related to alarm settings, so they have been removed from this module.  Functionality for setting LED array brightness should be physically located near the LED array, not on a separate IO panel.

So what's left? 

It all doesn't look to well: all those bar graphs...  The rotary encoder is out of place.

Let's work out another idea...

Third layout idea

Why not incorporate the LED bar graph functionality in the LED array?  We have plenty of pixels already there.  Both sides of the LED array can be flanked with buttons.  Alarm settings on the left, LED array settings on the right.  The pixel row next to the button can be used as a virtual LED bar graph.

The LED array "PCB" and the clock-io-panel have been merged into a single PCB.  This reduces cost and it will mechanical assembly easier.

Functionality overview at a glance, counter clockwise, starting at top left:

Alarm + LED array functionality merged into one IO panel.  Connectors & ICs not yet shown

In the middle you can find :

This clock-io-panel is bigger than the previous one, but 196x122mm will still fit on pretty much any night table.

Layout for PCB Revision 0

Finished layout
Some improvements with regard to the previous version:

Substantial effort went into the placement of the switches and LEDs so that as much as possible routing could be done on top layer.  As such, the bottom layer is able to serve as low impedance ground plane.

Five pieces of this PCB cost me €14.32 + €9.03 shipping.  Four of the PCBs will never be used.  PCB costs dramatically increase when your design doesn't fit a 100mm square as in this case.  If they had, the PCB would only cost me €1.79 for five pieces.

Layout for PCB Revision 1

Revision 0 was all well and good, but  the big clock IO panel PCB is relatively costly and won't find any usage in other projects.  It serves mainly as a carrier for functionality that is already on modules (displays, light sensor).  The fifteen LED/switch combinations might be split up in four identical sections of four switches each.  There would be one module carrying only three switches.  It would add cost in wiring and connectors, but this switch module could easier find usage in other projects.  I would be able to use four of the five prototypes sent to me.  These switch modules would also fit the 100mm square template of the PCB manufacturer.  The different modules could then be mounted on a laser cut panel.  A separate module would be needed for the rotary encoder.  Buy them, not make.

Switch module

Keyboard scanning

The clock-io-panel currently uses the standard matrix keyboard scanning technique.  It requires 8 IO lines for 15 switches.

It's only added here as a reference, because it's a clever circuit: If not enough IO lines had been available, there would be an alternative approach:

Using less IO less for keyboard scanning

This technique would require only 5 IO lines for 15 switches (max. 20 switches).  The downside is that 5 diodes need to be added.  This probably won't work with an SX1509 or similar which has a built in keypad scanning engine.

User input control

Having only a 32x16 LED array to show data poses some limitations on the user interface.

The Nokia 3310 interface could be used as an example.  There are three functions in three buttons:

To help with navigation, on the top right, the path in the tree is shown.  On the right, a line marker indicates the index of the menu item.

All in all that's very nice, but it forces you into a lot of key strokes.  Instead of a menu with several levels of hierarchy, the different functionalities will be brought out onto separate switches and rotary encoders.

Rotary encoder

The problem with a rotary encoder is that there's no way to go back to a higher level in the menu structure.  The workaround is to add a "Back" menu-item that points to a higher menu-level.

Filtered component list in Digikey for applicable rotary encoders with switch.  These are quite cheap, so they can be readily ordered on Digikey, no need to wait for AliExpress.

Another drawback of the encoder is the high switch actuation force.  For the Bourns PEC12R-series, is around 9N worst case.  That's about the weight of three soda cans.  This makes the rotary encoders unsuitable for horizontal actuation.  When you pushed the switch, you would turn over the clock, or it would start sliding over the surface if you wouldn't be holding it with your other hand.

The Bourns PEC12R series has a plastic shaft.  Rocking the shaft gently back and forth or left to right causes false contact switching.  The shaft also feels a bit flimsy.  Adafruit uses the PEC11-4215F-S24, which is now obsolete.  The PEC11R-4215F-S0024 is the new part number.  Presumably the metal shaft from the PEC11(R) series is more sturdy than the plastic shaft from the PEC12R.

Separate switches

Including the key cap(s), this is more expensive than a joystick if momentary switches are used. 

Using keyboard switches, it's another story.  There's a wide variety of push forces, key caps.

Because the original Cherry MX switches didn't accomodate for 3mm LEDs on a non-transparent key cap (which was what I had at that time), I opted to use SMD LEDs instead.  That wasn't a good option.  There's lots of light bleeding away on the sides.  Another problem is that only  the top half of the key cap is lit.  Using 3mm LEDs doesn't solve that issue.  3mm LEDs with a wide opening angle are needed.  Preferably the LEDs should also be high efficiency, as with charlieplexing, they might be driven with low duty cycles.

Keyboard switches are bigger than the ubiquitous 6x6mm momentary switch.  In this case, it's advantageous as it allows easier control.

Touch screen

A 6.2" or 6.4" touchscreen could be used (156 x 88 mm).  This costs $6.24.  Does a touchscreen have added value in this application that can justify the added cost? With a clever menu design, it can be very easy to use.


This has all the necessary features:

This single component can be used to implement the Nokia interface.  It might be strange somehow that the movement to the right has no function.

One handed operation.

The look might be odd with such a joystick pointing out on the front panel.

Navigation switch aka 5 way switch

The cheaper version of the joystick.  It uses switches instead of potmeters.  So there's no way of measuring how far the button has been pressed.

The key cap must be ordered separately.

1-Axis Thumb wheels

Very cheap, about $1.08 for 10 pcsAccording to Sparkfun, these parts are frequently used on portable MP3 players.

At least two of these would be needed.  For intuitive control, these would need to be mounted at 90 degree angles with respect to each other, so at the upper or lower corner of a device.

Even with two devices, these could still be operated by one hand.

They can also be bought from Digikey.

I ordered some of these buttons.   They're quite small and sometimes you push the middle button while wanting to move left or right.  When two of them need to be used, this no longer fulfills the single handed operation.


No suitable source found on AliExpress.  Available on Tindie.

IO Expansion

There's more IO needed than the BluePill can handle.  We need an IO Expander.

The IO expander also controls the 15 LEDs in this setup using charlieplexing.  A charlieplexing library for the MCP23017 has been developed, loosely based on the Chaplex library.

An alternative approach would be to use a 16 channel SPI LED driver instead: TLC5925 | STP16CPC26 | CAT4016 | MAX6969: 16 outputs, integrated current source, Digikey €1/pce.  This would allow me to get rid of the charlieplexing, which would ease timing a bit.

Ambient light sensor

The clock should monitor the intensity of the ambient light in order to adjust the intensity of the LED array.  Especially in the dark it can be quite annoying when the LED array is too bright.  Many choices for sensing the ambient light are available.

Important factors that determine the choice are cost and sensitivity in the human eye light spectrum (390 to 700nm).


Contains the poisonous CdS.  Not RoHS compliant.

Photo diode

Photo transistor

IC sensor

Main display

To be readable in the dark without glasses from about 0.5m distance, the characters should be around 50mm high.

There are a few options here:

After putting a lot of effort into making my own module for the 8x8 3mm LED matrix (see Tileable 8x8 LED matrix), I discovered that 32x8 LED matrices are on sale for close to no money (€2.93).  These modules use the MAX7219, which is controlled by SPI.

Writing first texts to display

Development is ongoing : two 32x8 display units are stuck together with tape.  I had some trouble writing data to the MAX7219 modules.  It seems that only bit banging SPI works.  Maybe that's because the modules are only powered with 3V3, while it should normally by 5V.

All the libraries I tried (LedControl, LEDMatrixDriver, ...), had issues.  I adapted the arduino-Max72xxPanel to suit my needs.

Choosing font

The font should be easily readable without glasses.  So we want it as big as possible.

Font comparison

The fonts have been recovered from the Xronos clock.  That clock contains five different fonts of which four are shown here.  The character '8' is chosen, because it's one of the most difficult ones to read.  The two fonts on the right are easiest to read.  The rightmost font has been chosen because it looks nicer.

Alarm display

Many silly alarm clocks don't show the alarm time by default.  You only see a dot indicating there's an alarm active.  To view the alarm time, some buttons need to be pressed.

To distinguish it clearly from the clock time, a smaller LCD display will be used.  It will allow to verify the alarm time before going to sleep.  It doesn't hinder that the alarm time can't be read without eye glasses.

TM1637 modules

A chinese 7-segment 4 digit module with TM1637 driver is very cheap.  Costing €0.51, it's only €0.10 more expensive than a bare 7-segment 4 digit display.  There's little to be gained by integrating the driver and the display on the main board instead of using a module.

The annoying thing about this TM1637 is that it doesn't have an I²C slave address.  It can't be used with other devices on the same I²C bus, unless you use some kind of I²C multiplexer.

HT16K33 modules

Adafruit's LED backpacks are based on this one.  Most of the modules are sold without LED display.  If you want one with display, you'll pay €2.83 on AliExpress.

You can save yourself a few cents by ordering the led backpack and the led display separately.

Nokia 5110 module

This module has an SPI interface.  It requires 5 IO connections.

OLED displays

Very bright, but small.  These cheap modules will also be very susceptible to screen burn-in.  This makes them less suitable for this application, where the alarm time will be shown continuously.