Mobile Tooltips: the unobtrusive UX pattern to deepen engagement

Remember Clippy? Perhaps you’d rather not!

Clippy was Microsoft’s “Office Assistant” and became universally derided. Here are 5 reasons why people hated Clippy:

  1. Obtrusive – power users hated Clippy because it had patronizing suggestions.
  2. Distracting – the image at right (without the gun) is literally Clippy looking bored and wanting you to stop your job and pay attention to it. As we’ve talked about before, JTBD (jobs to be done) is how a product manager should think of a user’s flow
  3. Always there – he(?) sat on top of Word/Excel taking up screen realestate
  4. Killed your flow – this hilarious Quora answer lampoons how it would take 30 seconds to hijack you writing a sentence.

How to be unobtrusively useful

We’ve blogged before about how tips need to be unobtrusive. In particular if a web “desktop design” approach is shoe-horned into a mobile App, the patterns conflicts with a user’s “Jobs To Be Done” (JTBD) imperative.

The best way to deliver unobtrusive user guidance via tips is:

Contextual

Unlike Clippy, tips should show when relevant to users.

Audience: We have customers in Health and Telecoms that have older customers that prefer guidance whereas Milenialls will click/touch/swipe a thousand things until it works. I’m not being “age-ist” – its just a fact.

Trigger: Apps should only show the tip to the correct audience and stage of user journey. If a user has already user a feature, then they shouldn’t be seeing tooltips explaining what they know. If a user is about to commence a complex task for the first time, then offer to help them!

Simple & Distinct

In my recent popular article at uxdesign.cc, the idea of “Cognitive Overload” was discussed and how App Product Managers should design to reduce this overload. In this article we suggest that launchers and tips need to be perceived as a layer on top of the application but not compete for screen real-estate.

In this simple tip, Youtube taught me something new – that I can pinch the screen. It obeys two simple rules that we think are important:

  • Get the Job Done (JTBD)
  • Get out of the way

Note how simple this tip is, it can be dismissed by simply touching.

mobile tooltips mobile tooltips - example youtube

Also, these two Youtube tips are similar but also point to a clickable screen element (the bell button and the drop-down filter). Notice how “cognitively” the tip looks very different to the rest of the App. Its very easy for the user to distinguish the tip from the App content – in fact they’ve interesting used the same colour in round badges over channels as discussed in my previously mentioned post.

The lesson is that Google: one of the largest tech companies on the planet has figured out that this design pattern of: simple, distinct, coloured tips converts their users to adopt the recommended features. Google would have massive teams of analytics, data scientists to come to that conclusion and we should take notice!

Data Driven

Which is a nice segue that puts substance to our first recommendation of “Contextual”. All tooltips need to justify their existence and Product Managers need to know what uplift they get on feature usage, engagement or other success metrics. We’ve written other posts on A/B split tests to verify that your in App education is data driven and working. Our two main points are:

  • Measure the success of tooltips – we’ve seen uplift range from 20-80% for new features. Pick your metric and compare against your Apps default state.
  • No Code – using tools like Contextual, the ability to deploy tooltips is codeless, no more Appstore releases or fighting for resources on the Product Roadmap. This is critical, you need to iterate fast!

Significant New FeaturesGoogle Maps add a Pit-Stop

Its worth mentioning a slightly different style tooltip that Google also shows for significant feature additions. Many Apps will throw this up as a popup or carousel page when the user opens the App – but that’s lazy and google does a great job here of contextualizing this new feature mid-task.

The inclusion of title, icon and “GOT IT” button are simple but significant to catch the users attention that this is significant. In particular, the use of a button allows the Product Manager to use analytically see who dismissed by the button or clicked elsewhere (or outside) the tip. In Contextual, this gives measures of “Accept” and “Reject” to measure how positive the response was for the tooltip.

Summary

Clippy got it wrong but was a brave piece of help technology for products (Word and Excel) that had become very feature rich (bloated?) and complicated to use. Microsoft had to solve the problem of surfacing features and their approach is what you should avoid – especially in Mobile apps!

Clippy Best Practice
Obtrusive
Distracting
Always there
Killed your flow
Job Centric (JTBD)
Simple
Contextual
Get out of the way

    More Posts

    Contextual & StreetHawk Inc 2023.