Image Areas | Options > Fit Mode

Image Areas | Options > Fit Mode

Please note that Fit Modes have been updated and as of 2022 there are 3 additional types which are detailed below - These types are Relative, Relative Contain and Tile.

Top Tip: Watch on full screen for best quality / viewing experience!
Please note the video does not yet contain the additional Fit Modes but will be updated in due course.

What are Fit Modes?
Fit Modes are a range of presets that control how uploaded images are scaled by default (within the defined image area).

How Do I Set Fit Modes?
Fit Modes can be set by creating an image area for a product and within the "Behaviour" dropdown of an image the Fit Mode can be set as shown below. 

Please note this screenshot is taken from the V3 Kornit X Platform. 

Below we have listed the available fit modes for all users of the Kornit X System. 

Contain
Displays the entire image in the image area based on its longest side. A typical use of this fit mode could be to display a logo or image that should not be cropped.
Note: The image may still be scaled manually once it has loaded so that it is exceeds the boundary of the image area. To prevent the user from doing this it is possible to disable the move, rotate and scale options on the image area, or use the Contain (Strict) option - see below.


Cover
Scales the image to fill the image area completely so that there's no empty space. This can result in some of the image being cropped. A typical use case of this fit mode could be for Photo upload products
Note: The image may still be scaled smaller using this fit mode, thus introducing empty space. To prevent the user from doing this it is possible to disable the move, rotate and scale options on the image area or use the Cover (Strict) option - see below.

Contain (strict)
Identical to the Contain fit mode except it does not allow the user to drag the image beyond the extents of the image area. In order to use this fit mode, any rotation must be disabled.
Important Note: This option requires v3 of the core Personalise-IT software and is therefore only supported in specific Apps. 

Cover (strict)
Identical to the Cover fit mode except it does not allow the user to scale down the image to a point at which empty space would be introduced to the image area. In order to use this fit mode, any rotation must be disabled.
Important Note: This option requires v3 of the core Personalise-IT software and is therefore only supported in specific Apps.

Actual
Sets the scale to 1:1 pixels in the App preview based on the pixel dimensions of the raw uploaded image.
The below 3 are the newest Fit Mode examples
Relative
With using this option images are not auto scaled and are instead displayed at original size 'relative' to the size of the area. 
Please note that any uploaded images are not automatically scaled, therefore images that are larger than the defined area will be cropped. 


Relative Contain
Uploaded images are displayed at their original size, unless they are larger than the area, in which case they are auto-scaled to avoid cropping. This has been shown with the example image below which is using a 2000 by 1000 pixel PNG image. 


Tile
Selecting this option will mean that for any uploaded images they will be automatically tiled at the original size (relative) to fill the area. An example of this is shown below on a phone case. 

Scaling the image will increase or decrease the number of tiles automatically.
    • Related Articles

    • Print Areas | Artwork > Adding Artwork and Artwork Fit-Mode

      This video is a lesson taken from our Academy course: Mastering Product Creation (Level 1).  For more information or to enrol on available courses go to: https://academy.custom-gateway.com/ Top Tip: Watch on full screen for best quality / viewing ...
    • Print Areas | How to Add Bleed (setup and preview options)

      Overview The print output file generated by the system is determined by the Print Size specified on a product's Print Area. If Bleed is a requirement, then it should always be included when setting the Print Size in mm. This document will cover the ...
    • Text Areas | Options > Hyphenation

      Level 3: This article will presume product setup knowledge and familiarity with Text Area functionality Overview Hyphenation is an advanced text feature that automatically splits words at a suitable place to allow the content to 'fit' to a specified ...
    • Image Areas | Anchor Gravity

      What is Anchor Gravity? Anchor Gravity is an Image Area setting that allows creators to define a specific default load position for uploaded images, in relation to the Image Area boundary. The Anchor Gravity dropdown menu provides the following ...
    • Image Areas | What is an image area?

      This video is a lesson taken from our Gateway Academy course Mastering Product Creation (Level 1).  For more information or to enroll on available courses go to: https://academy.custom-gateway.com/