top of page

Welcome to

AR Stylist

A conceptual integration with

Snapchat_logo.svg.png

Snap Inc.

Snapchat AR Closet

The Problem

What?
An AR “stylist” to recommend clothes from YOUR closet!

Why?
Help select clothes based on the weather and environment

Who?
Teenagers, young adults, and professionals

How?
Designed using Figma. Built using Lens Studio.

Where?
Anywhere. Preferably at home.

Initial Brainstorming

Concept Board
Weather Clothes.png
Lens Studio.png
Closet App User Flow.png
Lens Studio Assets.png
Snap Lens UI.png

The AR Closet simplifies outfit selection by allowing users to try on digital representations of their own clothes within Snapchat. By scanning their wardrobe, users can create a virtual closet where outfits are suggested based on weather conditions and occasions, ensuring practicality while maintaining personal style.

Mood Board
User Engagement.png
Confidence.png
Convenience.png
Entertainment.png
Establish Trends.png

This Mood Board visually represents the values and experiences associated with the AR Closet concept, focusing on its core principles: user engagement, confidence, convenience, entertainment, and trend-setting. Here's a breakdown:

User Engagement:

Images of people actively interacting with their phones suggest the filter's ability to captivate users, encouraging them to explore their virtual closets with curiosity and excitement.

 

Confidence:

Stylish individuals and polished outfits highlight how the AR Closet empowers users to make better wardrobe decisions, enhancing their confidence in personal style and appearance.

 

Convenience:

Photos of organized wardrobes and simplified outfit selection illustrate the ease of use, showing how the AR Closet simplifies daily fashion decisions by providing instant weather-based recommendations.

 

Entertainment:

Groups of people smiling, sharing, and laughing reflect the fun and social aspect of the filter, encouraging users to share their outfits and engage with friends on Snapchat.

​

Establish Trends:

Streetwear photography and "like" symbols show how the AR Closet can help users stay ahead of fashion trends, fostering a sense of community and shared style inspiration.

Style Guide
image.png

The color palette is vibrant and modern, striking a balance between playfulness and professionalism.

image_edited.png

The typography system is clean, modern, and easy to read

image.png

Minimal and sleek design with rounded edges for a modern look.Clear contrast between text and background ensures accessibility.The purple outline adds an interactive and vibrant touch, enhancing the user's experience.

Storyboard
image.png

The storyboard highlights a user's journey from confusion to clarity by deciding the perfect outfit for the user using our AR application. The userflow below explains the general user journey for the app!

The user opens the app asking "Can someone just tell me what to wear!!!"

The system analyzes the weather conditions and available wardrobe items

Social sharing features allow users to share their outfit choices with friends

Virtual try-on capabilities let users see how clothes look before making decisions

Users can browse through suggested outfits in AR

User Flow
image_edited.jpg

This user flow illustrates the journey for using Snapchat's AR Closet:

​Login to Snapchat: User logs in.

 

Grant Permissions: App requests camera and location access for AR and weather-based features.

 

Bitmoji Room: User navigates to their Bitmoji Room.

 

Personal Closet: User selects the AR Closet feature.

​

Onboarding Quiz: New users personalize their preferences (style, colors, etc.).

​

​Set Up Closet: User customizes their virtual wardrobe.​

Regenerate Suggestions: Snap AI Buddy offers alternatives if needed.

 

Try Outfits: User tries suggested outfits in AR.

​

Weather Detection: The system considers weather and activity context for outfit suggestions.

​

Share: User shares the final outfit with friends or on Snapchat.​​​

Challenges

01
User Experience Challenges

image.png

02
Content Management

03
Technical Challenges

Accuracy and Fit

Virtual try-ons may not accurately represent how clothes actually fit on different body types

Limited ability to convey texture, fabric quality, and actual feel of garments

Digital Wardrobe Creation

Users need to manually input their clothing items, which can be time-consuming

Maintaining an updated catalog of clothing items and styles

Hardware Limitations

Processing power demands for AR rendering could cause lag and battery drain on mobile devices

Real-time rendering of clothing items and accurate tracking of body movements requires significant computational resources

Accessibility Issues

Navigation and interaction could be difficult for users with visual impairments or limited technical skills

Need for inclusive design to ensure the app works for diverse user groups

Integration Challenges

Syncing with real-world weather data for accurate recommendations

Connecting with multiple clothing retailers and maintaining updated inventory

Development Complexities

Creating accurate virtual try-on experiences that realistically display clothing

Building a seamless integration between Figma designs and Lens Studio implementation

Low Fidelity

image.png

01
First Revision

A main camera view displaying clothing try-on functionality

​

Navigation controls at the bottom

​

User profile icon in a yellow circle

​

Temperature and weather information (58°F) displayed at the top

image.png
image.png
image.png
image.png

02
Improving Onboarding

Clean, minimalist interface with three purple dots indicating multiple steps

​

A white circular button at the bottom for navigation

​

"Visit your closet" prompt to guide users

​

Integration of room scanning capability for AR placement

image_edited.png
image.png

03
End State

Sharing options including "Friends Only" and "Public" settings

​

Advanced AR controls on the right side panel

​

"Send" button for sharing content

​

Story privacy settings and OOTD (Outfit of the Day) options

High Fidelity

Using Lens Studio and SnapAR, we were able to create a High Fidelity prototype with 3 try-on T-Shirts as shown in the adjacent video. We could also import motion graphic tees to make it more entertaining!

image.png

Usability Testing

01
Improving the onboarding flow

Added contextual prompts to guide new users

02
Labeling Icons

Bottom navigation bar features three clearly labeled icons:

Closet: Wardrobe management

Add Outfit: Creating new outfit combinations

Profile: User account settings

03
Reducing the number of steps in the flow

Reduced user journey complexity

Two main action prompts displayed:

"Visit your closet" for wardrobe access

"Add Outfits" for creating new combinations

image.png
image.png
image.png
image.png
image.png

Try it yourself!

image.png

A flow of how a Snap user would use the newly integrated Stylist feature within Bitmoji, which utilizes Snap AI.

Not on Snapchat? View the video here!

stylistAR 1.gif
image.png

Final Reflections

Quick Access

Users prefer minimal and fast onboarding processes, indicating a need for streamlined entry points to the feature.

SnapAR

The feature heavily depends on Lens Studio, highlighting a reliance on Snapchat's existing AR development toolset.

Bias

It is easier to onboard users familiar with social media platforms, which may exclude or create challenges for those unfamiliar with the space.

Future Scope

Expanding capabilities through gesture-based controls can enhance interaction.

Creating an independent application or tool without relying on Lens Studio could increase flexibility and usability for broader audiences.

bottom of page