In-App message

Overview

To engage your active users for better conversion ratio, In-App message is a good channel to connect with such active users and show them specific and relevant content via In-App messages.

Prerequisites:

  • In order to create In-app message campaigns, you should have the Smartech SDK integrated in your apps.

Please follow this link for integration details of Smartech SDKs.

If it is already integrated, let's get started.

  • Login to your CEE panel and go to "Engage -> On-site - > In-app message".
  • Here, you will see list of campaigns created for in-app messages.
  • You can then click on "Create" button (top right) to create a new In-App message.

Setup

In Setup section, you can add following details:

  • Campaign Name - Give a suitable name for the campaign
  • App Selection - You can select from the list of apps added in the asset section.
  • Tags - You can add tags to your campaigns

Advanced
You can set conversion goals here :

  • Activity - select an activity which you consider as conversion for this campaign. E.g. Purchase
  • Payload parameters - You can also specify certain criteria for payload of the conversion activity. E.g.
    Purchase activity where product price is greater than 10,000. Upto 5 parameters can be added.
  • Control group - You can specify control group percentage here to see the uplift your campaign is going to give as compared to the control group. The selected percent of users will not receive the in-app message but we will track the conversion for them as well.

Click on 'Save & next' button to go to Audience section.

13581358

Audience

In this step, you need to specify the trigger conditions and audience criteria for your campaign.

When To Target
The events selected in this section act as triggers for showing the in-app message to the app users. You can add up to 5 such trigger events here.
In such a scenario, the in-app message is shown when a user does any of the defined events. Here's how you can set trigger event -

  • Activity - You can select the event from the dropdown. E.g. Add to wishlist, App Launch, etc.
  • Specify parameters - You can also further provide payload parameter criteria such as where product_price is less than 10.000.
  • You can add more than one trigger event if you want to show the exact same in-app message in the different sections of your app.

πŸ“˜

Minimum SDK version requirements

  • For using multiple trigger events in your campaign, ensure that you are using Smartech Android SDK v3.1.23 and Smartech iOS SDK v3.1.10 onwards.
  • For SDK version older than above mentioned versions, only the first event added will be used as trigger event.

Whom To Target
Here, you can also specify certain conditions to define the base audience who should see the in-app message after the trigger event is performed.

  • User segment or List - In this section, you can select up to 5 user segments or lists. Use this option when you want to show the in-app message based on historical behavior which is captured by server-side user segments.

  • User activities - (real-time client-side segments). Use this option to set event-based criteria which essentially is client-side segment
    -Choose an event, select whether user should perform the activity as Yes or No
    -In case of event performed: Yes, you can add further event conditions. Up to Max 5 conditions.
    -In case of event performed: No, you can specify the wait time period.
    -You can also choose whether all conditions should work as AND or OR conditions. Please note Activity
    performed: NO is available only for AND conditions.
    -You can also specify event payload parameter criteria as well in terms of payload, operator and values

πŸ“˜

Important

  1. Please note that ability to select List or Segment is available for clients who are on vertica
  2. Ability to select List & Segment and Multi event based conditions will be available for users who are on following SDK versions: Android SDK v2.2.19 and iOS SDK v2.5.5
  3. Please note that for using these targeting options for android, it is necessary that you migrate to AndroidX library if you haven't already.
13661366

Content

In this step, you will specify the content for the in-app message.

First, you need to choose the template layout from following options:
- Sticky header
- Sticky footer
- Half interstitial
- Interstitial
- Full screen cover

You can also personalize the in-app messages activity payload parameters so that a personalized experience can be given to your customers. For more details, click here :

Once you select the template layout, you can start adding content via either of three methods available:
Manual

  1. Sticky header & Sticky footer
  • Message: Recommended size is 80 characters
  • You can add background color or background image
  • Call to action buttons: You can add up to 2 action buttons. Recommended size is 15 characters
  1. Half interstitial, Interstitial
  • Title: Recommended size is 35 characters
  • Message: Recommended size is 150 characters
  • You can add background color or background image
  • Call to action buttons: You can add 1 action button. Recommended size is 15 characters

3. Full screen cover

  • Title: Recommended size is 80 characters
  • You can add background color or background image
  • Call to action buttons: You can add up to 2 action buttons. Recommended size is 15 characters
13661366

Image Only
1.Sticky header and Sticky footer

  • Image - Supported formats .jpeg, .jpg and .png with recommended 100kb size and 2:1 ratio

2.Half interstitial

  • Image - Supported formats .jpeg, .jpg and .png with recommended 100kb size and 1:1 ratio

3.Interstitial

  • Image - Supported formats .jpeg, .jpg and .png with recommended 500kb size and 1:2 ratio

4.Full Cover

  • Image - Supported formats .jpeg, .jpg and .png with recommended 500kb size and 1:2 ratio

Note: Image size restrictions are recommended for optimal user experience and applicable for images uploaded on the panel. If you wish to large size images, you can use a self hosted image url feature

In all of the templates > Image only option - you can add 1 call to action button.

13651365

πŸ“˜

CTA (call-to-action)

You can select from seven different call-to-actions as follow

  1. Redirect to deep link
  2. Patch a call
  3. Redirect to a website
  4. Send email
  5. Send SMS
  6. Even share the content through Whatsapp
  7. Close the In-App message.

Custom HTML
Here, you can add custom html + JS to create your own content. You can use this option if you wish to get complete control of how in-app message should look like.

In this option, you have two options to add custom html content:

  • Direct URL - You can specify the valid url where you custom html is hosted.
  • Inline html - You can continue further in 2 ways:

