Onboarding Revamp - Hand Tracking Experience for Kariboo XR , Movie Streaming App - Quest

I was commissioned by Kariboo to redesign the onboarding experience for their VR streaming application targeting moviegoers. The goal was to enhance user engagement from the moment they opened the app, ensuring a seamless and intuitive introduction to the platform, its functions, the simplicity of using hand tracking in browsing movies, and finally watching them in a multitasking environment. The entire design process was centered around optimizing for hand tracking as primary interaction input , with controller as secondary, so every elements needs to be for natural interaction experience for users.

The onboarding experience is critical as it sets the tone for new users. The project began with a comprehensive information-gathering phase to understand the client's goals and user needs. I created a spatial user journey and information architecture to cater to new users, returning users, and first-time users in the browsing experience. I established a solid information architecture and logical framework, ensuring clarity in both in-headset and out-of-headset experiences, all optimized for hand tracking. Designing for hand interaction comes with its own set of UI rules, such as the minimum touch target size of 44px x 44px (approximately 10mm x 10mm), as well as specific guidelines for button size, header text, and field input.

For the Login Screen, this appears only the first time the user launches the app. After setting up their username, users are automatically logged in on subsequent visits. The keyboard was repositioned to optimize usage for hand tracking.

‍

The process began with research and understanding of user behavior during the movie-finding experience. By identifying pain points and analyzing natural hand behavior in a pass-through environment, i could get  insights that informed the beginning of the remaining  design approach. The onboarding process includes informative panels specifically for first-time users. For instance, the "Browse with Hand" panel instructs users to put down their controller and show their hand to the camera to activate hand tracking, simplifying the navigation process. Another example is the "Multitasking" panel, which guides users to hover over movie posters to display the description panel, allowing for quick movie selection. These steps ensure that users can fully utilize the hand tracking features for a seamless and engaging browsing experience.

‍

‍

‍

After, i focused on creating a guoided spatial user journey. This journey catered to new users, returning users, and first-time users in the browsing experience, ensuring each group had a tailored and effective onboarding process. A solid information architecture and logical framework were established to provide clarity, all optimized for hand tracking. The user flow was accompanied by auditory and visual feedback, that are crucial in enhancing the hand tracking experience, providing users with clear, immediate responses to their actions. This feedback loop helped users feel more in control and confident in navigating the VR environment, ultimately leading to a more engaging and satisfying user experience.

‍

‍

‍

‍

When i got into UI design , it involved establishing the spawn distance for UI elements that is more specific than controller input . UI components were strategically placed at a comfortable distance of 0.5 meters from the user. This decision was made to avoid overwhelming users at the beginning, providing a non-invasive introduction to the VR environment. By starting with UI elements at this distance, users could gradually acclimate to the VR space without feeling bombarded by information or controls.

Next, we focused on the interactable UI placement. Catering to users who might be seated, key interactable elements were positioned at a 15-degree angle. This placement facilitated easy access and interaction using hand tracking, ensuring that users could comfortably navigate and select options without straining. The angle and proximity were chosen based on ergonomic principles and user testing, which indicated the most natural and comfortable interaction zones.

The design also considered user behavior movement. It was observed that as users engaged with the interface, their natural behavior would bring them closer to the interactive elements. To accommodate this, the interface was designed to allow users to move to approximately 0.33 meters from the point of view (POV) for detailed browsing and selection actions. This proximity facilitated more precise interactions and a more immersive browsing experience.

Finally, a spatial user journey was crafted, ensuring that every step of the user flow was accompanied by auditory and visual feedback. This multisensory approach was crucial for enhancing the hand tracking experience, providing users with clear, immediate responses to their actions. This feedback loop helped users feel more in control and confident in navigating the VR environment, ultimately leading to a more engaging and satisfying user experience.

‍

‍

‍

‍

The client expressed significant satisfaction with the revamped onboarding, we are now continuing for browsing behaviour to enhance application functionality. Specifically they desire assiting user to find movie as soon as possible for them to start watching. This positive response and the client's eagerness for expanded features showcase its potential for further customization to meet evolving needs.


‍

Thank you for watching ❤️

‍