In-app messages
Swrve’s streamlined campaign workflow gives you several options to create and manage your in-app message campaigns. It supports creating in-app messages using a combination of images and text, as well as the ability to personalize text and call-to-actions.
Prerequisites
To deliver platform-specific in-app messages, your development team must integrate the latest Swrve SDK. For more details, see Intro to in-app messages.
Create a new campaign
The first steps for setting up an in-app message are the same as other channels, with a few extra actions.
- To create a new campaign from your Campaigns center, select Create campaign.
- On the Choose your marketing channel screen, select In-app message.
- To deliver in-app message campaigns to a specific device type (for example, if the content structure is different between TV and mobile), select a Device type from the options of Mobile and TV. The default is All device types.
Note: Device type delivery only applies if your app supports multiple device types. - To deliver in-app message campaigns to a specific platform (for example, if your campaign’s content is not relevant to all platforms), select the specific Platform from the options. The default is All platforms.
Note: Platform delivery only applies if your app supports multiple platforms. - To continue to the Campaign overview screen, select Continue.
- Enter the Campaign name, Description, and Tags, then select Save to go to the campaign builder.
The blocks on the campaign screen guide you through building your campaign. While there is no specific order to how you build your campaign, you must complete Content and Schedule before you can test and activate your campaign.
To update your platform and device type selections while your campaign is in Draft, select Channel. In some instances, changing the platform and device type might reset your campaign content, as the selection determines which templates are available to use.
The rest of this article mainly focuses on how to add campaign content and personalize single-line text and custom actions. To learn how to create your target audience, set your campaign display triggers, and schedule your campaign, see the following:
Building an in-app message
To add or edit your in-app message content from the campaign build screen, use the following steps.
- On the Content block, select add + or edit .
- Choose the in-app message template that matches the layout of the message and update each template element with the appropriate content.
- Add further in-app elements using the + Add element button.
The following sections cover these steps in more detail.
Message templates
The message template dictates the type of content you can include in your campaign. By default, Swrve supplies three templates for each orientation. If you require additional templates, contact your CSM at support@swrve.com.
The default templates are:
- No Buttons – Contains only background content and an associated action (for example, dismiss, deeplink).
- One Button – Contains background media, a single on-screen button, and the associated actions for both.
- Two Buttons – Contains background media, two on-screen buttons, and the associated actions for each.
To select your message template:
- From the Campaigns builder, select the Content block.
- In the Choose a template dialog, select the template orientation. The options are Portrait, Landscape, or Both.
- The available templates depend on your device type and platform selections. Select the template you want to use, whether for a single page or multi-page message, and then select Continue to proceed to the content editor.
To change your template, on the Content screen, select Change template. Changing your template resets any previously added content.
Dynamic elements (new!)
Once you have selected your message template, you now have the option to add dynamic elements to your in-app campaigns. Add buttons, text, or text buttons directly in the content editor without changing the base template.
Add elements
To add more in-app elements to your message, select the + Add elements button and choose the relevant content type. Update an element with a unique name that provides the purpose, content, or action.
Duplicate elements
Copy an existing message element using the Duplicate option from the element action menu. This action will clone the entire element, including its content, position, and size.
Rename elements
To improve the readability of the content within the content builder, choose the Rename option from the element action menu and enter the new element name.
Remove elements
Remove any message element or template placeholder with the exception of an in-app background.
Message content
The sections that display in the Content editor depend on the template you select. Your in-app message campaign is made up of a background and one or more types of content. While the message template must always include background media, the number of buttons and button content type is configurable.
Background
Every template requires background content. Swrve supports using both static and animated images (GIFs) as the media type.
Media type: Image
To help you use a single piece of artwork across all platforms and devices, the Background Image section displays two dimensions: the recommended size of the image you want to upload and the safe zone resolution. Swrve automatically resizes uploaded images for all devices. For more information about image guidelines, including sample images you can download for reference, see In-app messaging best practices.
There are two options for adding a background image:
- Upload a static image file.
- Enter the image URL and, if required, include user properties to personalize the content.
Option 1: Upload an image file
- To add an image for your message background, drag the image you want to use to the Upload file area or select choose file to upload a local file.
- Check the device preview to ensure the uploaded image adheres to the resolution requirements and that all important aspects of the image fit within the safe zone dimensions. A warning displays if the uploaded image resolution doesn’t match the template’s recommended resolution.
Option 2: Enter image URL
- To add an image URL, select URL and enter the relevant link.
- Once you’ve entered your image URL, select Add URL.
Media type: Animated image (GIF)
Add a video or animated image using GIF format, with the MIME type of image/gif
and hosted on an HTTPS server. Swrve automatically downloads the content to your users’ devices and if the asset fails to download, the fallback image is used instead. If no fallback image is available, the in-app message is not displayed.
To optimize performance, we recommend keeping the file size to less than 2MB. Similarly, avoid using multiple GIFs in the same message or across multiple pages
To use a GIF as your background:
- Select GIF and in the URL box, enter the relevant link.
- Once you’ve entered your image URL, select Add URL.
Dynamic URL properties
If your image URL supports height and width parameters, to insert image size properties in place of the respective URL references, select Insert image size property. Select the relevant width or height property and then select Insert.
Alternatively, if you manage your image URL outside of Swrve, include the image size properties using the following syntax: ${container_height} and ${container_width}
For example: https://37ggntsu.mi-msg.com/p/rp/d281e6e5d92eab36.png?height=${container_height}&width=${container_width}
Optional image size, position, and fallback
Once you add an image or GIF URL, you have the option to manually set the size, position, or fallback image.
- Size – Enter the container width and height values for your image to fit inside. The Swrve SDKs scale down images with height and width values exceeding the container’s height and width, so the downloaded image fits within the image container you defined when creating the campaign. While not required, to help reduce the size of the images downloaded and stored on lower resolution devices, use dynamic URL properties to optimize images with dynamic size fields (see above).
- Position – Manually edit the image position by either moving the image in the device preview or by entering the number of pixels by which you want to move the image in the X and Y boxes. For example, if you enter 5 in the X box and 10 in the Y box, the image moves 5 pixels to the right and 10 pixels down from the center.
- Image fallback – To specify a fallback image if the image cannot be downloaded from the URL, select Fallback image and upload an image file. Swrve automatically resizes fallback images for all devices, so they don’t need to match the size of the image URL container.
Alternative text
To add static or dynamic content that’s read aloud when a user selects the background image or an image button (that is, if the user has enabled accessibility settings on their device), enter the text in the Alt text box.
Background action
To include an engagement action for the background image, select an action from the Action list. No action is selected by default. However, Swrve requires that at least the background or one button has an action, even if that action is Dismiss. The available actions are:
- Dismiss – Dismisses the message.
- Deeplink – Directs the user to a particular custom location; for example, you might configure the action to direct a user to a specific website or section of your app. Coordinate with your development team to determine your app’s deeplink URL scheme.
- Copy to clipboard – Copies the action content to the user’s device clipboard. For example, you might provide a coupon code that the user can copy and apply later when making a purchase.
- Request Permission – Prompts the user to authorize permission for the selected capability and then triggers the related system permission prompt. The available permissions are as follows:
iOS Android Push notifications X X Location X Camera X X Photos X Contacts X X - Open app settings – Opens the app settings page. Use this option if prompting the user to manually update a permission when they previously denied it. To learn more about the target audience to use with this action, see Push notification permissions.
- Open notification permission settings – Opens the push notification permissions settings page. Use this option if prompting the user to manually update their notification permission if they previously denied it. To learn more about the target audience to use with this action, see Push notification permissions.
- Start Geo SDK – If your app uses Swrve’s Geo SDK, use this option to prompt the user to grant location permission. For more information, see the Swrve Geo SDK integration guide.
Additional data
In addition to selecting an action, use the following options to log supplementary data when the user engages with the campaign:
- Send custom event – Triggers a custom event for the user. Include up to five payload key/values, personalizable with realtime user properties. For example, you might send an in-app message that includes a question with each button providing a possible answer tracked as a unique event or payload value.
- Update user profile – Updates the value of a user property. For example, you might assign a unique user property value to each button, then target users based on their selection.
Buttons and text
Depending on the template you selected, include additional content with your message, such as buttons or text. To add buttons or text to your message, select + Add element and then select the content type.
Text
Add one or more lines of static or dynamic text that displays inside a text box and use the options available to set the text style and overflow behavior. There are two options for configuring the text styling for a text element:
- Apply a saved text style (for information on creating saved text styles, see Intro to in-app messages). After you select a saved text style, you have the option to also configure the horizontal alignment of the text and the text box’s padding.
- Create a new custom text style: Set the text style to Custom text style, then set the styling for the text and text box by selecting the:
- Font family, style, size, color, and opacity
- Background color and opacity (optional)
- Line height
- Horizontal alignment
- Padding
Note: To support full accessibility on a variety of devices, text box elements do not contain an action. Therefore, ensure your content includes an additional image button or text button if you want to include a call-to-action element in your message.
Image button
Upload an image file as the button or select URL to enter a personalized image link using realtime user properties.
Text button
Enter static or dynamic text that displays inside a button container.
For users who have accessibility settings enabled on their device, the device reads the button text value as the alt text. If you want to include custom alt text, select Add custom alt text and enter the text in the Alt text box.
Engagement action
To include an engagement action for text and image buttons, select an action from the Action list. If you did not select an action for your background image, then you must specify an action for at least one of your buttons.
Pages
Design multi-step flows for users within a single in-app message campaign with our in-app Pages. Use Pages to execute a wide variety of use cases, including:
- Onboarding – Educate new users about the key features of your app.
- Promotions – Highlight multiple relevant products that users can easily browse through.
- Requesting device permissions – Inform customers of the multiple benefits of device permissions before asking them to opt-in.
Create a multi-page campaign
To create a multi-page campaign, start by adding pages to your first message variant.
- Depending on the type of page flow you want to use, there are two options for adding a new page to your campaign:
- Choose a template for the new page. Only templates that are compatible with the variant’s original template are available for selection.
- Select swiping to enable right or left swiping for your multi-page campaigns.
- To add more pages, select add + next to the most recent page.
If you intend to localize or A/B test your campaign, we recommend creating all the pages before creating additional language and test variants. With this approach, pages are copied to the new variants, removing the need to add pages to each variant individually.
Change page template
You have the option to change the page template at both the campaign and single-page level.
- To change the template of a specific page, select the content for that page and then select (edit). As previously mentioned, only templates that are compatible with the variant’s original template are available.
- To change the campaign’s template, in the header section select Change template.
Linear and non-linear sequences
Depending on the Navigation type you selected, you have the option to create linear and non-linear flows.
Linear sequence
Variants that have the navigation type set to Swipe & button click always follow a linear sequence. That is, users can navigate back and forth between the pages in the order in which the pages were created: Page 1 ←→ Page 2 ←→ Page 3 .
Non-linear sequence
You have full control over the order that customers navigate through pages if the variant’s navigation pane is set to Button click.
For example, your first page may have two buttons, where Button 1 directs the user to Page 2, and Button 2 directs the user to Page 3.
Campaigns with Button click navigation do not support swiping between pages. Therefore a linear sequence is not enforced and a user can follow different paths depending on the button they click.
Preview message content
As you add your content, it displays in the device preview on the right side of the editor. To preview the content on a specific device or orientation, select an option from the device list and select the orientation icon. To include or hide the image safe zone in your preview (that is, the portion of the image that always displays after automatic resizing, regardless of the platform device), select the Safe Zones toggle.
The device preview and orientation automatically update to reflect the content you are currently editing. For example, if you upload an image for the landscape format, the device preview automatically changes to show the landscape orientation.
Personalized content and actions
Use Swrve’s real-time user properties to include dynamic, personalized content in your in-app message—for example, the customer’s favorite sports team, game character, or movie genre. Swrve supports personalization of the image URL and text values, deeplink and copy to clipboard actions, and message center details.
For more information on how to personalize your campaign content, see Campaign personalization.
Localize and A/B test your content
One of the most exciting features of our streamlined campaign flow is the ability to localize and A/B test your campaign content within a single, unified campaign. Use the Languages and Variant tabs to create localized versions of your content or create variations of your content to test for best conversion and engagement.
For more information on how to localize and A/B test your campaign content, see Localizing and A/B testing campaign content.
Message center
To display information about the in-app campaign in your app’s message center, set the parameter values returned by Swrve’s Message Center API. The available parameters are:
- Subject – The message center’s subject.
- Description – The message center’s description.
- Thumbnail – Upload or provide the image URL to display in the message center (this corresponds to the image parameter in the Message Center API). If you provide an image URL, you also have the option to upload a fallback image.
- Alt text – Optionally, provide an alt text value to be read aloud to end users, depending on the device accessibility settings.
For more information on using the Message Center API, see Swrve Message Center API.
Test your campaign
To test the in-app message campaign on a physical device, first ensure your device is set up on the QA devices screen. For more information, see Testing triggered campaigns.
Next steps
- Set custom goals to measure the success of your campaign. For more information, see Campaign goals.
- Define your campaign audience. For more information, see Targeting campaign audiences.
- Schedule and launch your campaign. For more information, see Scheduling your campaign.
- Manage your campaigns from the Swrve Campaign center. For more information, see Managing your campaigns.
- If you’re using a push notification to trigger the in-app message, review how to configure the linked in-app message campaign in Push notifications to in-app campaigns.