Cross platform Augmented Reality development with React Native
Software Architect & Consultant
Web / Mobile / VR / AR / IoT / Blockchain
Augmented Reality
reality 2.0
reality 2.0
1901 First recorded AR reference (L. Frank Baum - "The Master Key")
1952 Sensorama
Morton Heilig
1968 Sword of Damocles
Ivan Sutherland
1982 AR for weather broadcasters Dan Reitan
1992 Virtual Fixtures Louis Rosenberg
1996 First AR markers CyberCode
How it all started
1998 – NASA develops AR dashboard for X38
1999 Eye tap - wearable AR glasses Steve Mann
2008 AR used by BMW for commercial purposes
2010 – Kinnect
2012 – Google Glass
90's - 2000's
2013 – AR is used in car manufacturing
2016 AR/VR investment reaches 1.1 billion
2016 Microsoft Hololens/Meta 2
2016 – Pokemon Go
2017 – Apple anounced ARKit, Google - ARCore
2018 Magic Leap (light field technology)
Recent years
2019 - 2021
Exponential growth of all AR/VR related tech
How it all started
How we can create AR apps today
iOS
Android
So how do we do cross platform development?
Let's see it in Action
So how do I create awesome AR apps
Getting started with Viro
yarn add @viro-community/react-viro
link native libraries
Basic anatomy of an app
Loading...
AR Scene
Loading...
wraps every AR scene
setting up lights
positioning UI
Recognizing markers
Coordinate system
Right handed coordinate system
-
Positive Z is behind the viewer
-
Axis directions are changed when applied rotation prop
-
To determine positive rotation use "thumb" rule
Lights and Materials Demo
Ambient light
"Sun-like light"
Spotlight
Creating animations
Creating materials
Textures
3d models
.obj
.fbx
.gltf
3d model primitive
loading resources
Skeletal animations
Rendering shadows
Detecting planes
Portals
Portal scene wrapper
Portal wrapper
Portal 3d model
360 image
Particles
and more
So is it the best solution for cross platform AR development?
It depends on your use case
- Not maintained
- Limited capabilities
Unity & ARFoundation
DEMO
Unity as a native library
Bridging desired behavior using React Native bridging capabilities
So what type of apps you can create today
-
Location based AR - Games
- Retail apps
- Indoor navigation
- Tools
- Visual assistance
- Travel
- and much more
Cross platform Augmented Reality development with React Native
By Vladimir Novick
Cross platform Augmented Reality development with React Native
AR is a really fascinating technology. We can see more and more AR apps emerge on iOS and Android. We can also see more and more companies adopt React Native as great solution for Cross platform development using JavaScript, but getting native app performance. In this talk Vladimir Novick will explain how we can bridge AR capabilities into React Native apps.
- 1,045