LogoLogo
  • Home
  • Projects
  • About
  • Contact

Real Drawing to Augmented Reality

Devon O. · October 23, 2009 · Actionscript, Flash · 4 comments
4

Augmented reality may prove to just be a flash in the pan trend in the Flash world, but let’s face it – it’s fun. So, that in mind, here’s a little something I was just fiddling around with: a small app that takes an actual drawing (as in pen and paper – you know – analog) and converts it into a 3d augmented reality thingamajig.

To give it a try below:

  • Print out this marker (ignore the left hand / right hand bs. That was for another project and I was too lazy to create a new marker image).
  • Make a small drawing on a piece of paper. You can use colours, but keep the contrast as high as possible (a black drawing on white paper will work best, but not be very interesting).
  • Double click on the app below and allow webcam access. Hold your drawing up so that it fits nicely into the red square then hit the space bar.
  • When the app tells you to, put down your drawing and hold up the marker you printed out to see your work of art hover in 3 dimensions in front of your face.
  • Be amazed…
  • If you don’t want to go through all that hassle, just check out the demo video down below using a picture of a scary Halloween jack-o-lantern I drew with my wife’s crayons (shhh.. don’t tell her I got ’em).

Get Adobe Flash player

Demo:

Get Adobe Flash player

THE GEEK SHITE:

For anyone interested, here’s what’s going on under the hood. When you hit the space bar, the app takes two quick pics: one “what you see is what you get”, the other, 100% black and white contrast using Quasimondo’s handy “automated threshold and edge detection” gadgetry. The white in the black and white image is converted to alpha (felt like I was coding like a caveman at this point – looping through the vector of pixel values and replacing each white pixel with a transparent pixel, one by one. If anyone knows a quicker/smarter way of converting white pixels to transparent in BitmapData, please post a solution). The alpha channel of the black and white image is then copied to the color image. A Bitmap instance is created from that BitmapData and then passed on to an image extruder like I rambled on about here. That 3d object is then passed on to a Papervision3d/FLAR scene and that’s that. Fun stuff.

  Facebook   Pinterest   Twitter   Google+
augmented realitypapervision3d
  • Adventures in Playbook Land
    April 09, 2011 · 9 comments
    28600
    9
    Read more
  • Some Photographic Shaders
    September 13, 2014 · 12 comments
    6753
    46
    Read more
  • Making Waves
    April 17, 2010 · 9 comments
    3031
    7
    Read more
4 Comments:
  1. You should be able to easily use the “threshold” function for BitmapData to convert pixels to any color you like. The following will copy all non-white pixels to a blank BitmapData (you could then do your copyChannel if you like)

    targetBitmapData.threshold(sourceBitmapData, sourceBitmapData.rect, new Point(0,0), “==”, 0xFFFFFFFF, 0x00FFFFFF, 0xFFFFFFFF, true);

    Tom Richardson · October 23, 2009
  2. Beautiful, Tom. Thank you for that. Threshold didn’t even occur to me – I was thinking maybe floodFill., but threshold would be better.

    Devon O. · October 23, 2009
  3. Very cool techn. it it possible to have a look at the source, would be cool to get a little bit wiser on AR??

    skaale · April 06, 2010

Leave a Comment! Cancel reply

Your email address will not be published. Required fields are marked *

This site uses Akismet to reduce spam. Learn how your comment data is processed.

Devon O. Wolfgang

AIR | Unity3D | AR/VR

Unity Certified Developer

Technical Reviewer of “The Essential Guide to Flash CS4 AIR Development” and “Starling Game Development Essentials”

Reviewer of “The Starling Handbook”

Unity Engineer at Touch Press.

Categories
  • Actionscript (95)
  • AIR (16)
  • Flash (99)
  • Games (7)
  • Liberty (13)
  • Life (53)
  • Shaders (20)
  • Unity3D (21)
Recent Comments
  • Devon O. on Unity Ripple or Shock Wave Effect
  • Feral_Pug on Unity Ripple or Shock Wave Effect
  • bavvireal on Unity3D Endless Runner Part I – Curved Worlds
  • Danielius Vargonas on Custom Post Processing with the LWRP
  • Luca G on Unity Ripple or Shock Wave Effect
Archives
  • December 2020 (1)
  • December 2019 (1)
  • September 2019 (1)
  • February 2019 (2)
  • December 2018 (1)
  • July 2018 (1)
  • June 2018 (1)
  • May 2018 (2)
  • January 2018 (1)
  • December 2017 (2)
  • October 2017 (1)
  • September 2017 (2)
  • January 2017 (1)
  • July 2016 (1)
  • December 2015 (2)
  • March 2015 (1)
  • September 2014 (1)
  • January 2014 (1)
  • August 2013 (1)
  • July 2013 (1)
  • May 2013 (1)
  • March 2013 (2)
  • December 2012 (1)
  • November 2012 (1)
  • September 2012 (3)
  • June 2012 (2)
  • May 2012 (1)
  • April 2012 (1)
  • December 2011 (2)
  • October 2011 (3)
  • September 2011 (1)
  • August 2011 (1)
  • July 2011 (1)
  • May 2011 (2)
  • April 2011 (2)
  • March 2011 (1)
  • February 2011 (1)
  • January 2011 (2)
  • December 2010 (3)
  • October 2010 (5)
  • September 2010 (1)
  • July 2010 (2)
  • May 2010 (5)
  • April 2010 (2)
  • March 2010 (7)
  • February 2010 (5)
  • January 2010 (5)
  • December 2009 (3)
  • November 2009 (1)
  • October 2009 (5)
  • September 2009 (5)
  • August 2009 (1)
  • July 2009 (1)
  • June 2009 (2)
  • May 2009 (6)
  • April 2009 (4)
  • March 2009 (2)
  • February 2009 (4)
  • January 2009 (1)
  • December 2008 (5)
  • November 2008 (2)
  • September 2008 (1)
  • August 2008 (6)
  • July 2008 (6)
  • June 2008 (9)
  • May 2008 (4)
  • April 2008 (3)
  • March 2008 (4)
  • February 2008 (9)
  • January 2008 (7)
  • December 2007 (6)
Copyright © 2017 Devon O. Wolfgang