Rechargeable Table Clock

by Ausafmom in Circuits > Arduino

420 Views, 2 Favorites, 0 Comments

Rechargeable Table Clock

Clock Charging Mobile.jpg
Clock Angle View.jpg
Clock front face Humidity.jpg
Clock front face temprature Blue.jpg

We all rely on our bedside or desk clocks to keep us on schedule, but what happens when the power goes out or you're away from an outlet?

In this project, we are building a Rechargeable Smart Table Clock that pulls double duty. Not only does it keep precise time , but it also features a built-in high-capacity Power Bank. This dual-purpose gadget ensures your clock never loses power during a blackout while giving you a convenient, portable station to charge your phone, wireless earbuds, or other USB devices right from your desk.

Supplies

3D View FrontMain PCB.png
back in hand pcb.jpg
3D View Front Sensor PCB.png

Component

Specification

Quantity

Microcontroller

ESP32 Wroom -32 - 4 Mb (1)

LED Matrix/Strip

WS2812B Addressable RGB LEDs (73 LEDs)

RTC Module

DS3231 (with CR2032 Battery) (1)

Motion Sensor

PIR Sensor (MH-SR 602 or HC-SR501) (1)

Temp/Hum Sensor

DHT11 Sensor (1)

IR Receiver

TSOP1838 or equivalent (1)

Capacitor SMT

16v/100 uf (1)

Capacitor SMD

100uf (0805) (8)

22uf (0805) (2)

Resistor

10k (0805) (10)

1k (0805) (5)

5.1K (0805) (2)

LDR

22R (0805) (1)

10k or 100k (0805) (1)

LEDs

Any Colour (0805) (4)

JST Connector

2.54mm 6 Pin JST THT Male & Female (1 Each)

Power Path IC

IP5306_IC (1)

USB To TTL

CH340C_IC (1)

Transistor

BC817 or equivalent (1)

Sound Module

JQ6500 or DF player (1)

Buzzer

Generic THT Buzzer 12mm x 9mm 3.3/5v (1)

LDO Regulator

AMS 1117 3.3 v LDO (1)

Relay

HF46F 5V DC Relay (1)

USB port

Type C 16-P SMD (1)

Type A 4-P SMD (1)

Digital transistor

UMH11N or similar (1)

Buttons

4 pin smd 6mm x 6mm x 6mm (7)

Battery

18650 lithium-ion battery with holder (1)

Speaker

Mylar speaker 0.5W 8Ohm 40mm (4-ohm 3 watt Recommended) (1)

Power Supply

5V 3A DC Adapter (1)

Enclosure

3D Printed (PLA/PETG) (1)

PCB

Printed Circuit board (2 Main + Sensor pcb)

SCHEMATIC

Schematic_MINI-CLOCK_2026-06-19.png
Schem - Sensor PCB Components.png

Step 1: Understanding the Circuit Schematic

Before diving into the layout of the PCB, it is essential to understand how the components interact. The circuit is divided into distinct functional blocks that balance processing power, smart power bank management, and a rich sensor array.

1. Power Path and Battery Management (IP5306)

The heart of the power bank system is the IP5306 multi-function power management IC.

  1. Dual Purpose: It manages the safe charging of a standard 18650 Lithium-Ion battery via a Type-C input. Simultaneously, it boosts the battery's nominal voltage up to a stable 5V output.
  2. Smart Power Bank Features: The IC handles over-charge, over-discharge, and short-circuit protections. It ensures that the clock remains powered seamlessly when alternating between external USB power and battery mode.

