Design and build a Mobile Carousel

Learn how to set up a Mobile Carousel with this step by step guide.

Beth-Ann Sher avatar
Written by Beth-Ann Sher
Updated over a week ago

Mobile Carousels are multi-page messages that allow you to show your users around, provide support, and highlight features you know they'll love in your iOS or Android app.

With no code required, Mobile Carousels are highly customizable and easy to create.

Note: To use Mobile Carousels, your mobile app must be running one of these Intercom SDK versions (or higher):

Mobile Carousels are only available on mobile. For desktop, we recommend using Product Tours.

Create a Mobile Carousel

First, go to Proactive Support and click New message in the top right corner:

Then, choose Mobile carousel as your content type.

You can also choose to start with a pre-made template by picking this content type from the left sidebar.

Then give your carousel a title.

Design your carousel screens

Now it’s time to choose the general settings for the carousel, these will apply to all screens:

The settings are:

  • Close button behavior - Choose to show or hide a close button on your carousel.

  • Deliver to - iOS, Android or both.

  • Content vertical alignment - Aligned at the top, or middle of each screen. (Horizontal alignment can be set on each element individually.)

  • Colors - Background, Text & Buttons.

Best practices:

  • We recommend including a close button for your users, on non-critical carousels like new feature announcements, or promotions.

  • For optimal targeting of your carousel and a personalized experience, we recommend creating one carousel for each operating system (Android & iOS).

You can also switch between an Android or iOS preview:

Note: There is no iPad or tablet preview, but Android tablets and iPads are supported.

  • On an Android tablet, the carousel will take up the whole screen like in the Android preview.

  • On an iPad, the carousel will display in a centered modal:

This is also the screen where you can start a new test on your carousel. Just click Run a new test.

For more information on goals, A/B testing and control groups, check out this article.

Customize the individual screens

To create a new screen click one of the the “+” icons:

Note: Mobile Carousels can contain a maximum of 10 screens.

To change the order of your screens, click and drag the handle icon:

Select an existing screen to open and edit it:

There are four layouts to choose from and customize, or you can start with a blank slate. This example is the “List with icons” which is perfect for explaining a number of improvements, or the top ways that a user can get value from your app:

Note: Switching to another layout will remove the existing content from this screen.

The content of each screen can be edited directly inline:

The following formatting is supported:

  • Headings: H1 or H2.

  • Horizontal alignment: Left or centre.

  • Paragraph styling: Bold and Italic.

For a more personalized experience, you should include user or company attributes in your messages. Just hover and click the ‘{...}’ icon, then select the attribute you’d like to insert.

To edit an image or an ‘image with text’ block, just select it and click ‘Edit image (with text)’. Then, enter the new content, and add it to the message.

To add a full-width image, or an image with text, hover over the screen and click the “+” icon, then select the type of image you’d like to add.

Note: Videos aren’t supported in Mobile Carousels, but you can add animated GIFs.

Choose a button action

On any screen in a carousel you can add a button to request one of the following device permissions:

  • Camera

  • Location

  • Microphone

  • Photo gallery

  • Push notifications

The button labels can be edited directly by clicking on them.

Pro tip: Offer a clear explanation for why you need the permissions and how they’ll be used. This makes it more likely that users will allow them. 👌

On the final screen of a carousel you can also add a button to:

  • Open an external link. — Perfect for a social sharing URL, or link to a review site.

  • Open a deep link to a page in your app. — Ideal if you’re promoting a specific feature or product.

  • Start a conversation in the Intercom Messenger. — For a simple way to connect with, and support your customers.

Note: All of these actions will automatically close the carousel.

Important: If you choose one of these options for the button on your final screen, then add another screen, or move this screen, the button action will switch to ‘navigate to the next screen’ because these actions are only available on the final screen of a carousel.

Note: Localization is currently not built into the Mobile Carousel tool, meaning that you would need to create separate carousels for each language if you'd require them in different languages.

Things to note about requesting device permissions

When a user of your app accepts a request for device permissions (like location), the native system dialogue will open so they can grant the permission:

  • If they’ve already granted the permission, this screen in the carousel will be skipped.

  • If they’ve previously denied the permission, the screen will be shown and the ‘accept’ button will open the app settings on their device. The carousel will still be there when they return to the app.

  • On Android, push notification permissions are granted by default. This screen will be skipped unless they have previously denied the permission.

Important: To request push notifications permission, your app developers must have set up the Intercom mobile SDK for push notifications. Our developer documentation covers how to do this:


Send your carousel

Once you’ve designed your Mobile Carousel, the next step is to automatically show it to a target audience.

First, choose if the message should be ‘Ongoing’ or ‘One-off’:

Then, choose who this carousel should be sent to:

  • New mobile app users — Anyone who downloads and uses your app for the first time after you set the carousel live.

  • Existing mobile app users — Anyone who has already downloaded and used your app before you set the carousel live.

  • All mobile app users — Anyone who has already downloaded and used your app, and anyone who does in future.

Next, add rules to define the audience for your carousel. For example, to encourage free users who are getting value from your app to upgrade, you could target anyone on the ‘Free’ plan, who has been a user for more than 30 days, and had more than 10 sessions:

Note: Localisation is a feature that we are looking to build in the future, however, it is not currently not built into Carousels, meaning that you would need to create a separate Carousel for each language that you are looking to support.

Pro tip: This example uses a combination of ‘And’ & ‘Or’ rules. Learn more about creating detailed audience filters here.

If you launch your carousel with code directly from within your mobile app, you can choose to turn off automatic sending:

Important:

  • Mobile Carousels sent automatically will only send to each matching user once.

  • If a user hasn’t updated to the version of your app with Intercom’s latest SDK they won’t receive your carousel, but they will still be present in the audience list if they match the filters.

  • As a result, the audience size may differ from the actual number of users who receive the Carousel.

  • A workaround for this is to use the ‘Android/iOS App Version’ audience predicate, choosing only versions that have supported SDKs installed in them.

  • If a user matches the filters for more than one Mobile Carousel, we’ll show the oldest one first, based on when the carousel was set live.

  • To ensure your carousels send as expected, you must initialize the mobile SDK when your app starts (Learn how to do this for iOS & Android). This may lead to an increase in the number of active people you track in Intercom.


Add a goal

To accurately gauge the impact of a Mobile Carousel, you should define a goal based on your users’ data that represents the action you want them to take in your product. Choose “+ Add goal” and select an attribute or event:

With the example used above - encouraging free users to upgrade their plan - a suitable goal might be ‘Plan is pro’.

Next, select the period in which you’d like your customers to achieve the goal.

Important: If app users complete the action after the period you define, this isn’t counted towards the goal stats.


Schedule your carousel

Next, you should schedule a carousel to send at exactly the right time. There are three ways you can do this:

  • Set specific dates and times for it to start and stop sending.

  • Schedule it to send during or outside your office hours.

  • Set a custom delivery time during which it will send.

Note: Trigger times are based on your workspace’s timezone.

To define a custom time, click the start time, then hold ‘shift’ and click the end time.

Your message will then send during the selected period.

You can also set delivery times across multiple days.

And that’s it. Your Mobile Carousel is ready to send!


💡Tip

Need more help? Get support from our Community Forum
Find answers and get help from Intercom Support and Community Experts


Did this answer your question?