We know that communication with the end user is key, so we created the Content Builder dashboard. Here, you can build and style in-app messages that will be displayed to your users on their devices.
It can be a simple sticky notification to announce a new promotion, a modal to redeem a coupon, or a carousel with multiple cards to share new information on your application.

Supported messages types

Content Builder supports four types of in-app messages: Sticky, Modal, Half Modal, and Full Screen. Each one has different elements, proportions, and placements on the screen. You can use the right sidebar to control these elements and the device preview to understand how it will look on small, medium, and large devices.

Sticky

This type of in-app message is best suited for short messages or actions. It is similar to notifications and can be placed at the top or bottom of the screen on small devices, in the corners for medium and large devices, or in the center top or bottom of the screen for large devices. It comprises an image and text and can have one or two buttons, one of which has a close action by rule so that the user can close the message.

Modal

This type of message is composed of the same elements of the Sticky, with the addition of a Close icon that, when enabled, allows this message to be displayed without buttons. Otherwise, it will follow the same rules as the Sticky message type. It also includes an overlay that can be visible or not, depending on whether you want the user to be able to interact with the content (overlay disabled) below the block or not (overlay enabled). Contrary to the previous type, this one is always displayed at the center of the device.

Half Modal

This type is similar to the Modal in-app message in all aspects, with the only difference being the position on small devices. Contrary to Modal, which is always in the center of the screen, this one can be at the top or bottom of the screen.

Full Screen

This type of in-app message is more complex. As the name suggests, it fills the entire screen, but only on small devices. It appears as a Modal with an overlay on medium and large devices. It comprises a title, a close icon, buttons, and three different body types: List, Illustration, and Carousel.

List

As the name suggests, this body type is a list of blocks. Each block has a title, description, and a small image, and they can range from 3 to 5 blocks.

Illustration

This body type is more straightforward. It consists only of an image that can fill the entire space between the title and the buttons.

Carousel

This body is a simple slider with a minimum of two cards and a maximum of twenty. Each card can be one of the previous body types. Each card is independent, but properties, like the number of buttons or blocks, are shared across all cards.

Device preview

We added a device preview for each device type (small, medium, and large) so you can get an idea of how the in-app message will behave on each type. You can then use the switch below the preview (see next image) to toggle between the different device types. 

The following sections will give an idea of how the device preview will work for a Half Modal in-app message.

Small Devices

Medium Devices

Large Devices

Managing Content

In the content builder view, you can manage what is shown to your user, including selecting the number of buttons, what to say, and what color the text is. You have many properties under your control.

Layout sidebar

In this sidebar, you can control all the aspects of the in-app message layout, such as the type, position, and number of buttons.

Content Sidebar

The content sidebar, as the name suggests, controls what content is shown to your user and, in the case of the buttons, what action will occur when they are clicked.

Styles Sidebar

In this sidebar, you can control the style of your in-app message. You can select their color, how far apart they will be from each other, and how large they will be.

Localization

Globalization is present in every aspect of our lives, from having multinational coworkers to connecting to someone abroad. Communication is a key part of that, and that's why, in the localization tab, you can add translations to each content entry of your message.

Each column contains a language and the respective percentage of users who speak that language and use your app.

You can click on the column header to see the in-app message for that language user.