UX CASE STUDY - INTERNSHIP PROJECT

Most users never made it past setup so I redesigned onboarding from the ground up.

COMPANY

fAIshion.AI

ROLE

Product Designer

Platform

Mobile & Desktop

SCOPE

Research -> Handoff

https://faishion.ai/

V_CLOSET-V4
SPRING_2026
←
Drag items here to try on

Project description

A Chrome extension based AI styling product that allows users to try on outfits while browsing.

I redesigned onboarding to help users move from install to first try-on without friction.

Background

The product introduced a new behavior styling through a browser extension.

Users had to install, pin, upload an image, and learn a new interaction model.

Most users never reached the core experience.

01 WHERE IT BROKE.

Installed. Never Used.

Users installed it, but didn’t pin it

Uploading...

Upload = Friction

Turns out “just upload a photo” isn’t that simple.

Too Much Thinking Required

Text-heavy. Assumption-driven. Easy to drop.

03 RESEARCH

What Actually Works

I audited top-performing products to understand one thing how they get users through the exact moments this product lost them.

Pattern	Honey Shopping extension	Grammarly Writing extension	Monday.com Project Management	Loom Video extension
Animated pin tutorial Motion, not a static screenshot
Visual do/don't examples Shows correct action without text
Skippable + re-enterable steps No forced one-time gate
OTP destination shown User knows where code was sent

Supported

Partially Supported

Not Supported

KEY INSIGHT

The best Chrome extension onboarding doesn't just tell users what to do it shows them a live simulation of it happening. I learned Jitter animations specifically to bring this pattern to FashionAI's pin tutorial instead of using a static screen.

04 AI WORKFLOW

Where AI helped and where it did not

Used AI to move fast. Designed to get it right.

AI Exploration

I used AI to explore faster

Generate 2-3 layout directions quickly, then brougth the strongest one into figma to rebuild properly

Handoff

Screens rebuilt by hand

Final specs, states, and edge cases done in Figma. AI output never went directly to developers

05 DESIGN

The Flow That Fixed it

Every step was redesigned to remove friction, reduce confusion, and get users to their first try-on—faster.

ENTRY

First Impressions Matter

Users decide in seconds. This screen makes the value clear and the next step obvious no exploration required.

DESIGN DECISION

I owned UX and visual direction. Three layouts explored before landing on this one. Value prop above the fold, two CTAs splitting new from returning users cleanly. Screens under NDA but every decision was mine.

AUTHENTICATION

Login + OTP

Simplified login with social auth options. OTP always shows where the code was sent and if something goes wrong, an error state with attempt count tells the user exactly what to do next

OTP Verification

Enter the code sent to you@email.com

DESIGN DECISION

The original flow showed nothing after submitting an email. Added the destination address before the input, an error state with attempt count, and a resend confirmation. Three things that didn't exist each one a specific abandonment trigger removed.

ONBOARDING · MOBILE ONLY

Start with your favorites

Mobile users pick favorite brands to power the recommendation engine. This replaces the extension step mobile has no browser toolbar so the experience is built around personal taste instead

DESIGN DECISION

Desktop users pin the extension. Mobile users can't so I replaced that step entirely with brand selection to power the recommendation engine. Same goal, completely different solution built for the context.

ONBOARDING · DESKTOP ONLY

Pin the Chrome Extension

Animated Jitter tutorial showing exactly how to pin the extension. Motion, not a static screenshot the same standard used by Honey and Grammarly.

DESIGN DECISION

After studying how Honey and Grammarly both use animated tutorials for this exact moment, I learned Jitter specifically to match that standard. A static image of a browser toolbar teaches nobody anything

ONBOARDING · BOTH

Photo Upload

A real video showing exactly how to take the perfect photo not illustrations, not a do/don't grid. Watching a real person do it removes all guesswork.

DESIGN DECISION

Most apps use illustrated examples. I filmed a real person handing their phone to a friend and taking the photo — full body, good light, fitted clothes. Watching a real person do it removes all guesswork.