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  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 guided 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.

With a solid information architecture and logical framework were set to provide clarity, all optimised for hand tracking.

The user flow was accompanied by auditory and visual feedback, especially important for hand tracking experience, for a clear and immediate responses to their actions. This feedback loop helped users feel more in control and confident in navigating the  environment

‍

‍

‍

‍

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.

‍