Cardboard VR: Building Low Cost VR Experiences

Ad

Ad

Ad

Ad

Ad

Ad

Ad

Ad

Ad

Ad

Ad

Ad

CARDBOARD VR: BUILDING
LOW COST VR EXPERIENCES
Mark Billinghurst
mark.billinghurst@unisa.edu.au
April 14th 2016
CHIuXiD

What You Will Learn
• Virtual Reality Fundamentals + History
• How to Build Cardboard VR Viewer
• Example Cardboard VR App...

VIRTUAL REALITY

Virtual Reality
Computer generated multi-sensory simulation of an
artificial environment that is interactive and immersive.

David Zeltzer’s AIP Cube
! Autonomy – User can to
react to events and stimuli.
! Interaction – User can
interact with obje...

Key Technologies
• Autonomy
•  Head tracking, body input
•  Intelligent systems
• Interaction
•  User input devices, HCI
•...

Early Experimenters (1950’s – 80’s)
Helig 1956
Sutherland 1965
Furness 1970’s

The First Wave (1980’s – 90’s)
NASA 1989
VPL 1990’s
Virtuality 1990’s

Jaron Lanier
•  Founded VPL, coined term “Virtual Reality”

Desktop VR - 1995
•  Expensive - $150,000+
•  2 million polys/sec
•  VGA HMD – 30 Hz
•  Magnetic tracking

Second Wave (2010 - )
• Palmer Luckey
•  HMD hacker
•  Mixed Reality Lab (MxR)
• Oculus Rift (2011 - )
•  2012 - $2.4 mill...

•  sddg

Oculus Rift
Sony Morpheus
HTC/Valve Vive
2016 - Rise of Consumer HMDs

Desktop VR 2016
• Graphics Desktop
•  $1,500 USD
•  >4 Billion poly/sec
• $600 HMD
•  1080x1200, 90Hz
• Optical tracking
•...

https://immersivelifeblog.files.wordpress.com/2015/04/vr_history.jpg

Market Size

Computer Based vs. Mobile VR

Mobile VR
CPU: 300 Mhz
HDD; 9GB
RAM: 512 mb
Camera: VGA 30fps
Graphics: 500K poly/sec
1998: SGI O2 2008: Nokia N95
CPU: 33...

Mobile Phone AR & VR
• Mobile Phone AR
• Mobile phone
• Live camera view
• Senor input (GPS, compass)
• Mobile Phone VR
• ...

VR2GO (2013)
•  MxR Lab
•  3D print VR viewer for mobiles
•  Open source hardware + software
•  http://projects.ict.usc.ed...

Multiple Mobile VR Viewers Available

•  zxcvz

CARDBOARD VR

•  dsfsaf

Google Cardboard
• Released 2014 (Google 20% project)
• >5 million shipped/given away
• Easy to use developer tools
+ =

Cardboard
($2)
Lenses
($10)
Magnets
($6)
Velcro
($3)
Rubber
Band
(1¢)
Software
Components

Assembling the Cardboard Viewer

Version 1.0 vs Version 2.0
•  Version 1.0 – Android focused, magnetic switch, small phone
•  Version 2.0 – Touch input, iO...

Many Different Cardboard Viewers

SAMPLE CARDBOARD
APPLICATIONS

Cardboard App
• 7 default experiences
•  Earth: Fly on Google Earth
•  Tour Guide: Visit sites with guides
•  YouTube: Wat...

100’s of Google Play Cardboard apps

Sample Applications

Cardboard Camera
• Capture 360 panoramas
• Stitch together images on phone
• View in VR on Cardboard

Google Expeditions
• Teacher led VR experiences
• https://www.google.com/edu/expeditions/

Building Your Own Application
• Cardboard Viewer
•  https://www.google.com/get/cardboard/
• Smart phone
•  Android/iOS
• C...

Cardboard SDK

