Inspiration

Online fashion shopping often feels like a gamble. Shoppers rely on size charts and static product images, yet still struggle to imagine how clothes will look on their own body. This uncertainty leads to hesitation, dissatisfaction, and high return rates. We were inspired to build Clothifyy to bridge the gap between physical try-ons and online shopping by making the experience visual, personal, and confidence-driven.


What We Built

Clothifyy is an AI-powered virtual try-on platform that allows users to upload a photo or paste a product link and instantly see a realistic visualization of how an outfit would look on them. By removing guesswork, Clothifyy helps users make better fashion decisions before purchasing.


How We Built It

We built Clothifyy using Next.js for the frontend and backend API routes, enabling fast development and server-side processing. The application is deployed on Vercel, with secure environment variable management for API keys.
For the AI layer, we integrated multimodal generative models to process user images and clothing inputs and produce try-on results. The system focuses on maintaining body proportions and visual alignment, which can be thought of as minimizing visual distortion, conceptually similar to reducing an error term:

[ \text{Distortion} = \sum_{i=1}^{n} \lVert p_i^{\text{generated}} - p_i^{\text{expected}} \rVert ]


Challenges We Faced

One major challenge was ensuring consistent image scaling and alignment across different devices and screen sizes. We also faced deployment issues, particularly with environment variables behaving differently between local development and production. Coordinating team changes through Git under time pressure was another learning curve.


What We Learned

We learned how to integrate multimodal AI models into a real-world product, manage secure cloud deployments, and collaborate efficiently as a team. We also gained a deeper understanding of how small deployment details can significantly impact user experience.


What’s Next for Clothifyy

Next, we plan to introduce size recommendations, multi-angle try-ons, and brand integrations to help retailers reduce returns and improve customer trust. Ultimately, we aim to make online fashion shopping as confident as shopping in-store.

Built With

  • gemini
  • geminiapi
  • javascript/react
  • next.js
  • openai
  • tailwind
Share this project:

Updates