#ELH Challenge 177 + Tooltip Template

Another week, another excellent Elearning Challenge, this time on tooltips, hyperlinks and explorable explanations.

The term “tooltip” originally comes from the early days of applications like Microsoft Word and Paint, where users were greeted by toolbars full of unfamiliar icons. Although the FUN way to work out what everything did was to try every button out, the quickest way was to hover your cursor over the item. A small hover box would appear giving you information about that item without you having to try it out.

(I’m using past tense, but of course tooltips are still everwhere! )

Tooltips in Photoshop, 2017

Tooltips in Photoshop, 2017

For this week’s challenge I decided to take a passage from an encyclopedia and add in tooltips to provide nuggets of additional information.  With websites like Wikipedia I’ll often find myself getting lost as I branch down different pages. One moment I’m reading about the Royal Albert Hall, a few hyperlinks later and I’m reading about the island of Grenada (…it’s true!) With tooltips, it’s easy to get small nuggets of information which add to understanding without taking you too far away from the original topic.

Here’s my example which is all about the mysterious Mechanical Turk, a bizarre and fascinating episode in the history of computer programming:

mechanical turk.jpg

Get the Template

If you’re interested in taking a peek at the Storyline 2 file and adapting it for your own purposes, I’ve created a template which you can download here.

The future of tooltips?

The big problem with tooltips, of course, is that you classically need to be able to hover a cursor to use them – something you can’t really do if you are using a touch screen. It’ll be interesting to see what happens to tooltips and hovering interactions in general in the future. Are they on their way out?

If you’ve enjoyed this or found it useful, do let me know in the comments and find me on Twitter and LinkedIn! 

 

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s