Features:
1.  Lens distor-on correc-on.
2.  Head tracking.
3.  3D calibra-on.
4.  Side-by-side renderi...

INTRODUCTION TO UNITY

Unity 3D Game Editor

SETUP

Download and Install
•  Go to unity3d.com/download
•  Use Download Assistant – pick components you want

Getting Started
•  First time running Unity you’ll be asked to create a project
•  Specify project name and location
•  Ca...

Unity Interface
•  Toolbar, Scene, Hierarchy, Project, Inspector

Customizable Interface

Building Scenes
• Use GameObjects:
•  Containers that hold different components
•  Eg 3D model, texture, animation
• Use I...

GameObjects
•  Every object in Scene is a GameObject
•  GameObjects contain Components
•  Eg Transform Component, Camera C...

Adding 3D Content
•  Create 3D asset using modeling package, or download
•  Fbx, Obj file format for 3D models
•  Add file...

Positioning/Scaling Objects
•  Click on object and choose transform

Unity Asset Store
•  Download thousands models, scripts, animations, etc
•  https://www.assetstore.unity3d.com/

UNITY BASICS

Making a Simple Scene
1.  Create New Project
2.  Create Game Object
3.  Moving main camera position
4.  Adding lights
5.  ...

CreateProject
•  Create new folder and project

New Empty Project

Create GameObject
•  Load a Sphere into the scene
•  GameObject -> 3D Object -> Sphere

Moving main camera
•  Select Main Camera
•  Select translate icon
•  Move camera

Add Light
•  GameObject -> Light -> Directional Light
•  Use inspector to modify light properties (colour, intensity)

Add Physics
•  Select Sphere
•  Add Rigidbody component
•  Add Component -> Physics -> RigidBody
•  or Component -> Physic...

