DocumentationExperience PlatformMobile App Tutorial

Create and send in-app messages

Last update: Fri Dec 22 2023 00:00:00 GMT+0000 (Coordinated Universal Time)
  • Topics:
  • In App

CREATED FOR:

  • Beginner
  • Intermediate
  • Developer

Learn how to create in-app messages for mobile apps with Experience Platform Mobile SDK and Journey Optimizer.

Journey Optimizer allows you to create campaigns to send in-app messages to targeted audiences. Campaigns in Journey Optimizer are used to deliver one-time content to a specific audience using various channels. With campaigns, actions are performed simultaneously, either immediately, or based on a specified schedule. When using journeys (see the Journey Optimizer push notifications lesson), actions are executed in sequence.

Architecture

Before you send in-app messages with Journey Optimizer, you must ensure that the proper configurations and integrations are in place. To understand the in-app messaging data flow in Journey Optimizer, refer to the documentation.

NOTE
This lesson is optional and only applies to Journey Optimizer users looking to send in-app messages.

Prerequisites

  • Successfully built and run app with SDKs installed and configured.
  • Set up the app for Adobe Experience Platform.
  • Access to Journey Optimizer and sufficient permissions as described here. Also you need sufficient permission to the following Journey Optimizer features.
    • Manage campaigns.
  • Physical iOS device or simulator for testing.

Learning objectives

In this lesson, you will

  • Create an App Surface in AJO.
  • Install & configure the Journey Optimizer tag extension.
  • Update your app to register the Journey Optimizer tag extension.
  • Validate setup in Assurance.
  • Define your own campaign and in-app message experience in Journey Optimizer.
  • Send your own in-app message from within the app.

Setup

TIP
If you have setup your environment already as part of the Journey Optimizer push messaging lesson, you might already have performed some of the steps in this setup section.

Add an app surface in Data Collection

  1. From the Data Collection interface, select App Surfaces in the left-hand panel.

  2. To create a configuration, select Create App Surface.
    app surface home

  3. Enter a Name for the configuration, for example Luma App Tutorial .

  4. From Mobile Application Configuration, select Apple iOS.

  5. Enter the mobile app Bundle Id in the App ID (iOS Bundle ID) field. For example, com.adobe.luma.tutorial.swiftui.

  6. Select Save.

    app surface configuration

Update datastream configuration

To ensure data send from your mobile app to the Edge Network is forwarded to Journey Optimizer, update your Experience Edge configuration.

  1. In the Data Collection UI, select Datastreams, and select your datastream, for example Luma Mobile App.

  2. Select More for Experience Platform and select Edit Edit from the context menu.

  3. In the Datastreams > Folder > Adobe Experience Platform screen, ensure Adobe Journey Optimizer is selected. See Adobe Experience Platform settings for more information.

  4. To save your datastream configuration, select Save.

    AEP datastream configuration

Install Journey Optimizer tags extension

For your app to work with Journey Optimizer, you must update your tag property.

  1. Navigate to Tags > Extensions > Catalog.
  2. Open your property, for example Luma Mobile App Tutorial.
  3. Select Catalog.
  4. Search for the Adobe Journey Optimizer extension.
  5. Install the extension.

When only using in-app messages in your app, in Install Extension or Configure Extension, you do not need to configure anything. However, if you already have followed the Push notifications lesson in the tutorial, you will see that for the Development environment, the AJO Push Tracking Experience Event Dataset dataset is selected from the Event Dataset list.

Implement Journey Optimizer in the app

As discussed in previous lessons, installing a mobile tag extension only provides the configuration. Next you must install and register the Messaging SDK. If these steps aren’t clear, review the Install SDKs section.

NOTE
If you completed the Install SDKs section, then the SDK is already installed and you can skip this step.

  1. In Xcode, ensure that AEP Messaging is added to the list of packages in Package Dependencies. See Swift Package Manager.

  2. Navigate to Luma > Luma > AppDelegate in the Xcode Project navigator.

  3. Ensure AEPMessaging is part of your list of imports.

    import AEPMessaging

  4. Ensure Messaging.self is part of the array of extensions that you are registering.

    let extensions = [
    AEPIdentity.Identity.self,
    Lifecycle.self,
    Signal.self,
    Edge.self,
    AEPEdgeIdentity.Identity.self,
    Consent.self,
    UserProfile.self,
    Places.self,
    Messaging.self,
    Optimize.self,
    Assurance.self
]

Validate setup with Assurance

  1. Review the setup instructions section to connect your simulator or device to Assurance.

  2. In the Assurance UI, select Configure.
    configure click

  3. Select the Plus button next to In-App Messaging.

  4. Select Save.
    save

  5. Select In-App Messaging from the left navigation.

  6. Select the Validation tab. Confirm that you aren’t getting any errors.

    In-App Validation

