Color management in Design Editor

• 3 minutes to read

Colors on the design may not match colors on the hi-res output, especially if you are using the CMYK format. This happens due to various factors, such as the device-dependency of image color formats, inks, paper color, and other factors that affect output colors. To negate this effect, there is a special technique called color management, and Customer's Canvas supports it.

Configuring Color Management in Customer's Canvas

A system that implements color management must be able to obtain the color characteristics from color profiles, which uniquely define the color characteristics of the pixels. Customer's Canvas requires two types of such profiles: a source and a destination. The destination is the profile for your hi-res output. The source is the profile for any graphics loaded into the editor. Different graphic objects may have different profiles. For example, if you load an image into the editor, it may have its own embedded color profile.

To configure color management, you need to copy your color profiles to the ..\assets\ColorProfiles\ folder and specify them in ~/Configuration/Aurigma.DesignAtoms.config, using the RgbColorProfileFileName, CmykColorProfileFileName, and GrayscaleColorProfileFileName parameters for the corresponding color spaces.

<Aurigma.DesignAtoms>
    <add key="ColorProfilesDirectory" value="..\assets\ColorProfiles" />
    <add key="GrayscaleColorProfileFileName" value="grayscaleColorProfile.icc" />
    <add key="RgbColorProfileFileName" value="rgbColorProfile.icc" />
    <add key="CmykColorProfileFileName" value="cmykColorProfile.icc" />
</Aurigma.DesignAtoms>

By default, profiles specified with these three settings are used as destinations depending on the color space passed in the hiResOutputColorSpace parameter. For example, if you render the products to a CMYK hi-res output, the profile configured in CmykColorProfileFileName will be chosen as the destination profile.

Also, Customer's Canvas allows you to specify a destination profile through IConfiguration. In this way, you can specify profiles dynamically for a single product.

configuration = {
    rendering: {
        hiResOutputColorSpace: "cmyk",
        hiResOutputRgbColorProfileName: "US Sheetfed Coated v2"
    }
};

With source profiles, the rule is simple. If a graphics object has its own embedded profile, it will be used as the source profile. If it does not have an embedded color profile, one of three profiles configured in Aurigma.DesignAtoms.config will be used as the source profile depending on the color space of the graphics objects. The profile configured in RgbColorProfileFileName will be picked for RGB objects, CmykColorProfileFileName for CMYK objects, and GrayscaleColorProfileFileName for grayscale objects. If the color profiles are not configured in Aurigma.DesignAtoms.config or specified files are missing, then the standard profiles are applied:

• SWOP (Coated) 20%, GCR, Medium profile for CMYK
• sRGB IEC61966-2.1 profile for RGB
• Dot Gain 30% profile for Grayscale

Enabling DeviceCMYK for Hi-res PDF Files

In some cases, you may want to prohibit your printing equipment from applying additional color management onto hi-res PDF files generated by Customer's Canvas. Each color conversion leads to changes in colors and additional color management steps may mess up colors in the design, for example, replacing the true black color with combinations of cyan, magenta, and yellow. To avoid this, you need to enable DeviceCMYK and set up the destination CMYK profile in Customer's Canvas with the one compatible with your printing equipment.

To avoid undue conversions of the color space, you need to consider designing your CMYK templates with the destination color profile in the first place. In this case, there will be no color conversion of graphics loaded from the template when it is saved to hi-res PDFs. The only layers for which the conversion will actually be happening are the ones changed by the user. If the user uploads images, the editor will have to convert them to the destination CMYK profile when generating hi-res PDF files.

To enable DeviceCMYK in the Design Editor, modify the configuration files:

1. Add the PdfRenderDeviceProfileEnabled parameter to ~/Configuration/Aurigma.DesignAtoms.config and set it to True.

   <Aurigma.DesignAtoms>
       <add key="PdfRenderDeviceProfileEnabled" value="True" />
   </Aurigma.DesignAtoms>
   

2. Set the hiResOutputColorSpace property to "cmyk" in clientConfig.json or through IConfiguration.

   configuration = {
       rendering: {
           hiResOutputColorSpace: "cmyk",
           hiResOutputRgbColorProfileName: "US Sheetfed Coated v2"
       }
   };
   

Note

When you set either PdfRenderDeviceProfileEnabled to True globally or hiResOutputPdfFormat to "X4" for a single product, Design Editor creates PDF/X-4 files and does not embed any color profile into the resulting file.