FitXR
ABOUT THE PROJECT
This project heavily relied on my creative guidance, proficiency in UI/UX, skills in product design, and a range of other creative attributes to breathe life into this VR title. FitXR had the objective of evolving their current market offering, specifically the transformation of BoxVR into FitXR. Embarking on this endeavor from scratch, FitXR aimed to integrate a diverse array of virtual fitness experiences that could be seamlessly enjoyed within the confines of one's home. During my tenure, FitXR was awarded VR Fitness Game of the Year in 2020.
-
Service
Creative Direction, Product Design, UI UX
-
Client
FitXR
-
Dates
Mar 2019 - Feb 2021
Led the Product Design for this Tier 1 VR title, targeting an increase in user immersion and session length from 3 minutes to over 10 minutes (benchmarked against its predecessor) by architecting scalable spatial UI systems, engaging workouts with proven results and cross-functional workflows.
Primary Objectives
I joined FitXR during its initial phases as a fledgling startup. At that time, FitXR held the aspiration of revolutionizing its existing market presence, transitioning from BoxVR to FitXR. This transition aimed to integrate more fitness studios gradually into the platform's offerings.
Ensuring that all construction took place at a modular level was of paramount importance. This approach would facilitate seamless integration of additional studios into the reconstructed framework.
My initial responsibility encompassed elaborating the entire UX flow of the product within a span of three months, while simultaneously paving the way for the creative vision.
This product was intended for release on all VR platforms (ie. PlayStation VR, Vive, and Oculus/Meta)
Prior to embarking on the product transition, it was crucial to assess the technical and creative capabilities, as these insights would guide the direction of development.
Technical Hurdles
Following numerous discussions with FitXR's engineering team, it became evident that there would be limited room for flexibility in terms of potential UI and UX adjustments.
The engineering team at FitXR was compact, with everyone fully engaged in developing their ongoing marketing product, BoxVR.
Our development approach centered around accommodating the limitations of our lowest-spec devices, namely the PS4VR and Quest 1, both of which had constrained technical capabilities at the time. This required us to implement specific strategies to ensure optimal performance and usability on these platforms.
Given these various factors to take into account, it became clear that we needed to create a system characterized by a more rigid and structured layout approach.
Instructor Influence
BoxVR featured workouts choreographed by fitness instructors but had limited visual representation within the product itself.
This presented a significant chance not just to visually showcase the instructors within the app, fostering a stronger emotional connection to workouts, but also to establish a strong visual creative direction. This direction has remained pivotal in how FitXR continues to market all their classes to this day.
With these approved decisions in place, I began the process of establishing a coherent visual language within the product.
Pre-approved Logo and Style Guides
Prior to my arrival, FitXR had experienced a brand transformation carried out by an external agency.
The approved logo, color palette, fonts, and watermarks added further constraints to creative flexibility.
While predominantly utilizing pre-existing assets, it gradually became evident that these assets would require attention, as they lacked visual resonance.
Taking into account the technical constraints, I, along with pertinent stakeholders, embarked on the process of fleshing out the user experience (UX) for FitXR. The UX flow required careful consideration of various elements, including studios, class metadata, music, self-assessed and recommended milestones, fitness plans, achievements, statistical tracking, profile selection, health and safety settings, onboarding, class HUD and numerous other factors.
I also seized the opportunity to begin exploring stylized approaches for the instructors, drawing inspiration from reference imagery.
Rapid Assessment
It was critical that we tested the product flow and imagery, to see whether or not they would translate well to low spec VR devices.
In relation to fonts, our priority was to ensure that the chosen font remained easily readable even in the absence of anti-aliasing.
The intricate details in the instructor imagery were compromised when rendered and exported at sizes smaller than 512x512. On the other hand, the colors from gel photography retained remarkable vibrancy, enabling us to use them to indicate difficulty levels and enhance the visual impact of the classes.
The photography style chosen for representing the instructors garnered unanimous approval from the entire team. This success led to me directing a photoshoot in New York City later in the year.
Although a curved UI was highly desired, technical limitations deferred this preference to the backlog.
With the arrival of a dedicated UI engineer a month after I had started, these UX flows were beginning to be fleshed out in Unity. This allowed time for me to focus on some marketing and pitch deck aspects for the company.
Photoshoot
After receiving the green light for a photoshoot in the heart of NYC, my goal was to elevate FitXR's current instructor imagery, transforming it into a truly impactful and integral component of our fitness app.
Building upon the photography that had happened whilst BoxVR was in development, I aimed to incorporate gel lighting and leverage heightened contrasts to enhance the visual impact.
Operating within the constraints of a limited budget and a tight timeline, I began formulating a comprehensive shot guide. Additionally, I provided Mark Grgurich (international advertising and fashion photographer) with precise instructions on the necessary elements to ensure the seamless execution and success of this photoshoot.
We successfully captured a series of 100 photographs per instructor for both the Box and Dance studios. These images serve a dual purpose, being intended for both in-game integration and marketing campaigns.
Due to budget limitations, I took on the responsibility of personally handling all the post-photoshoot retouching of the images.
Here are a collection of some shots behind the scenes, delivered assets and final deliverables for in-game integration and marketing campaigns.
Oculus (Meta) Exclusive
With our attention firmly directed towards the Oculus release, FitXR embarked on a quest for additional investment round funding, with a particular emphasis on engaging with Oculus as a potential investor.
In close collaboration with the CEO and CMO, we meticulously crafted a comprehensive pitch deck for presentation and review by Oculus.
Following numerous iterations of the deck, we presented it to Oculus, and the outcomes were exceedingly favorable.
We effectively secured a funding round from Oculus, solidifying our partnership, and concurrently achieved exclusive product status on the Oculus platform, standing alongside Supernatural.
Emerging from a team of 15 dedicated individuals, we brought to life a product that filled us with immense pride and marked the beginning of an exciting journey ahead.
UI Take 2!
After some internal assessments, the conclusion was to primarily focus release for Oculus (Meta).
This approach granted a slightly greater degree of flexibility in terms of what could be accomplished from a UI/UX perspective.
While transitions, VFX, and curved UI remained aspirations in our pipeline, we were able to tailor our approach to capitalize on the unique strengths of the Quest platform. Some animations were allowed, specifically for the in game HUD.
The entire game's UX flow, encompassing aspects such as onboarding, in-game HUD, and more, underwent a comprehensive update to align seamlessly with the environments crafted by the 3D team.
Presented here are the in-game heads-up display (HUD) screens along with a selection of animations that were attainable within the platform's capabilities.
Displayed here are several class tiles, providing a visual representation of the comprehensive range of tasks I managed independently. These images were crafted using assets extracted from the aforementioned photoshoot highlighted in the summary.
In preparation for the upcoming game release, marketing materials were crafted in anticipation of FitXR's imminent global launch.
Thanks to the remarkable efforts of both the development and marketing teams, we successfully launched the product according to the anticipated delivery date. The game garnered an enthusiastic response from the community and eventually earned the prestigious title of VR Fitness Game of the Year 2020.
Following this achievement, our growth trajectory gained momentum, and we expanded rapidly without hesitation. The team swiftly expanded from its initial 15 members to a robust force of over 80 individuals.
UI Take 3!!
The launch of Quest 2 presented us with the opportunity to fully realize the UI art style in the manner I had envisioned all along.
As the UX continued to undergo enhancements, I integrated the refined UI art style into the updated UX flows, ensuring a cohesive and harmonious user experience.
As we prepared to launch new studios, it became essential to arrange another photoshoot. This time, I placed significant emphasis on the photography to play a pivotal role. Fresh guides and meticulously detailed shot lists were established for the photography team based in NYC.
Presented here are a variety of artistic style explorations undertaken before finalising the direction for our visual aesthetics.
This marked my final engagement with FitXR, as the team had successfully expanded and firmly established itself as a leading product in the VR fitness industry. With this chapter closed, my aspiration was to pursue projects that held the potential to contribute positively to the world's betterment.
Subsequent to my departure, FitXR has impressively sustained a trajectory of consistent expansion and enhancement.
