Web-based SmartMirror Using Serial Communication

Published

Introduction: Web-based SmartMirror Using Serial Communication

This instructable is delivered with all the code ready to use. The development was very complicated but once it's set up it's really easy to customize.

Take a look and enjoy ;)

Step 1: Configurating Your Arduino

First of all you'll need to configure your arduino.

Let's start with connecting the SRF Sensor to your arduino. In the photo above you can see how I connected the SRF to my arduino.

In the zipfile you will find an Arduino code to upload to your Arduino. When you run this code and open up the serial monitor in the Arduino IDE you should see a "0" when you're further than 1 meter and and a "1" when you're within a meter of the sensor.

You can replace these numbers but it's easier to read out later.

Step 2: Installing Node.js and Running the Websocket

Before we can send the data to our browser environment we will need to install Node.JS.

If that is installed you open up your command prompt and navigate to your Smartmirror folder

$ cd Desktop/SmartMirror

Now you're in the folder you run the index.js file that's provided in the ZIP.

$ node index.js

Normally you should see the "0" and "1" from your sensor now.

NOTE:

inside the index.js you will probably have to change your port. Mine was set up in COM6. Check in your arduino IDE which one your arduino is connected to.

var myPort = new SerialPort('COM6', {
baudRate: 9600 });

Step 3: Open Up the Webpage

Inside the webpage I set up a couple API like a clock, the weather, etc.

Open up the index.html file inside the public map and you will see inside your Command Prompt "new connection".

If everything works as it should the text should start (dis)appearing if you're within a meter or not.

Step 4: Lasercut the Casing

I also provided my own template for a casing but you can create your own because you'll probably have another monitor than me.

Once you cut it out, you assemble it and hide all the cables.

Step 5: DONE!

If everything went as planned you should now have your smartmirror!

Step 6: Tips

You could make it more compact and wireless if you use a Raspberry Pi. This will be less cables and more moveable.

Share

    Recommendations

    • Creative Misuse Contest

      Creative Misuse Contest
    • Oil Contest

      Oil Contest
    • Water Contest

      Water Contest

    Discussions

    That looks really cool. Do you have any video clips of it in operation.