On a website I have a map-like gizmo and list-like object. Both has their controls - the map has a google-map-like zoom giozmo and the list has simplified scroll bar. But both can be navigated using the mouse wheel once the mouse hovers over the object.

enter image description here

(mock-up image)

The problem is that for most users it is not obvious that they can use the mouse wheel to interact with the objects. It is probably the result of a broken convention where mouse wheel scrolling doesn't work as it should across all browsers and technologies (Flash?).

How can I make it obvious to the users that they can use mouse wheel to interact with the objects?

  • make a mouse wheel icon blink briefly over the map and list?
  • auto-move the map and list slightly every time the website loads for the first time?
  • any other ideas?

My hypothesis is that zooming via scroll-wheel is instinctive so doesn't need to be overtly advertised. See these posts by Jeff Atwood on Coding Horror:

Firstly zoomable interface where he claims that:

Zooming is a natural metaphor that people adapt to as easily as they do to scrolling.

And also his article able the scroll wheel invention that goes into more detail about the history of the scroll wheel - stating that it was actually concieved as a zoom feature for Excel users:

My (Eric Michelman) original idea was the zoom lever. This was simply a lever, presumably for your non-mouse hand (i.e. on the left side of your keyboard if you're right-handed). When you push it away from you the spreadsheet zooms out. When you pull it towards you, it zooms back in.

These are anecdotal articles though, not based on any actual research so make of them what you will.

  • The more I think about it the more I agree with you. People will understand the zooming and less is sometimes more. – daniel.sedlacek Mar 26 '12 at 16:42
  • 1
    I disagree that zooming with the wheel is natural (but the metaphor for zooming is fine). The wheel is called scrolling and not zooming (as originally proposed by the Excel team) for a reason. – dnbrv Mar 26 '12 at 17:14
  • 1
    I second dnbrv. The scroll "wheel" is especially bad for zooming on trackpads, especially on Macs where it is explicitly a scrolling gesture and horizontal/diagonal scrolling is on par with vertical scrolling with that gesture. On a web page it is even worse because the scroll wheel is generally used for scrolling the page, except when the mouse is over a map element and then its purpose changes without explanation. – meustrus Feb 17 '14 at 19:06

People learn best when the instructions are given at the appropriate time. So your application should "flash" (or "toast") the message for 3-5 seconds at the time of interaction, which, in this situation, will be when a user clicks on the zooming bar.

This notification should pop-up either where other messages are shown (if there's such a place) or right next to the control. You can always do some testing to see, which placement is more effective. (If you don't have the budget, get a script that would record how people interact with the live app.)

  • Wouldn't these notifications distract users from the task in hand? – Danny Varod Mar 26 '12 at 18:26
  • @DannyVarod: Any kind of notification is distracting. The difference is how much brain power is required to process the message & how intrusive into a workflow the message is. Flashes & toasts are placed in the top or the bottom of the screen specifically to minimize distraction because they're used to display the state of the system that isn't critical to the workflow. – dnbrv Mar 26 '12 at 19:33

I'm thinking that you could have a hint fade in and out when the user zooms using the visual control, hinting that the user can zoom in and out using their mouse wheel instead.

enter image description here

Maybe you want to add a checkbox like "Don't show this tip again" if you come across a user who prefers using the visual control, no matter how unlikely that sounds. So that the user isn't disturbed every time they use the control.

  • "Don't show this again" checkbox adds unnecessary bulk to the notification control, especially, since it doesn't prevent user from interacting with the system. – dnbrv Mar 23 '12 at 13:34
  • @dnbrv Maybe, but more importantly you could argue that it obstructs the background chart, which would be frustrating at times. The user should be able to chose whether the hint should be displayed or not. Once the user has read the message and actively chosen to discard it, there's no reason to display it back to that user again. – AndroidHustle Mar 23 '12 at 13:41

How about a brief delayed tool tip which appears when the mouse pointer moves within the vicinity of the + and - buttons ?

  • Where would you put it and how would it look like? Be more specific so that I can give you some credit. – daniel.sedlacek Mar 26 '12 at 13:48
  • Could you please explain how this suggestion is different and/or better than the existing answers? – dnbrv Mar 26 '12 at 13:49

You could use a cursor shaped like a mouse wheel when the pointer is above the zoom bar.

  • That's complicated, one does not simply change the cursor in a browser :) – daniel.sedlacek Mar 27 '12 at 8:46

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.