Download as PDF, PPTX
Uploaded byMark Billinghurst
Cardboard VR: Building Low Cost VR Experiences
The document discusses building low-cost virtual reality (VR) experiences using Google Cardboard. It provides an overview of VR fundamentals and history. It then explains how to build a Cardboard VR viewer and develop basic Cardboard VR applications using tools like Unity. Examples are given of panoramic and 3D VR scenes that can be created. Guidelines are also provided for adding interactivity and following Google's design specifications for Cardboard applications.
More Related Content
Similar to Cardboard VR: Building Low Cost VR Experiences
Cardboard VR: Building Low Cost VR Experiences
- 1. CARDBOARD VR: BUILDING LOWCOST VR EXPERIENCES Mark Billinghurst mark.billinghurst@unisa.edu.au April 14th 2016 CHIuXiD
- 2. What You WillLearn • Virtual Reality Fundamentals + History • How to Build Cardboard VR Viewer • Example Cardboard VR Applications • Basics of Unity Programming • How to Make Panorama VR Applications • How to Create VR Scenes • How to Add Interactivity to VR Applications • Cardboard Design guidelines
- 3.
- 4. Virtual Reality Computer generatedmulti-sensory simulation of an artificial environment that is interactive and immersive.
- 6. David Zeltzer’s AIPCube ! Autonomy – User can to react to events and stimuli. ! Interaction – User can interact with objects and environment. ! Presence – User feels immersed through sensory input and output channels Interaction Autonomy Presence VR Zeltzer, D. (1992). Autonomy, interaction, and presence. Presence: Teleoperators & Virtual Environments, 1(1), 127-132.
- 7. Key Technologies • Autonomy • Headtracking, body input • Intelligent systems • Interaction • User input devices, HCI • Presence • Graphics/audio/multisensory output • Multisensory displays • Visual, audio, haptic, olfactory, etc
- 8. Early Experimenters (1950’s– 80’s) Helig 1956 Sutherland 1965 Furness 1970’s
- 9. The First Wave(1980’s – 90’s) NASA 1989 VPL 1990’s Virtuality 1990’s
- 10. Jaron Lanier • FoundedVPL, coined term “Virtual Reality”
- 11. Desktop VR -1995 • Expensive - $150,000+ • 2 million polys/sec • VGA HMD – 30 Hz • Magnetic tracking
- 12. Second Wave (2010- ) • Palmer Luckey • HMD hacker • Mixed Reality Lab (MxR) • Oculus Rift (2011 - ) • 2012 - $2.4 million kickstarter • 2014 - $2B acquisition FaceBook • $350 USD, 110o FOV
- 13.
- 14. Oculus Rift Sony Morpheus HTC/ValveVive 2016 - Rise of Consumer HMDs
- 15. Desktop VR 2016 • GraphicsDesktop • $1,500 USD • >4 Billion poly/sec • $600 HMD • 1080x1200, 90Hz • Optical tracking • Room scale
- 16.
- 17.
- 18. Computer Based vs.Mobile VR
- 19. Mobile VR CPU: 300Mhz HDD; 9GB RAM: 512 mb Camera: VGA 30fps Graphics: 500K poly/sec 1998: SGI O2 2008: Nokia N95 CPU: 332 Mhz HDD; 8GB RAM: 128 mb Camera: VGA 30 fps Graphics: 2m poly/sec
- 20. Mobile Phone AR& VR • Mobile Phone AR • Mobile phone • Live camera view • Senor input (GPS, compass) • Mobile Phone VR • Mobile phone • Senor input (compass) • Additional VR viewer
- 21. VR2GO (2013) • MxRLab • 3D print VR viewer for mobiles • Open source hardware + software • http://projects.ict.usc.edu/mxr/diy/vr2go/
- 22. Multiple Mobile VRViewers Available
- 23.
- 24.
- 25.
- 26. Google Cardboard • Released 2014(Google 20% project) • >5 million shipped/given away • Easy to use developer tools + =
- 27.
- 28. Assembling the CardboardViewer
- 29. Version 1.0 vsVersion 2.0 • Version 1.0 – Android focused, magnetic switch, small phone • Version 2.0 – Touch input, iOS/Android, fits many phones
- 30. Many Different CardboardViewers
- 31.
- 32. Cardboard App • 7 defaultexperiences • Earth: Fly on Google Earth • Tour Guide: Visit sites with guides • YouTube: Watch popular videos • Exhibit: Examine cultural artifacts • Photo Sphere: Immersive photos • Street View: Drive along a street • Windy Day: Interactive short story
- 33. 100’s of GooglePlay Cardboard apps
- 34.
- 35. Cardboard Camera • Capture 360panoramas • Stitch together images on phone • View in VR on Cardboard
- 36. Google Expeditions • Teacher ledVR experiences • https://www.google.com/edu/expeditions/
- 37. Building Your OwnApplication • Cardboard Viewer • https://www.google.com/get/cardboard/ • Smart phone • Android/iOS • Cardboard SDK • iOS, Android, Unity • https://developers.google.com/cardboard/ • Unity game engine (optional) • https://unity3d.com • Content
- 38. Cardboard SDK Features: 1. Lens distor-on correc-on. 2. Head tracking. 3. 3D calibra-on. 4. Side-by-side rendering. 5. Stereo geometry configura-on. 6. User input event handling. Unity Cardboard SDK
- 39.
- 41. Unity 3D GameEditor
- 42.
- 43. Download and Install • Go to unity3d.com/download • Use Download Assistant – pick components you want
- 44. Getting Started • Firsttime running Unity you’ll be asked to create a project • Specify project name and location • Can pick asset packages (pre-made content)
- 45. Unity Interface • Toolbar,Scene, Hierarchy, Project, Inspector
- 46.
- 47. Building Scenes • Use GameObjects: • Containers that hold different components • Eg 3D model, texture, animation • Use Inspector • View and edit object properties and other settings • Use Scene View • Position objects, camera, lights, other GameObjects etc • Scripting • Adding interaction, user input, events, etc
- 48. GameObjects • Every objectin Scene is a GameObject • GameObjects contain Components • Eg Transform Component, Camera Component
- 49. Adding 3D Content • Create 3D asset using modeling package, or download • Fbx, Obj file format for 3D models • Add file to Assets folder in Project • When project opened 3D model added to Project View • Drag mesh from Project View into Hierarchy or Scene View • Creates a game object
- 50. Positioning/Scaling Objects • Clickon object and choose transform
- 51. Unity Asset Store • Download thousands models, scripts, animations, etc • https://www.assetstore.unity3d.com/
- 52.
- 53. Making a SimpleScene 1. Create New Project 2. Create Game Object 3. Moving main camera position 4. Adding lights 5. Adding more objects 6. Adding physics 7. Changing object materials 8. Adding script behaviour
- 54. CreateProject • Create newfolder and project
- 55.
- 56. Create GameObject • Loada Sphere into the scene • GameObject -> 3D Object -> Sphere
- 57. Moving main camera • Select Main Camera • Select translate icon • Move camera
- 58. Add Light • GameObject-> Light -> Directional Light • Use inspector to modify light properties (colour, intensity)
- 59. Add Physics • SelectSphere • Add Rigidbody component • Add Component -> Physics -> RigidBody • or Component -> Physics -> RigidBody • Modify inspector properties (mass, drag, etc)
- 60. Add More Objects • Add several cubes • GameObject -> 3D Object – Cube • Move cube • Add Rigid Body component (uncheck gravity)
- 61. Add Material • Assets-> Create -> Material • Click Albedo colour box in inspector • Select colour • Drag asset onto object to apply
- 62. Add Script • Assets-> Create -> C# script • Edit script using Mono • Drag script onto Game Object
- 63. Example C# Script GameObjectRotation using UnityEngine; using System.Collections; public class spin : MonoBehaviour { // Use this for initialization void Start () { } // Update is called once per frame void Update () { this.gameObject.transform.Rotate(Vector3.up*10); } } #
- 64. Scripting C# Unity3D • void Awake(): • Is called when the first scene is loaded and the game object is active • void Start(): • Called on first frame update • void FixedUpdate(): • Called before physics calculations are made • void Update(): • Called every frame before rendering • void LateUpdate(): • Once per frame after update finished
- 65. Final Spinning CubeScene
- 66. Resources • Unity Main site • http://www.unity3d.com/ • HolisticDevelopment with Unity • http://holistic3d.com • Official Unity Tutorials • http://unity3d.com/learn/tutorials • Unity Coder Blog • http://unitycoder.com
- 67.
- 68. Steps 1. Create anew project 2. Load the Cardboard SDK 3. Load a panorama image asset 4. Create a Skymap 5. Add to VR scene 6. Deploy to mobile phone
- 69.
- 70. Load Cardboard SDK • Assets -> Import Package -> Custom Package • Navigate to CardboardSDKForUnity.unitypackage • Uncheck iOS (for Android build)
- 71. Load Cardboard MainCamera • Drag CardboardMain prefab into Hierarchy • Assets -> Cardboard -> Prefab • Delete CameraMain
- 72. Panorama Image Asset • Find/create suitable panorama image • Ideally 2K or higher resolution image • Google “Panorama Image Cubemap”
- 73. Add Image Assetto Project • Assets -> Import Asset • Select desired image • Set Texture Type to Cubemap • Set mapping to Latitude- Longitude (Cylindrical)
- 74. Create Skybox Material • Assets -> Create -> Material • Name material • Set Shader to Skybox -> Cubemap • Drag texture to cubemap
- 75. Create Skybox • Window-> Lighting • Drag Skybox material into Skypebox form
- 76. Panorama Image inUnity
- 77. One Last Thing.. • CardboardMain -> Head -> Main Camera • Set Clear Flags to Skybox
- 78. Test It Out • Hit play, use alt/option key + mouse to look around
- 79. Deploy to Mobile(Android) 1. Plug phone into USB • make sure device in debug mode 2. Set correct build settings 3. Player settings • Other settings • Set Bundle Idenitfier -> com.Company.ProductName • Resolution and Presentation • Default Orientation -> Landscape Left 4. Build and run
- 80. Deploying to Phone 1. Plug phone into USB 2. Open Build Settings 3. Change Target platform to Android 4. Resolution and Presentation • Default Orientation -> Landscape Left 5. Under Player Settings • Edit Bundle Identifier – eg com.UniSA.cubeTest • Minimum API level 6. Build and Run • Select .apk file name
- 81. Running on Phone • Droid@Screen View on Desktop
- 82.
- 83. Key Steps 1. Creatinga new project 2. Load Cardboard SDK 3. Replace camera with CardboardMain 4. Loading in 3D asset packages 5. Loading a SkyDome 6. Adding a plane floor
- 84. New Project • Camerareplaced with CameraMain
- 85. Download Model Package • Magic Lamp from 3dFoin • Search on Asset store
- 86. Load Asset +Add to Scene • Assets -> Import Package -> Custom Package • Look for MagicLamp.unitypackage (If not installed already) • Drag MagicLamp_LOD0 to Hierarchy • Position and rotate
- 87. Import SkySphere package • SkySphere Volume1 on Asset store
- 88. Add SkySphere toScene • Drag Skyball_WithoutCap into Hierarchy • SkySphere_V1 -> Meshes • Rotate and Scale as needed
- 89. Add Ground Plane • GameObject -> 3D Object -> Plane • Set Scale X to 2.0, Z to 2.0
- 90. Testing View • Usealt/option key plus mouse to rotate view
- 91. Adding More Assets • Load from Asset store – look for free assets
- 92.
- 93. Adding Movement Goal: Movein direction user looking when Cardboard Button pressed. • Key Steps 1. Start with static screen 2. Create movement script 3. Add movement script to Camera head 4. Deploy to mobile
- 94.
- 95. Create Movement Script • Add new script object • Assets -> Create -> C# Script • Edit script in Mono
- 96. Add Script toScene • Drag Script onto Head object • CameraboardMain -> Head • Uncheck Track Position Box • Adjust movement speed
- 97. Adding More Interactivity • Load Cardboard Demo application • Assets -> Import Package -> Custom Package • Load CardboardDemoForUnity.unitypackage • Launch Demo Scene • Assets -> Cardboard -> DemoScene
- 98. Features Shown • Gazereticle + selection • Viewpoint teleportation • Menu panel overlay • Audio feedback • Event system
- 99.
- 100. Google Design Guidelines • Google’sGuidelines for good VR experiences: • Physiological Considerations • Interactive Patterns • Setup • Controls • Feedback • Display Reticle • From http://www.google.com/design/spec-vr/designing- for-google-cardboard/a-new-dimension.html
- 101. Physiological Considerations • Factors toConsider • Head tracking • User control of movement • Use constant velocity • Grounding with fixed objects • Brightness changes
- 102. Interactive Patterns -Setup • Setup factors to consider: • Entering and exiting • Headset adaptation • Full Screen mode • API calls • Indicating VR apps
- 103. Interactive Patterns -Controls • Use fuze buttons for selection in VR
- 104. Interactive Patterns -Feedback • Use audio and haptic feedback • Reduce visual overload • Audio alerts • 3D spatial sound • Phone vibrations
- 105. Interactive Patterns -Display Reticle • Easier for users to target objects with a display reticle • Can display reticle only when near target object • Highlight objects (e.g. with light source) that user can target
- 106. Cardboard Design LabApplication • Use Cardboard Design Lab app to explore design ideas
- 107.
- 109. Conclusion • Virtual Reality industrystarting to boom again • Google Cardboard provides a great entry for VR • Consumer hardware • Cheap/free viewer • Industry standard game engine • High quality content • Many tutorials/learning resources • The time to get started is now!
- 110.
- 111. Useful Resources • GoogleCardboard main page • https://www.google.com/get/cardboard/ • Developer Website • https://www.google.com/get/cardboard/developers/ • Building a VR app for Cardboard • http://www.sitepoint.com/building-a-google-cardboard-vr-app-in-unity/ • Creating VR game for Cardboard • http://danielborowski.com/posts/create-a-virtual-reality-game-for- google-cardboard/ • Moving in VR space • http://www.instructables.com/id/Prototyping-Interactive-Environments- in-Virtual-Re/
- 112.