This website details Martin's progress in building his Smart Mirror over the course of three weeks.
The smart mirror is a mirror that has the ability to display useful information, such as time, date, weather, news, and much more. With the help of a two-sided mirror, a monitor, and the power of coding, I was able to build a smart mirror that displays all the information listed above in just under three weeks.
|Engineer||School||Area of Interest||Grade|
|Martin X||Saratoga High School||Software Engineer||Incoming Junior|
My final milestone was finishing the final touches for the features I had implemented and to attach the monitor to the two-sided mirror. After finishing the code for all the features I wanted, I started using flexbox, a CSS Flexible Box Layout tool to help me design the layout of the smart mirror. I also downloaded some free fonts on the internet and customized my display that way. After I finished with all of that, I hot glued the monitor to the back of the mirror.
Here are some of my code for FlexBox to design the spaces between each of the four text sections. The display: “flex” line initalizes FlexBox and tells the system taht we are using FlexBox. After initalizing FlexBox, using FlexBox’s justifyContent: “space-between” just puts the two section of text on either side of the screen. I used this with both the weather and time and todo list and news so it’ll display all four sections on the top and bottom of each side. The height just moves the news and todo list to the bottom of the screen, to add on to the four corner display.
This is the code that updates the time every second, which displays like this:
This is my code that gets the weather data from the API and returns it onto the smart mirror. Here is how it looks currently:
Here is my code that loops through the most recent 5 items on my To-Do List and prints it onto the smart mirror:
Finally, I added a daily news section that displays the most popular headlines of the day from the New York Times using their API:
My first milestone was setting up the Raspberry Pi and all the necessary software on my computer. First, I followed a guide to set up a Raspberry Pi on the internet and plugged everything into the right place. In order to set up the Raspberry Pi, I had to plug the Micro SD card into my computer and use the Raspberry Pi Imager software and write everything necessary into the SD card. Following this step, I could then plug the SD card into the Raspberry Pi and continue with the set up through the monitor that’s connected to the Raspberry Pi. I had to install the Secure Shell Protocol (SSH) on both my computer and the Raspberry Pi then download a Virtual Network Computing (VNC) software in order to set up my Raspberry Pi with the Smart Mirror software.
Below is my inital design and drawing of the Smart Mirror. Although I’m not sure if I can implement all of these features within the three week period at BlueStamp Engineering, I will be sure to build on my progress and improve my mirror in the future.