7 ms·

MirrorMirror: A Raspberry Pi-Powered Magic Mirror

131 points by bdz 11y ago

Corrado 11y ago
I know this has been done a dozen times and shown on the Internet, this particular inception seems particularly cool. Maybe it's because the pictures are so clear, or that I recently got a Pi2 to play around with, but it makes me really want to do this project. :)
planb 11y ago
Does anyone know if this setup in combination with a camera would work to create a real time color overlay over the mirror image? Or is just white text readable due to the way the light shines through the mirror? I could imagine lots of useful or entertaining use cases for such a mirror...
- checker 11y ago
  You can see the raspberries are a little dim in this picture: http://blog.dylanjpierce.com/assets/mirrormirror/15_booting.jpg http://blog.dylanjpierce.com/assets/mirrormirror/15_booting.... Looks like it's certainly possible. I'm not a graphics/projection expert, but you might be able to boost the brightness for more visibility by adjusting the color profile of the monitor or maybe by adjusting the color output of the pi. I think ultimately it depends on the ambient light in the room and the brightness of your monitor. The brightest possible monitor would be ideal to offset the effect of the mirror.
- pininja 11y ago
  I made one for a christmas present this year. High contrast colors show up great. If colors are close to each other it becomes hard to tell them apart, but you can still see color. Dark colors are hard to see against a black background for the same reason.
  - atticoos 11y ago
    I just want to give a +1 to the high contrast colors. I have a few colors on mine (green & red arrows for stock quote directions) and they come out great.
- pierrec 11y ago
  Reading your question closely, I think what you're asking is "Can the reflection feature Augmented Reality?" (that's why you mention a camera and real-timeness) In which case I believe the answer is no, we can't currently do AR in a reflection. In order to match the viewer's perspective, you'd have to either use eye tracking (kind of a poor solution for something as shareable as a mirror); or use a multiscopic display, a technology that doesn't currently exist at any acceptable resolution. It might be possible to implement a limited sort of AR where the mirror's added content is on a plane at a fixed distance by a trick of lenses. But if you or any object sits between the virtual plane and the mirror, there wouldn't be any occlusion, so it would somewhat break the illusion.
  - planb 11y ago
    You're right, that's what I had in mind but I didn't think this far... Thanks for clearing this up.
  - kuschku 11y ago
    > or use a multiscopic display, a technology that doesn't currently exist at any acceptable resolution. That’s definitely wrong. REALEYES[1] has built some prototypes, although they only sell static ones. At my university we actually have a high-resolution (1080p) multiscopic display from them. It’s just 80'000k EUR
    - deleted 11y ago
      [deleted]
    - pierrec 11y ago
      [1]: http://real-eyes.eu/ http://real-eyes.eu/ Well, a "static multiscopic display" is essentially an old-school hologram, we've had those for a while. Their website doesn't appear to mention any real multiscopic display yet. I'd be curious to know the number of viewing angles and axes of the experimental display you mention. 1080p is only half the information: if it has the angular resolution of a Nintendo 3DS, it would very much fall out of the acceptable zone, especially if your goal is to superimpose any sort of AR on a mirror.
- izak30 11y ago
  Yeah, my Pyohio talk covered that a bit, it's totally doable. https://www.youtube.com/watch?v=MXO7YXvAGFk https://www.youtube.com/watch?v=MXO7YXvAGFk
timvdalen 11y ago
I also had a go at this recently, I wrote a backend in node that supported 'data plugins' that can generate events, which are then published to an angular app. I targeted a mobile device behind a mirror, so I included functionality that made the front-end refresh the page (and possibly load new front-end code) upon a special message from the backend. That way, I didn't have to connect the device for every update. I never quite finished any useful data plugins except for the weather, but if anyone's interested the code is here: https://github.com/timvdalen/webmirror-back https://github.com/timvdalen/webmirror-back https://github.com/timvdalen/webmirror-front https://github.com/timvdalen/webmirror-front
incanus77 11y ago
This is awesome! I made an iOS- and OS X-based interactive one for Halloween recently as well: http://justinmiller.io/posts/2015/11/17/mirror-mirror/ http://justinmiller.io/posts/2015/11/17/mirror-mirror/
brentvatne 11y ago
Cool stuff! ajwhite put something similar together with an old Android tablet and React Native: https://github.com/ajwhite/MagicMirror https://github.com/ajwhite/MagicMirror
- atticoos 11y ago
  Some more great mirror projects with Tablets (where I got my inspiration to try with RN): - https://github.com/plondon/BlackMirror https://github.com/plondon/BlackMirror - https://github.com/HannahMitt/HomeMirror https://github.com/HannahMitt/HomeMirror
