Introduction: Neopixel, ESP8266 and Custom 3d Printed Holder
This project was put together over a wet Sunday afternoon to combine three technologies into one project.
An ESP8266 wireless device
An Adafruit Neopixel ring
A 3d-printed frame for the project.
The design allows you to change the patterns and colours of the Neopixel from a web page.
An ESP8266 wireless device
An Adafruit Neopixel ring
A 3d-printed frame for the project.
The design allows you to change the patterns and colours of the Neopixel from a web page.
Step 1: The Circuit
The setup of the ESP8266 using the Arduino IDE is well documented, so I won’t
go into it here. I initially used an ESP8266 development board but quickly switched to the lower-cost ESP-01’ the one that exposes eight-pins. The wiring diagram is shown above.
To ensure there is a good fit of the ESP into the 3d holder, I desoldered the pins and hard-wired the EP8266 based on the wiring diagram shown.
During programming of the ESP, the GPIO0 pin needs to be temporarily grounded, so I resoldered one of the pins onto the front of the circuit board to make this easy to access.
In the final photograph you can see two pairs of wires, one pair is for external power and the second pair are temporary to hook up to the serial programmer.
go into it here. I initially used an ESP8266 development board but quickly switched to the lower-cost ESP-01’ the one that exposes eight-pins. The wiring diagram is shown above.
To ensure there is a good fit of the ESP into the 3d holder, I desoldered the pins and hard-wired the EP8266 based on the wiring diagram shown.
During programming of the ESP, the GPIO0 pin needs to be temporarily grounded, so I resoldered one of the pins onto the front of the circuit board to make this easy to access.
In the final photograph you can see two pairs of wires, one pair is for external power and the second pair are temporary to hook up to the serial programmer.
Step 2: The 3d Mount
I designed the 3d housing to mount the ESP8266 within the profile of the
Neopixel. The 3d model can be downloaded here: http://www.thingiverse.com/thing:1021530
The photograph shows the prototype circuits mounted in a redesigned Mount. This later design gives you more options to route the wires below across and around the ESP.
Neopixel. The 3d model can be downloaded here: http://www.thingiverse.com/thing:1021530
The photograph shows the prototype circuits mounted in a redesigned Mount. This later design gives you more options to route the wires below across and around the ESP.
Step 3: The Code
The standard Arduino sample code for Neopixels run through their sequence or pattern before returning to the main loop. Using an ESP8266 as the microcontroller means that the web server is not responsive during that interval.
I used animation code from a little-known article on Adafruit that ensured the web-server code was never blocked by the animation code itself.
The original article can be found here https://learn.adafruit.com/multi-tasking-the-arduino-part-3/put-it-all-together-dot-dot-dot and is referenced in the attached code.
You change the colour of the Neopixel using the URL assigned to the the ESP,
For example, http://[Your IP Address]/R sets the Neopixels to Red.
The complete options are:
/R=Red
/G=Green
/B=Blue
/W=White Scanner
/X=Rainbow
/Y= Rainbow Cycle
/Z=Chaser Rainbow
/set?R=255&G=255&B=100 [Set values to change to specific colours]
The code for my version can be modified to change or add a the behaviour
I used animation code from a little-known article on Adafruit that ensured the web-server code was never blocked by the animation code itself.
The original article can be found here https://learn.adafruit.com/multi-tasking-the-arduino-part-3/put-it-all-together-dot-dot-dot and is referenced in the attached code.
You change the colour of the Neopixel using the URL assigned to the the ESP,
For example, http://[Your IP Address]/R sets the Neopixels to Red.
The complete options are:
/R=Red
/G=Green
/B=Blue
/W=White Scanner
/X=Rainbow
/Y= Rainbow Cycle
/Z=Chaser Rainbow
/set?R=255&G=255&B=100 [Set values to change to specific colours]
The code for my version can be modified to change or add a the behaviour
Attachments
Step 4: Putting It All Together
The completed Project will light up the Neopixel initially with a static display until it connects successfully to the Wifi given in the code.
Once successfully connected, the Neopixel changes to an animated display. Of course you can easily modify the code to change this behaviour.
Have fun!
Once successfully connected, the Neopixel changes to an animated display. Of course you can easily modify the code to change this behaviour.
Have fun!