Hi-res print files
- 8 minutes to read
Rendering parameters
The rendering
section of the clientConfig.json configuration file contains parameters for both proof images and print files (so-called hi-res outputs). This topic dwells on the parameters of print files. For details about configuring proof images, refer to the Proof images topic.
{
"rendering": {
"hiResOutputDpi": 300,
"hiResOutputFileFormat": "pdf",
"hiResOutputColorSpace": "cmyk",
"hiResOutputRgbColorProfileName": "",
"hiResOutputCmykColorProfileName": "",
"hiResOutputGrayscaleColorProfileName": "",
"hiResOutputDestinationColorProfileName": "",
"hiResOutputToSeparateFiles": false,
"hiResOutputChannelContainersToSeparateFiles": false,
"hiResOutputChannelContainersRenderEmptyPage": true,
"hiResOutputBackgroundColor": "rgba(255,255,255,0)",
"hiResOutputCompression": "jpeg",
"hiResOutputJpegCompressionQuality": 90,
"hiResOutputFlipMode": "none",
"hiResOutputRotateMode": "none",
"hiResOutputPdfMetadata": {
"author": "",
"creator": "",
"keywords": "",
"subject": "",
"title": ""
},
"hiResOutputInStringPlaceholderHintsEnabled": false,
"hiResOutputPdfFormat": "Default"
}
}
Name | Description | Default value | Possible values |
---|---|---|---|
hiResOutputDpi | image resolution in dots per inch (DPI) | 300 |
integer |
hiResOutputFileFormat | the type of the hi-res output | "PDF" |
"PDF" , "JPG" , "PNG" , "TIFF" |
hiResOutputColorSpace | the color space of the hi-res output | "cmyk" |
"cmyk" , "rgb" , "grayscale" |
hiResOutputToSeparateFiles | if true , the hi-res output for each side of a multipage product will be put in a separate file |
false |
boolean |
hiResOutputBackgroundColor | The background color for the hi-res output. The value in the config is "rgba(255,255,255,0)" . |
color in css-compatible format | |
hiResOutputCompression | the type of hi-res output compression; "jpeg" and "zip" are supported for PDF files only, whereas "lzw" is supported for TIFF files |
"jpeg" |
"jpeg" , "zip" , "none" , "lzw" |
hiResOutputJpegCompressionQuality | JPEG compression quality in percent; this parameter makes sense only for JPEG and PDF formats. | 90 |
integer from 0 to 100 . |
hiResOutputRotateMode | rotates hi-res outputs clockwise to render products with different orientation of pages | "none" |
"none" , "rotate90" , "rotate180" , "rotate270" |
hiResOutputInStringPlaceholderHintsEnabled | Displays hints for unfilled in-string placeholders in hi-res outputs. The value in the config is false . |
boolean |
Any rendering configuration parameter can also be set up via the IRenderingProperty interface. For example, the following snippet configures the Design Editor to render a product in CMYK PDF files.
let configuration = {
rendering: {
hiResOutputColorSpace: "CMYK",
hiResOutputFileFormat: "PDF",
hiResOutputDpi: 300
}
};
Note
The Design Editor generates either vector PDF files or raster JPEG/PNG/TIFF images as the high-resolution output.
Since the PNG format was designed for transferring images on the Internet, it does not support the CMYK color space.
To avoid any problem with fonts and render products as close as possible to the designs, text is saved to PDF files as vector paths.
Color profiles
When rendering print files, color management is always enabled. You can define a color space and a specific color profile. Note that the color profile should correspond to the specified color space.
The Design Editor supports both the device-independent and device-dependent color spaces. Before using custom color profiles, you must copy them to the ..\assets\ColorProfiles\ folder. To set up device-independent profiles, you can use the following parameters.
Name | Description | Default value | Possible values |
---|---|---|---|
hiResOutputColorSpace | the color space of the hi-res output | "cmyk" |
"cmyk" , "rgb" , "grayscale" |
hiResOutputRgbColorProfileName | the name of an RGB color profile | "sRGB IEC61966-2.1" |
string |
hiResOutputCmykColorProfileName | the name of a CMYK color profile | "SWOP (Coated) 20%, |
string |
hiResOutputGrayscaleColorProfileName | the name of a color profile for grayscale outputs | "Dot Gain 30%" |
string |
hiResOutputDestinationColorProfileName | the name of a color profile for the CMYK preview mode | "SWOP (Coated) 20%, |
string |
hiResOutputPdfFormat | If "X4" , enables DeviceCMYK and does not embed any color profile into the resulting PDF file in the PDF/X-4 standard. By default, print files are generated in PDF 1.4. |
"Default" , "X4" |
At runtime, you can specify device-independent profiles in the hiResOutputRgbColorProfileName
, hiResOutputGrayscaleColorProfileName
, and hiResOutputCmykColorProfileFileName
parameters of the rendering
config, for example:
let configuration = {
rendering: {
hiResOutputColorSpace: "rgb",
hiResOutputRgbColorProfileName: "Adobe RGB (1998)",
proofImageFileFormat: "png",
proofImageRgbColorProfileName: "Adobe RGB (1998)"
}
};
Important
To define an ICCBased profile in clientConfig.json, use its full name. For example, if you want to use the CoatedFOGRA39.icc
color profile, define it in hiResOutputCmykColorProfileName
as "Coated FOGRA39 (ISO 12647-2:2004)"
, not CoatedFOGRA39.icc
or CoatedFOGRA39
.
You can also specify color profiles for each output color space (grayscale, RGB, and CMYK) for all products in ~/Configuration/Aurigma.DesignAtoms.config, using the RgbColorProfileFileName
, CmykColorProfileFileName
, and GrayscaleColorProfileFileName
parameters, as follows:
<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>
Important
To define an ICCBased profile in Aurigma.DesignAtoms.config, use its file name. For example, if you want to use the CoatedFOGRA39.icc
color profile, define it in CmykColorProfileFileName
as CoatedFOGRA39.icc
.
By default, ICCBased profiles specified with these four 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 picked as the destination profile.
If a graphic object has its own embedded profile, it will be used as the source profile. If it does not have an embedded color profile, then a profile configured in Aurigma.DesignAtoms.config will be used as the source profile depending on the color space of the graphics objects. If the color profiles are not configured in Aurigma.DesignAtoms.config or specified files are missing, then the following 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
To render high resolution outputs in a device-dependent color space, set either hiResOutputPdfFormat
to "X4"
or the PdfRenderDeviceProfileEnabled
parameter to True
in Aurigma.DesignAtoms.config.
<Aurigma.DesignAtoms>
<add key="PdfRenderDeviceProfileEnabled" value="True" />
</Aurigma.DesignAtoms>
In this case, hi-res outputs will not contain any associated color transformation data, and the PDF file will be generated in the PDF/X-4 standard.
You can find more details in the Color Management topic.
Multipage products
When rendering multipage products, you can get a single hi-res output file containing all pages or multiple files, one per each page in the product. This behavior is configured via the two parameters, hiResOutputToSeparateFiles
and hiResOutputFileFormat
. The hiResOutputToSeparateFiles
parameter specifies if an output file should be created for each page of a product. The hiResOutputFileFormat
parameter is involved because the only hi-res output format in Design Editor which can contain multiple pages is PDF.
Name | Description | Default value | Possible properties |
---|---|---|---|
hiResOutputToSeparateFiles | if true , the hi-res output for each side of a multipage product will be put in a separate file |
false |
boolean |
hiResOutputFileFormat | the type of the hi-res output | "PDF" |
"PDF" , "JPG" , "PNG" , "TIFF" |
To create a single hi-res output file containing all product pages, set the output type to PDF
and disable rendering to separate files. In this case, the output file will be named result.pdf.
You can make this configuration default for all products through the clientConfig.json file.
"rendering": {
"hiResOutputToSeparateFiles": false,
"hiResOutputFileFormat": "PDF"
}
To change these parameters on a product level without changing global settings in clientConfig.json, use the IRenderingProperty interface in the Iframe API.
let configuration = {
rendering: {
hiResOutputToSeparateFiles: false,
hiResOutputFileFormat: "PDF"
}
};
To create multiple hi-res output files, one for each page, you can enable rendering to separate files of any of the supported file formats.
Flipping hi-res outputs
You can flip hi-res outputs by using the hiResOutputFlipMode
parameter.
Name | Description | Default value | Possible values |
---|---|---|---|
hiResOutputFlipMode | the flip mode for hi-res outputs | "none" |
"none" , "vertical" , "horizontal" , "both" |
To set it globally for any product, change clientConfig.json.
let configuration = {
rendering: {
hiResOutputFlipMode: "horizontal"
}
};
To flip only one surface, use IPrintAreaDefinition
.
let productDefinition = {
surfaces: [{
printAreas: [{
designFile: "BusinessCard",
hiResOutput: { flipMode: "both" }
}]
}]
}
Setting up PDF metadata
If you choose the PDF type of hi-res outputs, you can specify PDF metadata.
Name | Description | Default value | Possible properties |
---|---|---|---|
hiResOutputPdfMetadata | PDF metadata of hi-res outputs | null |
"author" , "creator" , "keywords" ,"subject" , "title" |
To set up metadata globally for any product, pass the following configuration to the loadEditor method or update clientConfig.json with this configuration.
let configuration = {
rendering: {
hiResOutputPdfMetadata: {
title: "The red postcard",
keywords: "red,flower,postcard"
}
}
};
Also, you can specify PDF metadata at runtime by using the setPdfMetadata method. For such an example, refer to the topic describing Tagging designs.
PDF page boxes
When you choose the PDF type of hi-res outputs, you can also specify page boxes to crop resulting PDF files. The Design Editor supports CropBox
, TrimBox
, and BleedBox
. To specify one of these page boxes, you need to set the pdfBox
property to either "Crop"
, "Trim"
, or "Bleed"
when defining safety lines. Margins of safety lines are applied to the corresponding PDF page boxes. For example, you can define CropBox
with left/right margins of 8 points and top/bottom margins of 10 points as follows:
let productDefinition = {
surfaces: [{
designFile: "invitation",
safetyLines: [
{
margin: { horizontal: 8, vertical: 10 },
color: "rgba(10,200,10,0.7)",
pdfBox: "Crop"
}
]
}]
};
Channel containers
You can design print embellishments in the editor through channel containers. The Design Editor allows you to render these channel containers and the base design to the same PDF output file or to separate PDF files.
Name | Description | Default value | Possible properties |
---|---|---|---|
hiResOutputChannelContainersToSeparateFiles | enables rendering spot colors and textures to separate PDF files | false |
boolean |
hiResOutputChannelContainersRenderEmptyPage | to maintain the same number of pages in output files of the base design and channel containers, this parameter allows you to add empty pages to PDF with spot colors and textures if the corresponding pages of the base design do not have channel containers | true |
boolean |
You can specify how to render channel containers in clientConfig.json or through the IConfiguration
interface, for example:
let configuration = {
rendering: {
hiResOutputFileFormat: "PDF",
hiResOutputChannelContainersToSeparateFiles: true,
hiResOutputChannelContainersRenderEmptyPage: true
}
};