deleted 11y ago
[deleted]
bkd9 11y ago
It looks like most of these magic mirrors have been done with an old android whereas this one uses a monitor and a rasberry pi. If I wanted to make one, which one should I choose. What are the pros and cons of this approach?
- tracker1 11y ago
  Android would be a smaller display and potentially a camera/microphone for some environment detection.
avodonosov 11y ago
Super, widgets on mirror is a cool feature!
x3n0ph3n3 11y ago
I would buy one of these!
Mtinie 11y ago
I've got an extra Kinect laying around that would be cool to tie into one of these mirror builds. Has anyone had any success hooking a Kinect up to a Raspberry Pi? I've seen threads that discuss a few libraries that are available for depth and image data, but I don't recall ever seeing anyone successfully use a Kinect "controller" (gestures to move a pointer).
mchahn 11y ago
This is cool and I've already got a couple of ideas that steal from it. I have one question though. Why would an obviously technically capable person have photos displayed in the wrong orientation on the web page?
- atticoos 11y ago
  Tell the customers they just rotate their screens. It's not a bug.
kevinbowman 11y ago
I wonder if it has a reflection API...
tudorw 11y ago
It's a great project, must admit I was expecting a camera and some AI to detect whether I was the fairest of all!
awqrre 11y ago
I guess it can get really useful if you like to sit in front of the mirror all day.
teh_klev 11y ago
Very cool. If the author of this page turns up can I suggest one thing - image optimisation. You could save a chunk of bandwidth cost for yourself and others browsing on metered services, and improve your page load times by not having ~seventeen 3-5 MB (~5300x3000px ) images being loaded, especially when none of the 720x146 px images can be clicked to show a larger version. This page is 72MB big and took 100 seconds to load, even on a non-congested 8MB DSL service.

131 points by bdz 11y ago

I know this has been done a dozen times and shown on the Internet, this particular inception seems particularly cool. Maybe it's because the pictures are so clear, or that I recently got a Pi2 to play around with, but it makes me really want to do this project. :)

planb 11y ago

Does anyone know if this setup in combination with a camera would work to create a real time color overlay over the mirror image? Or is just white text readable due to the way the light shines through the mirror? I could imagine lots of useful or entertaining use cases for such a mirror...

checker 11y ago
You can see the raspberries are a little dim in this picture: http://blog.dylanjpierce.com/assets/mirrormirror/15_booting.jpg http://blog.dylanjpierce.com/assets/mirrormirror/15_booting.... Looks like it's certainly possible. I'm not a graphics/projection expert, but you might be able to boost the brightness for more visibility by adjusting the color profile of the monitor or maybe by adjusting the color output of the pi. I think ultimately it depends on the ambient light in the room and the brightness of your monitor. The brightest possible monitor would be ideal to offset the effect of the mirror.
pininja 11y ago
I made one for a christmas present this year. High contrast colors show up great. If colors are close to each other it becomes hard to tell them apart, but you can still see color. Dark colors are hard to see against a black background for the same reason.
- atticoos 11y ago
  I just want to give a +1 to the high contrast colors. I have a few colors on mine (green & red arrows for stock quote directions) and they come out great.
pierrec 11y ago
Reading your question closely, I think what you're asking is "Can the reflection feature Augmented Reality?" (that's why you mention a camera and real-timeness) In which case I believe the answer is no, we can't currently do AR in a reflection. In order to match the viewer's perspective, you'd have to either use eye tracking (kind of a poor solution for something as shareable as a mirror); or use a multiscopic display, a technology that doesn't currently exist at any acceptable resolution. It might be possible to implement a limited sort of AR where the mirror's added content is on a plane at a fixed distance by a trick of lenses. But if you or any object sits between the virtual plane and the mirror, there wouldn't be any occlusion, so it would somewhat break the illusion.
- planb 11y ago
  You're right, that's what I had in mind but I didn't think this far... Thanks for clearing this up.
