Introduction: Animated LED Matrix Jukebox in 10 Min

By
About: With Grablo, Anyone can create amazing IoT projects quickly and easily, without writing a single line of code.

This tutorial shows how to build an animated LED matrix jukebox using Grablo's visual programming blocks. Play music with synchronized GIF animations on a 32x32 NeoPixel display—a perfect mood lamp for your desk or room!


What You'll Build

An animated LED matrix jukebox with:

  1. 32x32 NeoPixel LED matrix display
  2. Synchronized music and animated GIFs
  3. Dashboard control with Play/Skip buttons
  4. Automatic track looping
  5. No coding required


Supplies

Required Components

  1. Raspberry Pi (Zero, 3, or 4)
  2. 32x32 WS2812B NeoPixel LED Matrix (or 4x 32x8 matrices)
  3. 5V DC Power Supply (10A+ recommended)
  4. Speaker (3.5mm audio jack, USB audio adapter, or Bluetooth)
  5. 18AWG power wires


Wiring: Refer to attached wiring diagram


⚠️ Critical Notes:

  1. Use thick wires (18AWG or thicker) for power lines
  2. Raspberry Pi GND must be connected to power supply GND (common ground)
  3. 5V 10A power supply supports up to ~30% brightness. Use higher amperage for brighter output

Step 1: Quick Start

  1. Download and install Grablo software on your Raspberry Pi
  2. Wire components according to wiring diagram
  3. Get this project
  4. Download music and GIF files and upload to your controller
  5. Open Grablo app in your browser
  6. Connect to your Raspberry Pi and hit RUN!

To build it yourself, continue to Step 2.

Step 2: Create Dashboard

Create Project & Dashboard

  1. Go to https://app.grablo.co
  2. Click "Create Project"
  3. Name your project
  4. Create a new dashboard


Add Widgets

  1. Switch Widget: Create a "Play" variable to control playback on/off
  2. Push Button Widget: Create a "Next" variable to skip to next track


Step 3: Logic-Music Playback

Control 1-3: Play Music Tracks

Create three controls to play three music tracks sequentially.

  1. Condition (Compare): Play = True
  2. Action (Play Media): Create media player, command = Play, upload music file

Duplicate for each track with different music files.


💡 Tip: When multiple controls exist in the same logic, they execute sequentially. When the third track finishes, it loops back to the first.

Step 4: Logic-Stop Music

Control 4: Stop Music

Stop playback when switch is off or Next button is pressed.

  1. Condition 1 (Compare): Play = False
  2. Condition 2 (Compare): Next = True
  3. Condition Operator: OR
  4. Option: Rising Edge
  5. Action (Play Media): Command = Stop

Step 5: Logic-LED Matrix

Control 5-7: Display Animations

Display matching GIF animation while each track plays.

  1. Condition (Watch Action): Select music playback action, Status = Running
  2. Action (I/O Device Control): Create WS2812B matrix device, command = Show Image, upload 32x32 GIF


Control 8: Clear LED Matrix

Turn off LEDs when switch is off.

  1. Condition (Compare): Play = False
  2. Action (I/O Device Control): Command = Clear


Step 6: GPIO Pin Configuration

You can use either GPIO 10 or GPIO 12 to control the LED matrix.


GPIO 10 (SPI) - Recommended:

  1. Allows use of 3.5mm audio jack for sound
  2. Requires adding spidev.bufsiz=32768 to /boot/cmdline.txt

GPIO 12 (PWM):

  1. No configuration needed
  2. 3.5mm audio jack will not work
  3. Use USB audio adapter or Bluetooth speaker instead


Step 7: Launch Your Project

That's it—you're done!


Launch Your Project

  1. Open Grablo app in your desktop or mobile browser
  2. Select your project
  3. Connect to your Raspberry Pi
  4. Hit RUN and enjoy!


Expected Results

When you run your project:

  1. Turn on Play switch: First track plays with matching animation
  2. Press Next button: Skips to next track and animation
  3. Press Next again: Cycles through all tracks, then loops back to first
  4. Turn off Play switch: Music stops and LED matrix clears


Step 8: Video Tutorial

Watch the complete build process in action!

Step 9: Expand Your Project

Add more functionality:

  1. Add more tracks and animations
  2. Time-based mood lighting (morning/evening themes)
  3. Voice control to switch tracks


Troubleshooting

No sound:

  1. Check speaker connection
  2. If using GPIO 12, use USB audio adapter or Bluetooth speaker
  3. Verify audio file format (MP3, WAV supported)

LEDs not lighting up:

  1. Check power supply capacity and connections
  2. Verify GPIO pin matches your configuration
  3. For GPIO 10, ensure spidev.bufsiz=32768 is added to /boot/cmdline.txt

Animation not displaying correctly:

  1. Verify matrix layout settings match your physical arrangement
  2. Check GIF size (should be 32x32 pixels)
  3. Try reducing brightness if colors look wrong


Resources

  1. Website: https://grablo.co
  2. Download: https://grablo.co/download
  3. Web App: https://app.grablo.co
  4. Docs: https://doc.grablo.co
  5. Support: support@grablo.co