Upgrade to Pro — share decks privately, control downloads, hide ads and more …

UI in VR

UI in VR

If you were working a VR food truck, how would you let the simulation know you were ready to leave? Try to walk out the door? Look for a “exit” button? In Job Simulator, you take a bite out of a burrito labeled “quit” - twice to confirm your choice. It’s just one of many ways designers are experimenting with UI design in VR.

In this talk, Senior UX Instructor Nick Anderson will explore the Wild West of VR UI design, from simple floating interfaces to true-to-life, fully integrated experiences. We’ll look at indications of where we can expect these trends to go next, and how it will impact the jobs of UX Designers. Finally, we’ll explore how gamification design plays a role in simulated experiences.


Nick Anderson

August 12, 2019


  1. UI in VR! UI in VR! By Nick Anderson

  2. Hi, I’m Nick • Distinguished Faculty at General Assembly Denver

    • UX Product Advisory Board Chair for GA Internationally • Co-Founder and Senior Lead Dad to his daughter Quinn, alongside his wife Katy and their two cats Gin and Tonic
  3. Also, I fucking love VR! I fucking love VR!

  4. Reasons VR IS cool #1

  5. Reasons VR IS cool #2 It opens up a completely

    new paradigm for design.
  6. Affordances & Heuristics Affordances & Heuristics But First: Plus a

    brief recap of the industrial revolution and better living in postwar america
  7. None
  8. Affordance Intrinsically obvious, does not need instruction

  9. Heuristic Not immediately obvious, must be learned

  10. ONe Big Problem . . .

  11. None
  12. None
  13. None
  14. None
  15. None
  16. OH hell yeah Better Materials + Easier Manufacturing = Better

  17. None
  18. None
  19. None
  20. ??????? ???????

  21. Affordances - No tangible interface - Mouse use has to

    be learned - No obvious points of interaction X X Heuristics - No relatable previous experience - No familiar patterns - No understanding of what it does, or how (except for power users)
  22. None

  24. fucking VR! fucking VR! But Then . . .


  26. Southern Metropolitan District of Heuristics

  27. None

  29. JK

  30. None
  31. I’ll have the uh . . . Plasma Rifle with

    the Large flaming demon. Hold the grenades.
  32. None
  33. None
  34. DESIGNED for Immersion But only When the UI is Designed

    for Immersion Immersion Immersion VR Can offer
  35. 1902:

  36. 1962: (60 years of Iteration)

  37. 2008: (106 years of Iteration)

  38. Goals: - Present seamless immersion - Require little to no

    learning curve from users Blockers: - Current design patterns are lacking - Exploring new patterns is time-consuming and expensive
  39. THE PROBLEM: VR is leaning on previous design patterns Game

    Menu UI Cinematic Camera Blocking
  40. THE Solution: Create a UI design standard for VR

  41. THE Solution: Create a UI design standard for VR In

    less than 106 years
  42. What we can do now: Observe use cases to Identify

    Good and BAD patterns
  43. Heuristic Evaluation #1 Subject: Rob Anderson (Dad) Age: 66 Notable

    conditions: • Severe Rheumatoid Arthritis Game: Superhot Gaming Experience: N00b
  44. TASK: Start Game (Insert floppy disk)

  45. None
  46. Floppy not obviously interactable Interaction blocked by wonky Camera X

  47. AFFORDANCES - Without FULL BODY integration, it can be hard

    to find affordances. X HEURISTICS - VR recreates PHYSICAL spaces that can be designed to be familiar
  48. I.e. - “Can I touch that?”

  49. None
  50. None
  51. None
  52. None
  53. Normal Heuristics resumed after prompt (and Camera Fix) Haptic Feedback

    reinforced decision
  54. TASK: Start Game (Insert floppy disk) Start game (Put on

  55. None
  56. Some Heuristics are dead ends X

  57. Heuristics can override Instruction X

  58. DESIGN Insight #1 Anticipate Familiar heuristics Embrace them or Subvert

    them LOUDLY DESIGN Insight #1
  59. Embrace:

  60. Loud Subvert: Use headset above pls

  61. None
  62. Heuristic Evaluation #2 Subject: Jeff Payne Age: 40 Notable conditions:

    • Easily Frustrated • 5 Bourbons deep Game: Job Simulator & Beat Saber Gaming Experience: Stopped at Resident Evil
  63. Task: Make a sandwich

  64. None
  65. Don’t tell me what to do User action is skewed

    in a consequence-free environment X X
  66. None
  67. None
  68. X

  69. DESIGN Insight #2 RELY ON Experimentation AS A CORE MECHANIC

    DESIGN Insight #2
  70. RELY ON Experimentation AS A CORE MECHANIC VR requires users

    to rediscover affordances & heuristics Users discover by “doing”, SO: Create a forgiving, consequence-free environment, - OR - Give strong indication on how actions will affect the world
  71. None
  72. Embrace Familiar Heuristics + Anticipate Experimentation Embrace Familiar Heuristics Anticipate

  73. Integrated UI! Integrated UI!

  74. None
  75. None
  76. None
  77. None
  78. “Anything you see, you should be able to interact with

    And touch the way you think you could” “Anything you see, you should be able to interact with And touch the way you think you could” - An actual VR Design Pattern
  79. X

  80. How can I Do this?! Seriously I want to design

    for VR How can I do this?!
  81. Frameworks - Designing for VR: A Beginners Guide by Blake

    Hudelson 1. Mozilla A-Frame is for Web VR and can be used platforms such as Google Cardboard, Samsung Gear, and Oculus Rift 2. Daydream VR is for midrange VR and works with mobile phones only 3. Unity VR/Unreal SDK are for high end headsets including Oculus Rift, HTC Vive, and HoloLens (AR).
  82. Design software 1. ¯\_(ツ)_/¯

  83. - Alex Schwartz, CEO of Owlchemy Labs “You can never

    know how good something’s going to be in VR until you try it out with a headset, with your hands, and it either clicks or it doesn’t. That means the fastest you can iterate is the best for development. We’re not going to sit down and write a [game design document], because it’s going to be wrong. We just try it out in VR.”
  84. Resources 1. https://www.uxofvr.com/ 2. https://www.invisionapp.com/inside-design/vr-interface-design/ 3. https://blog.marvelapp.com/designing-vr-beginners-guide/ 4. https://medium.com/startup-grind/4-things-i-learned-designing-user-interface s-for-vr-cc08cac9e7ec

    5. https://designguidelines.withgoogle.com/cardboard/designing-for-google-cardb oard/a-new-dimension.html
  85. None
  86. That’s IT! THat’s it! THanks for listening to me talk

    Questions, comments, want to hear me talk more? Nick.anderson.r@gmail.com