Best icon — text
If you can't say briefly and clearly, say it long and clear, but not short and clear.
janatem
Let's talk about icons. They are part of many interfaces. The problem is that under their influence can be destroyed the clarity.
Pictograms have been used since the first days of mankind. They can often be seen as attempts manifestations of writing. Some ignorant people still use them to transmit information.
In public places icons often used for navigation, for example, at international airports, where inscriptions in the local language will obviously be missed.
At some time the icons have become popular in user interfaces. Look at the first commercial computer with a visual control (the Xerox Star). Designer David Smith invented the concept of icons:
It becomes obvious their popularity in our days. First, they make the UI less loaded from the inscriptions. Secondly, when used correctly, the application acquires its uniqueness. It's all very well.
Moreover, one such a small picture can replace a group of consecutive words. This is especially true in view of reducing the size of the screens. But here is the trap: not all icons are user-friendly. They make you think. What good is the interface if it is incomprehensible? The moral is obvious: use the icons when they are understood by all, otherwise forget it.
It reminds me the picture from Twitter:
Think Ron confused while trying to understand the essence of all these symbols for washing clothes...
When I discuss the use of icons with clients, I always hear the argument like "People will use our product every day and will easily learn the functions of all buttons". Fair enough, but there is also a flaw. I use the mail app from Apple several times a day, but still not always the first time remember which icon is used to send emails:
This is bad news: people will not work with the app, which confuses them. We just have to destroy doubt. When Google hid the rest of the application behind this strange icon, got, po-vidimomumany queries support like "Where's my Google Calendar?"
Another example: after the redesign, the new Twittera could not immediately understand what they need to do. Icon was not so clear:
Later added more clarity:
Did you know that you can send photos to your friend in Instagram directly? Yes, but it's all hidden here for this icon:
If you were a user of that network previously, then the chances are that you have seen more. But what does it mean?
Of course, you need to use the icons in the right context. Some buttons can be interpreted in two ways. Let's look at another example. When opening the correspondence in the Gmail any user sees this. Okay, now how do I go back?
To me it happened that I was coming back to Inbox instead of having to write the answer.
Icons in Tweetbot can be clear not all, but they are taken out of context Twitter a. Users of Tweetbot are often by Twitter users, so the use of these buttons is acceptable:
The same can be said about the Tumblr app for iOS. Some unclear to us, but in the context of Tumblr much clearer. Users of this service clearly understand everything.
The Rdio Mac application looks like this:
Many users will be able to deal for their player. (However, one of the icons can be taken as the volume level and the current active track.)
Let me say it again: you do not use these icons, if not all of them understand. If the situation is controversial, it is better to write all the text, as it's sure to be clearer.
But no one forbids you to use labels with images. This is the perfect solution.
The Mac App Store, it does so:
Twitter uses the same technique in your web interface:
Let's look at Facebook as the last example: recently they replaced their icon-hamburger for easier navigation. Well done:
I hope that my tips will help you to perform to fulfill the most important feature of any interface is clarity. So be careful and don't forget to test your project! And remember always: the text is clearer.
Comments
Post a Comment