Introduction: Rotating Color LED Display

About: I built the first computer myself and grew up in the age of Apple II. Since then, I have been an electronics enthusiast and hobbyist.

The Rotating Color LED Display is a compact disc-sized display with 56 color LEDs. It displays animated images as well as time and weather data from the Internet. The device is wirelessly powered and controlled via a user-friendly web interface. It uses ESP32 and RP2040 microcontrollers.

Supplies

Please refer to the bill of material (BOM), which includes all parts and sources.

Step 1: The Story

When I published a monochrome rotating LED display on instructables.com 6 months ago, the feedback was overwhelming. People liked the concept and challenged me to make a color display, based on the same idea.

However, displaying color is much more complex, needs higher computing power and a significant number of technologies that I had to learn about (I am a hobbyist and not an engineer).

The rotating color LED display features the following highlights:

  • Simple design with few mechanical components
  • pre-assembled printed circuit boards with SMD components
  • Replicable wireless power supply with printed coils
  • Complete balancing of the display board to ensure vibration-free operation
  • Timer controlled clocking of the 56 color LEDs and independent regulation of the R, G, and B brightness
  • Interlacing for higher resolution and less flickering
  • Retrieval of time and weather data from the internet
  • Display of animated GIF images
  • User-friendly user interface via a standard web browser
  • Implementation of a file browser for the SD card for uploading image data
  • Transparent, object-oriented structure of the ESP32 software

Step 2: The Operating Mode of the Display

When switched on, the device tries to connect to a known wifi. If no valid wifi credentials are found, the unit will be configured as wifi access point. In this mode, a computer or mobile device can be connected, directly (SSID: RD56c, no password). 

Once the wifi connection has been established, the unit will display its IP address on the home page of the device. Enter this address in your web browser. This will load the web user interface and will allow you to configure your local wifi.

There are several operating modes that display time and weather information. Both in analog clock mode and logo clock mode, images can be displayed in the background. These images might be animated. Images of various formats, including animated GIF images, can be easily uploaded from the user interface and converted into a specific format.

Step 3: How to Use the Display

Device operation is managed through a web interface, accessible from any web browser. The interface allows users to select the operating mode, adjust the display brightness, manage login credentials, upload image files to the display, and control image and configuration files through a file manager. The use of the interface is intuitive and self-explanatory.

Step 4: The Structure of the Device

The device consists of two assemblies: power supply and display. The power supply board is also the base plate, which can either be placed on a flat surface or hung on a wall. A standard CD motor is attached to this board so that the CD tray above the power supply board can accommodate the display assembly. The display board is fixed with two M2 x 6 mm screws. Furthermore, the base plate carries a potentiometer to control the motor speed as well as an on/off switch for the motor.

The display board is equipped with a row of 56 color LEDs. The LED operations are controlled by a RP2040 microcontroller, while an ESP32 microcontroller generates the display content. Images (including animated images) can be stored on and loaded from a micro SMD card. The ESP32 maintains a Wi-Fi connection to the internet, which allows the device to retrieve the time from a time server, ensuring time accuracy. It also allows for the acquisition of weather data.

An important requirement for the display board is that the center of mass of the unit is exactly in the middle, on the axis of rotation of the motor. This is the only way to ensure smooth and vibration-free running of the display. To achieve this, the electronic components are arranged largely symmetrically. Residual asymmetries are compensated for by balancing weights (M3 screws and nuts).

The core of the power supply is a Royer converter for wireless power transfer. The circuit uses very few components, but its coils are quite complex. In order to ensure reliability and reproducibility of the device, the coils (bifilar primary coil, coupling coil, secondary coil) are implemented as a printed circuits.

Step 5: How to Assemble the Rotating Color LED Display

5.1. component supply

The parts list and all necessary documentation is available on GitHub. The Bill of Material also contains sources and corresponding links for purchasing the parts. However, as the PCB boards are custom made (including assembly), here are some hints on how to get them.

There are several suppliers who manufacture and assemble PCB boards to the specification of their customers in low quantities. I have used JLCPCB in China, but there are also many other suppliers, like digikey.com and others. The production files (Gerber files, bom and position files) are included in my GitHub repository. When using these files, the ordering process is easy.

