Skip to main content
All CollectionsMarketing Automation/Visitor TrackingUser FAQ
Setting up Background Images for Activations
Setting up Background Images for Activations

The optimal setup for your Captello digital activation's background.

Patrick Burns avatar
Written by Patrick Burns
Updated over 4 months ago

Captello activations offer a lot of styling options, including options for background images. This article goes into detail to explain each option and how to use them optimally to fit your needs.

All Settings

First, let's go through all the settings, then go through using the settings optimally for every situation.

Background Image Mode: Select whether to use the same image for the mobile apps (phone and tablet) and web view or an image for each (phone, tablet, and web).

Note: Web-view includes launching the URL on a phone or a tablet. The phone and tablet settings only apply to launching the activations on the Captello app.

Background Fit: Choose what happens if the background's resolution does not match the screen's resolution.
​Stretch: The image will stretch horizontally and/or vertically to match the resolution.

Cover: The image will keep its aspect ratio. If the screen is smaller, the image will be cropped to the center, and if the screen is bigger, the image will expand on the same aspect ratio.

Repeat: If the image is smaller than the screen, it will be duplicated to fill the rest of the screen.

Contains: The image will stay in the center, keeping its resolution and aspect ratio, it will neither expand, repeat nor shrink.

Using the Best Settings For Your Needs

The main factor for selecting the right settings is how many devices you will use (monitors, phones, tablets.. etc). Below are the best settings for possible scenarios.

Using Multiple Device Types (Phones, Monitors and Tablets)

In the complex scenario of using multiple device types, it is best to use the following settings:

Background Image Mode: One for All

Background Fit: Cover

Image Resolution: 2560x1440 (16:9 aspect ratio, the most common monitor aspect ratio).

If the background image has a shape/symbol, it's best to keep it in the middle of the image.

The settings above ensure the following:

  • The background will fit the most common monitor aspect ratios.

  • The resolution is high enough that the image will not appear pixelated, even on a big monitor (as long as the image quality is high).
    ​

  • The background will not get distorted by stretching/getting squished, instead, it will be cropped towards the middle to match different aspect ratios, keeping the shape/symbol shown on all screens.

An example of these settings in action is shown below:


​Landscape mode:

Portrait mode:


Notice that the image shows up in full on a landscape screen, but in portrait, it gets cropped to the middle to match the portrait resolution, without stretching/squishing the original image.

Using One Type of Devices

Using one type of device makes the process straightforward. You would upload an image with a similar aspect ratio to your device type.


Using Phones Only

For example, using phones only, you would want the following settings:

Background Fit: Cover

Image Resolution: 1080x2240 (9:19 aspect ratio).

This setup uses a similar aspect ratio to all phones in portrait mode and will crop and fit the image to different resolutions.

Using a Monitor Only

Another example is using the activation just on a big monitor:

Background Fit: Cover

Image Resolution: 2560x1440 (16:9 aspect ratio).

Using Tablets Only

Background Fit: Cover

Image Resolution: 1200x1920 (10:16 aspect ratio).

Tip: One Solution Fits All

Using a solid color or gradients with the 'Stretch' option is a one-solution-fits-all setup.

Solid colors and gradient images that do not have logos/symbols will not get distorted by stretching. You can also use any aspect ratio.

Did this answer your question?