|
|
|
|
 |
|
In This Issue: |
|
The Art of Icons – Where more realism is better, and why that's helpful.
|
HFI's Project Director Mary Michaels, MBA, CUA, and Chief Scientist, Kath Straub, PhD, CUA, look at recent research on the learnability of icons. |
|
The Pragmatic Ergonomist |
Dr. Eric Schaffer, Ph.D., CPE, founder and CEO of HFI offers practical
advice. |
| |
| |
|
When more is more |
User Experience (UX) designers often seek to distill things down to the essentials. Less is more. Minimalist is good. Users want to get in and get things done. We work to make short, concise menu lists, scannable text, streamlined task flows.
But there's a catch. Being "minimalist" and "streamlined" is not always most effective. Have you ever written yourself a quick, shorthand note, only to find later that you had no way to unpack your own great idea?
Icons work similarly. They are pictures – meant to provide a visual shorthand to users moving through a task. While research indicates that icons are best when initially paired with text to increase recognition and learnability, users experienced with a given set of icons will begin to ignore the text, scanning for and acting from the image alone.
Icons designed with a minimalist spirit are often harder for users to interpret than ones with more detail and more pixels. And it's more than just the number of pixels that matter. Streamlined icons take more energy because users need to mentally recreate the missing information on the way to understanding it. More work spent on interpreting icons means less mental concentration to assign to the real task at hand.
Here's a quick icon test – pull all the cables out of the back of your DVD / Stereo / Satellite and try to set it up again quickly.
So what is the best visual approach? Pictures? Line drawings? Stylistic imagery? |
|
Being concrete about being concrete |
Kunnath, Cornell, and Kysilka (2007) offer a study exploring how different visual strategies affect icon effectiveness within a complex, learning task. Participants were exposed to one of three different icon types within a tutorial / follow-up on how to use digital video equipment. The study looked at two aspects of icon use: learnability, and how well the icons facilitated application use.
Within their study, they developed three different kinds of icons
- Abstract drawings
- Line drawings
- Pictures
Abstract icons were drawn from a universally accepted representation of objects and processes (Dreyfuss, 1984). Pictorial icons were pictures of the actual part in the DVCAM supplemented with a vector (arrow) sign for process. The line drawing icons were line drawings of the pictorial versions.
As a secondary question, Kunnath and colleages also wanted to explore whether different icon types provided differential support for individuals with different learning styles (abstract or concrete, based on Kolb's scale).
Kunnath and team found overall that line drawings and pictures – what they call concrete icons – supported performance best. Further, they found that this effect was consistent across learning styles.
Notably, although previous research would predict that any benefit would diminish with exposure, Kunnath and teams' analysis indicates that the benefit for more concrete icons holds up even across sustained (20-30 minute) learning sessions. |
|
Leveraging the power of concrete icons |
In the past, using pictures as icons was problematic. Screen resolutions meant that pictures didn't down-size gracefully. But monitors have improved to the point that this type of icon can now be represented quite well. (To determine if your icons are too complex, user test them for recognizability.)
For interface designers this means that carefully created, realistic-looking icons can be used and may help users learn and perform better.
For developers in today's fast-paced development environments, this could potentially reduce design time since new concepts for abstract icons would not be needed.
Companies as a whole could benefit since concrete icons are more likely to be correctly understood, especially if there's limited time for testing.
As an added bonus, carefully tested concrete icons may facilitate internationalization, conveying the same concept across multiple cultures.
See, it's still true – good things do come in small packages! |
| |
|
|
|
This study really only looks at short term use (30 minutes). For longer term use I suspect that the SPATIAL POSITION of the icon is of primary importance. I also suspect that ideograms (icons with very low visual noise) will be a bit faster. But for short term use, we now suspect that the richer information of realistic images will make learning easier. This is lovely as I can whip up an icon from a digital snap... in a snap. |
|
|
References |
Dreyfuss, H. (1984). Symbol Sourcebook: An Authoritative Guide to International Graphic Symbols, Wiley, Hoboken, NJ.
Kolb, D. (1985). Learning style inventory. McBer and Company, Boston, MA.
Kunnath, M. L., Cornell, R. A., and Kysilka, M. K. (2007). An Experimental Research Study on the Effect of Pictorial Icons on a User-Learner's Performance. Computers in Human Behavior, 23 (3), 1454-1480. |
|
|
|
