TryOutfit: Virtual Outfit Try-On with AI

#devchallenge #awschallenge #amplify #fullstack

This is a submission for the The AWS Amplify Fullstack TypeScript Challenge

TryOutfit: Virtual Outfit Try-On with AI

I recently built an AI web application called TryOutfit that allows users to virtually try on outfits using AI. Powered by the IDM-VTON model from Replicate, TryOutfit provides an interactive experience for users to visualize how different outfits would look on them or on predefined models.

How It Works

TryOutfit offers a user-friendly interface where users can either upload their own image or choose from a selection of predefined models. Once an image is selected, the application uses the IDM-VTON AI model to generate a virtual try-on of the chosen outfit on the selected image. This enables users to see how the outfit would look on them or on the model without physically trying it on.

All the model generations are automatically deleted after 1hour from database.

Demo and Code

APP - https://www.tryoutfit.app/
Code - https://github.com/kaarthik108/tryoutfit

The application follows a serverless architecture, leveraging AWS services to handle various functionalities. User authentication is managed by Amazon Cognito, ensuring secure access to the application. User-uploaded images are stored in S3 buckets, while outfit and user data is stored in DynamoDB tables.

The AI model from Replicate is seamlessly integrated into the application to generate the virtual try-on images. To optimize performance, webhooks are used to poll the inference results instead of waiting for the model to complete the processing. Additionally, TryOutfit offers shareable links to the generated model outfits, which remain accessible for a period of 1 hour, enabling users to easily share their virtual try-on results with others.

Integrations

NEXTjs 14 (with server actions)
AWS s3 (To store image files)
AWS Dynamo DB (To serve product data and persist inference data)
AWS Cognito (API Key auth)
Replicate (AI model)
AWS Amplify (Hosting)

Connected Components and/or Feature Full

StorageImage from Amplify UI was used to display the images using path from s3.

Conclusion

Building TryOutfit using AWS Amplify and various AWS services has been a rewarding experience. Amplify simplifies the development process by providing a set of tools and services that make it easy to build scalable and feature-rich applications. The integration of AI models, such as the one from Replicate, adds an exciting dimension to the application, enabling users to virtually try on outfits from the comfort of their own devices.