2. Microcontroller and Regulation (ESP32 and AMS1117)

  1. The ESP32-WROOM-32 handles all core tasks: keeping time via Wi-Fi (NTP) or a DS3231 RTC module, refreshing the LED animations, and reading sensor telemetry.
  2. Voltage Regulation: Because the ESP32 operates strictly at 3.3V, an AMS1117-3.3V LDO regulator steps down the boosted 5V rail from the IP5306 to safely power the microcontroller.
  3. Auto-Flash Circuit: Using a CH340C USB-to-TTL converter and a dual-transistor configuration (BC817 / UMH11N), the schematic integrates an auto-reset circuit. This allows you to upload code seamlessly from your Arduino IDE without manually messing with physical Boot/Reset buttons.

3. Displays, Peripherals, and Audio

  1. WS2812B LED Matrix: The 73 addressable RGB LEDs are daisy-chained together. They receive power from the stable 5V rail and their data stream directly from an ESP32 GPIO pin.
  2. Audio System: The schematic includes footprints for an audio board (like the JQ6500 or DFPlayer Mini) paired with a 12mm buzzer and a dedicated small speaker for loud, customizable alarms.
  3. 5V DC Relay (HF46F) is added to the schematic, allowing the ESP32 to switch power to LEDs as it will consume power in off state

4. Sensor Integration Array

The front-facing board schematic breaks down your inputs into distinct channels:

  1. DHT11: Connectedto monitor ambient temperature and humidity.
  2. PIR Sensor (MH-SR602): Provides motion detection to trigger "auto-wake" functions when a person enters the room.
  3. LDR (Light Dependent Resistor): Forms a voltage divider to measure ambient light levels, allowing the ESP32 to auto-dim the matrix at night.
  4. IR Receiver (TSOP1838): Decodes signals from standard infrared remotes for quick, cordless setting changes.


PCB DESIGN

2D View Front Main PCB.png
2D View Back Main PCB.png
3D View Front Sensor PCB.png

Step 2: Understanding and Designing the Custom PCBs

To pack an ESP32, an addressable LED matrix, a full power bank path, and a suite of sensors into a compact desktop clock, standard protoboards just won't cut it. A custom Printed Circuit Board (PCB) is essential to keep the wiring clean, minimize electrical noise, and ensure the clock looks professional.

For this project, the system is split into two main parts: the Main Control Board and the Front Sensor/Display Board.

1. The Main Control Board

The backbone of the clock handles power distribution and processing. It features:

  1. The Brain: An ESP32-WROOM-32 microcontroller managing the Wi-Fi connectivity, animations, and sensor data.
  2. Power Path Management: Driven by the IP5306 IC, which handles charging the 18650 Lithium-Ion battery via Type-C and boosting it to a stable 5V output to act as a power bank.
  3. USB-to-Serial Programming: A built-in CH340C IC paired with an auto-reset circuit (using transistors) so you can flash code directly via USB without pressing boot buttons.
  4. Peripherals: An AMS1117 3.3V LDO regulator for the ESP32, an audio module slot (JQ6500/DFPlayer) for alarm Audios, a 5V relay, and tactile buttons for manual control.

2. The Front Display and Sensor Board

The face of the clock is designed to hold everything that interacts with the outside world:

  1. LED Matrix: Traces routed to chain together 73 WS2812B RGB LEDs to form the digital clock digits.
  2. Sensor Arrays: Dedicated footprints for the DHT11 (temperature/humidity), PIR sensor (motion detection), an IR receiver (remote control), and an LDR (light-dependent resistor) for auto-brightness adjustment.


ASSEMBLE PCB

back in hand pcb.jpg
front in hand pcb.jpg
3D View Front Sensor PCB.png

Step 3: Assembling and Soldering the PCBs

With your custom PCBs in hand, it’s time to bring the hardware to life. Because this project utilizes a mix of surface-mount devices (SMD) and through-hole technology (THT) components, a strategic, organized approach to soldering will save you hours of troubleshooting later.

πŸ› οΈ Assembly Strategy: Low to High Profile

Always solder components from the lowest physical profile to the highest profile. This keeps the board flat on your workspace while you work.

Part 1: Assembling the Main Control Board

1. SMD Components (The Base Layer)

