(More Images to Coming Soon)
Background Information
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.