Mockups

• 2 minutes to read

The Mockups folder contains graphics for the PIM Module. A mockup is a special kind of images used to visualize the products while editing the design.

The PIM Module supports mockups created in Adobe Photoshop in the PSD format. They can be one of the following types or a combination of them:

• Thumbnail
• Editor
• Preview

Let's consider these types in detail.

Thumbnail

The thumbnail mockup is a product miniature. It appears at the initial step, where you select a product variant, or at the same step with the Design Editor.

The recommended size for this mockup is between500 x 500 and 600 x 600 pixels.

In the thumbnail mockup, you can draw the product in perspective or apply transformations to show the design on a realistic representation of a product.

Editor

The editor mockup is a sketch of a product displayed in the Design Editor. The size of this mockup depends on the physical size of the print area. The measurement units may be in, cm, or mm. This mockup helps you place the design in the right location and adjust the size of the uploaded image or shape.

Preview

The preview mockup is used to display the personalization results at the Approval step. This mockup usually shows the product in perspective so that the design applied to it looks as realistic as possible.

Tip

Creating mockups is available only in Photoshop, in the PSD format. To learn how to create mockups for the PIM module, read the Overview section.

Folder hierarchy

Here you will see how you can organize a folder hierarchy for mockups.

To separate one product from another, create a folder for each product.

For example, you may have a product like a bottle sleeve and two mockup files for this product: thumbnail and preview. You can put these files in the product folder without creating subfolders. Such hierarchy will allow you to connect them to the product at the same time.

• Sleeves
  • Thumbnail.psd
  • Preview.psd

Let's consider another example. You may want to add wedding invitations to your products and may have a lot of thumbnail, editor, and preview mockups prepared for this product. In this case, create a separate subfolder for every mockup type.

• Wedding Invitation
  • Thumbnail
    • Curved.psd
    • Rounded.psd
  • Editor
    • Craft paper.psd
    • Regular paper.psd
  • Preview
    • Curved.psd
    • Rounded.psd

---

In the next article, you will learn how to work with color profiles in Customer's Canvas.

To learn more about the PIM module, refer to the PIM Module section.