B.Layer allows you to easily add images or gifs to your in-app message.

Required: at least one template with an image component. All templates are initially setup with an image component. See here on how to add an image component to your templates.

Image sizes

What is important to bear in mind is the total size of your in-app message.

Braze displays a warning when you upload an in-app message that is bigger than 300Ko. In practice, this warning is a legacy alert, and the real limit is 2Mo. Our testings revealed that the ideal size sits below 1Mo in order to optimize the deliverability to low connectivity users.

→ As a result, we limit the size of the images you can import to 100Ko.

→ You can work around this limit by using the "Import from link" feature and upload your image / gif to your Braze media library.

Uploading an image

This technique minimizes the time to load the image when the IAM is triggered. The image will sit in the IAM zip file. Prefer this technique if your image is under 100Ko.

1. Create a new IAM/edit an existing IAM
2. Make sure to select a template including an image component.
3. On the IAM mockup on the left, click on "Upload an image"
4. Select an image lighter than 100Ko
5. Submit ✔️

Importing a large image / GIF

This technique allows you to work around the 100Ko limit. It allows you to stream the image from a URL rather than having your image sitting in the IAM zip file. However, be mindful that low connectivity users may have trouble seeing your image when the IAM is triggered.

1. Upload your image/gif to your Braze Media Library. In Braze, you will find it under Templates & Media / Media Library.
2. Copy the Braze Media Library link attached to your image (column URL).
3. Create a new IAM/edit an existing IAM
4. Make sure to select a template including an image component.