{"id":1266,"date":"2016-08-02T13:28:30","date_gmt":"2016-08-02T11:28:30","guid":{"rendered":"https:\/\/blog.mi.hdm-stuttgart.de\/?p=1266"},"modified":"2023-06-07T15:17:56","modified_gmt":"2023-06-07T13:17:56","slug":"project-how-to-build-an-intelligent-mirror","status":"publish","type":"post","link":"https:\/\/blog.mi.hdm-stuttgart.de\/index.php\/2016\/08\/02\/project-how-to-build-an-intelligent-mirror\/","title":{"rendered":"[Project] How to build an intelligent mirror"},"content":{"rendered":"<p><img decoding=\"async\" src=\"https:\/\/blog.mi.hdm-stuttgart.de\/wp-content\/uploads\/2016\/08\/smartmirror_logo.png\" alt=\"logo\"><br \/>\nHello there, today we want to feature a project, we were working in the last semester. A Smart Mirror.<br \/>\nIt\u2019s not that new to build such a mirror and we\u2019re not the first who built one. We still wanted to do it in another way with another focus. Instead of focussing on our own needs we wanted to build an open and extendable solution.<\/p>\n<p><em>[written by Roman Kollatschny and Matthias Schmidt]<\/em><\/p>\n<p><!--more--><\/p>\n<h1>Project start<\/h1>\n<blockquote><p>\n  &#8220;At the start of the summer term 2016 I had the idea to build a smart mirror. I saw several of those projects on the internet and thought that such a smart mirror would be a cool project to work on. Therefore I was looking for a team to work together. After a team was found, we started with a first project kickoff in middle of march.&#8221; &#8211; Roman<\/p><\/blockquote>\n<p>As a team consisting of 4 master students (Roman Kollatschny, Matthias Schmidt, Christopher Uhrig and Calieston Varatharajah) of computer science and media at media university Stuttgart we started our project in the middle of March 2016. According to our time schedule we had to build a useable edition due to end of June where the \u201cMediaNight\u201d &#8211; a university-wide project presentation day &#8211; is dated. We planned building a prototype of our hardware and software, including frontend and backend. The MediaNight normally isn\u2019t the end of the project. We knew that there\u2019s some time left until the project really has to be finished, including the documentation, so the project won\u2019t be finally finished in June.<\/p>\n<h1>The first draft<\/h1>\n<p>By mid-april we planned our project by searching for similar projects and defining our own goals we want to reach. Our first draft of the mirror looked like this.<\/p>\n<p><img decoding=\"async\" src=\"https:\/\/blog.mi.hdm-stuttgart.de\/wp-content\/uploads\/2016\/08\/smartmirror_concept_i_front.jpg\" alt=\"\"><br \/>\n<img decoding=\"async\" src=\"https:\/\/blog.mi.hdm-stuttgart.de\/wp-content\/uploads\/2016\/08\/smartmirror_concept_i_back.jpg\" alt=\"\"><\/p>\n<p>The draft included a wooden frame with some build in sensors on the front. The sensors would be a leap motion controller to interact with the mirror by gestures, a pir sensors that can start up the mirror if someone comes near the mirror and a camera for facial recognition. On the back was also a rgb led strip to e.g. indicate status messages.<br \/>\nThe mirror should be powered by the latest raspberry pi model running a node.js web application for our interface. We also planned to integrate a backend for the mirror that allows users to customize the mirror interface to their needs. To be able to customize the interface we wanted to have some kind of app store where the users can download different widgets for the mirror. We also wanted that the mirror can be used by multiple users and that every user can have its own customized interface.<\/p>\n<h1>The second draft<\/h1>\n<p>In a second iteration of our draft, we had to make several changes. We had to remove the camera because of some privacy concerns and added a RFID sensor for the user authentication on the side of the mirror. We also added two more sensors, a temperature and humidity sensor and a light sensor. These two sensors were used to display their data on the interface. A microphone was added to the front to have a second way to interact with the mirror.<\/p>\n<p><img decoding=\"async\" src=\"https:\/\/blog.mi.hdm-stuttgart.de\/wp-content\/uploads\/2016\/08\/smartmirror_concept_ii_front.jpg\" alt=\"\"><br \/>\n<img decoding=\"async\" src=\"https:\/\/blog.mi.hdm-stuttgart.de\/wp-content\/uploads\/2016\/08\/smartmirror_concept_ii_back.jpg\" alt=\"\"><\/p>\n<h1>The final draft<\/h1>\n<p>At the end of April, we had finalized our draft and were able started with the development. The final draft for our smart mirror included the following hardware components:<\/p>\n<ul>\n<li>A two way mirror (also venetian mirror or spy mirror \u2192 the mirrors in<br \/>\nthe crime series when suspects get examined)<\/li>\n<li>A wooden frame that holds the the mirror and the components<\/li>\n<li>A ~24 inch lcd panel with led backlight and pva panel for higher contrast<\/li>\n<li>The latest raspberry pi model<\/li>\n<li>Several sensors (a pir, temperature<\/li>\n<li>and humidity sensor, a light sensor, a rfid sensor)<\/li>\n<li>The leap motion controller for gesture recognition<\/li>\n<li>A microphone for voice commands<\/li>\n<li>A rgb led strip<\/li>\n<\/ul>\n<p>For the software part, we planned to implement the following features:<\/p>\n<ul>\n<li>User System with multiple users and user authentication<\/li>\n<li>A Backend for interface customizations<\/li>\n<li>A store for widgets<\/li>\n<li>Controllable interface with voice and gestures<\/li>\n<\/ul>\n<p>In our next article we will talk about the realization and development part and state our problems and why we changed some things due to them.<\/p>\n","protected":false},"excerpt":{"rendered":"<p>Hello there, today we want to feature a project, we were working in the last semester. A Smart Mirror. It\u2019s not that new to build such a mirror and we\u2019re not the first who built one. We still wanted to do it in another way with another focus. Instead of focussing on our own needs [&hellip;]<\/p>\n","protected":false},"author":21,"featured_media":0,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"_jetpack_memberships_contains_paid_content":false,"footnotes":""},"categories":[22],"tags":[25,65],"ppma_author":[666],"class_list":["post-1266","post","type-post","status-publish","format-standard","hentry","category-student-projects","tag-nodejs","tag-project"],"aioseo_notices":[],"jetpack_featured_media_url":"","jetpack-related-posts":[{"id":1629,"url":"https:\/\/blog.mi.hdm-stuttgart.de\/index.php\/2016\/09\/29\/project-how-to-build-an-intelligent-mirror-part-3\/","url_meta":{"origin":1266,"position":0},"title":"[Project] How to build an intelligent mirror &#8211; Part 3","author":"Matthias Schmidt","date":"29. September 2016","format":false,"excerpt":"Mirror, mirror on the wall, who is the fairest of all? It\u2019s you, Albert. How Albert, our smart mirror, has grown - you can read it here. [written by Roman Kollatschny and Matthias Schmidt] In this last article, we will finally show you the result of the project, Albert. Besides\u2026","rel":"","context":"In &quot;Student Projects&quot;","block_context":{"text":"Student Projects","link":"https:\/\/blog.mi.hdm-stuttgart.de\/index.php\/category\/student-projects\/"},"img":{"alt_text":"","src":"","width":0,"height":0},"classes":[]},{"id":1282,"url":"https:\/\/blog.mi.hdm-stuttgart.de\/index.php\/2016\/09\/29\/project-how-to-build-an-intelligent-mirror-part-2\/","url_meta":{"origin":1266,"position":1},"title":"[Project] How to build an intelligent mirror &#8211; Part 2","author":"Matthias Schmidt","date":"29. September 2016","format":false,"excerpt":"Mirror, mirror on the wall, who is the fairest of all? It\u2019s you, Albert. How Albert, our smart mirror, has grown - you can read it here. [written by Roman Kollatschny and Matthias Schmidt] Last time we started with the general idea and the multiple drafts. This time we talk\u2026","rel":"","context":"In &quot;Student Projects&quot;","block_context":{"text":"Student Projects","link":"https:\/\/blog.mi.hdm-stuttgart.de\/index.php\/category\/student-projects\/"},"img":{"alt_text":"","src":"","width":0,"height":0},"classes":[]},{"id":556,"url":"https:\/\/blog.mi.hdm-stuttgart.de\/index.php\/2016\/05\/27\/test-driven-development-with-node-js\/","url_meta":{"origin":1266,"position":2},"title":"Test Driven Development with Node.js","author":"Roman Kollatschny","date":"27. May 2016","format":false,"excerpt":"Test-Driven Development with Mocha and Chai in Node.js","rel":"","context":"In &quot;Rich Media Systems&quot;","block_context":{"text":"Rich Media Systems","link":"https:\/\/blog.mi.hdm-stuttgart.de\/index.php\/category\/interactive-media\/rich-media-systems\/"},"img":{"alt_text":"","src":"","width":0,"height":0},"classes":[]},{"id":1190,"url":"https:\/\/blog.mi.hdm-stuttgart.de\/index.php\/2016\/07\/29\/test-driven-development-part-iv\/","url_meta":{"origin":1266,"position":3},"title":"Test Driven Development Part IV","author":"Matthias Schmidt","date":"29. July 2016","format":false,"excerpt":"[written by Roman Kollatschny and Matthias Schmidt] Welcome back to our fourth and final post in our series. This time we want to deal with code style and code quality to optimize coding on additional ways. You\u2019re new? Hop to the first, second or third post so you don\u2019t miss\u2026","rel":"","context":"In &quot;Allgemein&quot;","block_context":{"text":"Allgemein","link":"https:\/\/blog.mi.hdm-stuttgart.de\/index.php\/category\/allgemein\/"},"img":{"alt_text":"","src":"","width":0,"height":0},"classes":[]},{"id":1729,"url":"https:\/\/blog.mi.hdm-stuttgart.de\/index.php\/2016\/12\/08\/snakes-exploring-pipelines-a-system-engineering-and-management-project-2\/","url_meta":{"origin":1266,"position":4},"title":"Snakes exploring Pipelines &#8211; A \u201cSystem Engineering and Management\u201d Project","author":"Yann Loic Philippczyk","date":"8. December 2016","format":false,"excerpt":"Part 1: Tool Setup This series of blog entries describes a student project focused on developing an application by using methods like pair programming, test driven development and deployment pipelines. Welcome to the next part our project, on its way to become the Snake game with the very best underlying\u2026","rel":"","context":"In &quot;Allgemein&quot;","block_context":{"text":"Allgemein","link":"https:\/\/blog.mi.hdm-stuttgart.de\/index.php\/category\/allgemein\/"},"img":{"alt_text":"","src":"https:\/\/i0.wp.com\/blog.mi.hdm-stuttgart.de\/wp-content\/uploads\/2016\/12\/blue-krait.jpg?resize=350%2C200&ssl=1","width":350,"height":200,"srcset":"https:\/\/i0.wp.com\/blog.mi.hdm-stuttgart.de\/wp-content\/uploads\/2016\/12\/blue-krait.jpg?resize=350%2C200&ssl=1 1x, https:\/\/i0.wp.com\/blog.mi.hdm-stuttgart.de\/wp-content\/uploads\/2016\/12\/blue-krait.jpg?resize=525%2C300&ssl=1 1.5x"},"classes":[]},{"id":632,"url":"https:\/\/blog.mi.hdm-stuttgart.de\/index.php\/2016\/07\/26\/test-driven-development-part-iii\/","url_meta":{"origin":1266,"position":5},"title":"Test Driven Development Part III","author":"Matthias Schmidt","date":"26. July 2016","format":false,"excerpt":"[written by Roman Kollatschny and Matthias Schmidt] Uhwe, hello and welcome back to the third of our posts in this series. Today we want to show you additional features and tipps on developing a node.js web application test driven. As stated in the last article we use Mocha.js and Chai.js\u2026","rel":"","context":"In &quot;System Designs&quot;","block_context":{"text":"System Designs","link":"https:\/\/blog.mi.hdm-stuttgart.de\/index.php\/category\/system-designs\/"},"img":{"alt_text":"","src":"","width":0,"height":0},"classes":[]}],"jetpack_sharing_enabled":true,"authors":[{"term_id":666,"user_id":21,"is_guest":0,"slug":"ms435","display_name":"Matthias Schmidt","avatar_url":"https:\/\/secure.gravatar.com\/avatar\/06dcaaca4cf8e3dca153ac8a8454e5a5b76fb2a980d15e094b9b11bf5639ce53?s=96&d=mm&r=g","0":null,"1":"","2":"","3":"","4":"","5":"","6":"","7":"","8":""}],"_links":{"self":[{"href":"https:\/\/blog.mi.hdm-stuttgart.de\/index.php\/wp-json\/wp\/v2\/posts\/1266","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/blog.mi.hdm-stuttgart.de\/index.php\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/blog.mi.hdm-stuttgart.de\/index.php\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/blog.mi.hdm-stuttgart.de\/index.php\/wp-json\/wp\/v2\/users\/21"}],"replies":[{"embeddable":true,"href":"https:\/\/blog.mi.hdm-stuttgart.de\/index.php\/wp-json\/wp\/v2\/comments?post=1266"}],"version-history":[{"count":9,"href":"https:\/\/blog.mi.hdm-stuttgart.de\/index.php\/wp-json\/wp\/v2\/posts\/1266\/revisions"}],"predecessor-version":[{"id":24698,"href":"https:\/\/blog.mi.hdm-stuttgart.de\/index.php\/wp-json\/wp\/v2\/posts\/1266\/revisions\/24698"}],"wp:attachment":[{"href":"https:\/\/blog.mi.hdm-stuttgart.de\/index.php\/wp-json\/wp\/v2\/media?parent=1266"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/blog.mi.hdm-stuttgart.de\/index.php\/wp-json\/wp\/v2\/categories?post=1266"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/blog.mi.hdm-stuttgart.de\/index.php\/wp-json\/wp\/v2\/tags?post=1266"},{"taxonomy":"author","embeddable":true,"href":"https:\/\/blog.mi.hdm-stuttgart.de\/index.php\/wp-json\/wp\/v2\/ppma_author?post=1266"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}