One of the components of any digital solution is the User Interface, and I want to explore this here.
Here is a facebook pane containing one post.
Lots of components here including the identity of the poster, when posted, the post itself, who has reacted to it and how, who has comments, and what that comment is, with the opportunity to post your own comment or reply to or Like the commenter’s post
It also has some user interface elements that offer alternative options (in this case instead of or as well as textual input, we can add images) or will disclose further options that require more information to complete.
This last is worth exploring.
The ellipsis is used to indicate that the software needs additional information from the user before execution.
So, “Save” doesn’t require an ellipsis, whereas “Save as…” does because it requires the user to specify the location, filetype and name of the document.
Curiously the first use of the “Save” command does require this information, but has no ellipsis in this instance, and the icons representing add picture and so forth don’t have an ellipsis even though they need input from the user as to location and filename of the image to be uploaded.
It makes it difficult when teaching people how to use an application when these sorts of anomalies occur. This is exacerbated when User Interface designers from Microsoft, Apple, Google and others differ in their interpretation and application of interface elements.
Let’s revisit the image of the facebook pane
The “insert graphic” items at the bottom of the pane are obvious only when you have learned them. There is some transfer across platforms so that a user can expect similar behaviour from similar icons, but this is not guaranteed. The poster’s use of “atm” meaning “At The Moment” is largely understood by social media (and is part of the “vibe” of tribal inclusion) but “lol” can mean “Lots Of Love” or “Laughing Out Loud” to the semi-initiated: a problem when you end a post stating “Sorry to hear your mother died” with “lol”
To assist, some designers have used callouts, or “tooltips” which float above an icon and tell the user what the icon means. Two examples below (from Microsoft Excel) illustrate this:
There’s a lot of duplication here. Additionally, unless a user hovers over the icon, requiring the cursor to remain still for a second or two, the tooltip doesn’t appear. Further, the tooltip doesn’t have any ellipsis. In the case of “Cut”, this won’t matter, but “Merge and Centre” has a lot of options that aren’t shown by the tooltip.
These problems are made worse when considering inclusive UIs for the blind or deaf, for example, or when a touch interface is involved. How do you hover using your finger?
This is one of the great challenges of touch interface where Apple has provided two interfaces: one for mouse or trackpad where a traditional cursor appears on screen and another for touch for iPads and iPhones, and Microsoft has gone with one interface that runs in both scenarios—a brave decision in my view.
The inconsistency in user interfaces leads to an approach that means people say that they can only use, say, Microsoft Word and can’t possibly use Google Docs even thoug the functionality and, in most cases, the iconography is essentially the same.