An overview of how Web Standards and Augmented Reality are combining to create a new Augmented Web. This presentation was part of the "Open and Interoperable AR" session at #AWE2013.

1. https://buildAR.com - image credit
Augmented Reality is just a feature!

2. Who am I?
Rob Manson @nambor
CEO of MOB Labs the creators of buildAR.com
Chair of the W3C's Augmented Web Community Group
Invited Expert with the ISO, W3C & the Khronos Group
Co-Founder of ARStandards.org
Author of “Getting started with WebRTC” (available July)
https://buildAR.com

3. In 2010 we showed the first model of Web based AR
ARStandards Workshop in Seoul 2010
Patterns of Interest Proposal – Rob Manson
https://buildAR.com

4. In 2012 we created a test for the Augmented Web
You can test your device at theAWEsomeWEB.com now
https://buildAR.com

5. https://buildAR.com
And we rebuilt our whole platform
based on this vision for the future of AR

6. https://buildAR.com

7. Today WebRTC has already introduced
the Augmented Web to over 1 Billion devices
https://buildAR.com - image credit

8. https://buildAR.com
Current local image processing pipeline
using the Media Capture & Streams API
1. Setup <video> element in the DOM
a. declaratively then via getElementById or similar
b. createElement(“video”) then appendChild()
2. Access the camera
a. getUserMedia()
NOTE: Currently can only select the default camera
3. Pipe camera stream into <video>
a. video.src = stream
4. Setup <canvas> element in the DOM
a. declaratively then via getElementById or similar
b. createElement(“canvas”) then appendChild()
5. Get 2D drawing context
a. canvas.getContext('2d');
6. Draw <video> frame onto <canvas>
a. canvas.drawImage(video, top, left, width, height);
7. Get RGBA Uint8ClampedArray of the pixels
a. context.getImageData(top, left, width, height).data;
8. Burn CPU (not GPU) cycles
a. for (blah) { for (blah) { … } … }
NOTE: May also integrate other sensor data here
9. Render results
a. using HTML/JS/CSS
b. using another <canvas> and drawImage()
c. using WebGL
d. a combination of all

9. https://buildAR.com
JSARToolkit demo

10. https://buildAR.com
FAST feature detection demo

11. https://buildAR.com
What's in the near future?
Integrating WebRTC and Visual Search
Using WebGL/GLSL to utilise GPU parallelism
Khronos Group's OpenVX
Khronos Group's Camera Working Group
Lots more demos to share! 8)

12. Please join the W3C's
Augmented Web Community Group
https://buildAR.com - image credit