Welcome —finally— to my guide on how to control RGB LED lights from your smartphone or web browser by making use of the DMX protocol.

Some background

First of all, a bit of background history on how this all came to be. I started this project way back in February 2015 when we first installed RGB LED strips in my room. In order to power them, we got a regular 12V power supply, along with a DMX decoder to control the full RGB color scale.

Lights On

Lights Off

As it turns out, the DMX decoder included a wireless remote that’s supposed to help you change the color in display with an iPod-like wheel, along with the brightness and more. However, this remote just plain sucks; the “color wheel” is awful at best, and there’s no easy way to come back to the color combinations you’ve found to be the most comfortable.

The dreadful remote

There are countless other ways to solve this problem, but the aim of this DIY project was to figure out a new and better way to control the LED lights, while keeping the already present DMX decoder. To achieve our goal, I settled on just building a mobile-ready web interface and connect it to an Arduino board.

The bill of materials

Let’s talk details. Here’s a list of the most important components you will want to use to build this kind of system:

An Arduino Mega 2560 (rev. 3). I started this project with one of my Arduino UNOs, but after getting stuck at some point, I realized the board was lacking RAM… who would have guessed 2kB wasn’t enough memory? I even tried using the “hidden” F syntax, but that didn’t help much either; in the end, I solved the issue upgrading to an Arduino Mega 2560, based on the same architecture as the UNO but offering up to 6kB more RAM!

A 9V / 500mA power adapter for the Arduino board. This guide will help you find an appropiate one.

A breadboard, a few jumper wires, and the necessary length 3-wire electric cable to connect the Arduino to the DMX decoder.

How it works

So, once everything is setup, let’s take a look at how the system works.

You start by accessing the IP address of the Arduino (Ethernet Shield) from your browser of choice, at which moment you’re presented with a webpage that looks something like this:

Mobile webpage screenshot

As you can see, it’s nothing fancy, but it’s as functional as it gets. On the upper side it presents a list of buttons for the LED colors I have found to be the most pleasant, as well as three text fields right below to input any RGB value you want.

Anyway, once you select any of the colors, the software will encode the RGB color combination as an HTTP GET request, effectively sending the r, g, and b values back to the Arduino, as you can see at this point by checking the URL address. It will look something like this:

http://192.168.1.52?r=255&g=255&b=255

After receiving the aforementioned request, the Arduino will generate a DMX signal corresponding to the user input and making use of the rest of electronics will then send it to the DMX decoder, whose job will now be limited to powering up the LED strips to the expected color.

Easy, huh?

Putting it all together

That’s cool and all… but how the heck do I build this thing?

Hardware setup overview

Let’s start with the power side of things. Typically in a higher-power LED installation, you’d connect the lights to the 12V power supply of your choice and be done with it. However, in this case, we’ll place the DMX decoder in between, so now the power supply powers up the DMX box and then the LED strips plug into its output.

My specific DMX decoder has 3 pins for DMX input, corresponding to GND reference voltage and D+ and D- signals. Here’s where that 3-wire cable hooks up, connecting the box to the Arduino and electronics.

On the other side of the setup resides the Arduino Mega microcontroller attached to the Ethernet Shield. The board is also connected to a breadboard, which houses all the electronic components, along with 9V power and a Cat-5 Ethernet cable.

Hardware setup overview

Electronics

The whole circuitry is shown in the following Fritzing diagram. As explained here, here, and there, this combination of a MAX485 transceiver, a 100Ω resistor, and a couple jumper wires will handle the conversion from the digital output of the Arduino to an electrically-compliant RS-485DMX512 signal.

Electronics diagram

Software setup overview

Finally, now that we’re done with the hardware side of things we can switch our focus to the software that’s running on the microcontroller. If you prefer git-cloning to copy-pasting, you can easily do so as the source code is now available as a repository on GitHub.

The center piece is the library DmxMaster (formerly DmxSimple) by TinkerKit. Once installed via the downloaded *.zip file, it will be responsible for generating the digital output off PIN #3 that plugs into the transceiver to generate the aforementioned DMX signal.

As a final remark, you can see that jQuery scripts and styles are downloaded from a CDN instead of being read from the SD card. That’s because this approach is simply put waaay faster. And if one day the internet connection cuts out, the webpage will keep working; it just won’t look this fancy.

The Arduino sketch: final.ino and debug.ino

