Originally published at: https://tidbits.com/2019/08/30/less-is-more-apples-inconsistent-ellipses-icons-inspire-user-confusion/
Apple’s own software, as well as apps produced by independent developers following Apple’s lead, are increasingly reliant on ellipsis buttons that have no clear meaning or consistent action.
Nice piece, Josh.
I have this suspicion that this proliferation of the ellipses is the result of Apple trying to rely on a symbol rather than text. It appears to me that most of the confusion you describe could be solved by instead of the ellipses using buttons like “More…” or “Settings…”. And I believe this also used to be more common on iOS. Perhaps, there are translations where those become too long or cumbersome. Perhaps Apple doesn’t like text buttons. Either way, the solution would be to come up with better icons, possibly several, and use them in one consistent fashion.
I don’t mind the ellipses per se, but it’s too vague of a symbol for many uses. And what I really detest with vigor is the vertical ellipses. I get that it’s space saving, but while the horizontal ellipses is easily explained by its typographic origins …, the vertical one is just plain devoid of obvious meaning unless you tilt your head.
1 Like
I agree with Simon and have from my first classic Mac - Use Text. And just to be clear, text is a kind of icon. I guarantee the coming word in quotes is not a “tree.” 
Designers sometimes refer to these widgets as “overflow buttons” or “overflow menus,” and they are typically used like the “Miscellaneous” folder on people’s hard drive: “I got this command that I need to expose in the UI, but there’s just no room left, and it’s not used that often either. Oh, hey: overflow menu. Of course!”
And the outcome is typically just as usable as their Miscellaneous folder brethren: in most cases, it’s extremely difficult for users to predict what they’ll find when they access them. Add to that a poor choice of commands that get stashed away in these menus, and you’ll end up with sub-par UX.
Using a more expressive label for such buttons, as suggested by @Simon, would be extremely helpful with regards to “information scent,” but, as he already points out himself, there might just not be enough room to accommodate localized text, particularly on smaller mobile phone screens.
Here’s an example from a current localization effort of our SaaS platform: the German translation for “sign” is “unterschreiben.” Now, make that fit in the space of those ellipses…
That said, overflow buttons/menus can be a great choice of widget — if used sparingly and consistently. For example, showing a simple ellipsis in table rows makes context menus in those tables more discoverable and easier to use (because they only require a regular click to open vs. a control- or right-click) without giving them excessive visual prominence in the overall table.
By the way, popular nicknames for the horizontal and vertical ellipsis are “meatball” and “kebap,” respectively. Hmmm. Meatballs. Rolls off the tongue much easier than “horizontal ellipsis,” no? 
2 Likes
It’s funny, I get what you’re saying, but I’ve never found the ••• confusing, I’ve always assumed they meant ‘more actions’ or similar. This matches nicely with their traditional use on the Mac in menu commands, where it should be noted that you can get quite different interfaces resulting from a menu command ending in …. The fact that there are different interfaces for the resulting actions/information on iOS doesn’t strike me as a problem necessarily, and creating specific icons that are meaningful across cultures can be difficult. Saying that, I can see there are cases where more specificity would be better (the Shortcuts settings icon being a great example).
I’m not sure holding Google up as a better example works too well. They are a bit more consistent, but that’s probably because the scope of their apps is much more limited – they’re not providing the variety and OS services that Apple is (and even within this limited scope, they’re not fully consistent). It would be interesting to see how consistent they are on Android where they have an expanded set of interface issues to solve.
And the bigger problem is that the Google apps are not using the standard iOS interface conventions, which I find far more disorientating than Apple having different iOS interfaces resulting from •••. Maybe that’s because I don’t use any Google apps, so seeing your screenshots was pretty jarring, but I think largely following platform conventions is a more important principle. (This is aside from the fact that subjectively, the Google apps look ugly to me, so I’m glad I don’t need to use them. 
)
1 Like
Yeah, I think it’s hard to remember that some languages have significantly longer words. But since there are a lot of words that are used throughout Apple apps in iOS, I wonder if Apple is slowly whittling the set of words used down to those that do localize well.
Hamburger menus and meatballs! Must drive the vegetarian designers crazy. ;-) Where does “kebap” come from? (Or do you mean “kebab,” as in the skewered meat dish?)
Apple made a big shift to text labels in iOS 7 but they’ve dialed back from that. It was a bit of an accessibility problem, since the text wasn’t clearly identified as clickable, and iOS 7’s thin, wispy fonts didn’t help. And as Jochen said, some words are absurdly long in other languages. However, I’m generally in favor of the idea when there’s space on the screen. The Slack example could easily just be a text button under the ones already there.
Thanks for the insight and the terms of art!
Yup, “kebab:” picture a skewer with three small chunks of meat — or cherry tomatoes for the vegan faction — on it.
P.S.: “Kebap” is the usual spelling back in Germany.
Josh, the issue with the text-only “buttons” did affect accessibility, but not just in its more traditional sense.
Even for users with good vision, it is often difficult to tell what text on the screen is static, and which is interactive. To make that distinction easy-to-see, changing just the text’s color is way too subtle. Yes, it looks cleaner, but just how bad is it to add an outline to a button?
This nonsense has become prevalent in design in the last couple of years, with many designers giving aesthetic considerations higher priority than ensuring rock-solid interaction design. In fact, this lack of decent “perceived affordances” in the iOS 7 redesign is something I’ll always consider unnecessary and borderline inexcusable, particularly for a company with Apple’s history of UX prowess.
P.S.: The term “perceived affordance” was coined by Don Norman, and here’s his very own explanation of what he means by it.
2 Likes
Haha, I think that’s another case of localisation – three dots look nothing like a kebab in this part of the world (though anecdotally, I’d also never heard those terms used to refer to an ellipsis button). 
1 Like
The name of the “kebab” button (three vertical dots) comes from shish kebab, “an English rendering of Turkish: şiş (sword or skewer) and kebap (roasted meat dish).”
1 Like
I don’t think this will be a real problem to anyone, because whether or not it’s officially “more” that seems to be what it means in practice.
That said, there is a problem here… just not one requiring 2,500 words. I hope you reported it, and I hope Apple clarifies the guidelines and straightens this out going forward.
I’d loved to have written a shorter article, but there was no getting around providing so many examples, and we can’t just dump screenshots in without context. As far as reporting goes, consider the 2500 words I wrote to be the report. 
We know that at least a few Apple employees read TidBITS, and they’ve fixed things we’ve publicly complained about in the past.
1 Like
Another issue with reliance on text for small screens, ideograph heavy languages (Chinese, Japanese, to an extent Korean) can get REALLY hard to read when the fonts get smaller
For those who have trouble with this in iOS, Settings > General > Accessibility > Button Shapes can add some graphical callouts to text buttons.
I will admit that part of the problem I have with the increased reliance on graphical buttons is that I don’t parse them well myself. I’ve never liked little toolbar buttons because I often can’t see them all that well, and even when I can, I don’t think graphically, so a little boxy thing that might look like a dot-matrix printer doesn’t say “Print” to me. I’m sure others have different opinions, but give me words any day.
I’m afraid the same is 100% true for me as well.
One thing I always hated about the various Windows icon bars is that they consisted of a huge number of tiny icons of which at least half to me meant nothing at all. The floppy disk or dot matrix printer might have worked, and I’d even get the scissors, but what the heck is an icon with four blue squares where two are enlarged and solid blue supposed to signify? Now you need to either add text or you require people hover over it with their mouse to get what UI means. That’s tedious and tiresome to me. IMHO either icons need to be perfectly self explanatory or you’d have to resort to text labels. I don’t see another way.
2 Likes
They have been doing these kind of reductions in display data to save power.
Adam, UX research has shown time and again that the combination of icons and text labels work best, and I agree that all-too-often, graphical representations are not nearly as “intuitively” meaningful as their designers assume.
That would be quite the mindblowing conspiracy if all those UX/IxD designers, who have included overflow menus in their applications, did so just to make the battery life of Apple’s next iOS release look good…
P.S.: Sorry, @jcenters. Couldn’t resist using an ellipsis right there!