Start with the surface-mount components on the Main PCB. If you're new to SMD soldering, a fine-tip soldering iron with tweezers or a hot-air rework station with solder paste works best.

  1. The ICs: Solder the IP5306 (power management), CH340C (USB-to-Serial), and the AMS1117-3.3V regulator first. Ensure the orientation pin alignment matches the PCB silkscreen mark.
  2. Passives: Populate the 0805 SMD resistors, capacitors, and digital transistors (BC817 / UMH11N).
  3. USB Ports: Solder the Type-C (input) and Type-A (power bank output) SMD connectors. Take your time here to ensure the data and power pins aren't bridged together.

2. Microcontroller Insertion

  1. Place the ESP32-WROOM-32 module onto its footprint. Tack down one corner pin to hold it in place, verify its alignment, and then carefully solder the remaining castellated pads.

3. Through-Hole Components (THT)

Flip the board or clear your workspace for the bulkier components:

  1. Solder the tactile buttons (7 pieces) and the 5V DC Relay.
  2. Install the 18650 Battery Holder, ensuring correct polarity (+/-).
  3. Add the header pins or sockets for the DS3231 RTC Module and the Audio Board (JQ6500 / DFPlayer).
  4. Connect the Buzzer and Mylar Speaker.

Part 2: Assembling the Front Display and Sensor Board

1. The WS2812B LED Matrix

  1. Solder the 73 WS2812B RGB LEDs into their grid.
⚠️ Crucial Tip: Addressable LEDs are highly sensitive to heat and direction. Double-check the notched corner of every single LED to match the alignment mark on the PCB before soldering. Avoid holding the soldering iron on the pads for more than 2–3 seconds to prevent frying the internal IC.

2. Front-Facing Sensors

  1. Solder the DHT11 (Temp/Humidity), PIR Motion Sensor, IR Receiver, and the LDR.
  2. Stand them up straight or bend them slightly based on how they will peek through your 3D-printed clock face enclosure.

Part 3: Interconnecting the Boards

  1. Use the 6-pin JST male and female connectors to bridge power and data lines between the Main Control Board and the Front Sensor Board. This modular approach makes it incredibly easy to open up the clock for future upgrades or repairs.

πŸ” Pre-Power Inspection Checklist

Before inserting the 18650 battery or plugging in a USB cable, perform these vital checks:

  1. Short Circuit Test: Use a multimeter in Continuity Mode to ensure there is no short circuit between 5V to GND and 3.3V to GND.
  2. Visual Check: Look closely for any solder bridges, especially on the ESP32 pins and the Type-C port.
  3. Clean up: Use isopropyl alcohol (IPA) and an old toothbrush to scrub away any leftover flux residue.


ENCLOSURE

CLOCK 3D VIEW CAD BAck empty.png
CLOCK 3D VIEW CAD Side.png
CLOCK 3D VIEW CAD Back Cover.png

Step 4: 3D Printed Enclosure and Light Diffusion

To house the electronics beautifully, the enclosure is custom-designed in Onshape. It consists of a sleek main body, dedicated internal mounting pillars for both PCBs, and a snap-fit or screw-down back cover to keep everything secure.

The secret to making the 73-LED matrix look sharp and readable lies in a special multi-color 3D printing technique used on the front face. Instead of relying on a separate acrylic diffuser, the face is printed directly as part of the case using a filament pause trick.

🧡 Filament and Material Selection

  1. White PLA: Used exclusively for the first 2 layers around 0.4 to 0.6 mm to act as an integrated light diffuser.
  2. Black PLA/PETG: Used for the rest of the body to block light bleed and give the clock a clean, premium look.

πŸ–¨οΈ 3D Printing Strategy: The "Pause-at-Height" Trick

