B.Layer allows you to add images or gifs to your in-app message easily.
Please make sure that you are using the latest braze SDK to allow gifs to be displayed.
Image sizes
What's essential to remember is the total size of your in-app message.
Braze displays a warning when you upload an in-app message bigger than 300Kb. In practice, this warning is a legacy alert, and the absolute limit is 2Mb. Our tests revealed that the ideal size sits below 1Mb to optimize the deliverability to low connectivity users.
As a result, we limit the size of the images you can import to 5Mb
You can work around this limit by using the "Import from link" feature and uploading 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. Use this option if your image is under 5Mb.
Create a new in-app message or edit an existing one.
Make you are using the image component.
In the editor, click on the image to see the upload option on the sidebar.
Select an image lighter than 5Mb
Upload โ๏ธ
Importing a large image / GIF
This technique allows you to work around the 5Mb limit. It will enable 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.
Create a new in-app message or edit an existing one.
Make you are using the image component.
In the editor, click on the image to see the upload option on the sidebar.
Click "upload with link"
Add the image link from your braze media library
Upload โ๏ธ
Using an image as a background image
If you want to use an image as a full-height and width background for your in-app message, here is how to proceed:
Navigate to the editor
Click on "message styles"
Click on "background", click on "image"
Upload your image
You can now go back and edit all other components