Virtual Pioneers Part 2: Beyond Buttons

Designing Interactions in VR

This is Part 2 in our series: Virtual Pioneers. Check out the introduction to the series and Part 1: Creating Magic with Layout.

Rectangular buttons make sense on rectangular screens, but what happens when the screen becomes a limitless sphere that surrounds you? While we can safely assume users will quickly adapt to the ‘point-and-click’ model, this is virtual reality — it’s time to explore beyond the button! Without a tried-and-true interaction language for VR the urge is to fall back on familiar paradigms in order to help people navigate a new experience. We can do better.

My Beef with Buttons in VR

1. Precise hit targets are difficult with imprecise inputs (controllers or head gaze).
2. Buttons clutter the interface and compete with the environment for the user’s attention.
3. Buttons create a separation between the user and their environment.

Designing 3D Interactions

When designing for VR you should treat the interface more like a real life experience than a digital one. This means designing interactions that feel 3D in which you are manipulating the content directly. Think about grabbing things, rotating them and bringing them closer or further away. Think Tom Cruise in Minority report:

The goal isn’t necessarily to make every interface a whimsical VR game, it’s to make interaction in VR physically easier, faster, and more natural.

Alternatives to Buttons in VR

Here are a few concepts that ditch the point-and-click buttons and replace them with something more native to a 3D environment:

1. Expect people to be lazy — Instead of making the user pinpoint small areas for interactivity, let the experience allow for generalization. Zones allow for broad strokes in performing an action without a precise target. Large enough zones can be activated or triggered without even looking (such as using the controller and pointing up at the ‘ceiling’ zone to go back or undo).

Use broad “zones” of activation for content instead of small target points

2. Feedback shouldn’t be flat — Use scale, depth, lighting, materials, and physical qualities to convey feedback to the user. We are no longer constrained to a flat screen.

Use Z-Space and dimension to reinforce activation states

3. Non-euclidean geometry is fun — A cube can have more than 6 sides. We can flip something over many times and experience a unique feature each time. Objects can look familiar but not obey the laws of physics.

A cube can have more than 6 pieces of content to flip through

4. Try making the laser controller beam into the container for UI vs. placing 3 buttons in space. Switch between actions by rotating the controller to the left or right.

Map actions to degrees of rotation within the controller

5. Revealing Related Content — Selecting and then shaking a piece of content could be a gesture that reveals related pieces of content.

Be playful with how you can reveal new content — like a “shake to reveal” gesture

Think Outside the Button

Here are 9 interaction design principles that we’ve gathered (read: stolen) to keep you on the right track:

1. Set and fulfill expectations — Simplify the number and types of interactions within the system. If we set expectations with a simple and clear model (such as everything is grab-able) then people will play and discover how it works.
2. Design forgiving interactions — A mouse is precise, current VR hardware is not. Use large targets and direct manipulation where possible. This doesn’t mean the visual of the target needs to be huge. Swiping right on a large item is quick and easy because the entire item is the target (Tinder anyone?)
3. Simplify degrees of freedom — There’s no reason to drag the user through very precise movements or extra degrees of freedom when they are manipulating objects. This makes interaction easier for the user and simplifies the build.
4. Provide feedback — Think about how the UI can react to the users presence. This can be as simple as a color change or slight rotation. Conversely, elements that are not interactive should not react (see ‘Set and Fulfill Expectations’). This increases user confidence by providing immediate visual and audio feedback.
5. Keep Interactions reversible — If you pick up a book, you can put it back down where you found it. Interactions in VR should behave in a similar way — they should allow users to reverse their actions. In addition, if you provide visual feedback to indicate what will happen when the user completes an action, your app will feel safe to explore.
6. Keep interactions untimed — Interactions that require you to press and hold on the controller or stare in a specific area for a certain amount of time should be avoided because they are often triggered accidentally and are difficult to time correctly. When using head gaze, it can be physically uncomfortable to hold steady for a timed interaction.
7. Gorilla Arms — Simple interactions should require simple motions from the user. Otherwise you’ll quickly end up feeling like a gorilla with heavy arms. Simplify designs to be done with small hand movements and gestures.
8. Enduring Magic — Would I want to do this over and over again? Make common actions quick and easy while less common actions (pivots in a user’s flow) are opportunities for playfulness or surprises. Reward exploration and creativity.
9. Focus on Learnability — Resist the urge to make decisions solely based on discoverability. VR is a new medium and users approach it with curiosity. Core conventions and interactions are still being invented. Capitalize on the user’s curious mindset and judge new interactions based on their learnability not discoverability.

Twist!

If you’ve made it this far you may be thinking these are just good old design principles. And you’re right. VR is a cool and uncharted playground, the good news is that we don’t have to start from scratch. The key is to take what we know and design interactions that feel native to the experience which takes time and experimentation. Go forth and explore!

Written by Leslie Ferguson, Artwork by Gretchen Nash