Add More Objects
•  Add several cubes
•  GameObject -> 3D Object – Cube
•  Move cube
•  Add Rigid Body component (uncheck ...

Add Material
•  Assets -> Create -> Material
•  Click Albedo colour box in inspector
•  Select colour
•  Drag asset onto o...

Add Script
•  Assets -> Create -> C# script
•  Edit script using Mono
•  Drag script onto Game Object

Example C# Script
GameObject Rotation
using UnityEngine; 
using System.Collections; 
 
public class spin : MonoBehaviour {...

Scripting C# Unity 3D
•  void Awake():
•  Is called when the first scene is loaded and the game object is active
•  void S...

Final Spinning Cube Scene

Resources
• Unity Main site
• http://www.unity3d.com/
• Holistic Development with Unity
• http://holistic3d.com
• Official...

IMMERSIVE PANORAMAS

Steps
1.  Create a new project
2.  Load the Cardboard SDK
3.  Load a panorama image asset
4.  Create a Skymap
5.  Add to V...

New Project

Load Cardboard SDK
•  Assets -> Import Package -> Custom Package
•  Navigate to CardboardSDKForUnity.unitypackage
•  Unche...

Load Cardboard Main Camera
•  Drag CardboardMain prefab into Hierarchy
•  Assets -> Cardboard -> Prefab
•  Delete CameraMa...

Panorama Image Asset
•  Find/create suitable panorama image
•  Ideally 2K or higher resolution image
•  Google “Panorama I...

Add Image Asset to Project
•  Assets -> Import Asset
•  Select desired image
•  Set Texture Type to
Cubemap
•  Set mapping...

Create Skybox Material
•  Assets -> Create -> Material
•  Name material
•  Set Shader to Skybox -> Cubemap
•  Drag texture...

Create Skybox
•  Window -> Lighting
•  Drag Skybox material into
Skypebox form

Panorama Image in Unity

One Last Thing..
•  CardboardMain -> Head -> Main Camera
•  Set Clear Flags to Skybox

Test It Out
•  Hit play, use alt/option key + mouse to look around

Deploy to Mobile (Android)
1.  Plug phone into USB
• make sure device in debug mode
2.  Set correct build settings
3.  Pla...

Deploying to Phone
1.  Plug phone into USB
2.  Open Build Settings
3.  Change Target platform to Android
4.  Resolution an...

Running on Phone
•  Droid@Screen View on Desktop

CREATING 3D
ENVIRONMENTS

Key Steps
1.  Creating a new project
2.  Load Cardboard SDK
3.  Replace camera with CardboardMain
4.  Loading in 3D asset ...

New Project
•  Camera replaced with CameraMain

Download Model Package
•  Magic Lamp from 3dFoin
•  Search on Asset store

Load Asset + Add to Scene
•  Assets -> Import Package -> Custom Package
•  Look for MagicLamp.unitypackage (If not install...

Import SkySphere package
•  SkySphere Volume1 on Asset store

Add SkySphere to Scene
•  Drag Skyball_WithoutCap into Hierarchy
•  SkySphere_V1 -> Meshes
•  Rotate and Scale as needed

Add Ground Plane
•  GameObject -> 3D Object -> Plane
•  Set Scale X to 2.0, Z to 2.0

Testing View
•  Use alt/option key plus mouse to rotate view

Adding More Assets
•  Load from Asset store – look for free assets

ADDING INTERACTIVITY

Adding Movement
Goal: Move in direction user looking when
Cardboard Button pressed.
• Key Steps
1.  Start with static scre...

Static Scene

Create Movement Script
•  Add new script object
•  Assets -> Create -> C# Script
•  Edit script in Mono

Add Script to Scene
•  Drag Script onto Head object
•  CameraboardMain -> Head
•  Uncheck Track Position Box
•  Adjust mov...

Adding More Interactivity
•  Load Cardboard Demo application
•  Assets -> Import Package -> Custom Package
•  Load Cardboa...

Features Shown
•  Gaze reticle + selection
•  Viewpoint teleportation
•  Menu panel overlay
•  Audio feedback
•  Event sys...

DESIGN GUIDELINES

Google Design Guidelines
• Google’s Guidelines for good VR experiences:
•  Physiological Considerations
•  Interactive Pat...

Physiological Considerations
• Factors to Consider
•  Head tracking
•  User control of movement
•  Use constant velocity
•...

Interactive Patterns - Setup
• Setup factors to consider:
• Entering and exiting
• Headset adaptation
• Full Screen mode
•...

Interactive Patterns - Controls
• Use fuze buttons for selection in VR

Interactive Patterns - Feedback
• Use audio and haptic feedback
•  Reduce visual overload
•  Audio alerts
•  3D spatial so...

Interactive Patterns - Display Reticle
•  Easier for users to target objects with a display reticle
•  Can display reticle...

Cardboard Design Lab Application
•  Use Cardboard Design Lab app to explore design ideas

CONCLUSION

Conclusion
• Virtual Reality industry starting to boom again
• Google Cardboard provides a great entry for VR
•  Consumer ...

RESOURCES

Useful Resources
•  Google Cardboard main page
•  https://www.google.com/get/cardboard/
•  Developer Website
•  https://ww...

www.empathiccomputing.org
@marknb00
mark.billinghurst@unisa.edu.au

Share Slideshare

LinkedIn
Facebook
Twitter

Embed

Size (px)

Show related Slideshows at end

WordPress Shortcode

Link

Share
Email

Virtual Reality by Dom Cushnan 3651 views
Virtual Shopping by Dinesh Mv 1694 views
Virtual stores the future of retail by Bharat Bharadwaj 16009 views
Extending the Virtual World Framewo... by Ronald Punako, Jr. 1389 views
Hybrid-Realities: Merging real and ... by Nils Pokel 1337 views
HTC Vive, FOVE, Playstation VR and ... by Richard Hoffmann 1011 views

View on Slideshare

1 of 112 Ad

View on Slideshare

1 of 112 Ad