Introduction

A few months ago I ordered a 64x32 LED matrix to play around and have some fun with it. Since then I couln't stop programming and spending my time with this toy. After this project grew and grew, it currently contains the following components:

Code for NodeMCU (ESP8266)

Self designed circuit board

Android app

Pixel Art Generator (desktop application)

"Bouncing Pixels" animation

User interaction

The following points are showing, how the user can interact with the LED matrix.

Implemented functions

Drawing pictures and writing text from the Android app

Loading/saving pictures from/to an integrated EEPROM

Create animations using the saved pictures

Web-synchronized clock

Selecting pictures from gallery or take one with the camera

I also implemented a webserver in order to control the matrix with any device using a browser

Animations and games

4 retro animations based on SNES Super Mario games

3 different animations with "Bouncing Pixels"

1 animation displaying the actual system status

Snake

Pong

Flappyball

In this video I demonstrate these functions and animations.

Circuitboard

The circuitboard contains these parts:

2 Shift-Registers to create some virtual I/O ports

1 Level-Shifter to adapt the voltage levels of ESP (3.3V) and Matrix (5V)

2 128kB EEPROM memory to save pictures

Some connectors for signals and powering

It is fixed with screws at the back of the LED panel.

Android App

The Android app was developed with Android Studio. For communication the ESP and Android-Device have to be connected to the same WIFI network. In case the Matrix can't find a known network, it starts an own WIFI access point, which is used to pass information about your WIFI SSID and password.In addition to the graphics for animations, the EEPROM memory on the circuitboard also contains 40 slots to save custom pictures. These pictures can either be reloaded and displayed or used to create own animations. Following picture gives an overview of the user interface.

Overview App user interface

The possibility to draw pictures with your finger might be one of the most fun parts of the app.

Unfortunately I am not an IOS-developer. In order to create access to some functions and animations for not-android-users, I implemented a webserver on the ESP8266, which can be accessed by any device with a browser.

Webinterface (only german at the moment)

Pixel Art Generator

Drawig pictures in the app is fun, but really laborious when it comes to detailed painting. Therefor I developed a desktop application named "Pixel Art Generator". With this program you can create pixel graphics within seconds.

Pixel Art Generator

You can either create a picture on your own, or open a background-picture and take it as template. But instead of drawing every pixel according to the template, you can use the "Auto-Generate" function, which is demonstrated in the picture underneath.

Generate a picture according to a template

This is the result after sending the picture.

There is so much more to show and explain about this project when it comes to details. If you want to know more about a specific part of Wunderpixel, let me know.

Feel free to contact me or to share this article.