Try

Try on fashion virtually in VR. Pick garments, see yourself wearing them. Each shop represents instagram account and each section represents instagram post and a garment/s that brand is going to sell

Comment

Inspiration

Virtual try-on is a $10B+ industry, but the experience is flat - 2D overlays on phone screens. We asked: what if you could step INTO a fashion showroom, see garments on life-size mannequins, and try them on yourself using AI?

What it does

VR Try-On is an immersive WebXR shopping experience for Meta Quest. Users enter a virtual showroom featuring real fashion brands (4psy.com shop), browse garments displayed on 3D mannequins, and generate AI-powered virtual try-ons by uploading a selfie. The result appears in a VR mirror frame - see yourself wearing the clothes before buying.

User Flow:

  1. Enter VR → Choose shop → Browse mannequin displays
  2. Point at garment → See details (price, materials, sizes)
  3. Upload selfie → AI generates try-on image (25-35s)
  4. View result in VR mirror → Save, share, or buy

How we built it

Pure WebXR + Three.js - No Unity, no Unreal. Just 164KB of vanilla JavaScript delivering 95+ FPS on Quest 3S.

Key Technical Achievements:

  • Discovered and solved critical WebXR preloading bug (GLB models loaded during VR won't render)
  • Body-directed locomotion system (reduces motion sickness)
  • Custom procedural UI (Instagram-style frames, frosted glass panels) without GLTF bloat
  • ECS architecture supporting 1000+ interactive objects
  • Memory budget system preventing Quest heap exhaustion

Challenges we ran into

The biggest: models loaded during VR sessions don't render until you exit and re-enter. We tried 12+ workarounds (forcing material updates, texture re-uploads, scene graph manipulation) before discovering the solution: preload ALL assets before VR, toggle visibility during session.

What we learned

WebXR on Quest requires a completely different mental model than desktop Three.js. The XR render loop isn't requestAnimationFrame. Textures need re-uploading. DRACO decoders must be local. Among others :)

Built With

Share this project:

Updates