Designing the experience Experience

Experience

Interface Expand and collapse content An arrow that points down when collapsed and points up when expanded.

Design for an immersive experience, but empower users to feel in control.

  • Full-screen takeovers: Avoid this unless the user explicitly selects it
  • 2D overlays: Avoid persistent 2D overlays that can disrupt immersion
  • Continuity of experience: Avoid flows that frequently take the user in and out of a scene. Let users perform primary & secondary tasks within the app. For example, allow users to select, customize, change, or share objects without leaving AR.

Avoid full-screen takeovers

Initialization Expand and collapse content An arrow that points down when collapsed and points up when expanded.

Make transitions from 2D to AR explicit

Use visual techniques to clearly indicate system status. For example, dim the phone or use effects to blur the screen when a transition is about to take place.

Onboarding & instructions Expand and collapse content An arrow that points down when collapsed and points up when expanded.

Provide a contextual onboarding flow.

Allow users to launch the AR experience quickly and teach users how to perform key tasks contextually in the first-run experience. This will tie helpful instructions to relevant tasks and build retention.

While adding contextual onboarding tips, be sure to:

  • Dismiss cues once the task is completed
  • Offer tips or resurface key onboarding visuals if the user repeats the same mistakes

Rely on visual guidance

Rather than relying solely on text, use a combination of visual cues, motion, and animation to guide users.

For example, users are more apt to understand a swipe gesture if it’s demonstrated to them on-screen, rather than communicated via text-only instructions.

Use of visuals & text to guide the user

Familiarity Expand and collapse content An arrow that points down when collapsed and points up when expanded.

Leverage familiar UI patterns & conventions

Align to standard UX interaction models & patterns without breaking the immersiveness of the experience. This will help reduce the need for providing instructions or detailed onboarding.

Modalities - landscape & portrait Expand and collapse content An arrow that points down when collapsed and points up when expanded.

Provide support for both portrait and landscape modes. If this isn’t possible, select the modality that’s ideal for your experience.

Supporting both modes creates a more immersive experience and increases user comfort.

Consider the following best practices:

  • Camera & button placement. For each mode, be aware of how camera positioning affects depth sensing, spatial awareness, and accurate surface measurements
  • Key target placement. Don’t displace key targets or allow for rotate animation
  • Layout. When appropriate, change layouts for secondary targets
  • One-mode support. Make it clear to the user if support for only one mode is available

Use subtle rotation and try to avoid rotating an entire menu

Audio exploration Expand and collapse content An arrow that points down when collapsed and points up when expanded.

Use audio to encourage engagement and enhance the user’s experience.

Audio encourages users to engage with the app and explore the 360 environment. Ensure sounds add to the experience rather than distract from it.

If you are infusing audio in 3D objects or the 360 environment, be mindful of the following aspects

  • Avoid playing sounds simultaneously
  • Add attenuation for sound effects
  • Allow audio to fade or stop if user is not handling the object
  • Allow users to manually turn off the audio of selected objects

Visual exploration Expand and collapse content An arrow that points down when collapsed and points up when expanded.

Use visual or audio cues to encourage off-screen exploration.

Use visual cues to nudge users to explore a more robust AR world around them. For example, having a bird fly off-screen until the user brings it back in the scene, can help direct the user to complete the intended goal.

Nudge users to explore off-screen spaces

Depth collisions Expand and collapse content An arrow that points down when collapsed and points up when expanded.

Always consider users’ spaces.

To avoid depth collisions—when a virtual object appears to intersect a real-world object—be mindful of reasonable room sizes and the various environments in which users could use your app.

Set expectations up front by clearly communicating how much space is needed for the experience, from a tabletop, to an entire room, to world-scale space.

Communicate to users the amount of space they need