You can import Photoshop Document (PSD) files to your Image and Video Template designs in the Creative Editor. If you are using a template set that contains multiple Image or Video templates, you can import a different PSD to each template if needed.

ℹ Note: The PSD can only contain one artboard.

To import a PSD file, pick the file from your computer. In Video Templates, you can also drag and drop it to the canvas.

In the guide below, we'll present a quick look into how this works. At the end of the article, you'll find further details as well as some limitations you should be aware of before importing PSD files.

How it works

• After importing the PSD file, Smartly.io automatically reads all layers from the file.

• Text layers in the PSD file are transformed into text layers in the template. All other layers are transformed into image layers. These images are not saved to your Smartly.io library.

• All Video and Image Templates Editor actions are available for the imported text and image layers.

• If the Image or Video Template does not contain any layers before importing, the height and width settings from the PSD file will determine the template format. If the template contains layers before a PSD file is imported, the template format won’t change.

• You can import multiple PSD files in one template. In Video Templates, the layers appear on the editor timeline at the playhead position. This enables, for example, creating a video storyboard in Photoshop and importing several PSD files to Video Template editor.

• If you use Adobe Illustrator, export your design as a PSD file to use it with Smartly.io Video and Image Templates.

• You can convert static image layers from the PSD file into dynamic images in Smartly.io. For example, you can set up a placeholder image in Photoshop and replace it with a product image from a feed.

Preparation, limitations, and workarounds

Before importing your PSD file, refer to this list to properly prepare your design for import.

• Note: The PSD can only contain one artboard.
• Use 8-bit RGB color mode
  • CMYK, Grayscale, and other color modes are not supported.
  • In Photoshop, select Image → Mode → RGB Color and 8Bits/Channel. 
• Font selection might be reset during import.
  • Make sure you upload your selected fonts and typefaces to the asset library in one of the supported formats before importing.
• Font selection might not match what is used in Photoshop
  • The font might look different and not be picked up if Photoshop uses a different font version than what has been loaded into Smartly.
  • You can mitigate this by naming the font files that you upload to Smartly to be exactly named as what you have in Photoshop. 
• Font-weight might change during the import.
  • If the editor cannot detect the right font-weight for the given font, the font-weight might not correspond to the font-weight used in the PSD file.
• Faux bold or italics are not supported in the editor
• Layer styles and effects (Blending Options) are not supported.
  • In Photoshop, either right-click on the layer in question and select “Convert to Smart Object" or right-click on the layer and select Rasterize Layer Style.
• Mask layers are not supported.
  • In Photoshop, either right-click on the layer in question and select “Convert to Smart Object" or right-click on the mask thumbnail and select Apply Layer Mask.
• Text color settings might be reset during import.
  • In the template editor, reselect the color by editing the imported text layer and modifying the Text color & opacity (Image Template) or Text Format (Video Template) section.
• There is no size limit for PSD file uploads, but large files might take some time to upload.
  • While there is no file size, PSD layers should be 4x4px at minimum and 6000x6000px at maximum for images, videos do not support layers larger than 3000x3000px.

Additional tips for preparing your PSD files

Label everything clearly
Smartly will keep layers named exactly as you have them in Photoshop. Consider pre-labeling which layers will be dynamic and connected to the feed i.e., Product Image (Dynamic)

Clean up your file
Folders won’t be recognized so help yourself out by simplifying your layer structure now. Delete any assets you won’t need in your final template and again, use Smart Objects as needed.

Making the creatives dynamic
If you are looking for variating the text content from the feed, the next step after the import is to update the text columns and to be dynamic elements from a data source such as the automation feed. See more here on how to attach a data source to your templates.

Other software

Adding support for importing Photoshop files also unlocks the ability to bring in your work from other design software.

• For Adobe Illustrator, you can directly export your design as a PSD file. Simply navigate to File → Export → Export As and choose "Photoshop (PSD)". See this tutorial for a more detailed guide to exporting your design.
• Similar to Illustrator, in Affinity Designer, you can navigate to File → Export and select PSD as your format.
• For Sketch files, you can copy your Sketch design to Affinity Designer and then export it as a PSD. See this tutorial for a more detailed guide.