Heap’s tooltips highlight elements with hotspots and vignette shadow

Heap’s tooltips highlight elements with hotspots and vignette shadow

Heap uses a trio of onboarding UX patterns to make sure they have the utmost attention and focus of users. By using a hotspot and tooltip together and adding vignette shadow, they achieve this goal.

Heap uses a trio of onboarding UX patterns to make sure they have the utmost attention and focus of users. By using a hotspot and tooltip together and adding vignette shadow, they achieve this goal.




Why it’s great:


Low-pressure announcement - By using a hotspot&tooltip combo instead of an announcement modal, Heap keeps it low-pressure and makes sure to include a close button to let users skip.


Contextual - Because Heap uses a hotspot, it takes the user where the new feature is supposed to be. This way, the users can experience the feature in the context of its own.


Fun look - Thanks to the vignette shadow, the users aren’t only focusing easily but also get the feeling the light is coming from a flashlight. This way, onboarding is made more fun.