2

I have been testing a mobile application (iOS) that allows you to access past actions. I'm currently using an icon like this https://cdn1.iconfinder.com/data/icons/material-core/21/history-128.png to access the page, and the icon is located on the top right corner of the screen. Almost all of my testers thought it was a refresh or back button. Any suggestions on how to make it clearer that it's a history button?

1

Take a look at the Nielson/Norman report on icons. It might resonate with your findings.

This bit is your answer: "Always include a visible text label."

2

In testing I always find that users know few icons and end up having to learn what they mean. If I can I go with text. "History" is going to be much clearer, especially given the backwards arrow's association with refresh, back (as you mentioned), and also undo. Text can also be internationalized, avoiding a mismatch of associations with particular objects.

That said it may be a space issue or you may have a ton of palettes for your users to learn. How you represent actions could be modified with another icon to denote past. Or you could take a page out of Adobe's book Adobe Photoshop's History palette button.

0

Maybe something like this?

I just used Font Awesome's stacking feature.

0

The main issue with the icon you're using is it makes a full circle, which is representative of the common "refresh" icon found on most browsers.

Another option would be to research "previous" icons, such as the common undo icon. You will need to add some indication that there are multiple options, such as:

  • A number indicating how many previous steps are available
  • A stack

Here is a basic mockup I made:

Stacked undo button

Another idea:

enter image description here

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.