To achieve perfect light diffusion without complex multi-material upgrades (like an AMS or MMU), you can manually pause the print. Here is how to slice it:

  1. Layer Height: Set your primary layer height to 0.2
  2. Slicer Setup: In your slicer (Cura, PrusaSlicer, or Bambu Studio), insert a Pause at Height / Color Change command right after Layer 2 finishes (at exactly0.4)
  3. The Print Process:
  4. Start the print with White PLA loaded. It will lay down two solid, thin layers over the clock face.
  5. When the printer reaches Layer 3, it will automatically pause and move the print head to the corner.
  6. Purge your nozzle and swap the filament to Black PLA.
  7. Resume the print. The black filament will build up the walls of the grid cells and the rest of the chassis, completely sealing off each LED segment so the light doesn't bleed into neighboring digits.

πŸ”§ Final Assembly and Fitting everything together

Once your main chassis and back cover are printed, it's time to pack the electronics:

  1. Slide in the Front Display: Place the Front Display & Sensor PCB right against the front face. The individual WS2812B LEDs should align perfectly with the 3D-printed internal grid segments.
  2. Mount the Main Board: Secure the Main Control Board onto the integrated internal standoffs using small M2 or M3 screws.
  3. Wire Routing: Guide the JST interconnection wire cleanly between the two boards.
  4. Align Sensors & Peripherals: Ensure the PIR motion sensor, DHT11, LDR, and IR receiver poke through their dedicated cutouts on the case exterior.
  5. Close it up: Route the Type-C charging port and Type-A power bank output port through the rear cutouts, then snap or screw the back cover in place.


CODE UPLOAD

Screenshot 2026-06-19 114209.png

Step 5: Code Upload and Firmware Setup

With the hardware assembled and the enclosure ready, it is time to flash the firmware onto the ESP32. This code handles the Wi-Fi synchronization for the network time protocol (NTP), reads data from the sensor array (DHT11, LDR, PIR), processes IR remote inputs, and drives the fluid animations on the 73-LED matrix.

πŸ”Œ Preparing the IDE and Board Setup

Before uploading the source code, make sure your development environment is properly configured:

  1. Install Arduino IDE: Ensure you have the latest version of the Arduino IDE installed.
  2. Add ESP32 Board Support: Go to File > Preferences, and add the ESP32 stable URL to the Additional Boards Manager. Then, navigate to Tools > Board > Boards Manager, search for esp32 by Expressif, and install it.
  3. Select Your Board: Go to Tools > Board > ESP32 Arduino and select ESP32 Dev Module. Choose the correct COM port corresponding to your connected clock.

πŸ“š Required Libraries

Make sure to install the following dependencies via the Library Manager (Sketch > Include Library > Manage Libraries):

  1. FastLED or Adafruit NeoPixel (for driving the WS2812B matrix)
  2. DHT sensor library by Adafruit (for the DHT11 temperature/humidity tracking)
  3. IRremote (for decoding your remote controller inputs)
  4. RTClib by Adafruit (for communicating with the backup DS3231 RTC module)

πŸ’Ύ Source Code and Complete Tutorial Links

The complete firmware code, configuration scripts, and step-by-step firmware breakdown are hosted externally for easy updates:

  1. πŸ“₯ Download the Full Source Code Here – This contains the complete .ino sketch file, along with custom animation headers and matrix mapping files.
  2. πŸ“– View the Detailed video Tutorial – A complete walkthrough detailing how to customize the clock faces, adjust the LDR auto-dimming thresholds, and configure your local Wi-Fi credentials in the code.
πŸ’‘ No Buttons Needed! Thanks to the auto-flash circuit integrated into our custom Main PCB (using the CH340C and dual-transistor setup), you do not need to hold down a physical 'BOOT' button on the board. Simply plug in the Type-C USB cable and hit Upload in your Arduino IDE!


FINAL LOOK

Clock Front Labelling.jpg
Clock Side Labelling.jpg
Clock Back Labelling.jpg
WEB UI Alarms.jpg
WEB UI Clock Settings.jpg
WEB UI Colour settings.jpg