All this code comes together in the Arduino sketches, a.k.a. the “C++” scripts to be compiled on the microcontroller. If you’re new to the Arduino world, this is as simple as writing your code using the open-source IDE, plugging in your board with a USB type-A to type-B cable, selecting the appropiate board model and serial port, and clicking “Upload”.

When programming, you just need to keep in mind what libraries to include (DmxMaster, Ethernet, SD) , and whether your code should run once (inside setup), indefinitely (inside loop), or be available globally (outside of any function). Here’s the full code, with additional commentary:

The “production” code is available as final.ino, while debug.ino will throw a couple more errors if certain conditions aren’t met.

Voice control via “Ok, Google”

If you have followed the instructions up until now, you should already have a fully functioning system. The final—and optional— step is to get the lights to turn on by using your voice.

For this to work, you’ll need an Android phone with the Google app installed. You’ll also need to download Tasker and the AutoVoice plugin. Everything is explained better in the video, but here’s a summary:

First of all, make sure the “Ok, Google” command is enabled on your phone by opening the Google App > Settings > Voice > “Ok Google” detection and turning on the first two options. Also grant AutoVoice access to allow for the Google Now integration by going to Settings > Accessibility.

If you’ve never used Tasker before, here’s an introduction. And step-by-step:

Open up Tasker.

Create a new profile with the bottom-right “+” button.

Choose Event > Plugin > Autovoice > Recognized.

For the configuration, speak your voice command (i.e., “turn on the lights”) by selecting “Speak filter”.

After saving the changes, go back to the profiles tab, and a pop-up menu will show up; choose “New Task”.

Name it as you like and then click the bottom “+” button.

When asked to select an action, search for “Browser URL”.

Fill in the URL field with the IP address of your arduino followed by the GET request with any RGB values you like. I chose the equivalent to the “Clear” button from the webpage, like this:

http://192.168.1.52/?r=255&g=128&b=50

You can now repeat the same steps for the “turn off the lights” command and any others you’d like to have. Once you’re done, you should see something like the following in the profiles tab.

Creating a Tasker task

Tasker profiles view

AutoVoice “Ok Google” setup

And… that’s it. Next time you feel like adding some ambient light, just shout out to your phone “turn on the lights!”… and there will be light.

Conclusions

So… we’re done.

By following this guide you should have been able to build a system that allows for easy control of your RGB LEDs from your web browser or phone via the DMX protocol. If you run into any issues, just let me known in the comments down below and will see what I can do.

Lights Blue

I’ve been using this setup for over a year and it’s been rock solid. So far it has only stopped working because of power outages or because someone (read: not me) has kicked the Arduino board and some of the wires have disconnected.

Regarding power outages there’s not much I can do, but either 3D-printing a case for the system (Arduino + breadboard) or soldering it into a PCB would make it more resistant, plus dust-proof.

When it comes to security, right now there is no data validation, but that shouldn’t be a problem for this kind of system. What’s more worrisome, especially given the status quo of IoT security these days, is whether someone outside your network can gain access to the webpage or the Arduino, and neither should happen as long as your home network and Wi-Fi are safe.

Future work

As I was writing this post, I realized the Arduino Ethernet Shield has since been “retired”. Even though you can still find them online, I’m pretty sure the same can be accomplished using one of the newer Wi-Fi shields. However, compatibility with the MKR1000 and other ARM-based boards is not assured by the DmxMaster library.

Given that this is an open system, adding new features requires nothing but a bit of coding. One of the things I tried to implement was this JavaScript-based web color picker, but in the end I wasn’t happy with the performance and didn’t feel like I would use such an option.

I’ve found that my usage of the “Ok, Google” voice commands has been going down over time, as it feels faster to just ctrl-t into a browser. However, if I could get an Amazon Echo (not available in Spain, or anywhere outside the US for that matter), adding support for Alexa would probably make the system way more useful.

One of the features that could be added in the future are “effects”, like fading and switching between colors, or maybe even sync them to the music or movies playing in the background.

Finally, integrating this webpage-based setup with other home automation systems could turn it into kind of a “hub” for the home, alaPhilips Hue but cheaper of course.

thanks again pol mesalles i have no access to the dmx decoder, MAX transceiver around here i was thinking of making a proof of concept by using LED to represent the lights…..using ok google to turn on and off the the LED connected to the breadboard…..control LED from the phone…..