1. Create Custom Template - here you can copy and paste the content directly in the content box provided.

πŸ“˜

Important

Please note that Direct URL under Custom html option will work on following SDK versions onward: iOS SDK version 2.4.3, Android SDK version 2.0.11 and 2.2.12 (Android X compatible)

However, please ensure that you confirm to the custom html guidelines given in the next section in order to ensure the experience is smoother and in-app message is shown to the user correctly.

2. Choose from the templates offered - Once you choose any template, you can make changes to its HTML in the "Pseudo Editor" and save it for future use.

12971297

Guidelines for using custom HTML in In-app messages

πŸ“˜

Pro Tip: Add gamification experience to your app

Use custom html feature for in-app messaging use cases around gamification like timer, wheel of fortune, scratch code, self-hosted/3rd party feedback surveys, customized multi-page in-app message.

  1. HTML file must contain the following javascript to support the in-app actions such as in-app click action and in-app close action, and to trigger in-app click event and in-app close event.
    https://cdnt.netcoresmartech.com/smartech-app.js
    And also need to add jquery to support the javascript
    https://code.jquery.com/jquery-3.4.1.min.js
<script src="https://code.jquery.com/jquery-3.4.1.min.js" integrity="sha256-CSXorXvZcTkaix6Yvo6HppcZGetbYMGWSFlBw8HfCJo=" crossorigin="anonymous"></script>
<script src="https://cdnt.netcoresmartech.com/smartech-app.js"></script>
  1. The actions from the script can be performed by either assigning the predefined classes to the buttons or by calling predefined functions.
  2. There are three classes in this script, that are smt-click, smt-close, and smt-c2a
    And also there are two functions included in this script i.e netcoreCloseInApp() and netcoreTrackInApp(deeplink, customPayload)

To trigger in-app close event and to close the in-app window, either assign smt-close class to the button. For Example:

<button class="button smt-close">Close</button>

Or instead of assigning class to the button, you can call netcoreCloseInApp() function from the mentioned javascript in your javascript code.

For Example:

function closeInAppLocalFunction(){
    smartechCloseInApp();
}
  1. To send data to the application on button click, assign smt-click or smt-c2a class to the button and also define values for smt-click and smt-data.
  • Values for smt-click and smt-data should be defined .
  • Value for smt-click defines the action that app should perform (example: url or deep link should be open after in-app close)
  • Value for smt-data must contain data in jsonString format which will get pass to the application (data will not get receive in application if no value or value in wrong json format is assigned to smt-data)
  • When the valid json string formatted value is assigned to the smt-data, Then in application it will get received in Dictionary format. (only in case of deeplink or open url action)

For Example:

<button smt-click="https://www.google.co.in" smt-data='{"name": "Netcore"}' class="button smt-click">Open Url</button>
  • Value for smt-data is optional. If the value for the parameter smt-data is not defined then the event will get triggered without custom data.
  • Value for smt-data is not necessary for the actions like send SMS, call a number, whatsaap and send email

For example,

<button smt-click="sms:9850269829&body=Hello" class="button smt-click">Send SMS</button>
<button smt-click="tel:9850269899" class="button smt-click">Call a number </button>
<button smt-click="whatsapp://send?text=hello everyone"class="button smt-click">Whatsapp message</button>
<button smt-click="mailto:[email protected]?subject=Hello&body=This is Email" class="button smt-click">Email</button>
  1. The action β€œin-app clicked” can also be called via calling netcoreTrackInApp(deeplink, customPayload) function in your javascript code
  • Value for deeplink defines the action that app should perform (url or deep link should be open after in-app close)
  • Value for customPayload must contains data in jsonString format which will get pass to the application

For example,

function openDeeplinkWithCustomDataLocalFunction(){
        var deeplinkValue = "smartech://image";
        var person = {
          firstName : "John",
          lastName  : "Doe",
          age     : 50,
          eyeColor  : "blue"
        };
        var payloadValue = JSON.stringify(person);
        smartechTrackInApp(deeplinkValue, payloadValue);
    }
  1. Sample Values for smt-click attribute or smt-c2a attributes are given below:

Schedule

In this last step of campaign creation, you can specify the campaign start date and end date.

  • start date - you can choose to publish the campaign now or at a later date and time.

  • end date - you can run campaign indefinitely or choose a particular date and time.

  • campaign frequency - You can also choose the frequency in terms of day of the week and time of the day.

For frequency of campaign, you can choose how many times this campaign should be shown to the users. You can choose x number of times per session or per day or per campaign in this option.

13621362

Preview

This section will provide you summary of the campaign details which you have created.
So before publishing check all the details carefully.

27202720

Campaign Listing

On mouse-hover, by clicking on ellipsis (3 dots) you can Clone a given campaign as well as download its reports, or by clicking on campaign title you can see the preview of the campaign.

The entire campaign listing can be sorted basis modified time, viewed & clicked.

  • Last modified - shows the date and time when the campaign was last edited.
  • Ends - shows the date and time when the campaign ended or is going to end.
  • Viewed - shows the number of times the in-app message has been viewed.
  • Clicked - shows the number of times the in-app message has been clicked.

You can also toggle between percentage and numeric values of the entire listing.

Search
The campaign listing page allows you to search any campaign by its name or id.

Filter
You can also filter based on Campaign Status such as scheduled, completed, failed, suspended, etc. as well as based on the Tags

Download Reports
This feature allows you to download reports of all or selected campaigns.

13661366

πŸ“˜

For any queries, please contact [email protected]