What is a product?

• 7-8 minutes to read

In this article, you will learn how to start working in Customer's Canvas. First, you will read how a customer interacts with your storefront products.

Then, you will read how Customer's Canvas helps you automate your processes. For example, Customer's Canvas provides options and option values for your product, a design, and then creates a high resolution print file.

Next, you will consider the concepts of Customer's Canvas products in detail such as a product, assets, product variants, and so on. Each paragraph contains the link to the corresponding sections with tutorials.

Let's start from a storefront product.

Storefront product

Your product catalog consists of storefront products. They configure customer navigating.

A storefront product consists of product variants. These are all the items that you sell in your product.

For example, your product is a T-shirt, and your customer can select its color: green, blue, or white. So, you sell three product variants in the T-shirt storefront product.

When customers select your product, they start a personalization process.

Personalization process

A personalization process is the process when your customers edit a product variant design. Customer's Canvas allows you to set up a personalization process for your ideas. You can find different examples in our Demo section.

Let's consider an example of a personalization process.

1. First, your customer selects a storefront product.
2. Then, the customer selects a product variant: green, blue, or white T-shirt. Let's assume that a customer selects a green T-shirt.
3. Your customer starts personalization: adds text or uploads a photo.
4. Next, your customer approves the personalization result and adds the product to a cart. Customer's Canvas creates a cart product.

Cart product

When customers add your product to cart, your storefront creates a cart product and add this product to a cart.

A cart product is based on:

• A product variant from Customer's Canvas product
• Personalization data by a customer

The counterpart of a storefront product is a Customer's Canvas product. Let's consider what this product contains.

Customer's Canvas product

Customer's Canvas product defines the counterpart of a storefront product. Read the Creating products article, to learn how to create a new product.

This product contains:

• Options and option values
• Product variants
• SKU
• Assets
• Product links
• A workflow with personalization process
• A pipeline

These components define your storefront product. Customer's Canvas product provides your personalization process, options and option values, product variants, SKU, editors, and assets.

When a customer clicks the Add to card button, Customer's Canvas renders a high-resolution image and creates a project. In this project, you will see how pipeline has worked and download the image to print.

You can see the area of responsibility in the following schema.

Let's consider the product properties in detail.

Option and option values

An option configures a product. For example, Color and Size. Options may impact on a product price, product appearance, and so on.

Options have option values. They define an option. For example, your option is Color, and the option value are Green, Blue, and White

Let's see an example. Imagine that your product is a T-shirt. The options and the option values are the following:

• Size: S and M
• Color: Green, Blue, and White

Read the Editing options article to set up options and option values in a product.

Let's see how options and option values may affect the price and the appearance of a product:

1. Your product is a T-shirt. The product has the Color option. Whether a customer selects a color, it doesn't affect the price.

2. Your product is a business card. The product has the Paper Quality option. Depending on the paper quality, the final price will be different.

3. Your product is a brochure. The product has the Orientation format. If you select the portrait, you will see a vertical design. If you select Landscape, you will see a horizontal design. This doesn't affect the price.

Option and option values define product variants.

Product variants

Product variants are the combinations of options and option values in a product.

For example, your product is a T-shirt, and your options and option values may be the following:

• Size: S and M

• Color: Green, Blue, and White

In this case, the product will have the following variants:

• Green/S

• Green/M

• Blue/S

• Blue/M

• White/S

• White/M

When a customer selects the Black color and the S size, Customer's Canvas selects the Black/S product variant.

Read more about product variants properties in the Variants article.

SKU

SKU is a stock keeping unit. Each product variant has SKU. SKUs allow you to:

• Account your merchandise in a warehouse
• Add your product to a cart on your storefront

Read how to set SKU for your product variants in the Variants paragraph.

Availability

Sometimes you may find some product variants out of stock. For example, your white t-shirts of the L size are over. Your customers can't select such a variant to add to a cart.

In Customer's Canvas, you can manage the availability of a product variant by the Available property. Learn how to do this in the Variants paragraph.

Assets

Assets are files for personalization purposes. They can be divided into groups:

• Graphics: designs, mockups, and images.
• Visual elements: fonts, color profiles, and documents.

Designs

When customers want to buy your product, they personalize designs, and then you print this design file for a customer.

Let's see an example. This is the design of a brochure.

Learn more about designs in the Designs section.

Customer's Canvas suggests you several tools to create a design:

• Adobe Photoshop
• Adobe InDesign
• Template Editor

You can learn more about creating designs in the Designer's Manual section.

Mockups

A mockup is a realistic image of your product. After the personalization process, customers can see how the result looks like on the surface of a product. Learn more about mockups in the Importing mockup files article.

You can create mockups only in the PSD format in Photoshop in the PSD format. To learn how to create mockups, read the Creating mockups section.

Images

You can organize a collection of images, clipart, and photos for your different purposes. Read more in the Images article.

Fonts

You can add text to your designs. You need to upload fonts before creating a design in Template Editor or import PSD or IDML designs.

Note

Customer's Canvas supports the TTF and OTF font formats.

Learn more about fonts in the Fonts article.

Color profiles

Customer's Canvas uses color profile files in the ICC and ICM formats. They are used in color management when it is necessary to convert color spaces defined for graphic elements or the entire design, for example, from RGB to CMYK. Your account already has pre-installed universal color profiles. However, to achieve accurate color conversion, you may need to upload color profiles for your specific printing equipment.

Read more about color profiles in the Color profiles article.

Documents

For packaging, you need to connect die cut models when defining products. These models are saved in PDF documents.

For classifying design elements and setting the properties of these classes, Customer's Canvas uses toggle sets. They are saved in the JSON format.

Connecting assets

Designs and mockups provide visualization of a product in a storefront. To make this happen, you must connect them to your product.

When you connect assets to a product, you select option values for an asset.

For example, the green-s.png file may represent the Green and S option values.

To learn how to connect assets to a product, read the Connecting assets to products article.

Workflows

A workflow configures a personalization process. This process defines how your customer will personalize a product.

Customer's Canvas allows you to create your own personalization processes for your product in workflows files. These are JSON files, where you can define steps, widgets, and additional data.

Read more about workflows in the Workflows section.

Projects

Customer's Canvas creates projects, when your customers create an order. A project keeps the result of personalization process.

In a project, you can see information about the order:

• Status of this project
• A customer's name
• Dates of creation and last modification
• Your integration
• Order line item
• Pipelines
• High-resolution print file

Read more about projects in the Projects section.

Pipelines

Pipelines define what happens to an order when a customer adds a product to a card. They are a sequence of tasks. You can see your pipeline in your project.

A pipeline may consist of:

• Rendering a PDF file
• Post-processing the PDF file
• Delivering the result and so on

A pipeline is a JSON file containing tasks.

Read more about creating a pipeline in the Order processing pipelines section.

Integration

You can integrate Customer's Canvas to your custom storefront or in an e-commerce system. In the Customer's Canvas integrations section, you can read how to integrate Customer's Canvas to several e-commerce systems such as: Shopify, WooCommerce, nopCommerce, and Magento. If you have a custom storefront or work in other e-commerce system, read the Developer Center.

Connection to storefront products

A product link is a connection between a Customer's Canvas product and a storefront product. Read the Connecting products to an e-commerce system article to set up a product link.

Product links allow your storefront product to use properties from your Customer's Canvas product:

• Options and option values

• Product variants and their settings

• SKU

• Connected designs and mockups

• Workflow

• Pipeline