DEV Community

Cover image for PrintAI - A Print on Demand E-com website powered with Wix and AI
Dhairya Chheda
Dhairya Chheda

Posted on

PrintAI - A Print on Demand E-com website powered with Wix and AI

This is a submission for the Wix Studio Challenge .

What I Built

We’ve innovatively combined print-on-demand with AI to create a custom product configurator. This advanced solution allows users to enter a prompt and choose from four design options for their t-shirts. Users can opt to remove the background and add designs to both the front and back of the shirt.

Utilizing a custom element, we implemented a color picker, enabling users to select any t-shirt color they desire. Additionally, users have the option to upload their own images. Once satisfied with their selections, they can easily add the product to their cart.

This integration of AI with print-on-demand showcases our commitment to providing a personalized and engaging user experience, leveraging cutting-edge technology to meet modern consumer demands.

Demo

https://wixfreaks.wixstudio.io/printai

Image description

Image description

Image description

Development Journey

Leveraging Wix Studio’s robust APIs has enabled us to develop an innovative and trendsetting solution in the age of AI. By utilizing backend file capabilities, we securely store and retrieve API keys, ensuring the utmost security. This infrastructure allows us to seamlessly call and test OpenAI and background removal APIs, enhancing our product’s functionality.

Additionally, with the wix-ecomm API, we crafted a custom product integration that dynamically adjusts to user specifications. This ensures both the admin and the user receive precise order details, enhancing transparency and accuracy.

The element API calls further enabled us to elevate the user experience, providing a seamless and intuitive interface. Wix Studio’s comprehensive API toolkit has been instrumental in creating this cutting-edge product, showcasing the platform’s potential to support advanced, AI-driven applications.

APIs and Library we utilised

  • We used the openAI API to generate Images
  • Bg.remove API to remove the background from an Image
  • wixEcom API to add the specifcations of the product to the cart using addToCart()
  • We also have used a Custom Element, that acts as a color picker for the t-shirt.
  • Wix Secrets Manager to store and get the API
  • Wix-Fetch to call and get the API

Top comments (2)

Collapse
 
codequeen profile image
Code Queen

Do mean custom interface with wix elements? Or an actual custom element component? Because custom elements were not allowed per the rules!

Collapse
 
dhairya_chheda profile image
Dhairya Chheda

Oh I missed that point. I used an actual custom element for just the color selector!