VR Social Fitting Room Experience 🤓
A breathing prototype for VR social fitting rooms, designed to bring joy while user try on clothes that match their preferences through digital interactions with color and music choices 🪞💃
Physical store is trying to compete with the online shopping conviniency and impulse buying that happens online more than offline. Exploring intersections of consumer psychology, personal styling, and AI technology in the context of fashion retail will assist user to explore their identity.
Research
Research has shown that there is indeed a connection between an individual's mood and their clothing choices. People often dress in a way that reflects their current emotional state. Shopping is a mood based journey , based on research we found this :
- Shopping behavior is influenced by various factors, including personal preferences, needs, external influences, and mood.
- Retail therapy refers to the act of shopping with the process of browsing, trying on clothes, and making purchases can provide a temporary mood boost and a sense of control or self-expression.
- Impulse Buying: Mood can also contribute to impulsive buying behavior. Positive emotions can lower inhibitions and increase the likelihood of making spontaneous purchases without much consideration for long-term consequences
- The shopping environment, including store layout, music, lighting, and overall ambiance, can influence mood and subsequently affect purchasing decisions.
Concept
The concept social fitting room is made with the idea to let user finds the joy in trying on different clothes based on their mood and preference. A Potential to assess a shopper's mood or wish based on their or specific social media activity , a digital interaction options of colors and music choice for clothes recommendation of whats available in that store . 🪞💃
Create the jobs to be done :
- As a user, I want to use fashion as a means of self-expression, mood enhancement, and self-care, so I can align my clothing choices with my emotional state and improve my overall well-being.
Journal 03 :
Prototyping Social Fitting room . 60% of the theory i could grasp and re create it ! I have the initial design . I used Quest 1 for it!
The initial concept as drawn in the storyboard paper :
Started doing the UI for Onboarding Experience, using FloatGrids as the design system foundation!
I started with applying the interaction of the wireframes :
1. Background ( main / hover / clicked )
2. Research (( main / hover / clicked )
3. Concept ( main / hover / clicked )
One difficulty im having is to align the object one to another , thers no easy way to do this but to just eye it out , but i dont think i can do it without precision to have a good prototype. ( more like perfect prototype 🤓 )
The other mundane difficulty is i cannot replace the UI with another from the library , so i have to keep on creating them taking out from the library
Find the import figma within Import library. If its a UI , toggle on mark it as UI element to set the pixel density for 1 metre options.
Turn on the grid , to help in setting up the object and UI, every grid is a representative of 50cm .
There are template mood that user can choose , like bohemian , futuristic, romantic , along with set of room color and music that is predefined for learning curve and easeness of user in the beginning.
Following the launch of Apple Vision, i tried to apply the gaze and pinch UX for the experience. Quest 1 has head tracking , we can use user's head direction to approximate their gaze direction , and complement them wit timed interactions, where specific actions are triggered when the user's head remains facing a certain direction on objects or UI for a set duration.
The theory principal is as followed : 5 -10cm size in 1 metres, within 20 degree of user POV ( Foveated ) and 10-20 degree below the user horizon . The further the menu the bigger the size.
This is where i had difficulty in the beginning 😄 because it wasnt as accurate ofcourse without eye tracking device , nonenthless the combination of those does give a sembalance of gaze like interactions using Quest 1 , which im very happy about ! 🪩
After making the first layer interaction, i start doing the doodling for the " Create your Own Mood " experience.
Interface and Experience Concept :
Screen 1 - Welcome:
Start with a visually engaging welcome screen that captures the essence of your brand and the promise of a personalized experience. Include a simple "Get Started" or "Connect Now" button.
Screen 2 - Explain the Process:
Before asking for permissions or personal data, briefly explain what the social fitting room is and how it works. Use simple language and include relevant graphics to make it engaging. Include a "Next" or "Continue" button.
Screen 3 - Permission to Connect Social Media Accounts:
Present users with the option to connect their social media accounts. You might use text such as: "Connect your social media to let our AI learn your style preferences."
The user uses their phone to scan the QR code displayed on the screen. Scanning the QR code opens a URL in the user's smartphone browser. The user logs into their social media account and authorizes your platform to access their public profile and other relevant data.
Example : WhatsApp Web
Screen 4 - Mood and Color Preferences:
On the next screen, ask the user to indicate their current mood and preferred color palette. You could present a range of moods (like "Casual," "Energetic," "Sophisticated") as selectable options, along with a color palette.
Screen 5 - Music Preference:
Similar to the previous screen, ask users about their music preference. This could be as simple as choosing their favorite genres or connecting to a music streaming service like Spotify.
Screen 6 - Getting Started:
With preferences set, bring the user to the main dashboard of the app where they can start exploring clothing recommendation
This experience is done using Blender, Figma, ShapesXR, Ready Player Me, FloatGrids VR and AR Design System | Version : August 2023
