Controllable Led (Music Visualizer + IoT)

Today, playing light using android and bluetooth is already mainstream, so I decided to make something different, make the lights that can be controlled via the Internet. It's not about the relay, temperature logger or internet of things in general, I make something different. I make lights that can be :

Sound reactive - Its music visualizer
17 pattern - Led moving effect
Color Changing - 16 millions color possibilities
19 type world lights - showing the real world lights, including black light and candle
Cheer lights - connecting the world with color project

And the device can be controlled from anywhere in the world as long as connected to the Internet. See the video to know how this device work.

It might look difficult, but if you follow the steps properly then it will be easy. I promise...

Or if you want make this sound react only (offline), just upload the code to your nodemcu or arduino and skip the configuration step.

Material

Acrylic glass
Piece of plywood
Glue
Nuts and Bolts
RGB LED strip
NodeMcu
Sound detector module
Few jumper cable
5V Power supply (I use a phone charger)
Breadboard
1k Resistor
Push button
Electrolytic Capacitors - 1000uF/25V (optional)

Tool

Hacksaw
Drill
Soldering iron

Step 1: BlueMix and Code Configuration

Why choose Bluemix?

No delay, for comparison Thingspeak need 15 second minimum delay.
Node-Red integration, in node-red app you can make your IoT smarter.
Easy integration with other popular app like Slack, Facebook, Twitter or even Thingspeak.

Programing NodeMcu using Arduino IDE

For simplify we will use arduino IDE for this project, follow this step to program nodeMcu using arduino IDE :

