TryOn AI
You fall for an outfit online with no idea how it’ll look on you. TryOn AI lets you upload a selfie and see yourself wearing it, rendered on your own photo.
It looks great on the model. Will it look good on me?
Every online shopper knows the guessing game. You find an outfit you love, then order it with no real idea how it fits your body.
A fitting room on the web.
New image models can put you in the clothes yourself. We set out to bring the certainty of an in-store fitting room to online shopping.
Three steps from selfie to outfit.
Upload a selfie and see yourself in any piece, as a photorealistic image.
Try on clothes you already own, then add things you don’t have yet to build a full look.
In the marketplace, every listing shows up on your own photo, so sellers can show real fits on real bodies.
Save a try-on or send it to a friend before you buy.
How the pieces talk.
The frontend handles uploads, instant previews and sharing. It sends your selfie and the pieces you picked to a FastAPI backend, which asks Google’s Nano Banana model for a photorealistic image of you in the outfit. The render keeps the original photo’s lighting, background and pose.
Image jobs are heavy, so the backend runs them on threads and can process several at once.
The frontend.
I built the landing page and the outfit-swapping interface, the part you actually touch.
- 01Landing page
A typewriter headline and gentle animations set a soft, boutique feel before you upload anything.
- 02Outfit picker
Browse curated looks or build your own, with up to two pieces selected at a time.
- 03Renders that swap in place
New AI renders drop into the result panel without leaving the page, so comparing looks is quick.
- 04Fixing the seam
I worked with our backend teammates to fix FastAPI routes, so the frontend and the AI service talked reliably.
A blush palette and roomy product cards keep the focus on the clothes.
What we ran into.
Nano Banana would sometimes generate an entirely new person, or forget to apply one of the pieces.
Two items per try-on gave the most reliable results, and sending them as one outfit collage worked better than separate images.
We tuned temperature, top_p and top_k to keep the model as deterministic as possible.
Selfies and product photos come in every shape, so getting uploads, previews and results to line up took a lot of small frontend fixes.
Processing images is slow, so the backend uses threading and concurrency to work on several at once.
Consistent results came down to small choices, like sending outfits as collages and capping each try-on at two pieces. By the end, try-ons were consistent and worked for both men and women. I also learned a lot about handling big images on the frontend.
We kept using it to test outfits before buying anything. Next is turning the hackathon build into a deployed site and app that real shoppers can use.