Taking the Web to the Next Dimension (Martin Naumann)

Taking the web to the next dimension

Using WebGL and WebVR

Who am I?

Software Engineer @ Archilogicfrom Zurich github.com/avgp twitter.com/g33konaut ox86.tumblr.com

http://about.archilogic.com

https://github.com/AVGP

https://twitter.com/g33konaut

http://ox86.tumblr.com/

http://ox86.tumblr.com/

Our journey today

● Introduction● Interactivity & 3D● Immersion with Virtual Reality

Introduction

Sharing information

Sharing impressions

Sharing moments

Sharing not just a single glimpse

Sharing what’s in our head

So far

● all of this was static● two-dimensional content● external perspective

On the web

On the web

Images

Videos

3D & Interactivity

3D Examples

1. NYT article: The Dawn Wall2. Google Maps3. Teleports4. d3-3d experiment5. Globe demo

http://www.nytimes.com/interactive/2015/01/09/sports/the-dawn-wall-el-capitan.html

http://www.nytimes.com/interactive/2015/01/09/sports/the-dawn-wall-el-capitan.html

https://www.google.ch/maps/place/etc.venues+Bishopsgate/@51.5013045,-0.0669328,1026a,20y,335.81h,63.2t/data=!3m1!1e3!4m2!3m1!1s0x48761cb3b4cc5e63:0xb1b5d03c23441ae

https://www.google.ch/maps/place/etc.venues+Bishopsgate/@51.5013045,-0.0669328,1026a,20y,335.81h,63.2t/data=!3m1!1e3!4m2!3m1!1s0x48761cb3b4cc5e63:0xb1b5d03c23441ae

http://teleports.me/#show=zurich_5_NyOiQv0x

http://teleports.me/#show=zurich_5_NyOiQv0x

http://projects.delimited.io/experiments/d3-threejs/

http://projects.delimited.io/experiments/d3-threejs/

http://globe.chromeexperiments.com/

http://globe.chromeexperiments.com/

Can we use it?

Source: http://webglstats.com/

http://webglstats.com/

New ways to interact with content

LEAPMotion - £55Demo

Myo - $199Video

http://avgp.github.io/3d-web-demos/lookma-only-hands/index.html

http://avgp.github.io/3d-web-demos/lookma-only-hands/index.html

https://www.youtube.com/watch?v=oWu9TFJjHaM

https://www.youtube.com/watch?v=oWu9TFJjHaM

Recap

● better spatial representation of data● more flexibility in layout and visible content● new interaction modes

So far

● we covered static and dynamic content● two-dimensional and three-dimensional● still only external perspective

Immersionwith Virtual Reality

Giving people superpowers... the computer is the most remarkable tool that we've ever come up with.

It's the equivalent of a bicycle for our minds

Now what if...

...we could bring people into the scene?

...make them interact in a natural way?

...deliver truly emotional experiences?

When sharing a moment

wouldn’t it be amazing to be in it?

Virtual Reality, 1962

●

Virtual Reality, $273

Oculus Rift - $350

Google Cardboard - $5

WebVR

http://www.youtube.com/watch?v=In9_I83wC-Q

WebVR beyond the demo

http://www.youtube.com/watch?v=Wuoeb0WhTeM

But...

Challenges ahead!

Current VR challenges

● Simulator sickness


● Not many design guidelines yet● Google Cardboad Guidelines

http://www.google.com/design/spec-vr/designing-for-google-cardboard/a-new-dimension.html

http://www.google.com/design/spec-vr/designing-for-google-cardboard/a-new-dimension.html


● New interactions and UI concepts

Wrap up

● 3D on the web is mature now● Interesting visualisation capabilities● New interaction modes available● WebVR is evolving● Give your users superpowers!

Thank you!

Slides @ http://bit.ly/fowd-3dweb

Twitter: @g33konautWeb: archilogic.com

http://bit.ly/fowd-3dweb

https://twitter.com/g33konaut

http://archilogic.com

Taking the Web to the Next Dimension (Martin Naumann)

Design

Transcript of Taking the Web to the Next Dimension (Martin Naumann)