Portals is a prototype of a tangible and networked system/interface for interacting with a virtual world.
A portal, according to Wikipedia, is a magical or technological doorway that connects two distant locations separated by spacetime. Places that a portal will link to include a different spot in the same universe, a parallel world, the past or the future, and other planes of existence.
There are basically 3 main features of these specific portals:
1. To interact with the portal, you reach inside the box, going behind the screen instead of gesturing in front of it or touching it.
2. The two portals are networked so you can collaboratively play with someone in a shared space, even if they're physically far away.
3. The system recognizes and responds when special objects are inside, tracking the id, position, and rotation.
Videos
It makes more sense when you see it in action, so here's an edited version of a longer scenario video I made for the project which just highlights the main features.
Also, a short video of the Portals in action at 4 Hours Solid, my grad show:
The project was created in 2011-12 as part of an MFA Thesis in Graduate Media Design, at Art Center College of Design. If you want more details about the project visit Portals (and friends). One of my main goals of the project was to create something that other people could build upon and expand. So.... without further ado, let's get on to the How To part of things!
Note: my process of building these boxes wasn’t this straight forward. It was a super iterative process that involved lots of small tests. Even though I’m going to try to explain it in a more logical step based way, I would still recommend testing out parts of the hardware + software before diving in and building the entire thing for real.
“The visible world is no longer a reality and the unseen world is no longer a dream.”-Arthur Symons
A portal, according to Wikipedia, is a magical or technological doorway that connects two distant locations separated by spacetime. Places that a portal will link to include a different spot in the same universe, a parallel world, the past or the future, and other planes of existence.
There are basically 3 main features of these specific portals:
1. To interact with the portal, you reach inside the box, going behind the screen instead of gesturing in front of it or touching it.
2. The two portals are networked so you can collaboratively play with someone in a shared space, even if they're physically far away.
3. The system recognizes and responds when special objects are inside, tracking the id, position, and rotation.
Videos
It makes more sense when you see it in action, so here's an edited version of a longer scenario video I made for the project which just highlights the main features.
Also, a short video of the Portals in action at 4 Hours Solid, my grad show:
The project was created in 2011-12 as part of an MFA Thesis in Graduate Media Design, at Art Center College of Design. If you want more details about the project visit Portals (and friends). One of my main goals of the project was to create something that other people could build upon and expand. So.... without further ado, let's get on to the How To part of things!
Note: my process of building these boxes wasn’t this straight forward. It was a super iterative process that involved lots of small tests. Even though I’m going to try to explain it in a more logical step based way, I would still recommend testing out parts of the hardware + software before diving in and building the entire thing for real.
“The visible world is no longer a reality and the unseen world is no longer a dream.”-Arthur Symons
Remove these ads by
Signing UpStep 1: Supplies
1. MATERIALS (for a pair of Portals)
What you use to build the physical enclosures/structures is up to you really. And how much of it sort of depends on how big your box is.
• 1x sheet of drafting velum To diffuse the light box light.
• 3x 1/4” white acrylic (18” x 32”) To build the light boxes + poppets
• 2x 3/8” plywood (36” x 48”) The main cases
• 1x 1/8” plywood (18” x 24”) For the camera + light mounts
• 4 tiny hinges. For the box lids.
• 2 sheets of clear address label stickers Avery 1” x 2 5/8”
• Misc. adhesive + cutting supplies. A roll of velcro, white tape, elmer’s glue, acrylic cement, small screws, x-actos, laser cutter, woodshop, etc...
2. ELECTRONICS (for a pair of Portals)
They're not exactly cheap..
• 2x Newer iMacs. Running OSX 10.6.8. a newer/faster one is probably better.
• 2x flat-screen LCD monitor. I’m using 17inch Acer monitors with removable stands
• 2x display port to VGA adapters To hook up the monitors to the computers
• 2x HD webcam I’m using Logitech c910. Color and quality is great but there’s no manual control for anything which sucks. But the HD cams result in a pretty clean chroma key. I am definitely still inter- ested in an acceptable alternative to these cameras.
• 2x board camera with remote CCD Unibrain’s Fire-i Digital Board Camera with Remote CCD. These are Firewire and have a manual focus as well as an interchangeable lens.
• 2x lens for the Fire-i cameras 2.1mm seems to work alright for this distance.
• 2x firewire 400 to 800 adapters For the firewire cameras
• 2x set of ultra thin LED puck lights I have some by Amertac. One set contains 3 lights.
• 4x set of Ultra Thin LED strip lights Amertac. One set is 3 strips, you need 12 strips total.
• 1x power strip/surge protector
3. SOFTWARE + FILES
I’ll go into more detail about each of these later, but we’re basically going to be connecting all of these things together.
• Reactivision (http://reactivision.sourceforge.net/) Open source computer vision framework
• Osculator (http://www.osculator.net/) Interprets OSC messages
• NETLab Toolkit + HUB (http://www.netlabtoolkit.org/) Integrates tangible interaction + Flash
• Adobe Flash CS5+ (http://www.adobe.com/downloads/) You know. Flash.
• iChat (comes with your mac) Handles the video chat side of things
• CamTwist (http://camtwiststudio.com/) Layers all the video feeds together.
• Files (http://portals-and-friends.com/share/Portals_Files.zip) Includes program files, laser cutting files, and artwork
What you use to build the physical enclosures/structures is up to you really. And how much of it sort of depends on how big your box is.
• 1x sheet of drafting velum To diffuse the light box light.
• 3x 1/4” white acrylic (18” x 32”) To build the light boxes + poppets
• 2x 3/8” plywood (36” x 48”) The main cases
• 1x 1/8” plywood (18” x 24”) For the camera + light mounts
• 4 tiny hinges. For the box lids.
• 2 sheets of clear address label stickers Avery 1” x 2 5/8”
• Misc. adhesive + cutting supplies. A roll of velcro, white tape, elmer’s glue, acrylic cement, small screws, x-actos, laser cutter, woodshop, etc...
2. ELECTRONICS (for a pair of Portals)
They're not exactly cheap..
• 2x Newer iMacs. Running OSX 10.6.8. a newer/faster one is probably better.
• 2x flat-screen LCD monitor. I’m using 17inch Acer monitors with removable stands
• 2x display port to VGA adapters To hook up the monitors to the computers
• 2x HD webcam I’m using Logitech c910. Color and quality is great but there’s no manual control for anything which sucks. But the HD cams result in a pretty clean chroma key. I am definitely still inter- ested in an acceptable alternative to these cameras.
• 2x board camera with remote CCD Unibrain’s Fire-i Digital Board Camera with Remote CCD. These are Firewire and have a manual focus as well as an interchangeable lens.
• 2x lens for the Fire-i cameras 2.1mm seems to work alright for this distance.
• 2x firewire 400 to 800 adapters For the firewire cameras
• 2x set of ultra thin LED puck lights I have some by Amertac. One set contains 3 lights.
• 4x set of Ultra Thin LED strip lights Amertac. One set is 3 strips, you need 12 strips total.
• 1x power strip/surge protector
3. SOFTWARE + FILES
I’ll go into more detail about each of these later, but we’re basically going to be connecting all of these things together.
• Reactivision (http://reactivision.sourceforge.net/) Open source computer vision framework
• Osculator (http://www.osculator.net/) Interprets OSC messages
• NETLab Toolkit + HUB (http://www.netlabtoolkit.org/) Integrates tangible interaction + Flash
• Adobe Flash CS5+ (http://www.adobe.com/downloads/) You know. Flash.
• iChat (comes with your mac) Handles the video chat side of things
• CamTwist (http://camtwiststudio.com/) Layers all the video feeds together.
• Files (http://portals-and-friends.com/share/Portals_Files.zip) Includes program files, laser cutting files, and artwork
Visit Our Store »
Go Pro Today »
Awesome work though, instructables like this are what makes me love this site so much. So much ingenuity and creativity. Keep up the awesome work!
CamTwist, which is what sort of makes the magic happen is for Mac only. There are other similar programs out there for Windows but I don't know which ones would work best since I haven't tested for it. But let me know if you find a good one!
http://www.pcwinsoft.com/screencamera/