Apple shook up the Augmented Reality world this week with their new Vision Pro headset.
In case you haven't heard, Vision Pro is a mixed reality headset that lets users interact with apps in their physical spaces, using hand and eye gestures.
It's pretty amazing.
But how do we get started designing UX/UI for augmented and virtual reality?
Today we'll explore 5 Principles for Spatial Design from Apple VisionOS to help you get started.
Let's dive in.
5 Principles for Spatial Design:
1. Familiarity: Blend the Old with the New
Mixed reality is very new to a general audience and will novel to many people. When designing for these interfaces, we should lean on what is familiar to users.
Leverage existing patterns and interactions
Use common UI elements
Create hierarchy with elements and windows
2. Human Centricity: Design for Movement and Sight
Think about what a user can see and how they might need to move. How do their apps and windows behave when they sit or stand? Is there the equivalent to a 'hover state' when a user looks at an icon or button?
3 key areas:
Field of view
Ergonomics
Movement
Place primary content at centre view, and use head tracking to keep elements in field of view. This is the default placement, but users can control where to place windows in their environment.
A mix of hand and eye gestures are the primary methods of interaction, and will need to be carefully considered when designing UX.
3. Dimension: Boundless Spaces
Design for all spaces, taking into consideration depth and scale.
We're used to designing in 2 dimensions on our laptop screens.
But when your ROOM becomes your interface, things get interesting.
Not everyone will inhabit the same size space, so the UI needs to be flexible enough to account for this:
Balance between infinite canvas and room size
Use depth, light and shadows to create hierarchy
Be subtle with animations and micro interactions
4. Immersion: Tailor to Context
Consider different levels of immersion depending on context:
Shared space (single window or app)
Partial immersion (focused content in physical space)
Full immersion (VR experience out of physical space)
Most apps and windows will open as a 'shared space' view, which is a typical window. Depending on what the user is doing, the window might need to transition into partial immersion (AR), or full immersion (VR).
These shifts are the magic to the Vision Pro experience, giving users control to determine how their surroundings adapt to their content front and centre.
5. Authenticity: Create Magical Experiences
Double down on key moments that deliver experiences that feel authentic and real.
These moments will be the ones that make or break the experience, as they serve as the 'Wow' moment that keep people coming back.
Prioritise engagement and delight
Blend content with physical surroundings
Find a 'key moment' to deepen immersion
Want to learn more?
Read the full VisionOS documentation here.
AR and VR have been around for some time, but we haven't had standardised guidelines for design until now.
I'm excited to see how the industry evolves, and to see how mixed reality is adopted by a general consumer audience.
That's all for this week.
If you're reading this, I really appreciate you reading to the end.
If you found this helpful, let me know on Twitter @seanhowardux.
See you next week.
-Sean