Create your own in-app message

To create your own in-app message, you must define a campaign in Journey Optimizer that triggers an in-app message based on events that occur. These events can be:

  • data sent to Adobe Experience Platform,
  • core tracking events, like action, or state or collection of PII data, through the Mobile Core generic APIs,
  • application lifecycle events, such as launch, install, upgrade, close, or crash,
  • geolocation events, like entering or exiting a point of interest.

In this tutorial, you are going to use the Mobile Core generic and extension-independent APIs (see Mobile Core generic APIs) to facilitate the event tracking of user screens, actions, and PII data. Events generated by these APIs are published to the SDK event hub and are available for use by extensions. The SDK event hub provides the core data structure tied to all Mobile Platform SDK extensions, maintaining a list of registered extensions and internal modules, a list of registered event listeners, and a shared state database.

The SDK event hub publishes and receives event data from registered extensions to simplify integrations with Adobe and third-party solutions. For instance, when the Optimize extension is installed, all requests and interactions with the Journey Optimizer - Decision Management offer engine are handled by the event hub.

  1. In the Journey Optimizer UI, select Campaigns from the left rail.

  2. Select Create Campaign.

  3. In the Create Campaign screen:

    1. Select In-app message and select an app surface from the App surface list, for example Luma Mobile App.
    2. Select Create
      Campaign Properties

  4. In the Campaign definition screen, at Properties, enter a Name for the campaign, for example Luma - In-App Messaging Campaign, and a Description, for example In-app messaging campaign for Luma app.
    Campaign name

  5. Scroll down to Action, and select Edit Content.

  6. In the In-App Message screen:

    1. Select Modal as the Message Layout.
    2. Enter https://luma.enablementadobe.com/content/dam/luma/en/logos/Luma_Logo.png for the Media URL.
    3. Enter a Header, for example Welcome to this Luma In-App Message and enter a Body, for example Triggered by pushing that button in the app....
    4. Enter Dismiss as the Button #1 text (primary).
    5. Note how the preview is updated.
    6. Select Review to activate.
      In-app editor

  7. In the Review to activate (Luma - In-App Messaging Campaign) screen, select Edit in the Schedule tile.
    Review schedule select Schedule

  8. Back in the Luma - In-App Messaging Campaign screen, select Edit Edit triggers.

  9. In the In-app message trigger dialog, you configure the details of the track action that triggers the in-app message:

    1. To remove Application launch event, select Close .
    2. Use Add Add condition repeatedly to build the following logic for Show message if.
    3. Click Done.
      Trigger logic

    You have defined a track action, where the Action equals in-app and the Context data with the action is a key value pair of "showMessage" : "true".

  10. Back in the Luma - In-App Messaging Campaign screen, select Review to activate.

  11. In the Review to activate (Luma - In-App Messaging Campaign) screen, select Activate.

  12. You see your Luma - In-App Messaging Campaign with status Live in the Campaigns list.
    Campaign list

Trigger the in-app message

You have all the ingredients in place to send an in-app message. What remains is how to trigger this in-app message in your app.

  1. Go to Luma > Luma > Utils > MobileSDK in the Xcode Project navigator. Find the func sendTrackAction(action: String, data: [String: Any]?) function, and add the following code, which calls the MobileCore.track function, based on the parameters action and data.

    // Send trackAction event
MobileCore.track(action: action, data: data)

  2. Go to Luma > Luma > Views > General > ConfigView in the Xcode Project Navigator. Find the code for the In-App Message button and add the following code:

    // Setting parameters and calling function to send in-app message
Task {
    MobileSDK.shared.sendTrackAction(action: "in-app", data: ["showMessage": "true"])
}

Validate using your app

  1. Rebuild and run the app in the simulator or on a physical device from Xcode, using Play .

  2. Go to the Settings tab.

  3. Tap In-App Message. You see the in-app message appear in your app.

Validate implementation in Assurance

You can validate your in-app messages in the Assurance UI.

  1. Review the setup instructions section to connect your simulator or device to Assurance.
  2. Select In-App Messaging.
  3. Select Event List.
  4. Select a Display message entry.
  5. Inspect the raw event, especially the html, which contains the complete layout and content of the in-app message.
    Assurance In-App Message

Next steps

You should now have all the tools to start adding in-app messages, where relevant and applicable. For example, promoting products based on specific interactions you are tracking in your app.

SUCCESS
You have enabled the app for in-app messaging and added an in-app messaging campaign using Journey Optimizer and the Journey Optimizer extension for the Experience Platform Mobile SDK.
Thank you for investing your time in learning about Adobe Experience Platform Mobile SDK. If you have questions, want to share general feedback, or have suggestions on future content, share them on this Experience League Community discussion post.

Next: Create and display offers

recommendation-more-help
9fed61f5-c338-47ad-8005-0b89a5f4af8b