A Lesson in Gradual Engagement

When a visitor lands on your marketing page, what should they see? For nearly all web applications it’s the same: testimonials, a feature list, screenshots. Marketing sites usually explain just enough to entice people to sign up. But what if there were a different way? What if people could use the actual application the moment they land on the page?

A traditional marketing page for a web application faces two problems: First, it must interest a visitor to the point that he or she will sign up for the application itself. Second, a marketing page much teach a user how to use the application once they’ve have signed up, through a process known as onboarding. Combining these two processes – essentially enticing users to use an application (marketing) while teaching them how to use it (onboarding) – is a process I call gradual engagement.

Becoming Fluent

To put this into context, let’s look at an example: I designed an flash card iPhone app called Fluent. It employed a behind-the-scenes system for showing users the cards they know less often and the cards they need to practice moreoften. This made it so that users could simply launch the app and review cards, rather than having to decide which set or category to review. How it all works took time to explain and, as a consequence, the iPhone app didn’t gain traction.

So I made a website to introduce the app.

Image of 2192 article

Instead of a bunch of marketing and/or technical language, it simply asks users what language they’d like to learn: French, Italian, Spanish, or Latin.

Image of 2192 article

Choosing Latin, for example, slides a flash card in that displays a Latin word. A tooltip instructs users to click on the card to see the answer.

Image of 2192 article

Clicking the card flips it over, showing the answer on the back. Additional tips explain that it will likely take several tries before learning the card.

Image of 2192 article

Next, a new card is shown with along with a tooltip that explains how cards that are incorrectly marked will be repeated in a review session.

Image of 2192 article

After the user correctly answers the first three cards, a new box appears:

Image of 2192 article

"Congratulations! You’re learning Latin. Create an account to save your progress.

Note how I delayed showing the “create an account” page. I never (explicitly) asked users to to try out the app. Instead, I asked them to save their progressafter they invested their time and energy. The difference is huge.

Designers fight a constant battle for attention. Whereas the first paragraph in this section – the one explaining the Fluent engine – might have felt like a bore, a web app that asks a simple question is enticing. Most important, the web app seeds a placeholder account with a small amount of meaningful data, which makes users much more likely to continue using it.

Flipping the process

Gradual engagement encourages visitors to become users immediately. Rather than presenting users with information about the product, it enables them to use the product right away, without signing in and without creating an account …at least not until they have had a chance to use the product and add some of their own data!

This process may not be right for all applications, but it is worth considering for yours.

Image of 2192 article

As another example, Netvibes lets users create a custom news dashboard and walks them through the process. After they’ve make some customizations to the interface, it reminds users to create an account. This allows visitors to actually use the application before deciding if it is right for them.

If possible, delay asking for signup until users have already invested in your application. At that point it becomes a simple decision.

Image of 2192 article

As a final example, Pandora asks visitors to tell them an artist, genre, or composer that they like. The moment users do this, Pandora creates a station for that artist and starts playing their music, essentially letting users use the app without creating an account (though the option is always available). Instead of trying to create a marketing page to tell visitors about the fantastic recommendation engine, Pandora just asks a simple question, so that they can demonstrate the product immediately.

Imagine a marketing page for Pandora that tries to explain how the product works, why it is valuable, and that you should create an account. All that text wouldn’t have nearly the impact as the simple text box that gets visitors engaged immediately.

Adding gradual engagement to your application

After seeing it in action, you might be curious how to add gradual engagement to your own product. to get started, simply answer these two questions:

- What is the core feature of my product?

- What features are confusing or complicated that need more time to explain?

Pandora may have a lot of features, but playing recommended music is one of their cornerstones. So they placed it front and center, designing the rest of their onboarding process around playing recommended music.

The biggest obstacle for Fluent was that people had a hard time understanding the process – what was happening behind the scenes. By slowly explaining features as they were used, unknowing users were able to assess its value first hand.