This project was a full size infinity guantlet that I designed in Fusion 360 and 3d printed on my prusa i3 (clone).
Background information & Context
Back in 2018, Marvel’s Avengers Infinity war was about to be released, the culmination of the entire marvel cinematic universe up to that point (around 20 films across 10 years of films), as you can imagine I was very excited. Around this time I was 3d printing and ocassionally selling replica movie props and I decided that I wanted some prop from Infinity war. I stumbled across a youtube video by “the broken nerd” who had 3d printed a full size infinity gauntlet in november of 2017. Instantly I knew that I wanted to make my own so I set about procuring the same files that he had used. The files in question were from Do3d.com and I sent them an email asking for the price of the files. They responded quite quickly but the price for files was £60 way out of my price range. At the time I thought that £60 was an outlandish price to ask for just a set of files especcially when you consider all of the other expenses that would go into fabricating the gauntlet, so I decided to design it myself. In hindsight after experiencing how challenging creating such a 3d model is, I think £60 is a pretty fair price and I would recommend that you look at do3d if you are looking for any movie prop or cosplay models for 3d printing.
Reference Images
Since I started this project before Avengers Infinty War had been released, when I was modelling the inifinity gauntlet I had very little in the way of reference images.
For reference I used:
The 2 and a half minute trailer for avengers infinity war that had been released at the time
Photos of the inifinity gauntlet prop that was displayed at d23 2017
Images of the marvel legends infinity gauntlet toy by hasbros
Images of the hot toys infinity gauntlet replica
An Avengers Infinity war poster that showed the infinity stones in surprising detail.
Of these reference images I think the images of the hot toys replica was the most useful as it looked almost exactly the same as the prop shown at D23 but it had pictures from many more angles than the D23 prop.
Movie prop shown at s23
Hasbro toy
Hot Toys Replica
CAD Design
The model was designed using fusion 360 since that was the program I was most familiar with at the time. If I were to do this again I would not use fusion 360 as it is not the best when it comes to modelling organic shapes. Instead I would use a program such a blender or cinema4d.
The total time to create the model was over 60 hours, I know this because I watched every marvel movie that had been released at the time whilst I was designing the model and I still spent around another 10 hours on it after that.
Desiging this model definitely pushed my CAD skills to the limit but by the end of it I could tell that my CAD skills had greatly improved. This was the largest 3d printing project I have ever attempted and so optimising the design for 3d printing was crucial. I think In this regards I did quite well however were I to do it again I would be more careful about where I split the model into seperate parts. This is because I found that it was difficult to fill and sand a seam line when it was running through an area with an embossed pattern.
3D printing
The entire gauntlet was printed in white PLA plastic mostly at 15% infill. I honestly have no Idea how long it took to 3D print the model especially when you include failed prints and the fact that I don’t like to leave my printer running overnight (which severley limits the maximum print time for a part). But from what I can remember I was printing for over a month.
Post Processing
After printing I glued the parts togther using super glue, another thing that would change in the design is to add registration points so that the parts will line up when I am assembling them.
I then filled the seam lines and sanded the filler until it was flush. At first I was using a cheap wood filler but the filler itself was really porous when it dried so when I sanded it always had a very noticiable rough surface. I switched to using Bondo, a two part car body filler which worked really well, the only downsides were the fumes.
As mentioned before, if I were to redo this project I would make sure that the seams did not go through any part consisting of intricate detail as it is very difficult to fill and sand these areas, especially when you need to retain as much detail as possible.
After gluing and filling I applied multiple coats of a filler primer and sanded it back. I repeated this until the layer lines were gone and the part was smooth to the touch. This part took an extremeley long time, once again I don’t have an exact time frame for how long but I watched the majority of “Friends” while I was doing it. (Yes, the friends TV show with 10 23-episode seasons. )
Filler primer
Primer for Painting
Gold Paint
Final assembly
Finally, once every thing was glued together I added the “infinity stones” which are essentially hollow domes (obviously shaped to match how the infinity stones look in the movie). These were prinited with very thin walls, and 0% infill in white PLA plastic this was so that I could put an LED behind each of them and the light would shine through.
With the addition of the infinity stones the infinity gauntlet was done however I neede a way to display it. To do this I made a stand using a a threaded rod a 3d printed base with a captive nut (this had to be printed with 100% infil to be sturdy). To attach the gauntlet to the threaded rod I made a plate that was shaped to perfectly fit on the inside of the infinity guantlet and I screwed the threaded rod into that. Once of the unexpected benefits of using fusion 360 was that it showed me where the centre of mass of the model was which allowed me to position the stand so that the entire assembly is very stable.
The objective of this project was just to challenge myself to see if I could design and fabricate my own pair of bluetooth headphones. I originally got the idea when the plastic frame of my favourite pair of headphones broke. The only way that I could see fixing it was to 3d printed a replacement part of the frame however the frame was assempled with such tight tolerances I didn’t think that my 3d printer could manage. I decided that the only way to fix it would be to design and 3d print a replacement to the entire frame, so I decided just to design and make a completely new pair of headphones and better yet make them bluetooth.
The Mechanical Design
The headphones were designed using fusion 360 as that was the program that I was most comfortable with. I started this project in september of 2017 and at that point I didn’t have much expereince creating functional mechanical assemblies, most of my projects had been small 3d printed static objects like modifications to my printer or replacing broken parts of a chair or desk.
I went to my local electronics store and tried on different headphones do find what design aspects and features I wanted to include in my design.
What I settled on was that the ear cups of the Beats Studios were increadibly comfortable however the beats themselves felt overly bulky. The Bose Quietcomfort 35s had less comfortable earcups but had a much more sleak and stylish design. In terms of sound the Beats Studios were too bass heavy whilst the Bose Quietcomfort 35s were a lot more balanced but still had decent bass.
As such I decided to base my design of the headphones around the Bose Quietcomfort 35s but have the earcushions of the beats Studio’s fit on them. Additionally, I wanted them to sound like the Bose Quietcomfort 35s
The headband of the heaphones would ideally be made using metal however I wasn’t sure how I would go about fabricating a metal band of the correct dimensions. Instead the headband is also 3d printed however since the all of the parts of the heaphones are printed in ABS the headband is relativley flexible. For comfort the headband is lined with a memory foam cushion which is wrapped in a piece of faux leather.
The cushion was purchased from ebay and is meant to be an upholstery cushion, whilst the leather was also purchased from ebay and was a 20cmx20cm sample for an upholstery material.
The biggest design challenge was the sivel mechanism, specifically making it strong enough that it wouldn’t fail if you were to take of the headphones too agressively. Due to the fact that wires must pass through the entireity of the headphones the sivel mechanism had very thin walls and kept breaking. To overcome this I used chamfers instead of hard angles to reduce the stress and I increased the wall thickness as much as posssible by widen the cavity it is inserted into this resulted in the sivel mechanism being more loose but it is much stronger.
The Electronics
This project is based around the krc-86b stereo Bluetooth receiver, at the time this was the only bluetooth audio receiever that I could find that both had pins for button control and was designed for higher powered speakers.
Unfortunately this bluetooth module was a very big let down, specifically the fact that it introduced a hissing background noise (sort of like static from an old tv). I tried addind filters to get rid of the noise but if i’m honest I was a lot less educated when it came to analogue electronics back then so I could not get rid of the noise. The noise is unnoticeable when music is playing but unbearable when music is the off.
The worst part of all was that the audio quality over bluetooth was terrible. Initially I thought that It was the speakers drivers I had bought that were terrible however when I plugged the headphones in tirectly via a 3.5mm jack and the bluetooth module was acting as a pass through the audio quality increased tremdously.
The speakers I used were purchased from ebay and were listed a replacement drivers for Bose Quietcomfort 35s. They were obviously fakes and even when plugged in without the bluetooth module they didn’t sound as good as real Bose Quietcomfort 35s but they didn’t sound too bad.
The krc-86b had pins for music control, you would simply pull the pin high to execute the desired command. I accessed these controls by adding three very basic mechanical momentary switches that would pull the control pins high when they were pressed.
The headphones are powered using a lithium polymer battery connected to a TP4056 lithium battery charging circuit and charged via a micro usb port.
Finally the last challenge was turning the headphones off and on. I decided that I didn’t want to have a mechanical sliding switch or a phyically latching switch but I wanted the power button to be a momentary switch similart to that on a phone or laptop. This was a very strange feature to implement especially considering how much trouble it caused me but I thought at it would make the headphones feel more “premium”. To achieve this I found a latching circuit (using bjt transistors) online and assembled it however many of the circuits that I found online simply didn’t work despite being wired up correctly maybe it was to do with the transistor I was using. When I finally found a circuit that worked I assembled it using some prototype board and added it to the headphones.
latching circuit on breadboard
Originally I added an amplifier to raise the volume then a couple potential dividers to lower the volume as the amplifier made it too loud however I found that the amplifier greatly amplified the background noise so I removed it.
The way the headphones are spread out is one earcup holds all the audio electronics such as the KRC-86b, the control buttons, and the 3.5mm pass through jack. Whilst the other earcup holds all the power electronics such as the charging port LED inducator ,battery and charging circuit, the latching circuit and the power button. This is to distribute the weight more evenly and reduce the number of wires that have to pass through the headband to just two 1mm thick wires and a piece of wire that I salvaged from a cheap pair of earphones. Despite having an overall thickness of about 1mm also, the wire contrains two sepeate cores that are isolated from each other by some form of coating. This wire is what’s used to connect the speaker drivers to the krc-86b.
Final Thoughts
Were I to do this project again I would test the bluetooth receiver extensively before basing the heaphones around it. Looking online, it seems as though there is a much larger selection of bluetooth audio recievers now some of which even have their own power mangement & latching circuit and can communicate over bluetooth low energy (BLE) to give the connected phone battery information.
Also I would experiment with using snap fit connectors instead of screws as this would look better.
Finally I may run some stress analysis on the headphones do see where parts may fail and how certain design changes would affect this. This would save me from printing and testing every design change.
Note: This project is ongoing and I will continue to add posts about its progress
Background
So to give a little context surrounding the origins of this project, back in 2014/15 I was learning how use Arduinos. I had just begun experimenting with Attiny85 microcontroller and I had the idea to use the attiny85 in addition to a HC-05 Bluetooth module to create my own smart watch. To be perfectly honest I think I got the idea when I saw a round LCD for sale on eBay. At this point in time smart watches were still pretty new with only the Samsung galaxy gear and Motorola 360 being the only smart watches available from big brand companies (at least as far as I knew at that time). Because of this finding a round smart LCD on eBay was pretty shocking to say the least. My plan was to use two attiny85’s one a CPU and once as a GPU then connect to the phone using the HC-05. sufficed to say that my plan had many flaws and the project got put on hold. Fast forward to 2020 I discovered the esp32, a dual core microcontroller running at 240 MHz with built in WIFI and Bluetooth 4.0. In addition to discovering the esp32 I found that there was an abundance of round LCD’s now available online. This is likely due to the fact that smart watches are actually pretty cheap now and you could probably pick a decent one up for less than £50. So there is no real economic advantage to this project, honestly I just wanted to see if I could make my own smart watch that functioned as well as commercially available models.
Project Goals
When I first decided to take on this project, I thought it would be best to decide upon a set of features that I wanted the watch to have. Throughout this project some of those features were changed or ignored but having a list of outcomes helped with organising such a mammoth project. initially the features I wanted to incorporate were:
Telling the time and date (obviously)
A round LCD (Not really a feature but this was something I felt was important but also resulted in some issues)
Displaying notifications (once again pretty basic)
Setting Alarms
Controlling music from the watch
Being able to see the current song in spotify from the watch (this is a featured that had to be dropped)
Initial Research
Upon discovering the esp32 I found some example code by “S-March” that allowed the esp32 to connect to an iOS device and subscribe to ANCS (Apple Notification Center Service):
This allowed the esp32 to receive notifications from the devices. later discovered that there is an ANCS example from Espressif the manufacturer of the esp32 however this required using the ESP-IDF and I was much more comfortable using the Arduino IDE. The code by S-March only allowed for the esp32 to subscribe to the notification source characteristic but not the data source characteristic. Essentially, this meant that the Esp32 would know then the device received a notification and of what type said notification was but it wouldn’t get the details of the notification. To rectify this I altered S-March’s code, referring to the ANCS example given by Espressif.
Version 0.1
Once I was able to receive notifications and the details of said notifications I moved on to implementing another feature, controlling music from the watch. This was accomplished by having the watch act as a HID device (although not a HID keyboard) and sending media commands to the phone. This was slightly tricky as most examples I found online made the esp32 act as a Bluetooth keyboard that once connected to my phone (I was using an iPhone 11 running iOS 13 at the time) would stop the onscreen keyboard from appearing (This is just one of those things in iOS that would be a cool feature in any other situation). I eventually found some code by “sabas1080” that I was able to send media commands without registering as a Bluetooth keyboard. I combined this code with the ANCS code and this was the foundation of the smart watch back end.
The next step was to display the data, initially I used a 16×2 LCD screen. For some reason I spent a lot of time working with this display making sure it looked right, even going so far as to create custom auto scrolling.
Version 0.4
(FYI there is no reasoning behind the version numbers before version 1)
I purchased a screen from AliExpress that I intended to use for the final version, it was a round 1.3 inch LCD screen that communicated used SPI and had an ST7789V driver board which is pretty widely supported (turns out this display would go on to cause a lot of sleepless nights and misery but more on that later). This display was shipping from china to the UK amidst the coronavirus pandemic so as you can imagine I knew I would be waiting quite a while for it. Since I am a very impatient person and had literally nothing to do other than work on projects during quarantine I decided to order what I thought was almost the same display just rectangular from Adafruit (it would turn out that despite using the same driver the displays could not work interchangeably).
Using the Adafruit display as a substitute for the final display I began work on displaying the notifications. For this I utilised the TFT_ESPI library and despite having to move away from that library I do recommend the library if you have a project involving an LCD display due to its wide use of sprites. I spent a lot of time working on displaying the notifications and eventually the time using the TFT_ESPI library however most of that work became useless so I won’t cover it here, however if people are curious contact me and I will make another post about it.
In addition to displaying the notifications, I also incorporated the displaying time in this version. This was accomplished by using a Ds3231 real time clock. Utilising the real time clock (rtc) was pretty easy as it communicates over i2c so there are only two wires connecting it to the esp32. The rtc will accurately keep track of the time however it must be set to the correct time after any power loss. I accomplished this by subscribing to the current time service of my phone and every time the esp32 connects to my phone it will set the time of the watch to the time of my phone. This also means that the watch automatically will respond to time zone changes. Displaying the time (in analogue form) was achieved relatively easily using sprites and the TFT_ESPI library so I when I eventually had to abandon all of that work I was quite upset (so much so that I worked on a different project for an entire month). However, in the end it was for the best as in later versions I created a watch face display that looked much nicer.
Display Drama
As I have alluded to, most of the problems with this project came from the display that I purchased from AliExpress. Despite both having an ST7789 driver board and communicating via SPI, the round display from AliExpress could not be used interchangeably with the rectangular display from Adafruit. This was due to the round display using 3 wire, 9 bit spi instead of the more common 4 wire, 8 bit spi. This meant that the display was not supported by the TFT_ESPI library. finding a library that supported 9 bit spi was very difficult especially one that was fast enough that it could be used for the watch whilst not making the watch seem sluggish or “laggy”. To achieve this hardware SPI had to be utilised however the only library that I found that supported 9-bit SPI only did so if software spi was used. Luckily during the time I was looking for the library moononournation released the Arduino_GFX library which supported 9-bit spi using hardware SPI and was also comparably fast to the the TFT_ESPI library.
Verison 0.7
After finding the Arduino_GFX library recreated the UI I had previously made using the TFT_ESPI. Unfortunately the Arduino_GFX library did not have an equivalent to the sprites of the TFT_eSPI library, as such I was unable to recreate the autoscrolling feature of when displaying a message larger than the screen however there are physical buttons that you can use to scroll. Although the Arduino_GFX library does not have sprites it is much better at drawing bitmaps. This allowed me to create much better looking user interfaces and watch faces that do not have to be created by code but instead can be imported as images. I also created a couple different screens such as a screen to display a list of all the notifications received, a screen that allowed you to change your watch face and a screen that lets you set an alarm. Using bitmaps for watch faces allows for easy implementation of new analogue watch faces. For the digital watch face I incorporated counters that let you easily see how many notifications you have from specific applications. Although the use of bitmaps makes it easier, creating new custom watch faces still requires a bit of effort and a tedious work flow therefore one of the things to improve in the future would be to make this process much easier.
Dropped features
As mentioned above, I initially wanted to be able to see what song is currently being played by a connected iOS device. Unfortunately, due to the way in which IOS works it is impossible for this to work in such a general way, instead I decided to focus on what song was being played by Spotify. Although I did figure out a way that this could be achieved it would require either having the phone act as a Wi-Fi hotspot at all times or a custom IOS app would be needed. I do have some experience with iOS programming however to publish an app to the app store or even just permanently load an app you have developed on to your own phone you must be part of the apple developer program which costs ~£100 a year. Without the apple developer program you would need to reinstall the app every week which would get very annoying very quickly but more importantly for this app to work in the background push notifications would’ve been needed however only developers apart of the apple developer program have access push notifications. Therefore one feature would essentially cost £100 a year which is a little bit to expensive for me as a university student.
Next Steps
The next steps of this project are to:
Implement an accelerometer to allow the watch to act as a pedometer
Implement wireless charging this will be done using a BQ51050BRHLR
Design a custom PCB for the watch
Have the pcb manufactured
Design and print a housing for the watch in PETG or a carbon fibre filament (In the future I may make the housing out of wax like material using SLA 3d printing and try my hand at lost wax casting)
Unlike most of my other projects there was no real reason for this project, it doesn’t really solve a problem I just thought making a smart mirror would be cool. I moved into a new house over the summer and my bedroom used to be a study/library so there is a large bookcase along one wall. I also needed a mirror in the room and I decided that a large rectangular mirror that would fit in the book case would look nice. I noticed that my monitor was around the right size for the mirror and then I remembered all the smart mirrors that I had seen people make. Around this time I was learning to use react native to make mobile apps and it occurred to me that I could make a companion app for the smart mirror. I could add things to a to-do list, or events to a calendar and the mirror would tell me what I had to do for the day.
Other Smart Mirrors
Smart Mirrors are not a new idea, many people have documented building a smart mirror in the past and there is a lot of free opensource software to help build a smart mirror. One of the most popular is magicMirrror2, this is a great piece of software that even allows you to install 3rd party modules. One downside of Magic Mirror is that it is not designed to work with the raspberry pi Zero therefore were I to use it I would have to spend £30 on a raspberry pi 4 (I could get a raspberry pi 3 but for some reason they around the same price as the 4). I would prefer not to spend £30 on a raspberry pi that will literally only be running one program and displaying text as it feels like a waste of both £30 and a raspberry pi. I do have some projects planned that would a raspberry pi to its fullest. I decided that I wanted to have my smart mirror use a raspberry pi zero and so magic mirror was out of the question. Also I thought that making the software for the smart mirror myself would be more fun and it would give me more freedom when it came to making a companion app.
The App
The app was made using react-native and consists of two main parts, the to-do list and the calendar. Both the to-do list and calendar upload data to a Firebase cloud Firestore database. Similarly to the Smart LED Panels that I made, my reasoning for using firebase is simply because I wanted to gain experience in using it.
For the calendar portion of the app I used the React Native Calendars module by wix. This is a pretty versatile module that provides a very nice looking calendar that also has an agenda view and allows you to add events. You simply have to create an object containing all the events and they will be displayed automatically. Adding Events was pretty simple and only consisted of a couple text inputs and a time and date picker. When I added the new event to the events array I also send the data to the firebase database.
The to-do list portion of the app was much simpler and was consisted of a flatlist and text input. When a new item was added to the flatlist array it was also sent to firebase.
Raspberry Pi software
The software running on the raspberry pi was developed using python. It simply connected to the firebase database and got the data regarding the calendar events and to-do list items and displayed them onto the screen. The gui was developed using the Tkinter library. Tkinter was perfect for this application as it is simple to use and a smart mirror displays most of its information in text form.
The smart mirror also displays the time and date, this was accomplished using built in python functions.
As a final feature the smart mirror also displays the weather. This is done by retrieving the weather for the set area from OpenWeatherMap. OpenWeatherMap returns quite a lot of data regarding the weather but I only used the average day temperature with highs and lows and the icon id. I decided to use the daily temperature instead of the current temperature as I that in a standard use you would look at the smart mirror in the morning and want to know what the weather would be like during the day. (Also I think it may be important to note that I decided to do this before iOS 14 and widgets were announced so looking at the weather on my phone was ever so slightly more tedious).
In the Companion app I added a settings panel that allowed for the location the smart mirror sends to the OpenWeatherMap to be changed as well as allowing for the choice of which information is displayed.
Physical construction
The physical construction of the Smart Mirror is very similar to that of the smart LED Panels I made in a previous projects (Actually I worked on both of these projects simultaneously).The housing of the mirror was made of 6mm mdf wood and contains19 inch monitor. A two way acrylic mirror is then placed in front of the monitor so that some when looking at the mirror you mostly see your reflection in addition to any bright parts of the monito. Since the background colour of the smart mirror program is black the only bright parts on the screen is the information.
The smart mirror is powered by 12v via a 21mm female dc jack. connected to this jack is the monitor and a voltage regulator which converts the 12v input into 5v for the raspberry pi zero. The raspberry pi zero is connected to the monitor using a microhdmi to hdmi adapter which is connected to a hdmi to vga adapter which is finally connected to the monitor with a vga cable. I am using a vga monitor as it is just a spare one I had lying around it did cause some issues when using the raspberry pi as the resolution is quite uncommon these days at 1440x900p.
Final Thoughts and Opinions
Overall this project came together very well and the GUI even looked almost identical to what I had sketched when I first thought of this project.
Evaluation of what went well
Although this project met all the criteria that I set I think there is still a lot that could be changed or improved. First is the app, as with the Smart LED panels project my inital plan was to host and access the mobile app through expo however after discovering how easy and useful progessive web apps are I think it would be better to turn the app into a pwa. Unfortunately, the react-native calendar module does not display very well as a web app essentially making half of the app useless. Additionally I think the the GUI of my smart Mirror looks a lot more basic and unpleasant than that of the more popular opensource software available such as magic mirror 2.
What I will do moving forward
Creating my own smart mirror software was a very fun and educational endeavour, however, I think moving forward I may try to use a pre existing solution such as magic mirror 2. I mentioned before that magic mirror 2 is not completely supported for the raspberry pi zero however it is possible to install it on the pi zero. I think I will experiment with magic mirror and decide whether I can live with the limitations present when running it on a pi zero.
I previously mentioned that magic mirror 2 is an open source modular piece of software meaning that I is possible for me to create my own modules. There already exists a module that allows you to sync your Microsoft, Google, or Apple calendar with the mirror, a feature that I attempt to implement but decided to forsake due to time constraints (I wanted to finish most of my projects before I started university again). I could also still have a companion app but instead make it a pwa and develop my own module to allow the mirror to get the to-do list items from firebase display them.
I think there is still more to do with this project and I will return to it at some point in the future but as of now I am satisfied with its current state even if accessing the companion app is slightly tedious.
During summer of 2020 I moved into a new house with some other students at my university. Like a lot of student houses many rooms that initially served a different purpose had been converted into bedrooms. In my case my room used to be a study or library and as such contains a large book case along one one wall. I felt that I needed to fill the book case with something interesting instead of just mundane belonging as this would’ve made the room feel cluttered. Additionally, due to the positioning of the room in the house, very little light enters. I decided to kill two birds with one stone by adding led panels that I could control with an app.
Project Outcomes
The goal of the project was to create Led panels that I could control using an app on my phone. At the time I was learning how to use react native to create apps and I thought that this project would be a great way to put these new skills to use.
The way in which these LED panels work is slightly unorthodox, mainly the app which actually ended up becoming a progressive web app sends data to a firebase database and the LED panels which are controlled using esp8266 modules connect to this firebase database and change colour based on the values in the database. Once again this is quite a unorthodox method of implementing WI-FI control into a project but it does allow for the easy addition of more RGB LED devices. The reason for having the LED panels work this way was simply because I wanted to gain experience creating an app that worked with firebase.
Single LED panel controlled with smart phone app
Three of five LED Panels controlled with browser web app
The App
Developing for IOS
My main device is an Iphone 11, this presents a problem as unlike with android developing apps for your own personal use is much more difficult with iOS. When it comes to android you can easily side load apps by installing the apk file however there is no equivalent for this when it comes to iOS. The only way to permanently install an app you have developed yourself onto your own iOS device is to sign up to the apple developer program for ~£100 a year. I decided to get round this restricted was to develop my app using react native and expo and publish the app to expo. Essentially this would allow me to access the app from within the Expo app.
Design of the app
When designing the app I took a lot of inspiration from the Smart Life app, as I liked that it was quite minimal whilst still giving a wide range of functionality. I decided that the app would be based around a colour wheel with a few extra buttons for turning the LED panels off and on or making the LED panels pure white. This last feature was as in addition to RGB led strips, the LED panels also contain pure white LED that supposedly have colour temperature of 6000K. There is also drop down menu that allows you to choose the which device you are controlling or if you want to control all of the simultaneously.
The colour picker that I had chosen for the app had the option for sliders. These sliders let you control how bright the colours were. Unfortunately I had to disable these sliders as they did not display well when I turned the app into a progressive web app.
Firebase
I built this app after making an app for a smart mirror and so I was quite familiar with connecting to a firebase database. For the smart mirror I used the cloud firestore database however for this project I needed to use the Realtime database as it was much easier to connect to the Realtime database from the esp8266.
Within the Realtime data base every device has a unique device ID, nested within each device id are the RGB values for the current colour.
The functionality of the app is quite simple, any time the colour of the colour wheel is changed these new RGB values are sent to the Realtime database. When the button to turn off the panel is pressed then all the colour values are set to zero and when the button to turn the panels white is pressed then all colour values are set to 255.
Native app to web app
Initially my plan was to create a native app that I would publish through expo however as time went on I began to think that it may become tiresome accessing the app through the expo app. Additionally, I decided that I may want to control the lights when I am at my computer and my phone isn’t next to me. For this reason I decided to create a web app instead that I could access though a browser on either my desktop or mobile phone. Also progressive web apps can be added to the home screen and will act identically to native apps.
This proved to be much easier than I thought as react-native allows for apps to be published to not only iOS and android but also for the web. When I initially tested how the app would look displayed as a website I found it did not work perfectly, as for some unknown reason the built in modal function of react native did not work. To fix this, I had to use the modal function of react-native paper which worked fine. After reworking the code to work with the react-native paper modal function and disabling the brightness sliders of the colour picker the app displayed perfectly in a browser.
Since the app would be hosted online, accessible to everybody I added a Login page so that I only I would be able to control the Lights, this was done using firebase authentication and react navigation.
Finally I hosted the website using firebase hosting which is free to use and was really easy to implement.
Web app in Browser
Physical construction
The housing
The Led panels were made using 6mm MDF boards. This was the largest wood working project that I had taken on and I made several mistakes during this project. The wood was purchased from ebay as pack of 10 600x300mm sheets as well as two 810x410mm sheets from B&Q. The Largest mistake that I made was deciding to by a jigsaw as opposed to a circular saw. At the time I though that a jigsaw would be a better investment due to the fact it was more versatile and although that may be true buying a circular saw for this project would’ve save a lot of time and hard ache. Due to inexperience with a jigsaw, making straight cuts of the right size was a much harder ordeal than I had expected. Although I did not make any catastrophic mistakes I did have to spend a lot of time sanding and filling to correct mistakes I made while cutting. Although making the housings was a very problematic process I am happy that I went through it as I feel that my wood working skills did improve.
The “window”
In order for the light to be visible the LED panels obviously need a transparent section. I achieved by replacing one of the walls of the housing with a 2mm thick acrylic sheet purchased from B&Q. My plan was to cut this to size and then sand it so it would diffuse the light. Unfortunately, cutting this acrylic sheet was very difficult as using a jigsaw would cause it to crack and split. I even tried to use a glass cutter however this produced inconsistent results and took a very long time. In the end I found that sandwiching the acrylic sheet between two pieces of wood and then using a jigsaw produced very clean cuts. This did produce the problem of finding enough would of the right size that I could sacrifice but it made do by gluing together off cuts left over from making the housing. I did find out after I had cut the acrylic sheet to roughly the size needed that a rotary tool such as a Dremel with a cut of disk was able to cut the acrylic without it cracking.
My initial plan was to have custom acrylic sheets cut to size and shipped to me however the acrylic sheet from B&Q was the cheaper option. Had I been at university and had access to the laser cutters I could of cut acrylic sheets to the exact size needed myself and this likely would’ve been cheaper still. Unfortunately this project was during the coronavirus pandemic and so university facilities were closed. Although cutting the acrylic sheet myself with a jigsaw was difficult and time consuming, it was probably the best option. Due to the inaccuracies created when cutting the wood for the housings the dimensions of each of the housings were all slightly wrong, therefore for each housing the acrylic sheet had to have different dimensions. Since I was cutting the acrylic sheet myself it was easy to tailor the panels for each housing whereas had I outsourced the acrylic, the panels likely would have been a worse fit. Once again had I had access to a laser cutter I could’ve laser cut the housing and the acrylic panels, ensuring a perfect fit and identical dimensions of all the housings.
The electronics
Panel Electronics
The electronics for each LED panel was pretty simple. Each LED panel consists of an esp8266, connected to 4 AO3400 A09T N-Chanel MOSFETs each rated at 5.7A and 30V much more that what was need. the mosfets are connected to the negative pin of each colour of LED whilst the positive pins are all connected to the 12v input. A 5v regulator is used to convert the 12v input into 5v for the esp8266. All of the Electronics was kept in a 3d printed enclosure screwed to the back of each panel.
I have some experience soldering SOT-23 mosfets in the past for a custom RGB LED fan controller I made for my PC, however for some reason I found it much more difficult during this project. After many hours trying and many more destroyed MOSFETs I decided to purchase SOT-23 to DIP adapters, this made assembling all the circuits much easier and much faster.
I also created a test circuit, that allowed me to easily switch MOSFETS and test that they were working, this aided in troubleshooting all of the circuits. The test circuit consisted of a 12V input, A momentary switch, RGB LEDs and female headers to allow for the easy replacement of a MOSFET.
The Power supply
To power all of the LED panels once they were installed in the book case I first though of using 18650 lithium ion batteries so that I could avoid using wires. I decided against this as charging all of the batteries would be a hassle as they’d likely all die at the same time and I would need at least 20 batteries, more if I wanted a battery life of more than an hour. Instead I decided to use a 12v 15a power supply unit that I had spare. This is the psu that came with my 3d printer but I replaced it with a better one as I made upgrades to the printer.
I built an enclosure for the psu out of spare wood that I had left over making the housings, admittedly wood is not the safest material to make an electronics enclosure out of but it was either wood or 3d printing the entire enclosure only to then put it in a wooden bookcase so I decided to take my chances with wood. I did include a switch with a 13a fuse to make it slightly more safe. The psu enclosure was made of mdf with its front and back panels being 3d printed. For the front panel I modelled holes for the power socket and switch module and the DC jacks that the led panels would plug into. There was no need for the back panel to be 3d printed but since it had the exact same dimensions of as the front panel, I decided why not?
The code
The code uses the WIFIManager library from tzapu and the Firebase-ESP8266 library from mobizt. The WiFIManager library is not necessary for the functionality of the LED panels but it means that the SSID and Password for the WIFI connection does not need to be hard coded into the code. Therefore you could move the LED panels to a new place or change the password of your router and reconnect the panels to the WIFI using your phone.
The code is pretty simple, once the esp8266 is connected to the internet it gets data from the firebase Realtime database. If the device id in the realtime database matched the panel’s own device id set in its code it parse out the RGB colour values from the data received from the database and produces the corresponding colour.
Evaluation and Next Steps
I feel that this project came together rather well, like I mentioned before I think my biggest issue was deciding to use a jigsaw rather than a circular saw otherwise everything worked out better than expected.
One issue that I have is that the PSU that I am using is struggling to output enough current to power the LEDs despite being rated for 15A. The power supply is causing the LED panels to flicker however this is when only 3 are connecting so should only be drawing ~7A. I know that the PSU had issues delivering adequate power when it was installed in my 3d printer however I had assumed that that was due to the printer require more than 15A however no I believe that the PSU maybe faulty. I will replace the PSU and in hopes that that will fix the flickering issue.
Next Steps
Moving forward I plan to create a hub, an esp8266 dedicated to sending colour values to database to create different lighting effects such as fading from one colour to another or each panel changing colour in sequence.
I do not anticipate this being a difficult addition however I believe that the difficulty will lie in adding this functionality to the app. More specifically how I would go about implementing an ascetically pleasing, intuitive method of controlling lighting effects.
