Smartphone Controlled Neopixels (LED Strip) With Blynk App Over WiFi

I created this project after I was inspired by smartphone controlled neopixels in a friends house but his were shop-bought. I thought "how hard can it be to make my own, it would be much cheaper too!"

This is how.

Note:

I'm assuming you're familiar with the arduino ide environment, if not then there are many tutorials out there.

UPDATE:

04/04/2019 - Added zeRGBa use in app.

Step 1: Gather Parts

1. NodeMCU (or another type of esp8266, but MCU will work best)

2. Jumper wires (3x male->female, 2x female->female)

3. Neopixels

4. Smartphone

Step 2: Wiring

Connect GND of Neopixels to MCU GND.

Neopixel DATA --> MCU pin D3.

Neopixel +5V --> external 5V power supply (you must connect neopixels to an external supply or they will draw to much current from the controller and fry it, plus the MCU doesn't even have a 5v pin!).

MCU GND --> power supply GND.

Power supply+ --> MCU Vin pin.

Step 3: Download Libraries

First we will need the adafruit neopixel library to control the LEDs. It can be found in the libraries manager, just search for 'adafruit neopixel' and select the one shown and install it.

Then to download the board definitions, open prefrences and paste http://arduino.esp8266.com/stable/package_esp8266com_index.json into the 'additional board URLs' box. Then open boards manager and search for 'esp8266' it should be the first one, click on it and install it.

Step 4: Code

Create a new sketch and name it 'neopixels on esp8266 with blynk' (or something that you're going to remember). Paste in the code.

Change 'yourAuthCode' to the auth code for your project. (found in the 'nut' icon in blynk app)

Change your wifi name and password to those of your network.

Set the number of neopixels to the length of your strip.

Plug your MCU into your computer, select MCU from the board menu in the ide, select the COM port and baud rate(115200) but ignore all the rest, it should be pre-configured. Then upload!

Neopixels_on_esp8266_with_Blynk.ino
Download

Step 5: Blynk App

Install blynk app from app store or play store.

Once it has installed, open it and create an account.

Create a new project then drag in 2 styled buttons, 1 menu, 1 horizontal slider and 3 vertical sliders from the widget box.

Tap on the menu icon, then change the title to "Colour", tap on the box that says 'PIN' change this to virtual pin V0.

Create 9 menu items:

red, green, blue, yellow, purple, turquoise, white, off and custom. (In that order!!).

Go back then tap on one of the buttons, set it's PIN to virtual pin V2, and the 'off' label and 'on' label both to "rainbow".

Go back and click on the other button, set it's PIN to virtual pin V3, and the 'on' and 'off' labels both to "update".

Go back then click on the horizontal slider, title it "brightness", and set it's PIN to virtual pin V1, turn on 'show value' if you want and turn OFF 'send on release', the 'write interval' should be 100ms.

Go back then click on one of the vertical sliders, title it "Red", then set it's PIN to virtual pin V4, 'show value' and 'send on release' both to ON.

Do the same for the next 2 vertical sliders, but label them "Blue" and "Green", with pins virtual V5 and V6 respectively.

If you do not want to use sliders, you can use the zeRGBa tile instead. Tap on the icon, then choose pins; V4, V5, V6 for Red, Green, Blue respectively. Make sure the values are from 0 to 255.

Hold and drag a widget to move them around.

Click the play symbol in the top right-hand corner to use your app.

USING YOUR APP:

Make sure you connected to the same WiFi network as the MCU.

Selecting a colour from the drop down menu will set the strip that colour, use the 'brightness' slider to change the brightness then press update. Pressing the 'rainbow' button will do a rainbow pattern. If you select 'custom' then drag the 'Red', 'Green', and 'Blue' sliders to change the amounts, press update to change the colour.