This is compilation of the my learning, experience and online study while Designing interfaces for Virtual Reality applications

1. Design for
Virtual Reality (VR)
Kumar Ahir Jan18
@kernel_kumar
www.kumarahir.com

2. since 2008 ...
Interaction Design, IDC
MahaWar - strategy board game
OoBI alpha - first multitouch
OoBI - Out of Box Interactions –
www.oobi.in
Exit to PropTiger
now...
Brief walkthrough
Twitter: @kernel_kumar
www.kumarahir.com
kumar.ahir@gmail.com

3. Am entrepreneur now bit selfish
Evangelize VR
Design inferences
Get ideas
Increase product reach
“2018 - Investing in talking to people”

6. Why Design for VR?

7. Gartner Hype cycle

8. Immersive
interface - future

9. It’s going to be super hot
Investments
Products
Hardware
Low entry barrier

10. Why should DESIGNERs pay attention ?
It’s still undefined - nanscent and evolving
not boxes and arrows in flat screen - Designing real space
It’s about real immersive interaction - the UX
Not just window to digital world but THE WORLD
No more fiction - It’s real in your hands as Native mobile apps - increasing
Is it different than current UI design? Will find out

11. Why should DESIGNERS pay attention ?
if you currently own a smartphone
chances are, you are already carrying a virtual reality
device in your pocket

12. What is VR?

13. https://www.seevividly.com/info/Virtual_Reality/VR_and_Human_Vision
Physiology of eyes
The human lens bends light
varying on the distance of an object

14. https://www.seevividly.com/info/Virtual_Reality/VR_and_Human_Vision

15. VR Concepts
FOV
Latency
DOF
Input/Interaction

16. Industry landscape

17. 32000 years old
Early traces of VR

19. Early days
Bulky
Latency
Field of View - FOV
Cost
Enterprise only
Specialized operations
1955 1961 1961 1995
Color limitations
Ergonomics

20. Oculus 2012 - Kickstarter project
Wider FOV
Low Latency
Consumer
Low Cost

22. Google Cardboard - 2014 - pet project
Proto version
Mobile VR
Quick fix
< Rs. 500

23. VR headsets
Sony
HTC Vive
Oculus rift
Google Daydream - Lenovo Pico
Samsung Gear VR
Google Cardboard
standalone

24. Companies and investments
Facebook
Google
HTC
Microsoft
Samsung
Sony
Nvidia, Intel
~ $ 800mn in 2017 Q2
~ $ 3bn till date
~ $ 5bn in 2018
Source: Digi Capita

25. VR Market
Gaming
Healthcare
Engineering
Live Events
Video
Real estate
Retail
Military
Education
Goldman Sachs forecast for 2025

26. VR content market
Video posts have 135%
greater organic reach
than photo posts
People spend 3x longer
watching video which is
Live compared to video
which is no longer Live
https://medium.com/omnivirt/360-video-vr-performance-statistics-from-1000-campaigns-2f7343ecfe13
https://www.socialmediatoday.com/marketing/top-5-facebook-video-statistics-
2016-infographic

27. Why so hot?
View Hardware prices have gone down drastically
360 Capture hardware growth
H/W capable of delivering high quality output - UX
Low cost hardware
Portable - mobile phones
Platform and frameworks utilizing h/w capabilities
IMMERSIVE

28. VR Design fundas

29. Context Users Goals
Design Process
Experience
Immersion
Learning
Explore
Media
Gamers
Enterprise
Entertainment
Gaming
Healthcare
Automotive
Manufacturing
Design
user personas, conceptual flows, wireframes, an interaction model

30. Digital Designer
for
Real Space

31. What are you designing
Controls or Space

32. Design elements
Units - not pixels but cm, inch, feet, m
Dimension - x,y,z - near and far
Peripheral vision
Typography - legibility
Shape vs volume
User Point of reference - stationary vs moving
Seated vs Standing interaction
Spatial sound/audio
Ergonomics - physiological, environment
contd...

