Add a multi-step guide on your mobile app

Last updated:

A multi-step guide can be used for onboarding new users or introducing a new feature set. Once you build and deploy your guide, you can go to the Guide Details page to see a detailed view of how users are interacting with your Guide and its steps. 

Our recommended way to onboard new users is via a contextual Tour, highlighting important features in your app upon first use: 

tooltip-tour.gif 

You can mix and match lightbox and tooltip steps to create the exact tour that fits your app. 

Best practices for building a multi-step guide

  • We recommend building a Guide with a maximum of 5 steps. Although this isn't a restriction, we recommend it as a best practice to stay within an attention span without losing your user's interest or overwhelming your users. 
  • Brevity is your friend.
    • In multi-step lightboxes, let the visuals illustrate your intention.
    • In tooltips, use short text
  • Onboard new users with full-screen guides before they are introduced to your app. This will help you focus your users before they get started.
  • We recommend that each Guide step have similar branding (the same background color, font style, button styles, etc.) for a smooth visual experience. 
  • If you use a tooltip in any step of your Guide, test it on a physical device before deploying the Guide to your users. 
  • Decide whether you want to let your users to opt out of the tour.
  • In a new feature announcement, the last step can lead directly to the new feature's page (via an app's deep link).

Requirements

After the Pendo Mobile SDK is installed, Pendo users need one of the two following permissions to build a Guide in the Visual Design Studio

  • Pendo Administrator Permissions
  • Pendo User Permissions with at least:
    • Create Guides from Layouts
    • Manage Published Guides
    • Create Guides & Layouts from Scratch

Create your guide

1. Edit an existing guide or create a new guide in the Visual Designer.

Screen_Shot_2020-06-25_at_11.27.12.png

2. Open the 'View Steps' drawer to "+ add step"

Screen_Shot_2020-06-25_at_11.28.30.png

3. For a lightbox, you can add a button with a 'Next Step' action to advance to the next step / 'Previous Step' to go back. 

4. Select Go to Step to define a specific step to go to. A tooltip step automatically moves to the next step, if one exists.

Screen_Shot_2020-06-25_at_11.29.56.png

4. Each Tooltip step includes a visual backdrop by default, which blocks the end-user from interacting with the application. You can control the backdrop's settings in the Styling tab.

5. Each Tooltip step can advance by either:

  • Including a button with a 'Next step' action
  • If the tooltip does not include a backdrop, once the user clicks on the application's screen, the tooltip will close and advance to the next step
  • If the tooltip has a visual backdrop, and the target element is exposed above the backdrop, then the tour will advance when the user taps on the target element (tapping anywhere else on the screen will do nothing).
    See more details on tooltip guides in this article.

5. Always test your guide on your device before publishing.  Select Test to test the entire guide.

test_guide.png

 

Frequently asked questions

Can I create a Multi-Step guide with Full-Screen steps only?

Pendo's Multi-Step support allows you to create a tour comprised of a series of lightboxes or full-screen steps, as depicted in the video below. The resulting guide resembles a 'Carousel' which is a common way to onboard on mobile. However, it is different than a traditional Carousel in several important ways:

  • In this multi-step guide, each step is distinct and has its own entrance and exit animation, which means that your users may see pauses between guide steps. 
  • Progress between steps is done via guides buttons and not via a swipe gestureץ
  • Guide buttons placement is relative to the guide elements so buttons are not 'sticky' to the bottom of the screen.

2020-01-13_10-27-55__1_.gif

 

 

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