I have used these manufacturing parameters:

  • PCB thickness: 1.6 mm
  • PCB color: black
  • Material: FR4 standard
  • outer copper weight: 1oz
  • inner copper weight: 0.5oz
  • impedance control: yes, JLC04161H-7628
  • all other PCB options: standard
  • PCBA type: economic

Some of the components of the power supply are through-hole components and need to be soldered by hand. When buying these components, please refer to the BOM on GitHub. Most critical is capacitor C1 (33 nF). It needs to be of high quality and I recommend to use the exact model, specified in the list.

5.2. the motor assembly

Use fast curing two component epoxy resin to glue the CD motor to the carrier plate. Furthermore, carefully glue two M2 nuts to the CD tray auxilliary plate, without contaminating the threats.

Use double sided tape to attache the auxilliary plate with the two M2 nuts to the back of the CD tray. By means of two M2 screws you can make sure the plate is in the right position.

Solder the two wires of the motor to the carrier plate (red = "+").

5.3. the power supply board

Solder all through-hole components to the power supply board. Then, use 4 pin connectors to attach the motor assembly to the power supply board. Use M3 screws with a flat head to screw the 20 mm bolts to the pcb. Finally, use fast curing epoxy resin to glue rubber bumpers onto the ends of the bolts. Insert the 6 mm magnet into the respective hole in the power supply board. Glue it from the back side. The orientation of the magnet does not matter - it will work either way.

5.4 the display board

Use 6 pins to attach the secondary coil pcb to the back of the display board. Make sure, the two boards are connected and soldered tensionlessly, as the relative position between the two boards needs to be as precise as possible. Finally, use two M2 x 6 screws to attach the display pcb to the power supply assembly.

Step 6: Uploading the Software and Necessary Data to the Microcontrollers

All software to be used is free. Install Microsoft Visual Studio Code on your computer. Load the platformIO extension. Familiarize yourself with the system. There are numerous tutorials on Visual Studio Code and platformIO on youTube.

Download a copy of the github repository and store it on your computer, locally. Open the folder “RD56c_RP2040” in Visual Studio Code. Use the right USB-C connector on the display board to connect the RP2040 with your computer. Power on the display (but not the motor ;-). Start the compilation and the data transfer with the checkbutton of the platformIO extension. The program will notify, when the process is completed. Should the computer not connect with the microcontroller, disconnect the display from power, push and hold the RP2040 boot button, re-connect power, and release the boot button, once power is on.

Next, close the “RD56c_RP2040” folder in Visual Studio Code and open the folder “RD56c_ESP32”. Connect the left USB-C connector of the display PCB with your computer. Now, you can start the compiler and data transfer by clicking on the checkbutton of the platformIO extension. Should there be problems with data transfer, re-start the display while pushing the boot button of the ESP32.

Finally, you need to copy some folders and files to a micro SD card. First, properly formate the SD card. You might want to use the formatter of the SD association. Possibly, the on-board formatting routine of your PC serves as well. Then navigate to the ESP32 data directory of the repository (RD56c_ESP32 > data). Copy the four folders (gif, html, images, variables) to the SD card. Insert the micro SD card into the card slot of the display board.

Step 7: Setup the Rotating LED Display

Once the software is uploaded to the microcontrollers and the micro SD card with the necessary data is installed, restart the display by pulling the power plug and reconnecting again. Switch on the motor. Now, the system should run properly and display the home screen with the wifi information. Use your computer to connect to the wifi (SSID RD56c, no password) and start a web browser. Enter the displayed IP address in the address line of the browser. The user interface page will be loaded. You can edit the wifi credentials by clicking on the “config wifi” button of the user interface. Enter the data for your local wifi, click on “done”. Re-start the display. Now, the device will connect with your local wifi and will display it’s new IP address.

If you would like to use the weather clock mode, you need to configure the access information to openweathermap.org. In order to do so, you need to register and subscribe to the “Current Weather Data” Service, which is free of charge. The platform will provide an API-key, which you need to copy to the UI of the Rotating Color Display.

Uploading images, converting them, and downscaling the resolution to 110x110 pixels can be done with the “RDC image manager” page of the user interface. The software can deal with a wide range of image formats and resolution, including animated GIF images. As a last step, select an .RDC image in the selection box by long clicking on the entry. Assign the image to the analog clock, the logo clock, or the image mode by clicking on the respective button.

Step 8: Have Fun With the Rotating Color LED Display

Anything Goes Contest

Participated in the
Anything Goes Contest