Images make your configurator much more attractive and increase purchase confidence. With image visualisation customers immediately see what the configured product looks like with each selection.
Which Method Is Right for Me?
I have product photos in different variants (e.g. roller blind in White, Anthracite, Bronze) → Option images
I want to combine variants visually (e.g. colour + panel should both be visible at the same time) → Layer technology (combined image)
I want a rotatable product view → 360°
Option Images
The simplest approach: each option gets its own image. When the customer selects an option, the corresponding image is shown.
Adding an image to an option:
- Features tab → click the feature (e.g. "Colour")
- In the right panel open the VALUES section → click the option
- In the IMAGE section upload the image
- Recommended format: JPG or WebP, 800×800 px, white or transparent background
Typical use: colour selection — each colour shows the product in the chosen colour.
Layer Technology (Combined Image)
With multiple configurable features affecting the visual, one photo per combination would quickly mean hundreds of images. Layer technology solves this:
Instead of a complete image per combination you add transparent PNG layers per option. configento.app overlays the layers in real time to create the finished product image.
Example — Roller Blind:
- Base layer: frame and box (always visible)
- Layer Colour White: white slat image (transparent)
- Layer Colour Anthracite: anthracite slat image (transparent)
- Layer Drive Electric: motor box at top (transparent)
Activating layers:
- Under Settings → General → IMAGE SETTINGS: choose Combined Product Image
- Per option: in the right panel open the IMAGE section → Upload layer
- Upload a transparent PNG — all layers must have exactly the same image size
- Set the z-index (higher value = further to the front)
Important: All layers must have the same resolution (e.g. all 1200×1200 px), otherwise the overlay will not align.
360° View
For a rotatable product view upload shots from all angles.
Requirements:
- 24 to 48 images (the more, the smoother the rotation)
- Same image size and lighting for all shots
- Images sorted in the correct direction of rotation
Setup:
- Under Settings → General → IMAGE SETTINGS: choose 360° combined product image
- Upload all images in the correct order
Layer technology also works in 360° mode.
Image Size and Performance
| Format | Recommendation |
|---|---|
| Option images | 800×800 px, JPG or WebP |
| Layers | 1200×1200 px, transparent PNG |
| 360° images | 800×800 px, JPG |
Images that are too large slow down the configurator — especially on mobile devices. WebP offers the best compression.
Image Position
Under Settings → General → IMAGE SETTINGS → Merkmalbilder position you set whether the product image appears to the left or right of the features.