How we built it
- Capture: the YouCam Camera Kit (
wristmode) captures the wrist image in the browser. Users can also upload a photo. - Proxy: a Vercel serverless function receives the wrist and watch images, validates them (size and file signature), limits requests per visitor and keeps the API key on the server.
- YouCam AI Watch VTO API: the function uploads both images, creates a task with
POST /s2s/v2.0/task/2d-vto/watch, polls the task until it finishes, and returns the result image. - Frontend: vanilla JavaScript, HTML and CSS bundled with Vite, with GSAP and Lenis for animation and smooth scrolling.
Challenges we ran into
- Asynchronous AI results. The try-on is a task we poll for, so the UI needed a clear scanning state and a safe fallback if the API is slow.
- Protecting the API key and credits. Calls go through a server proxy with origin checks, request limits and strict image validation.
- Platform limits. Serverless time and request-size limits meant downsizing photos in the browser before upload, and moving the deployment to a host that fit the project.
What we learned
Luxury shoppers need confidence more than features: a fast, believable try-on does more to reduce hesitation than extra product photos.
What's next
More watch models, wrist-size aware scaling, and a real reservation backend for the concierge team.
Built With
- api
- css3
- gsap
- html5
- javascript
- lenis
- perfect-corp
- serverless
- vercel
- vite
- youcam-api
Log in or sign up for Devpost to join the conversation.