Importing artwork

Last updated on May 15, 2025
•
3 minutes to read

To add designs to storage, you can create or import them first. Let's learn how you can import artwork created in external tools, like Adobe Photoshop and InDesign. Such artwork may be created by professional designers and contain many design elements and document settings. In this case, you can also predefine how the design elements should behave in the editor.

The endpoint POST /api/processor/v1/designs/import allows you to import artwork and save it to storage. The source file can be an internal Customer's Canvas state file or a graphic file in PSD or IDML format. If needed, you can generate a design preview with this endpoint.

curl -X \
POST "https://api.customerscanvashub.com/api/processor/v1/designs/import" \
-H  "accept: application/json" \
-H  "Authorization: Bearer <TOKEN>" \
-H  "Content-Type: multipart/form-data" \
-F  "sourceFile=@test-page.psd;type=image/psd" \
-F  "previewSettings.makePreview=true" \
-F  "previewSettings.width=300" \
-F  "previewSettings.height=300" \
-F  "previewSettings.name=thumbnail" \
-F  "previewSettings.namespace=mystore"

POST https://api.customerscanvashub.com/api/processor/v1/designs/import
{
    "sourceFile" = "@test-page.psd;type=image/psd",
    "previewSettings.makePreview" = true,
    "previewSettings.width" = 300,
    "previewSettings.height" = 300,
    "previewSettings.name" ="thumbnail",
    "previewSettings.namespace" = "mystore"
}

var tenantId = 12345;    // Put your tenant ID here
var sourceFile = "@test-page.psd;type=image/psd"; // Put design file name settings here
var makePreview = true;    // Put true if a preview is needed
var width = 300;           // Put your preview width here
var height = 300;          // Put your preview height here
var name ="thumbnail";     // Put your preview name here
var namespace = "mystore"; // Put your preview namespace here
var design = await designProcessorApiClient.ImportDesignAsync(tenantId, null, null, null, makePreview,
                                            namespace, name, width, height, null, null, sourceFile);

var tenantId = 12345; // Put your tenant ID here
var sourceFile = "@test-page.psd;type=image/psd"; // Put design file name here
var makePreview = true;    // Put true if a preview is needed
var width = 300;           // Put your preview width here
var height = 300;          // Put your preview height here
var name ="thumbnail";     // Put your preview name here
var namespace = "mystore"; // Put your preview namespace here
var design = _designProcessorApiClient.importDesign(tenantId, null, null, null, makePreview,
                                       namespace, name, width, height, null, null, sourceFile);

$tenantId = 12345; // Put your tenant ID here
$sourceFile = "@test-page.psd;type=image/psd"; // Put design file name here
$makePreview = true;    // Put true if a preview is needed
$width = 300;           // Put your preview width here
$height = 300;          // Put your preview height here
$name ="thumbnail";     // Put your preview name here
$namespace = "mystore"; // Put your preview namespace here
$design = $designProcessorApiClient->designProcessorImportDesign(sourceFile, tenantId, null, null, null,
                                     makePreview, namespace, name, width, height);

After a design has been imported to storage, there may be situations that will not allow working with the design normally, for example, font files or data schemas may be deleted. In BackOffice, this is indicated by the red icon on the design thumbnail, and its hasProblems property will have the true value. To get the details about such problems, use the endpoint POST /api/processor/v1/designs/{id}/check.

curl -X \
POST "https://api.customerscanvashub.com/api/processor/v1/designs/6551d8abef47c0b108dc75de/check" \
-H  "accept: application/json" \
-H  "Authorization: Bearer <TOKEN>"

POST https://api.customerscanvashub.com/api/processor/v1/designs/6551d8abef47c0b108dc75de/check

var designId = "6551d8abef47c0b108dc75de"; // Put your design ID here
var problems = await designProcessorApiClient.CheckAsync(designId);

var designId = "6551d8abef47c0b108dc75de"; // Put your design ID here
var problems = await _designProcessorApiClient.check(designId);

$designId = "6551d8abef47c0b108dc75de"; // Put your design ID here
$problems = $designProcessorApiClient->designProcessorCheck($designId);

A response for a design with missing fonts may look as follows:

{
  "fontMissingProblems": [
    {
      "postscriptName": null,
      "name": "Roboto_Condensed"
    },
    {
      "postscriptName": null,
      "name": "Raleway"
    }
  ],
  "dataValidationProblems": [],
  "dataSchemaMissingProblem": null
}

After you have changed a source design file, you can re-import the design to storage. The endpoint POST /api/processor/v1/designs/{id}/re-import is used when you need to replace a file without losing its metadata and ID. It will replace the design, its name, and file metadata, but the ID will remain the same. It is convenient when you are updating designs already associated with some products in your online store.

Further Reading

Learn how to create new designs using this API.
Explore how to create and manage preview images.
Dive into Asset Processor API reference.

Importing artwork

Was this page helpful?