The best icon is a text label
thomasbyttebier.be
thomasbyttebier.be
Despite being a programmer -- but not front end work -- I find myself struggling more and more with UI and especially icons. I think so much of it reflects the current trend of zero empathy for the end-user. Fortunately, I know enough about computers to get around many of these issues, but icons are the one area that I still struggle with.
Unless you have some site with several million users, teaching end-users is a wasted effort, and it does well to either piggy-back on other ideas or use text. Even Facebook is using text, and it seems a little odd that anyone smaller would feel they have some lessons to teach the end-user about UI. UI, in my opinion, doesn't mean "pretty," it means "usable," which is sort of implied by U meaning "user." If a significant portion of your user-base is computer illiterate, which will often be the default, it does well to UI to the lowest common denominator. Once your user presses the back button because your icons made them feel stupid, you lost a customer, and that is a very high price for "pretty."
Still waiting for a good answer to this one. When someone does successfully counter it, I imagine the rebuttal will involve Chinese pictograms or something else that has worked well for a while but isn't likely to survive the next thousand years.
(b) So why'd the Egyptians stop using them? What makes them right for today's needs?
Egyptian hieroglyphs, in their ornate form, clearly depict various items like reeds, birds, arms, and snakes. But those glyphs don't actually refer to the reeds, birds, arms, and snakes they show; rather, the ancient Egyptian writing system is largely alphabetic. Their formal letters were just much prettier than ours.
It wasn't a voluntary act, trust me and with the rise of the emojis as a medium of communication, I can say that we or the ancient Egyptians had it right all along in using hieroglyphs.
I'm out. This thread is 200TB of crazy on a 10TB drive.
Also, you're EXTREMELY overestimating the individual agency of the ancient Egyptian in this matter. Most of the citizens of ancient Egypt were illiterate and only a certain class or caste had the privilege to be able to read and write but the rest of the population were completely oblivious to those icons and therefore your argument is just baseless.
And in fact that's why they're HIEROglyphics, they were the priestly writings. (compare to demotic, as also seen on the Rosetta stone).
English is the primary programming language, not because a team of dedicated Anglo-Saxons are pointing rifles as the head of brown people, but because American trade provides the most profit motive between 1974-2008.
A "primary methodology" only applies in "most" cases, not all of them.
Lots of languages have perished for outside forces other than trade -- the Hebrew wasn't abandoned because a better trade language came around, but because Israel was conquered and the locals scattered. Other languages were persecuted by decree. Others died because their native speakers were eliminated. And several other ways (e.g. Mussolini tried to smooth out local dialects of italian using the powers of government plus radio and early cinema).
Religion can and does preserve memes and linguistics, but only trade can scale it out.
If it was just for trade, language learning would be relegated to merchants in those countries and few others.
Government, bureaucracy and occupation matters more than trade in this regard. That's how latin become the norm in a large area during the roman empire -- and not because everybody in those regions traded directly with Romans or couldn't agree on pricing otherwise.
Same e.g. for French -- it's not because of trade they got big as a language in the 18-early 20th centuries, but because the french run a big colonial empire.
And English, beyond trade, were the language of the big British colonial empire, and afterwards of the dominant culturally power that was America (Hollywood, rock, pop culture etc.).
That would make sense if you had many debates with the parent and he always blamed unrelated stuff to imperialism.
In this case he talks about a specific historical example, where we have a specific historical account, which happens to agree with the parent.
They didn't just go out of style, they were phazed out when the country was invaded, along with other aspects of the local culture. For centuries after Alexander, in Egypt you wouldn't get promoted to the higher ranks unless you were Greek (or Greek speaking) for example, and the local population was kept as second rate citizens. Then came the Romans, then the Arabs, ...
But clearly you have a specific self-made explanation, that they just "couldn't work" and were abandoned for that, history be damned.
In hiragana you have 48 letters for sounds which in most cases are a consonant + vowel. Hence Japanese written in Hiragana or Katakana is shorter than it would be if it was written with a western alphabet. Japanese is probably not the language with shortest words, but neither are they exceptionally long.
Egyptian hieroglyphs were in use for about 3600 years, and as other commenters pointed out, Egypt stopped using them because they were conquered by Rome, which then imposed Christianity — which banned a different kind of "icon", killing the hieroglyphs as a side effect. Also, far from being "icons" in the UI sense, Egyptian hieroglyphs were primarily phonetic, although they did have ideographic components — less so than Chinese characters (which are logographic, but only about 4% of them are pictograms) but more so than the Latin alphabet.
The Latin alphabet, which is a modified subset of the Egyptian hieroglyphs (via the proto-Sinaitic and Phoenician abjads and the Greek, Etruscan, and Old Italic alphabets) has been in use for 2100 years, about 1500 years less than the hieroglyphs.
If we're still using the Latin alphabet around AD 3400, your argument from observed adoption that alphabets work better than pictograms would make sense — if hieroglyphs were pictograms, which they mostly aren't.
Every invention of writing except the khipu started out pictographic: Chinese characters (which have been in use since the Shang dynasty a bit over 3000 years ago, contrary to what you seem to think), Sumerian cuneiform, Mayan hieroglyphs, and Egyptian hieroglyphs all have clear pictographic origins. But all of them developed phonetic components in order to expand the range of language that could be written, and those phonetic components came to dominate the script almost immediately, to the point that none of them have an identifiable pictographic-only period in archaeology. In fact, as the numerical nature of the decoded khipus and much of the early Sumerian tablets suggests, logograms for abstract concepts such as numbers may have been in use as early as pictograms or even earlier. So, the actual history supports your idea that systems relying entirely on pictograms have very limited applicability, even though it has nothing in common with the history you imagined supported that idea.
On the gripping hand, maybe computers are not the same medium as clay tablets and printed paper, and so maybe past experience is not entirely applicable.
In frontend land this is often the distinction between UI vs. UX. UX means usability, UI is the more aesthetic side of the exercise, though of course there is considerable overlap.
Part of the issue - at least from my corner of the industry in mobile app dev - is that a lot of good UI designers have renamed themselves UX designers - because UX designers are in greater demand - but are poorly qualified to actually assess and design for usability.
There are also more and more designers crossing over from other design disciplines - graphics designers and print designers are often transitioning to UX design and the results are not always good. To some degree they can bring fresh ideas to the table, but often it results in a lot of designs that aren't competent at a usability level.
> "If a significant portion of your user-base is computer illiterate, which will often be the default, it does well to UI to the lowest common denominator."
I agree with the gist of what you're saying - but I think there needs to be a bit more nuance here.
We're no longer in the 90s, the userbase for most websites and apps largely are not computer illiterate. They are in fact quite technically savvy overall - the issue isn't that your users are technologically ignorant, it's that they're not skilled in your software.
If you look at the modern smartphone user they have a lot of learned expectations and behaviors and they know full well how everything works. The issue comes only when you try to break the established knowledge and do your own thing - which is exactly what the blog post here is about, icons that aren't universally established and have vague meaning to non-experts (and even some experts).
One of the hardest things as frontend people is retaining the first-time-user mindset. You use your own software day in and day out and become experts at it, and your designs and considerations start swimming around that - you are more inclined to build power-user features and implement power-user shortcuts, and you gradually lose the ability to assess your own product from the perspective of a new (or even old, but irregular) user.
The issue isn't that people are technologically illiterate, but that they are not specialists in a very particular expert-user UI you may have designed.
This is made worse when designers start openly egging competitors' UIs, so now not only are you pursuing a confusingly non-standard UI, but this non-standardness starts becoming a meme in your specific niche.
The distinction is important IMO - with the exception of a few demographics (retirees?) it's actually pretty safe now to expect a reasonable amount of tech savvy from your users, but you have to recognize what you think is universal trained user behavior vs. actually widespread user behavior.
I've never understood how the concept of "UI" ever evolved to not encompass usability at it's core.
I was happy to cede UI territory to the designers who said they'd do it better. Even when I was insulted to my face that because I'm a programmer and liked my arcane typing based interfaces for myself, so therefore I couldn't possibly understand making usable software for others. I bit my tongue, put my head down and went back to the things I wanted to focus on anyway.
In the time since, user interfaces have experienced gradual incremental improvement just like everything in computing. But rather than going for "nothing else left to take away" design (or perhaps due to a shortsighted version of it) visual clutter was just turned into mental clutter. The number of WIMP nouns and verbs the average user has to understand are higher than ever, with less consistent behavior, and overflowing with one-off slightly different implementations to remember.
Rather than any grand improvements, I've only seen degenerate phenomenons for making user experience worse. My favorites being: A well-managed brand name, good aesthetics and software reputation means that when someone (eg. Apple) ships a bad interaction, users that would (rightly) blame the software first before working around it, start blaming themselves first for "not getting it". Or that products evolving quickly (such as the early years of Facebook) are bewilderingly unusable to people that don't log in often enough to keep up with the UI changes as they happen in small increments.
Then after waking up from their bender the UI folks start talking loudly about UX. I thought that was the goddamn point all along! Oh, but what do I possibly know? I only have formal training in what we used to call Human-Computer Interaction, and I quite like my console shells. And shells have bad aesthetics, so they must have bad ux too. And at least the UI guys managed to get 1 of the 2, I guess I'll just go back to holding my tongue now.
UI design was always about the “usability”, the “how” and “why” of the design, not the looks. For example, the first edition of Alan Cooper’s About Face (1995) had a subtitle "The Essentials of User Interface Design”. It was more or less the UI design bible back in the 90s for the practitioners.
However, back then, most managers and technical people incorrectly thought that the job of UI designer was to “make this ugly thing we built pretty”. This caused a problem for UI design as a profession, and people inside the field started to use a term "Interaction Design”. It was also a better term because it highlighted the temporal part of the design exercise: the user interaction flow. This is often the hardest part to design right and the term clearly separates the interaction design from designing visual surfaces. This change was reflected in the 2nd edition of About Face (2003), the subtitle was now “The Essentials of Interaction Design”. Also, IxDA, the Interaction Design Association, was founded the same year.
At the same time, there was another rising term, user experience design. It was used especially by Don Norman. While Interaction Designers tried to drive home the point that the interaction design was a separate profession than visual design, Norman took a more holistic approach. Instead of separating the fields, he actually highlighted the importance of aesthetics for the user experience, which culminated in his book Emotional Design (2005).
By the late 2000s, most of the leading software organisations had already understood the importance of UI design. Also, the rise of the startup culture and smaller teams meant that more and more people in our field worked on the product-level decisions, instead of working on the nitty-gritty of technical architecture. User experience design grew to mean a more holistic take on how the user experiences the product and became more or less the umbrella term for the field.
"UI" is the user interface. It's the facility through which the user interacts with a tool -- both receiving information and inputting their own responses.
"UX" is the user experience, which is the totality of the user's interaction with the tool. Not just how it looks, but inclusive of goals, success or failure in accomplishing them, frustrations or joys in the process.
https://m.fastcompany.com/3032719/ui-ux-who-does-what-a-desi...
Today, I think UX::UI as Agile::programming or Lean::startup.
That is, people who knew what they were doing did most or all of the things the buzzword implies before, and they had probably also a broad skill set that covered most of the useful areas implied by the modern buzzwords. However, a lot of other people feel the need to attach buzzwords or build silos to subdivide a field where they don't have a comprehensive skill set, because of all the usual motivations.
They go for drastic re-designs, get rid of all the text because "nobody" reads it, hide all the features because they "confuse" and "intimidate" users and "nobody" uses them, and end up with something that requires a young professional software developer like me some real sleuthing to figure out, on behalf of friends and family.
Then, when 95% of users don't know how to do anything, they get more desperate, and the result is even worse...
Is that a thing ? I can't speak in general but I know that for the large mobile app I am working on, we are slowly migrating to our own solution and I highly doubt that users could deactivate it.
Especially if the option is buried somewhere deep in the settings menu. Also the most likely users to have adblockers, though that's getting more and more common.
The only users who (in significant number) change settings are power users. A small minority in any regard, but also the ones who then are more likely to defeat various tracking and feedback systems -- disabling feedback or preemptively blocking sites and systems which profile system performance, including Google Analytics, New Relic, etc.
Yes, if you can instrument within your tool (Web page, app) for response, great, but that's More Work For You, so it's far too easy to fall back on standard services. Which your best users are most likely to block....
This dynamic does seem to strongly reflect how marginal UIs get progressively worse.
Don't design for idiots.
Oh: and there's some truth in the observation that 90% users don't know how to do anything. People are far less rational and sensate than we typically believe.
P.T. Barnum had something to say on that.
This is a huge issue with open source software - everything seems to be named Libre- these days and I haven't found many Americans who can pronounce it...let alone people in China or India.
At least by me.
The implication is "we choose this as our adjective, because we care more about our ideology than the quality of your user experience". Ok, the ideology says that "because we build our software like this, you get a better user experience", and I have a lot of sympathy with that. But by the time you have to explain the name like this, you've lost the potential user's attention.
(OTOH, I also suck at software naming so probably shouldn't preach.)
So how does your implication theory explain the fact that TDF is currently hiring a UX mentor and having a tender to develop and incorporate usability metrics collection for LibreOffice?
They didn't just rename the project for fun - Oracle held on to the OpenOffice trademark and the forkers had to think of something to replace it.
The problem with the text-only approach is that you can't change the layout or the names of the functions visible to the user in your app or you'd face a severe backlash or blowout from your user.
But in the case of icons, you could still move things around and the user would find it less demanding to locate the new place of the function by identifying the pictogram quickly taking into account that we humans are better equipped to identify pictograms and shapes than text very quickly and efficiently.
PS: Assuming a conventional method or approach to this problem and not a hybrid or innovative one.
UIs undergo changes, them staying the same for all eternity is not a promise anyone wants to make.
FYI, this is almost certainly not true. Research suggests that users only recognise a very limited set of icons in an application, and where there are extensive toolbars full of different icons, it is often the position that the user is recognising more than the icon itself. Thus reorganising things like toolbars can have a profound negative effect on usability, and it seems likely (though I'm speculating now) that this would be much worse than something like reordering text items in a menu.
> always include a visible text label. As Bruce Tognazzini once said, “a word is worth a thousand pictures.”
Even though you've always got undo I'd much rather not have to click undo.
I let out an internal comforting sigh once I realised I could just replace the icons with text.
Some years ago I was working for an educational software company. We sold directly to schools. As expected, we'd get a lot of feedback from teachers using the product. For a while, everyone from the execs on down would ignore this feedback with a laugh. The majority of teachers we dealt with were absolutely clueless about anything involving software. Their reports reflected this ineptness.
One day, I had an epiphany that maybe, just maybe, these people were worth listening to. We went over the written feedback, translated their ramblings into something approximating proper bug reports, and it turned out they were doing a wonderful job of pointing out many of the problems (especially UI) hiding in our blind spots.
We had dismissed them because of a perceived cluelessness, and probably because of some internalized ageism & sexism (most of these teachers were middle aged+ women and most of my team was not). And yet when we finally listened to them, we put out an update which led to several accolades, a sudden drop-off in complaints, and probably our best selling product.
It was funny in part because the sequence wasn't something any of us would consider logical. So we had never tested for it. But I was able to duplicate the crash on my system and fixed it.
That was the epiphany. I convinced the director to push out the release date and we went through the backlog of ramblings and rants. Over half of them ended up being very useful.
And don't forget: software was shit when we were younger. Win 9x, Mac pre-OS X. Buggy crap all of it. I can't remember the last time my desktop hardlocked, though Android and iOS these days are similarly shitty to how Windiws 9x was.
Windows 3.1, for example. It had a very elegant Virtual Machine Manager with pre-emptive multitasking and true process isolation... and then GUI programs were all placed into a single cooperatively-multitasked event loop, because anything else would have killed performance. And the OS also had to continue to support IO device drivers written for DOS—that could disable interrupts system-wide and thus freeze the computer!—because otherwise your (horrible, un-QAed) scanner wouldn't work.
I fully believe that software hasn't gotten much better over the last 40 years. The hardware constraints have simply relaxed to the point that we're no longer forced to make as many Faustian bargains.
Hilariously enough, this is now known to be a UX nightmare. HN has had multiple articles on why it is a UX nightmare, even when users know to click the hamburger menu (and everyone does by now), they don't engage or explore as much as they would with a layout that doesn't hide half (or more) of the user's choices.
However, to be fair, Apple designers are very much against this trend as well (not to defend the recent downturn in Apple UX design).
I recommend this 2014 WWDC talk on UX[1]. The entire talk is worth watching even for non iOS UX design. but it goes into the problems with hamburger menus specifically at 32 minutes.
Probably the best thing Microsoft could have done back then was make a little pseudo-video† walkthrough, showing people what's in the Start Menu and what happens when you click on a few of the items in there.
† What do you call a video stored as a sequence of automation triggers for software, rather than as pixels? Are you allowed to call it "machinima" if it's not a game?
Or to shut down the computer.
That should be "Start to shut down the computer". (grin)
I hate this joke.
It's 2015! I didn't think 'Best Viewed with Internet Explorer' was a thing anymore.
Don't own any Apple stuff but I like to watch what they are up to (often because I'll end up supporting their stuff at some point).
OH! I FOUND IT! it's a little small button under the register form!
I love how Evernote has managed to seamlessly combine the stupid web design tropes of 1) the hidden log-in form and 2) the incomprehensible hamburger. They've got a little something for everyone to hate. It's certainly not just them, though. My own employer's public website just hid all of its useful links behind a hamburger (I'm steering clear of the communications department for a while for their safety) and about every three days I start filling out the registration form on Github before realizing it's not the one I want.
Big UI pain: sites that are not compatible with browser-stored login info.
Compare the login forms for Verizon Wireless:
Home page - https://www.verizonwireless.com (upper right corner)
Logged out page - https://login.vzw.com/cdsso/public/c/logout
Tweaking your password manager settings to log you in through a site's logged out page can often bypass the compatibility headaches.
Using 1Password's Chrome extension, this trick has worked for me so far, although your mileage may vary.
- Menu - Typically at the top of the screen or window, you can go there and find everything you can do with the application, at the consistent place; moreover, as you go over menu entries, an helpful explanation what does what will appear at the bottom of the screen.
- Toolbar - A place which has most commonly used tools. They are represented by icons, text, or both (and you can actually make a choice in settings). Typically, you can configure the toolbar to your heart's content. Toolbars can also depend on the context.
- Context menu - Right clicking on some object will give you menu of things that you can do with that object. Again, explanation of what each of these actions does appears helpfully at the bottom of the screen.
- Tooltips - As you mouse over any UI element, it will helpfully explain you what it's purpose.
- Buttons - Things that are clickable look visually differently than other things that are not. For example, they have different shading. Buttons may also give feedback that they are clickable when you mouse over them. Also, if you click thing that is clickable, it will give a feedback that it was clicked by changing the shading.
I think the big problem here is that UX/UI people want to be artists and so create art, not useful application for end users (which often means follow some standard!). So the end result is even more disastrous when programmers design UI (at least they are rational about it, in some sense), but the cause is the same - it's putting your own ego (behold at my artistic creation!) in front of actual usability.
There are ways. Some applications for example had a "query" button which let you examine the UI, what each element does. I don't see why touch devices couldn't have the same thing as a (hardware) button.
Steve Jobs hated buttons, but they have their place. If you eliminate all of them, of course you end up less productive.
And yeah, unfortunately, my list is very obvious.
The article is misguided, in that it assumes that the meaning of an icon only exists in the lines/color/visual form of the icon. Icons are visual language. You have to teach the user what the icon means. Either the user has seen the icon before (such as in airports), or if the user hasn't, your UI has to accommodate that.
Once that happens, then icons are way faster.
Icons are like visual acronyms. The sequence of letters 'T', 'C', 'P', 'I', 'P' means nothing to someone who doesn't already know what 'Transmission Control Protocol/Internet Protocol' is, but once you do, TCP-IP is way faster to recognize, speak, type, and to share.
Recognition speed presumably goes up with familiarity. I have Age - 6 years of experience reading, I have far less than that with whatever icon you come up with.
Let's take starting an app as an example.
On my Smartphone I use the email client "Nine". I probably open up the app manually (versus tapping on a notification) about 5 or 6 times a day.
It took me ~3-5 months of use to be able to look for the icon first versus looking for the text. Note that this is WITH keeping the icon in the exact same place on my home screen the entire time.
So that is what, 450 impressions for, well, no real speed improvement.
In a sea of words, a good icon can help an app stand out. But I'd argue that a good textual name helps more.
If you have multiple products, having your company name start off the title of all your products just means I cannot find your product in my alphabetized app list.
Changing app names is another huge problem. Google's constant re-branding of how I send SMSs on my phone has been very unconductive to me remembering anything. Half the messaging apps out there have the same type of icon (a speech bubble), the textual names make them unique.
That said Facebook cheats by calling theirs Messenger. :)
Also, enough blue icons. Stop it. Everything is one of 3 shades of blue, gross color differentiation kicks in WAY before shape matching does. The three easiest apps to find on phone are the three apps that still have "out of fashion" black icons.
> Icons are like visual acronyms.
I disagree that the analogy is 100%. Our brains have this giant section dedicated to nothing but recognizing characters in our native written language. Sure we have a lot of brain power going to shape recognition in general, but character recognition is so incredibly trained in our heads that it should be our go to.
When I mean icons are a language, I literally mean that they're a language, in that there's a lineage and history of these languages.
For example, I bet you have decades of experience recognizing the 3.5" diskette 'save' icon, and a similar familiarity with the landline phone receiver as symbolizing 'phone'. These are icons that are part of a shared language, so it's safe to say that using them will be instantly recognizable, despite the fact most people don't use floppy disks or landlines anymore.
If a company decides to use a new icon that's not easily recognized, it's like trying to introduce new language; it has to be done smoothly, otherwise most users will not understand what it means. This is not a problem unique to icons; it's a problem across languages.
If I had a new command-line tool that, instead of `./cmtool --verbose`, I implemented `./cmtool --consult` or `./cmtool --magicify`, you'd have to `man cmtool` in order to understand what the commands mean. This is because '--verbose' is a flag that's common oft-used enough to be understood, generally, what it means, while 'magicify' or 'consult' are ambiguous and rarely used. This confusion has nothing to do with the nature that the UI is text-based (vs. icon-based), and everything to do with the fact that user interfaces, like a language, involves shared conventions.
This is also a problem. You cant avoid reading text when its presented to you, so extra text makes the page cluttery, and hard to find the text you really want to read. It is very useful to replace an ever same-looking label for an recognizable icon (Like "Close", "Open", "Save" etc).
Oh great, now I'm flashing back to hunt-and-peck through the Windows XP Start Menu trying to find a particular piece of software in a list categorized sometimes by company, sometimes by software, sometimes by built-in Windows category. An absolute mess.
Yea, but you still have to read them, i.e. focus this "machinery" on a single word/sentence. So you're working in sequence when trying to identify a bunch of unrelated labels. On the contrary, you can probably differentiate an entire group of icons just by a glance in their direction (provided they are appropriately designed, of course).
Plus reading speed is pretty much the same no matter how many times you repeat the task. Recognition on the other hand improves with repetition.
If you're using only text, you're pretty much stuck with being able to differentiate your icons either by location or by actually reading them. Icons add another component to this.
Totally agree with the color-related comment though.
IANANS btw, so your mileage may vary.
I feel like you can also draw a parallel with programming languages. Consider:
def sum1(array)
sum = 0
array.each { |e| sum += e }
sum
end
def sum2(array)
array.reduce(:+)
end
sum2 isn't just a different way to write the same thing. It's a construct that expresses a specific pattern of evaluation and aggregation. It doesn't describe what it's doing like sum1 does. It's more expressive than that. It's "clearer" once you learn it.Similarly (at least in the US) green means proceed/go/forward/continue and red means cancel/go back/stop/error. This is something that was learned, not something that was known by instinct.
Well...[1][2] There are some precedents for red being a no-go colour even in nature. Which is likely why we use it as a stop colour. It would be interesting if someone knows of a significant number of cultures that use it as a "go ahead" colour. I mean, the samples are probably skewed because everyone has been a colony these days but still.
[1]: http://www.noaa.gov/features/resources_0109/images/fire1.jpg [2]: http://museumvictoria.com.au/spidersparlour/images/en000008....
But there are cultures where red means good things.
Who's in charge here? The software works for me, not the other way around.
I don't want to be learning your glorious new UI, I want to be using its essential feature and getting out ASAP.
I understand that for progress to be made, ideas must be explored and risks must be taken.
But leaving out a label is not progress, it's just someone trying to save screen space on a cluttered design, and it doesn't help me.
If you replace all the icons for text, you will feel the site looks from the 90's. Try it out on any major site with the browser.
Text label is not a silver bullet.
In a consumer app, especially one which the user only uses occasionally the bar is much higher, so your icons should be much more obvious, because the user will just delete your app if he can't figure out your icons.
I can look up a word written in a phonetic alphabet.
Which is the first problem, we don't care, we don't want to learn your crappy custom little visual language. We already know how to read, use words.
> Once that happens, then icons are way faster.
That never usually happens; use words, icons suck and we're all tired of them. Works work better, we all know how to read and don't need you to "teach" us anything.
For fun, I looked it up. Some of the icons are obvious, a few make sense once you know the basics, and still others seem almost sillier once explained.
I assume the "No Christmas Crackers" symbol means "Do Not Wring Out".
I ended up going for "40 degrees shirts and pants" since that matched what I was actually trying to wash, but God help anyone trying to use that machine with any specific requirements.
European road signs[1] are another example where text labels wouldn't be practical. Many of the symbols are meaningless in and of themselves, but you of course pick up their meaning pretty quickly when you're learning to drive. If you're an American driving over here for the first time, you wouldn't expect to automatically understand the system without first at least glancing at a travel guide or some other reference.
All that said, I do think it sucks that the whole laundry symbol system is copyrighted.[2]
[1] https://en.wikipedia.org/wiki/Vienna_Convention_on_Road_Sign...
[2] https://en.wikipedia.org/wiki/Laundry_symbol#National_and_in...
I don't use Apple Mail, so this is an example of what a completely new user --- albeit one who has used computers for a long time --- thinks when they see those icons along the top:
- It's a closed envelope. Mail? Send? Close?
- Write? Edit? Compose? Sign?
- No idea what this is.
- Trash can. Deleted items? Delete?
- Left-pointing arrow --- but coming from bottom and looking like it expands outward. Back? Open message in separate window?
- Two left-pointing arrows. Rewind?
- Forward to next message? And why is this arrow not coming out of the bottom, unlike the two to its left?
- Flag. This is probably the clearest of them all.
On web sites, it used to be "send mail to site operator". Now it's "spam this page to someone else so we can monetize it."
- Closed envelope: No idea - Compose - No idea either - Delete - Reply - Reply to all - Forward - Flag. The meaning of this changes, but not the overall idea.
The problem is, WTF are those doing in an desktop application?
I mean, I don't think it's inherently obvious that a triangle pointing to the right means play, a square means stop, and a circle means record. However, it didn't take cassette players and VCRs to be out that long before everyone knew what they meant. In that case, I think having more info (like the text 'Play') is unnecessary.
In the mobile space, I feel like there is pushback because it's also not immediately apparent that 3 horizontal lines means "menu". I wonder how long that will be the case, though.
Or even worse, make the common case harder just so the interface can include all the features.
It's generally a good idea to look through the settings or search on the internet if you don't like something on your PC.
Windows 7/8/8.1/10 all allow using labels and text for the taskbar buttons.
The other real irritation comes from the fact that the selected button no longer has a "pushed in" effect like Windows Classic used to have, but only a very subtle colour change (and the colour varies depending on the colour of the icon too... so instead of just one "active" colour for everything, I now have to figure out what each app's active colour is to find it quickly):
http://answers.microsoft.com/en-us/windows/forum/windows_7-d...
Even if you decide to use a textual button, offer a hover tooltip if there's a keyboard shortcut. (Hello phpStorm, I'm looking at YOU!)
Not today, but if pressure sensitive touch becomes a widespread thing, distinguishing the "hover"/"click" distinction could be a thing on touch interfaces as well -- bringing back some of the depth of interaction that touch has lost with comparison to desktop.
So yeah, I think the article is spot on.
[0]: https://github.com/dtinth/YosemiteAndElCapitanSystemFontPatc...
[1]: https://github.com/alexzielenski/ThemeEngine
[2]: http://freemacsoft.net/liteicon/
[3]: https://www.xs4all.nl/~ronaldpr/emaculation/Mac_Icons_and_Te...
as you can see, I'm obviously a SCARY elite hacker that should not be messed with ;)
They are "language agnostic" in that an icon system is its own language.
The result is more like having dozens or hundreds of different dialects of Esperanto - each system intends to be rational and useful, but the overall effect on users of multiple icon systems is more like cacophony than expressive consistency.
OTOH, the core challenge of using text labels is finding texts that work and are meaningful and reasonably consistent across dozens of written natural languages.
(I'm looking at you Eclipse)
For instance I liked OS X's original toolbars, in that you could easily shift between modes that displayed text or did not display text. (Then they entered their phase where toolbars couldn't be customized and all icons were the same shape, which is far less sensible.)
I also set up my browser such that half of the tab bar is favicon-only bookmarks; I can very easily get to the few sites that I look at most days or want a reminder to look at. I also use favicons to identify tabs. I remove most of the standard browser icons in the interface and just leave the few I use regularly, so I can remember what they all do.
So maybe it is best to think of icons as visual interface optimization that is best performed by the user. Especially for web sites or default application modes I agree with the author that there should be text involved most of the time.
OTOH a younger person confronting a piece of "antiquated" equipment, e.g., an old camera where everything had to be set manually might well feel totally lost vs. the old-timer who knows how to use it from prior experience.
It's not really a generational thing, more associated with environment, exposure to the device in question, education and similar factors. It's all too easy to assume everyone else has the same background and knowledge base as we ourselves, but that's in fact rarely the case. When others aren't similar to us, it's not safe to believe their apparent deficits are due solely to factors like age or obvious personal characteristics.
There's a series which includes examples where kids are asked to use old technology, like a VCR ( https://www.youtube.com/watch?v=kesMOzzNBiQ ) or rotary phone ( https://www.youtube.com/watch?v=XkuirEweZvM ). They fumble, rather like their grandparents might have fumbled with the unfamiliar interface when it first came out.
The major difference is that children don't worry so much about making mistakes and feeling dumb.
no mention of i18n, no language variation. just try using labels with a more verbose language like german. welcome to hell.
a good icon works across cultures and languages, allows optimized and pixel-perfect UI.
Cancel becomes what, "Zurücksetzen"? "Abbrechen"? All longer strings, good luck with your tiny button.
Not even mentioning Mandarin or Japanese yet.
Oder aber das ist einfach Enterprise-Software Problematik und die Consumer-App Afferl spielen weiter mit ihren Zehen.
Text-only is as-bad as icon-only. Combine the two.
Also the recent trend for black and white icons makes them sometimes harder to understand. Colorful icons worked fine, in older Office <=2010 and elsewhere. Though finding a good icon set with 500+ generic icons that fits one needs means taking compromisses.
But the easiest icon is that weird squidgy thing that looks like a ... well, I don't know, I'm expecting users will click on it and eventually figure it out. Squidgy thing takes maybe an hour to create. The internationalization team's SLA is not an hour.
The only time I prefer icons is when I am already in graphics mode while using graphics software.
I'm thinking about for example a swipe based touch interface. A lot of functions now are click here, then click there, when they could be done in a simple gesture. But the problem is that one would have to learn the gesture somehow in the first place. And people don't read manuals, even if there were any nowadays.
On mobile you have to try and hope it is not the "irrevocably delete thread" button.
>> Google decided to hide other apps behind an unclear icon in the Gmail UI, they apparently got a stream of support requests, like “Where is my Google Calendar?” <<
I think icons next to a text label are very useful because they guide the eye so you can quickly see where your buttons are.
> Facebook as a final example: they lately traded their
> unclear hamburger menu icon for a frictionless navigation
> that combines icons with clear copy. Well done
No, not well done. They went from almost conforming to the OS' (on Android) design guidelines, to totally ignoring them.The 'hamburger' button is not "unclear", because it's so commonplace that at the very least it has an intuitive meaning in the context of an Android app - it's where I expect more options, settings, etc. How do I know that is now kept behind the much less clear icon that seems to show a man moving quickly?