Install Arduino 1.6.5 from the Arduino website.
Start Arduino and open Preferences window.
Enter http://arduino.esp8266.com/stable/package_esp8266com_index.json into Additional Board Manager URLs field. You can add multiple URLs, separating them with commas.
Open Boards Manager from Tools > Board menu and install esp8266 platform (and don't forget to select your ESP8266 board from Tools > Board menu after installation). Mine is NodeMCU 1.0 (ESP-12E Module).
Dont forget to select your nodemcu port and select upload speed to 115200.

Bluemix Setup

Go to https://console.ng.bluemix.net/ and sign up. Name your organization (project or team that shares resources, such as apps, databases, and other services) and choose the region (geographic region where your organization exists). For region choose US South because some features that we will use are support only in that region right now.
Under Catalog tab, you can see plenty options for development, various services (Boilerplates, Data, Mobile, third party…) that you can use to build wide variety of applications. At the bottom, you will see Internet of Things section. Click on the Internet of Things Platform.
Choose free plan, which has certain limitations but it is more than enough for us now. The Free service plan for Internet of Things Platform includes up to 20 registered devices, and a maximum of 100 MB each of data exchanged, data analyzed, and edge data analyzed per month.
We want to connect our devices to Bluemix. In order to do that, launch Internet of Things Platform dashboard. On the left side of the dashboard, click devices. Since we don’t have any device types created yet, we have to create one.
Click create device type and name as you want, ex : nodemcu. Description is optional. Click next. There are some other fields (serial number, manufacturer, model…) that you can select but they are not mandatory. Continue with this process until you can click the create button. We still haven’t added any particular devices, we have just created a template, a device type, that we have to choose each time we want to add a new device.
Now choose nodemcu device type and click next. We need to add a device ID. Device ID should be the MAC address of your nodemcu module. To obtain address copy code below to your arduino IDE then upload. Open serial monitor and you will see your NodeaMcu device ID, save your Device ID and dont forget all letters should be capitalized and remove all colons, for example : 5CCF7F23FFEB.

#include <ESP8266WiFi.h>
void setup() {
  Serial.begin(115200);
  String clientMac = "";
  unsigned char mac[6];
  WiFi.macAddress(mac);
  clientMac += macToStr(mac);
  Serial.println();
  Serial.println(clientMac);
}
String macToStr(const uint8_t* mac) {
 String result;
   for (int i = 0; i < 6; ++i) {
    result += String(mac[i], 16);
   if (i < 5)
    result += ':';
 }
 return result;
} void loop() {
 }

Click Add. The window that appears is very important. You have to copy authentication token now, because you won’t be able to access it any more after you close the window! Copy all parameters because you will need them in the code. You have added a new device and you should see it in the dashboard.

The Code

Download Lumen Histoire codeand open on your arduino IDE, update the arduino code with the parameters you have just saved and upload it to the nodemcu. Also, don’t forget to add SSID and password for WI-FI connection. Take a look at the topic string. Cmd refers to command, which means that we are send command. String ends with fmt/String which means that data is published in string format.

Lumen_Histoire.ino
Download

Step 2: Slack Configuration

Why using Slack app?

Making app from zero need more time, i want fast as possible.
IoT device can controlled by group, ex : family.
This will make you learned how to integrating your IoT with other popular app by using api.

Slack Setup

Go to slack.com and signup, make 4 channel for send command to our IoT device. Name it with #mode , #pattern , #coloring and #realcolor

Channel Setting :

Go to channel settings and click add an app or integration. For ex i will configuring #mode channel.
Search for outgoing webhooks which will allow you to send Slack messages to external addresses, such as our app in Bluemix.
Add new configuration, choose your channel and click add outgoing webhooks integration.
Choose channel, leave trigger word and fill URL with the name of your Node-RED application, followed by the arbitrary path, for example: juicy.mybluemix.net/mode
Configure other channel (#coloring, #pattern, #realcolor)

Step 3: Create an App With Node-RED

Your device is ready to receive messages from Slack Channel. Now we have to make a flow in Node-RED. Bluemix supports several programming languages. We will build our app using Node-Red. It is a visual tool for wiring together hardware devices, APIs and online services.

On Bluemix catalog page, Click on browse boilerplates and choose Node-Red Starter. Enter your app name and choose Cloudant DB. Click create.
Go to status page of your app (from the main dashboard), click Connection menu, choose connect exiting and check Internet of Things Platform service, click connect and restage your app.
Go to your Node-RED flow editor. You can access your app by clicking on the link (appnamw).mybluemix.net

Node Configuration :

On the left side of your Node-Red App, you can see nodes divided in several categories (input, output, function, storage etc.) Nodes are building blocks of our app. We place them in the editor and wire them to create a flow. You can have many flows within an editor.

Drag http, debug, function and IBM IoT to the flow chart. Wire them, see image for detail.
In HTTP node you have to put the same path you have chosen while adding webhook integration to your channel (ex : /mode for #mode channel) and choose POST method.
Function code :

msg.payload = msg.payload.text;
return msg;

Double click IBM IoT, Choose Bluemix Service and Device Command. Type your device type, ID and command type. Check arduino code in Command topic line, you can see the command name there. Change format to String and type “command” text on Data field.
Configure other channel (#coloring, #pattern, #realcolor)

For Cheer Lights node configuration :

Drag inject, function, http request, debug and IBM IoT to the flow chart. Wire them, dont forget to wiring cheerlights function with mode function. see image for detail.
Edit inject node to :
- Payload : String - Value : 3
- Repeat : interval - every 15 minutes
- Cheklist “Inject once at start?”
Edit http node to :
- Methode : GET
- Url : http://api.thingspeak.com/channels/1417/field/2/last.txt
For IBM IoT node same as command channel configuration.

Step 4: Making the Device

First, dont forget to gather all material that listed on step 1.

Create holes in the four corners of the acrylic using a drill. be sure the nut can get into the hole.
I have 30 pixel Led strip and cut them into 4 strip, so each strip holds 7 or 8 pixel.
Cut plywood for strip holders using hacksaw. Cut as long as led strip, I covered the plywood pieces using black sticker to make it look better.

Attach led the plywood pieces and solder all of led strip into one piece as before using cable or jumper wire.
Stick a small piece of plywood or other small object on the side of led strip, it serves as a divider between the led with acrylic.
Stick it on each side of the acrylic, make sure the parts are glued is small chunks that had we put as separator/divider.
Then pair nuts and bolts on each hole in acrylic. It serves as a foot, so the acrylic is not easily scratched and damaged.
Now you can modify this device as you like, for example i stick some sticker.

Step 5: NodeMcu Hookup

Sound Detector Module to NodeMcu :

AO (envelope) > A0
+ > 3V
- > GND

Calibrating (if you using cheap module from aliexpress) :

Open Serial monitor and see volume value, make sure its become zero if no sound near the module. You can change the value by adjusting small potentiometer on the module and make sure the led in module is turning off when no sound near the module.

Power Supply (Wall Adapter or phone charger) to NodeMcu :

I use a cheap 1.5 amp phone charger, cut the cord and hook up the 5v to Vin and GND to GND.

Optional :

Add Electrolytic Capacitors - 1000uF/25V betwen poer supply and nodemcu. Help prevent possible damage to the LEDs.

LED Strip to NodeMcu :

DO > D1
+ > 5V power supply

- > GND power supply

Push Button to NodeMcu :

Look the image for detail. It using D2 pin

Sound React Only (Offline)

If you decided to make sound react only, you can use nodemcu, led strip and sound detector module only.

The code is same as online mode, just upload the sketch to your nodemcu or arduino.

Step 6: How to Control

By default its in sound reactive (music visualizer) or offline mode, then if you press the push button its will becoming IoT mode that means you can change the color of pixel, following cheerlights, play with led moving pattern and select the real world color lights. And if you press push button again, its back to offline mode again.

Change Device Mode :

Make your device in IoT mode by pressing push button.
Open Slack app and send message to #mode channel using this keyword :
- 0 : Sound Reactive
- 1 : Led pattern mode
- 2 : Coloring led mode
- 3 : Cheer lights mode
- 4 : Real world color mode

Ex : if you send "3" the led color will turn into cheer lights

Change to Sound Reactive (mode 0) :

Send "0" message to #mode channel and the led automatically become sound visualizer.

Change led moving pattern (mode 1) :

Send "1" message to #mode channel
Send message to #pattern channel using this keyword :
- 1 : RGB Loop
- 2 : Strobe
- 3 : Halloween eyes
- 4 : Cylon bounce
- 5 : New KITT
- 6 : Twinkle
- 7 : Twinkle random
- 8 : Sparkle
- 9 : Snow sparkle
- 10 : Running lights
- 11 : Color wipe
- 12 : Rainbow cycle
- 13 : Theater chase
- 14 : Theater chase rainbow
- 15 : Fire
- 16 : Bouncing balls
- 17 : Colored bouncing balls

Ex : if you send "12" the led will moving in Rainbow cycle pattern.

Change led color (mode 2) :

Send "2" message to #mode channel
Send message to #coloring channel using this keyword :

Rvalue.Gvalue.Bvalue

Amount of value from 0 till 255

Ex : if you send "255.0.0" the led color will turn into red color, because its mixing 255 Red color, 0 Green color and 0 Blue color. You can change the amount as you wish, its have 16 millions color possibilities.

Change to Cheer Lights (mode 3) :

Send "3" message to #mode channel and the led color automatically follow cheer lights project.

Change led to real world color (mode 4) :

Send "4" message to #mode channel
Send message to #realworld channel using this keyword :
- 1 : Candle
- 2 : 40w Tungsten
- 3 : 100w Tungsten
- 4 : Halogen
- 5 : Carbon arc
- 6 : High noon sun
- 7 : Direct sunlight
- 8 : Overcast sky
- 9 : Clear blue sky
- 10 : Warm fluorescent
- 11 : Standard fluorescent
- 12 : Cool white fluorescent
- 13 : Full spectrum fluorescent
- 14 : Grow light fluorescent
- 15 : Black light fluorescent
- 16 : Mercury vapor
- 17 : Sodium vapor
- 18 : Metal halide
- 19 : High Pressure Sodium

Ex : if you send "15" the led color will turn into Black light fluorescent.

Important : Make sure before you change anything, you have already changed the device mode and for detail please watch the video.

Step 7: Conclusion

I takes about one month to make this thing, and I only do it at night after work. If you follow the steps above properly, maybe it only takes two days and if you make just for the music visualizer may only take 2 hours.

If this device can be controlled by the blynk or cayenne app may be easier and more awesome, but we did not learn anything from that. This tutorial might make you a little dizzy, but if you successfully complete it then you will know and be able to use node-red, make you IoT smarter and you can integrate your IoT with a wide range of popular applications by simply using api or http request.

Would you please take a moment to Donate or Vote?

We accept donations of any amount, it will help my next project. If you can not give me a donation of money then please take a little time to vote in this tutorial, I will be very grateful and motivated me to make the next tutorial.