- kuschku 11y ago
  > or use a multiscopic display, a technology that doesn't currently exist at any acceptable resolution. That’s definitely wrong. REALEYES[1] has built some prototypes, although they only sell static ones. At my university we actually have a high-resolution (1080p) multiscopic display from them. It’s just 80'000k EUR
  - deleted 11y ago
    [deleted]
  - pierrec 11y ago
    [1]: http://real-eyes.eu/ http://real-eyes.eu/ Well, a "static multiscopic display" is essentially an old-school hologram, we've had those for a while. Their website doesn't appear to mention any real multiscopic display yet. I'd be curious to know the number of viewing angles and axes of the experimental display you mention. 1080p is only half the information: if it has the angular resolution of a Nintendo 3DS, it would very much fall out of the acceptable zone, especially if your goal is to superimpose any sort of AR on a mirror.
izak30 11y ago
Yeah, my Pyohio talk covered that a bit, it's totally doable. https://www.youtube.com/watch?v=MXO7YXvAGFk https://www.youtube.com/watch?v=MXO7YXvAGFk

timvdalen 11y ago

I also had a go at this recently, I wrote a backend in node that supported 'data plugins' that can generate events, which are then published to an angular app. I targeted a mobile device behind a mirror, so I included functionality that made the front-end refresh the page (and possibly load new front-end code) upon a special message from the backend. That way, I didn't have to connect the device for every update. I never quite finished any useful data plugins except for the weather, but if anyone's interested the code is here: https://github.com/timvdalen/webmirror-back https://github.com/timvdalen/webmirror-back https://github.com/timvdalen/webmirror-front https://github.com/timvdalen/webmirror-front

incanus77 11y ago

This is awesome! I made an iOS- and OS X-based interactive one for Halloween recently as well: http://justinmiller.io/posts/2015/11/17/mirror-mirror/ http://justinmiller.io/posts/2015/11/17/mirror-mirror/

brentvatne 11y ago

Cool stuff! ajwhite put something similar together with an old Android tablet and React Native: https://github.com/ajwhite/MagicMirror https://github.com/ajwhite/MagicMirror

atticoos 11y ago
Some more great mirror projects with Tablets (where I got my inspiration to try with RN): - https://github.com/plondon/BlackMirror https://github.com/plondon/BlackMirror - https://github.com/HannahMitt/HomeMirror https://github.com/HannahMitt/HomeMirror

deleted 11y ago

[deleted]

bkd9 11y ago

It looks like most of these magic mirrors have been done with an old android whereas this one uses a monitor and a rasberry pi. If I wanted to make one, which one should I choose. What are the pros and cons of this approach?

tracker1 11y ago
Android would be a smaller display and potentially a camera/microphone for some environment detection.

avodonosov 11y ago

Super, widgets on mirror is a cool feature!

x3n0ph3n3 11y ago

I would buy one of these!

Mtinie 11y ago

I've got an extra Kinect laying around that would be cool to tie into one of these mirror builds. Has anyone had any success hooking a Kinect up to a Raspberry Pi? I've seen threads that discuss a few libraries that are available for depth and image data, but I don't recall ever seeing anyone successfully use a Kinect "controller" (gestures to move a pointer).

mchahn 11y ago

This is cool and I've already got a couple of ideas that steal from it. I have one question though. Why would an obviously technically capable person have photos displayed in the wrong orientation on the web page?

atticoos 11y ago
Tell the customers they just rotate their screens. It's not a bug.

kevinbowman 11y ago

I wonder if it has a reflection API...

tudorw 11y ago

It's a great project, must admit I was expecting a camera and some AI to detect whether I was the fairest of all!

awqrre 11y ago

I guess it can get really useful if you like to sit in front of the mirror all day.

teh_klev 11y ago

Very cool. If the author of this page turns up can I suggest one thing - image optimisation. You could save a chunk of bandwidth cost for yourself and others browsing on metered services, and improve your page load times by not having ~seventeen 3-5 MB (~5300x3000px ) images being loaded, especially when none of the 720x146 px images can be clicked to show a larger version. This page is 72MB big and took 100 seconds to load, even on a non-congested 8MB DSL service.