Custom product designer documentation
Welcome to the Custom product designer
The Custom Product Designer app empowers customers to design, print, and receive personalized products directly from your store. With this app, online store owners can offer an array of customization options, enabling customers to easily personalize items such as t-shirts, mugs, phone cases, shoes, hats, and more.
Featuring a user-friendly design studio, the app allows customers to create unique products by uploading images, adding text, selecting colors, patterns, and cliparts, and choosing from various fonts. This flexibility ensures that customers can design anywhere on the product, not just in predefined areas, and from any device.
Personalize products by adding text, images, cliparts, patterns, and colors.
Receive print-ready files in .PNG, .JPG/JPEG, .SVG, and .PDF formats.
Enable or disable options for adding text, uploading images, or selecting clipart on specific products.
Access a ready-to-use collection of cliparts, fonts, colors, and patterns, with the ability to add your own.
A fast, responsive design studio that works seamlessly on any device with multiple design areas.
Install Custom product designer visiting our listing on the Shopify app store, clicking install, and interacting with the prompts that follow.
To configure and display the Custom Product Designer Studio app on your product detail pages, please follow these steps:
Install the App: Begin by installing the Custom Product Designer Studio app from the Shopify App Store and purchase the appropriate plan.
Refer to the Guide: After installation, refer to the detailed configuration steps provided in the guide: Install and Configure Custom Product Designer App.
Customize Settings: Review and customize the app settings, selecting personalization options as per your requirements.
Save Changes: Make sure all changes are properly saved to activate your configuration.
Verify Display: Check your product detail pages to ensure the app displays and functions as expected.
Allow customers to personalize products with the following options: upload images, choose product colors, select clipart, apply patterns, and add custom text.
The Custom Studio Design app offers a feature to upload and add images for personalizing products.
Upload Masking Images: You can upload your masking images directly from here.
File Size: The file size must be under 2 MB.
Supported Formats: Accepted formats are .png, .jpeg, .svg, and .jpg.
Image Dimensions: The dimensions of the images must be 700x1000.
How to Upload: Click on the Add Images button to upload your image.
Masking images is essential for personalizing product designs within the Custom Studio app. This feature allows customers to modify the appearance of images by changing their colors and applying unique shapes or patterns.
By using masking images, merchants can offer a tailored experience, enabling customers to create distinctive designs that stand out. This functionality not only enhances the customization process but also allows for greater creativity and personalization in product offerings, making it easier for customers to express their individual style.
How to Create Masking Images?
To create masking images for your products, you can connect with our design team for assistance. Additionally, you can watch the video tutorial below for step-by-step guidance.
YouTube Video Link
Note: We accept requests for up to 2 masking images, where we will create custom masking images for your product designs.
The app provides a feature where merchants can offer customers the ability to add custom text to their products, with options to choose from various text colors and font styles.
Text Character Limit: Set a character limit for custom text (e.g., 10 characters).
Text Colors: Customers can choose from a range of available text colors.
Font Family: Multiple font family options are available for customers to personalize the look and feel of the text.
Click on the Select Your Text Colors to get this option:
Click on the Select Font Family to get this option:
Customers can personalize products by uploading their custom images and using clipart images. Merchants can enable one or both of the following options:
Upload Images: When this option is enabled, customers can personalize products by uploading their own images.
Clipart Images: When this option is enabled, customers can select from a library of clipart images provided by the merchant for product personalization.
In app offers a clipart functionality, including a clipart library. Additionally, you can create your own clipart categories, allowing for personalized product customization. This feature provides customers with various options to enhance their designs, making their products truly unique.
Click on the Personalisation Options
There you will find options such as Cliparts, Fonts, Colors, and Background Patterns.
Click on Add New Category
Or else, you can Upload on Clipart Images.
To upload your designs, you can click on Select Designs.
Merchants can enable the Product Colors option, allowing customers to select and customize the color of the product during the personalization process. This feature offers customers flexibility in choosing their preferred product colors.
Note: To use this feature, please use only masking images or transparent images.
Merchants can allow customers to change the product pattern in the design studio. If merchants enable this option, customers can select from various product patterns.
The app provides functionality for merchants to use default assets such as cliparts, fonts, colors, and background patterns. Merchants can also create their own categories, offering customers the option to personalize products with these assets, including cliparts, fonts, colors, and background patterns.
Cliparts
Font
Colors
BACKGROUND PATTERN
Setting the perfect background pattern the way your customers want.
Personalization Layout :The app provides merchants with two layout options for customers to personalize products:
Personalization on Product Page
If this option is enabled, customers can personalize the product directly on the product page. This allows for a seamless shopping experience as they can view and customize their product in real time without leaving the page.
Personalization on Popup
If this option is enabled, customers will use a popup editor to personalize the product. This provides a dedicated space for customization, allowing for a more focused editing experience while keeping the product page intact.
The app provides a feature to receive print-ready files in the following formats. You can enable the option to choose one that best suits your printing needs:
.PNG
.JPG/JPEG
.SVG
.PDF
A print-ready file format is a specific type of file that meets professional printing requirements. It ensures that the artwork is properly set up for production, including the correct resolution, color mode, and trim marks.
You can typically download the print-ready file from your Shopify order page once the product is ordered. The design can be downloaded in PDF, PNG, JPEG, or SVG formats.
When a store owner receives an order for a custom product designed by their customer, they will need the print-ready file to proceed with printing. The chosen file extension will determine how the store owner can use the print file for production. Common formats include PDF, SVG, and JPEG,PNG.
If a store owner's customer has designed a product and placed an order for it, we will provide him with a print file. He can get the print file printed according to the file extension he has selected.
This feature allows customers to either add a single product to their cart or select multiple sizes and quantities for bulk orders directly from the customization popup. The option is configurable from the backend, providing flexibility to enable or disable it based on store requirements. When enabled, customers can easily choose product variants and quantities in a streamlined way, improving the shopping experience for both individual and bulk purchases.
Steps:
Go to the app backend and navigate to General Settings.
Choose Personalization Layout as Product Popup Option.
Enable Single or Bulk Add-to-Cart option.
Once enabled, if the product has variants, customers will see the variant size options on the front end. They can select multiple variant sizes and quantities, then add them to the cart in bulk.
If enabled: All variant size option will display
If disabled: Default product will display
Merchants can set that price for every Price Per Text, Price Per ClipArt, Price Per Uploaded Image, or Pattern which the customers.
This is the actual masking of the product and you can clearly see the price of this product.
You can clearly see that the price gets increased once customers add designs they want.
This feature allows customers to either add a single product to their cart or select multiple sizes and quantities for bulk orders directly from the customization popup. The option is configurable from the backend, providing flexibility to enable or disable it based on store requirements. When enabled, customers can easily choose product variants and quantities in a streamlined way, improving the shopping experience for both individual and bulk purchases.
The Customize It button allows merchants to personalize the appearance of the button to match their store's branding. Here are the customizable options available:
Button Label: Merchants can change the text displayed on the button to better suit their store’s theme or to provide clearer instructions to customers.
Background Color: The background color of the button can be customized to align with the store's color scheme, ensuring it stands out or blends in as desired.
Text Color: Merchants can choose the text color for the button label, enhancing visibility and ensuring that the text is legible against the button’s background.
Text Over Color Style: This option allows merchants to select styles for the text when hovered over, adding a dynamic effect to enhance user interaction.
Padding: Merchants can adjust the padding around the button, affecting its size and overall appearance, making it more aesthetically pleasing and improving the user experience.
By utilizing these customization options, merchants can create a personalized Customize It button that effectively engages customers and fits seamlessly into their store design.
The app provides functionality that allows merchants to display the design layout text in their store's language. Merchants can easily add translated text in the Translation tab, ensuring that customers can interact with the design tools in their preferred language. This feature enhances the user experience by making the customization process more accessible and intuitive for a diverse customer base.
If you need further assistance, feel free to ask!
Introduction
The Custom Product Designer app empowers customers to design, print, and receive personalized products directly from your store. With this app, online store owners can offer an array of customization options, enabling customers to easily personalize items such as t-shirts, mugs, phone cases, shoes, hats, and more.
Featuring a user-friendly design studio, the app allows customers to create unique products by uploading images, adding text, selecting colors, patterns, and cliparts, and choosing from various fonts. This flexibility ensures that customers can design anywhere on the product, not just in predefined areas, and from any device.
Key Features:
Personalize products by adding text, images, cliparts, patterns, and colors.
Receive print-ready files in .PNG, .JPG/JPEG, .SVG, and .PDF formats.
Enable or disable options for adding text, uploading images, or selecting clipart on specific products.
Access a ready-to-use collection of cliparts, fonts, colors, and patterns, with the ability to add your own.
A fast, responsive design studio that works seamlessly on any device with multiple design areas.
Installation
Install Custom product designer visiting our listing on the Shopify app store, clicking install, and interacting with the prompts that follow.
Configuration:
To configure and display the Custom Product Designer Studio app on your product detail pages, please follow these steps:
Install the App: Begin by installing the Custom Product Designer Studio app from the Shopify App Store and purchase the appropriate plan.
Refer to the Guide: After installation, refer to the detailed configuration steps provided in the guide: Install and Configure Custom Product Designer App.
Customize Settings: Review and customize the app settings, selecting personalization options as per your requirements.
Save Changes: Make sure all changes are properly saved to activate your configuration.
Verify Display: Check your product detail pages to ensure the app displays and functions as expected.
Personalization Products
Allow customers to personalize products with the following options: upload images, choose product colors, select clipart, apply patterns, and add custom text.
1.UPLOAD IMAGES
The Custom Studio Design app offers a feature to upload and add images for personalizing products.
Upload Masking Images: You can upload your masking images directly from here.
File Size: The file size must be under 2 MB.
Supported Formats: Accepted formats are .png, .jpeg, .svg, and .jpg.
Image Dimensions: The dimensions of the images must be 700x1000.
How to Upload: Click on the Add Images button to upload your image.
2.MASKING IMAGES
Masking images is essential for personalizing product designs within the Custom Studio app. This feature allows customers to modify the appearance of images by changing their colors and applying unique shapes or patterns.
By using masking images, merchants can offer a tailored experience, enabling customers to create distinctive designs that stand out. This functionality not only enhances the customization process but also allows for greater creativity and personalization in product offerings, making it easier for customers to express their individual style.
How to Create Masking Images?
To create masking images for your products, you can connect with our design team for assistance. Additionally, you can watch the video tutorial below for step-by-step guidance.
YouTube Video Link
Note: We accept requests for up to 2 masking images, where we will create custom masking images for your product designs.
3.Text Personalisation
The app provides a feature where merchants can offer customers the ability to add custom text to their products, with options to choose from various text colors and font styles.
Text Character Limit: Set a character limit for custom text (e.g., 10 characters).
Text Colors: Customers can choose from a range of available text colors.
Font Family: Multiple font family options are available for customers to personalize the look and feel of the text.
Click on the Select Your Text Colors to get this option:
Click on the Select Font Family to get this option:
4.IMAGE PERSONALIZATION
Customers can personalize products by uploading their custom images and using clipart images. Merchants can enable one or both of the following options:
Upload Images: When this option is enabled, customers can personalize products by uploading their own images.
Clipart Images: When this option is enabled, customers can select from a library of clipart images provided by the merchant for product personalization.
5.CLIPART IMAGES
In app offers a clipart functionality, including a clipart library. Additionally, you can create your own clipart categories, allowing for personalized product customization. This feature provides customers with various options to enhance their designs, making their products truly unique.
Click on the Personalisation Options
There you will find options such as Cliparts, Fonts, Colors, and Background Patterns.
Click on Add New Category
Or else, you can Upload on Clipart Images.
To upload your designs, you can click on Select Designs.
6.Product Color:
Merchants can enable the Product Colors option, allowing customers to select and customize the color of the product during the personalization process. This feature offers customers flexibility in choosing their preferred product colors.
Note: To use this feature, please use only masking images or transparent images.
7.Product Patterns
Merchants can allow customers to change the product pattern in the design studio. If merchants enable this option, customers can select from various product patterns.
Personalization Assets
The app provides functionality for merchants to use default assets such as cliparts, fonts, colors, and background patterns. Merchants can also create their own categories, offering customers the option to personalize products with these assets, including cliparts, fonts, colors, and background patterns.
Cliparts
Font
Colors
BACKGROUND PATTERN
Setting the perfect background pattern the way your customers want.
General Settings
Personalization Layout :The app provides merchants with two layout options for customers to personalize products:
Personalization on Product Page
If this option is enabled, customers can personalize the product directly on the product page. This allows for a seamless shopping experience as they can view and customize their product in real time without leaving the page.
Personalization on Popup
If this option is enabled, customers will use a popup editor to personalize the product. This provides a dedicated space for customization, allowing for a more focused editing experience while keeping the product page intact.
Print Ready File Format
The app provides a feature to receive print-ready files in the following formats. You can enable the option to choose one that best suits your printing needs:
.PNG
.JPG/JPEG
.SVG
Print-Ready File Format:
A print-ready file format is a specific type of file that meets professional printing requirements. It ensures that the artwork is properly set up for production, including the correct resolution, color mode, and trim marks.
You can typically download the print-ready file from your Shopify order page once the product is ordered. The design can be downloaded in PDF, PNG, JPEG, or SVG formats.
When a store owner receives an order for a custom product designed by their customer, they will need the print-ready file to proceed with printing. The chosen file extension will determine how the store owner can use the print file for production. Common formats include PDF, SVG, and JPEG,PNG.
If a store owner's customer has designed a product and placed an order for it, we will provide him with a print file. He can get the print file printed according to the file extension he has selected.
Single or Bulk Add-to-Cart in Customization Popup:
This feature allows customers to either add a single product to their cart or select multiple sizes and quantities for bulk orders directly from the customization popup. The option is configurable from the backend, providing flexibility to enable or disable it based on store requirements. When enabled, customers can easily choose product variants and quantities in a streamlined way, improving the shopping experience for both individual and bulk purchases.
Steps:
Go to the app backend and navigate to General Settings.
Choose Personalization Layout as Product Popup Option.
Enable Single or Bulk Add-to-Cart option.
Once enabled, if the product has variants, customers will see the variant size options on the front end. They can select multiple variant sizes and quantities, then add them to the cart in bulk.
If enabled: All variant size option will display
If disabled: Default product will display
ADDITIONAL LAYER PRICE
Merchants can set that price for every Price Per Text, Price Per ClipArt, Price Per Uploaded Image, or Pattern which the customers.
This is the actual masking of the product and you can clearly see the price of this product.
You can clearly see that the price gets increased once customers add designs they want.
Customize It Button Personalization
This feature allows customers to either add a single product to their cart or select multiple sizes and quantities for bulk orders directly from the customization popup. The option is configurable from the backend, providing flexibility to enable or disable it based on store requirements. When enabled, customers can easily choose product variants and quantities in a streamlined way, improving the shopping experience for both individual and bulk purchases.
The Customize It button allows merchants to personalize the appearance of the button to match their store's branding. Here are the customizable options available:
Button Label: Merchants can change the text displayed on the button to better suit their store’s theme or to provide clearer instructions to customers.
Background Color: The background color of the button can be customized to align with the store's color scheme, ensuring it stands out or blends in as desired.
Text Color: Merchants can choose the text color for the button label, enhancing visibility and ensuring that the text is legible against the button’s background.
Text Over Color Style: This option allows merchants to select styles for the text when hovered over, adding a dynamic effect to enhance user interaction.
Padding: Merchants can adjust the padding around the button, affecting its size and overall appearance, making it more aesthetically pleasing and improving the user experience.
By utilizing these customization options, merchants can create a personalized Customize It button that effectively engages customers and fits seamlessly into their store design.
Translation
The app provides functionality that allows merchants to display the design layout text in their store's language. Merchants can easily add translated text in the Translation tab, ensuring that customers can interact with the design tools in their preferred language. This feature enhances the user experience by making the customization process more accessible and intuitive for a diverse customer base.
If you need further assistance, feel free to ask!
Updated on: 11/03/2025
Thank you!