0

I have developed a web-based online game and I am currently working on a tutorial for new users. I wanted to show a "press here" type of element on the page wherever the user is supposed to click/tap. This will be in addition to on-screen text telling the user what to do now.

It seems that there are two approaches in use currently:

  1. A "pulsating glow" around the element
  2. An arrow moving slightly back and forth pointing to the element

However, I can't find anything online indicating the benefits/drawbacks of either approach (I'm only interested in UX aspects, not technical aspects).

Can anyone point me to any research/discussions/opinions about the pros/cons of either approach? If not, can anyone provide me with their own experiences?

Are there any different/better ways of signifying "press here" that are better than either of these two?

1
  • Why the downvote? – Arj Apr 28 '20 at 12:22
1

Both of these can work - depending on how you implement it.

What you want is a clear contrast of your nudging, compared to the content around it. Whether that means you use an arrow, or a pulsing glow, it doesn't really matter. It just needs to grab attention with color, movement and/or contrast. Usually you'll see people darken the content that's considered irrelevant for the current action, and highlight what they want people to interact with. You probably didn't find research detailing the pro's/con's of your examples, because they are considered just different variaties of implementing the walkthrough pattern, playthrough pattern, coachmark pattern, or guided tour pattern.

As you can see from this link, the ways you can implement a tutorial are very diverse, but the overarching thing you'll see is contrast and movement.

1
  • Those links are excellent, thank you Wendy. – Arj Apr 29 '20 at 0:13

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.