Back to all Usecases
How to Use GIFs in Onboarding Walkthrough

Introduction

Onboarding new users effectively is crucial for driving engagement and ensuring long-term retention. Using GIFs in In-app messages can provide a visually appealing and interactive way to guide users through the onboarding process.

For example, a new user downloads a beauty app and needs guidance on how to navigate the app to easily order products, get exclusive discounts, and access the latest beauty news.

In this article, we will learn how to create an engaging onboarding walkthrough using GIFs in the In-app messaging feature of MoEngage.

Expected Result

New users will have a smooth and engaging onboarding experience, leading to better understanding of app features, increased user satisfaction, and higher retention rates. Specifically, users will be able to easily navigate through the app to make their first purchase, apply a discount code, and read the latest beauty articles, resulting in higher user satisfaction and more frequent app usage.

ScreenRecording2024-07-26at6.24.45PM-ezgif.com-video-to-gif-converter.gif

Create an Onboarding Walkthrough

Creating an engaging onboarding walkthrough using GIFs in the In-app messaging feature of MoEngage is a two-step process:

  1. Step 1: Identify the Key Onboarding Steps and Create GIFs
  2. Step 2: Create In-app Messages

Step 1: Identify the Key Onboarding Steps and Create GIFs

  1. Identify Key Onboarding Moments: Determine the critical steps and features that new users need to understand during their first interaction with the app. For example, the goal is to ensure new users can easily order products, find and apply discounts, and access the latest beauty news.
  2. Create Informative GIFs: Develop a series of short, looping GIFs that clearly demonstrate each key feature or action. Ensure the GIFs are visually appealing and easy to understand. For example, create GIFs telling new users about the new products, how to apply discount codes, and navigate to the beauty news section. The following is a sample GIF:
    onboarding-walkthrough.gif

Step 2: Create In-App Messages

In this section, let us create an In-app campaign targeting new users or users who have recently installed the app. We will incorporate the GIF you created earlier to enhance user onboarding.

Step 1: Target Users

  1. Navigate to the sidebar on the left and click Engage > Campaigns and click + Create campaign, or click + Create new > Campaign.
  2. Under Inbound, click In-app.
    In-app.png
    You are taken to the first step "Target users" of defining your campaign.
  3. Enter the following details:
    • Campaign name: Enter a name for the campaign. For example, "Onboard using GIFs".
    • Campaign tags: Select the relevant campaign tags.
  4. In the Target Platforms section, select both the platforms Android and iOS.
    target platforms.png
  5. In the Trigger Criteria section, select On app open because we aim to onboard users who has opened and are using the app.
    trigger criteria.png
  6. Set the trigger time for the In-app messages to appear after 2 seconds of opening the app.
    trigger time.png
  7. In the Target audience section:
    1. Select the Filter users by option.
    2. On the User behaviour tab, segment the audience to target only those users who have newly installed the app.
      target audience.png
  8. Click Next to move to the second step "Content" where you can define the content that will go into your campaign.

Step 2: Content

MoEngage In-app campaign offers a variety of templates for all your use cases. It also provides the option to start from scratch.

  1. Select the Nudge - gif with a button template.
  2. Upload the created GIFs in the template.
  3. Add a concise and clear CTA for the GIF.
  4. Add navigation to the button so that when the user clicks the button, they are redirected to the info page.
  5. Modify the design of the template accordingly. Follow the video below to edit the design of the template.
  6. Before launching, under the Preview in-app section, test the In-app messages on different devices and screen sizes to ensure the GIFs and text display correctly.
    testing.png

Step 3: Schedule and Goals

  1. In the Send campaign section, define when you want to start and end your In-app onboarding. image-20240121-054649.png
  2. In the Conversion goals section, add conversion goals that you like to track.
  3. In the Campaign priority section, assign a priority to this campaign. Assigning a priority helps you decide which In-App message to be shown to a user when they are eligible for more than one messages at a specific time. For example, selecting Critical makes sure that the users will always see this even when there are other campaigns that they are eligible for.
  4. In the Delivery controls section, define the controls based on your requirements. For more information, refer to Create In-App Campaignimage-20240121-054810.png
  5. Click Publish. After the In-app campaign is deployed, you can monitor its performance using MoEngage Analytics.

Analyze and Optimize

  • Use the analytics dashboard to track user interactions with the In-app messages.
  • Gather feedback and identify any drop-off points.
  • Make necessary adjustments to the GIFs or message content based on user behaviour and feedback.

To learn more, see In-App Campaign Analytics.

Conclusion

Implementing an onboarding walkthrough using GIFs in In-app messaging of MoEngage can significantly enhance the user experience, making the onboarding process more engaging and effective. By following the steps outlined in this use case, businesses can ensure new users quickly understand and appreciate the value of the app, leading to higher engagement and retention rates.

Was this article helpful?
0 out of 0 found this helpful

How can we improve this article?