33. Design elements
Motion
Input controls - internal, external
Environment - skybox - background
Hover is back

34. Units
https://virtualrealitypop.com/practical-vr-ce80427e8e9d
Recticle -> Head -> Body
They are in cm, m, in, ft and degrees
NOT PIXELS
Screens are fixed distance and area
Immersive world has depth

37. Dimensions
X, y, z

38. Peripheral vision
Design of notifications
Stationary controls - HUD

39. Typography
Avoid showing text on white and translucent
backgrounds
Minimum readable size for the font in VR is height
of 2.32cm on the distance of one meter
Recommended size of the font is height of 6.04cm
on the distance of one meter
Try
https://coob113.github.io/font_test/size.html

40. Shape vs Volume

41. Point of reference
Stationary MovingControls placement
2d Layout vs 3d object placements
Interactive elements - near and far
Movement
Framing the content
Ground the user

42. Seated vs Standing vs Movement

43. Motion
Avoid lateral motion with close/large objects, and at high speeds
Avoid fast motion toward the user
Be careful about moving the user

44. Audio/Sound
Spatial audio is a key ingredient for true immersion,
making the design process around sound absolutely essential

45. Ergonomics
Physiological
Surrounding
Eyes
Eye
Hand - Fingers
Body

46. Input controls
Reticle - Head

47. Input controls
HMD switch

48. Input controls
controllers

49. Input controls
Hands
Leap motion

50. Environment
Skybox
3d objects

51. Hover is back

52. Googles’ design guidelines for VR
1. Using a Reticle
2. UI Depth & Eye Strain
3. Using Constant Velocity
4. Keeping the User Grounded
5. Maintaining Head Tracking
6. Guiding with Light
7. Leveraging Scale
8. Spatial Audio
9. Gaze Cues
10. Make it Beautiful

53. In the age of
digital tools for
design and
prototyping
We are going to
use paper
wireframing

54. Paper wireframing

55. Let’s design
Real Space

56. Volodymyr Kurbatov

60. Design Exercise

61. Let’s create a paper wireframe
Personal Website
Image gallery - browsing
Music player - playback
WebVR
Low Fi proto - cardboard

62. My co-ordinates
kumar.ahir@gmail.com
@kernel_kumar

63. VR design resources
https://www.uxofvr.com/
https://sizecalc.com/
Daydream - VR Design process - https://www.youtube.com/watch?v=-
mcXAMDch7s

64. Riding on shoulders of GIANTS
https://medium.com/inborn-experience/vr-ar-prototyping-for-everyone-ea6fb8f159b5
https://www.slideshare.net/robinmedelange/virtual-reality-history-state-of-the-art
https://www.webpagefx.com/data/why-virtual-reality-matters-to-marketing/
https://developers.google.com/vr/distribute/daydream/design-requirements
https://www.smashingmagazine.com/2017/02/getting-started-with-vr-interface-design/
https://www.linkedin.com/pulse/ux-virtual-reality-designing-interfaces-without-prashanth-shanmugam
https://medium.com/omnivirt/360-video-vr-performance-statistics-from-1000-campaigns-2f7343ecfe13
http://mediakix.com/2016/08/facebook-video-statistics-everyone-needs-know/#gs.8qmE7vE
http://realityshift.io/
Uploadvr.com
Roadtovr.com
https://medium.com/@V_Kurbatov
https://virtualrealitypop.com/practical-vr-ce80427e8e9d
https://medium.com/aol-alpha/making-sense-of-skyboxes-in-vr-design-3e9f8fe254d3
https://www.slideshare.net/AugmentedWorldExpo/john-howard-loook-inc-uxui-design-for-vr-and-mixed-reality
https://medium.com/@LeapMotion/vr-design-best-practices-bb889c2dc70
https://www.upwork.com/hiring/for-clients/beginners-guide-to-designing-virtual-reality/