How Did We Do It?

This interactive image is an example of augmented reality (AR),a form of technology in which something real (the cover image) and something virtual (the surprise image) merge to create a mixed reality. How does it work? The contrast in a black-and-white “marker” (in this case, the “40”) is picked up by your webcam and “read” by the software. The 3-D model and animations that appear on your screen are overlaid onto the live video from your webcam, allowing you to manipulate the image in real time by changing the orientation of the page as you hold it up.

Producing this augmented-reality piece was a team effort. Simply put, a graphic designer created the image, which includes the marker. Two designers created 3-D images and animations. Finally, a Flash developer used FLARToolkit and FLARManager to make the composite image magically appear together in cyberspace.

Download the open-source Flash code.

*This cover appeared on the 40th anniversary issue of explore, a publication available only to Exploratorium Members. To learn more about Membership, click here .



If your webcam isn't activated, restart your web browser and reload this page. If that doesn't work, try manually selecting your webcam using the following steps:

  1. Right click (Control-Click on a Mac) on the application window, the dark area above
  2. Select the Settings... option from the Flash Player menu.
  3. Select the privacy tab (the second tab from the left at the bottom of the Adobe Flash Player Settings window) and make sure "allow" is selected
  4. Select the webcam settings tab (the fifth tab from the left)
  5. Select your webcam or webcam driver from the Camera drop-down selector.
  6. Close the Flash Player menu by clicking the Close button.

What's half real, half virtual, and completely cool? Try this to find out.

You need a webcam and the cover image of explore , our Members’ quarterly publication,* to do this. You can use a black-and-white or color printout of this PDF , if you don't have the magazine. Follow the instructions below, or watch this video.

  1. Make sure the area where you're sitting has bright, even lighting.

  2. Click the "Allow" button on the screen at left when prompted to give permission for the web page to use your webcam and microphone.

  3. When you see yourself in the window, hold the cover as flat as possible in front of the webcam. Experiment by gently moving it around until something surprising appears.

  4. Blow into your microphone for an extra surprise.

Don't have a webcam? Click here to see the surprise.


Connect with us on:
Facebook Flickr
MySpoace Twitter YouTube