Introduction: Wifi Connected Smart Backsplash Using a RGB LED Strip
In this project, I will show you how I made a wifi-connected smart backsplash featuring a timer, beeper, night light and how it is controlled using a web interface, MQTT messages, and buttons.
Step 1: Watch the Video
The video shows the journey of upgrading my kitchen by embedding a RGB LED strip in my new backsplash. Feel free to add your questions in the comment section of the YouTube video if you need any futher assistance.
Step 2: Order the Components
-- LINKS -- (When available, I use affiliate links and may earn a commission)
- Wemos d1 mini (4M version) - https://amzn.to/3jLR1Qd
- Aluminum channel - https://amzn.to/3c5jWOI
- RGB LED strip - https://amzn.to/3sRNXaL
- ESP12 module - https://amzn.to/3t1qnZl
- FTDI adaptor - https://amzn.to/3iNKXHN
- Wemos d1 mini (4M version) - https://s.click.aliexpress.com/e/_dXcNTYU
- Aluminum channel - https://s.click.aliexpress.com/e/_AVQro9
- RGB LED strip - https://s.click.aliexpress.com/e/_AfzFSt
- ESP12 module - https://s.click.aliexpress.com/e/_A9IoQV
- Light sensor - https://s.click.aliexpress.com/e/_AE3tY9
- 0805 Resistor Kit - https://s.click.aliexpress.com/e/_AgrCzF
- 0805 Capacitor Kit - https://s.click.aliexpress.com/e/_9RqlFF
- 3-terminal - https://s.click.aliexpress.com/e/_9wrHcV
- DC Power Plug - https://s.click.aliexpress.com/e/_A4RW81
- FTDI adaptor - https://s.click.aliexpress.com/e/_A42MaV
- Wemos d1 mini (4M version) - https://amzn.to/3fx28Lq
- Aluminum channel - https://amzn.to/3od8Zgw
- RGB LED strip - https://amzn.to/2KIpfIu
- ESP12 module - https://amzn.to/39YyInG
- FTDI adaptor - https://amzn.to/3sZ8JVI
Step 3: Background
When it was time to add a backsplash, I wanted to take the opportunity to make it a little more interactive and integrated with my home automation.
The first thing you will notice is the LED strip. It acts as a timer and a visual indicator to show the status of some of my appliances.The middle portion of the LED strip is the timer. I used a blue LED to represent 10-minute intervals and a white LED to represent 1-minute intervals…. so this is 11 minutes, 12, 13, . and so on.
The corner LEDs are used as status indicators. I can customize them to use any color or flashing pattern for any given appliance. For example, a solid red LED indicates that the cooktop is on and a flashing LED means that the air circulation is on.
Step 4: Interface
I interact with the backsplash in 3 ways:
- Over MQTT messages: cmnd msg for control and stat msgs for updates. This is very useful because it allows easy intergration with home automation systems.
- The second way is by using a built in web interface: I can adjust the timer and read the status indicators here.
- The third way is using buttons on the controller to adjust the timer or to turn on the night light.
The controller also has a buzzer, so when the timer is up, you hear this …. * beep beep beep beep*
Step 5: The Controller
I designed a custom controller board using an ESP12 module, 3 buttons, a light sensor, a connection for the LED strip, a buzzer, a 3.3 voltage regulator and pin outs to program the ESP12 module.
New to ESP8266? Watch my Introduction to ESP8266 video.
I then moved on to design the PCB layout. I chose a long rectangular shape so it would easily fit under the cabinet. One thing I learned from previous boards I designed is to make sure the area around the antenna is not covered by copper or else the range suffers dramatically.
Step 6: Install the LED in the Tiles
Since this is a permanent setup, I wanted to be sure that the LED channel will not move and break the grout, so I drilled 4 holes for attachment. I tried to align the holes with the studs and used big anchors when that was not possible.
I used 4 long screws with a flat head to fix the LED strip to the wall. I then added the plastic cover to protect the channel. I continued applying tile adhesive and placing the tiles all the way to the top.
Later, I drilled to the side on of the cabinet, fished the wires and installed the LED strip in the aluminum channel.
Step 7: Software
For the software, I wrote a custom firmware using the Arduino IDE. The main parts to highlight are:
- the LED setup
- the web server
- the OTA update option
- the loop that handles the interactions
- and the custom effect for the kitchen timer
Flashing the code was so easy using the FTDI adaptor and pinout in the controller. I don't have to put it in programming mode or hold down any buttons … Just CLICK and DONE.
You can download the source code on GitLab:
Step 8: 3D Case
I also designed a case for the controller to make the setup neat.
Step 9: Power
I connected the LED strip to the controller using the block terminal and fixed the controller under the cabinets.
Then I got a really really long power extension and ran the power from the top of the cabinets, down a gap between two cabinets and straight to the controller.
Step 10: Done
And now, I made the kitchen a little bit more smart. Once I integrate it this with my home automation system, the real fun will begin……
If you found this useful, please consider subscribing to my YouTube channel and give me a LIKE - It helps a lot.
* Much of the information contained is based on personal knowledge and experience. It is the responsibility of the viewer to independently verify all information.
Participated in the