Affordances are dead

I miss affordances.

Affordances in computing UIs… are nothing new! When we put words on a screen, we collectively needed to visually convey what one could do with those words. Menus? Buttons? Dropdowns? All of the fundamental UI elements we’ve had for 30+ years started with deliberate design decisions – good or bad – that became standards, or de facto standards.

And as the web and touch interfaces have matured, designers have collectively thrown them out the window. I blame removing underlines on links.

Let me explain, without getting nostalgic.

In the old days of the web, links were underlined and in blue (versus black and no underline for text). It was the standard. Over time, the ability to remove underlines was introduced – so links could be any color and not have an underline. But… how does one convey it’s a link? Some links sprouted icons. Some remained in a different color. Some grew on hover, or showed a background on hover, or did something only when tinkered with.

Even there, the ability to scan a digital thing and convey intent was lost.

But, as with changes, people adapted. We started to click and poke at more things on pages, even things that looked as ordinary as anything else, in the hopes – the hopes – that maybe this thing would make a page or an app do the thing we wanted it to do.

Touch interfaces escalated this change. When using a touch interface, more than ever, the only way to know what one can interact with is through experience. It is less and less conveyed by the UI itself. Thus, it’s shifting the mental burden of figuring out “how do I work this” to the user – fully. Now, it may not be a significant burden! But, a burden nonetheless. The UI no longer says, “This is clickable” or “This is a thing you can interact with” consistently. Sometimes yes, sometimes no. I’ll note: we’ve collectively gotten used to this.

Big Unsure

Like any UI snob, this came home to roost for me when I upgraded my family Mac to Big Sur, the latest macOS. This version has a UI shift that, when rifling through reviews, seems to be noted as significant but manageable. I disagree. Any change will be tough for people including myself, but the other side of that change appears to be… kinda crappy.

Probably the biggest shift is that everything in the OS is button-esque now. Menus are button-y things that open up boxes below them, without a strong visual attachment. Buttons? Are just icons now with no clear indication that they can be clicked, other than the fact that they’re icons. Look at this screenshot from Safari.

Icons? Or buttons? Who the hell knows? (These are… toolbar buttons in Safari.) [Image description: five icons in a row, with no background or border or indicator, from Safari]

Icons? Or buttons? Who the hell knows? (These are… toolbar buttons in Safari.) [Image description: five icons in a row, with no background or border or indicator, from Safari]

I talk a big game about context. The above is out of context but this area in Safari is accurate. Five icons, in a row. No borders. No indicators of what they do. The colors? I believe they’re from third-party extensions, but who knows? And they’re blue because… Reasons, I guess.

There is a ton of guessing one needs to make to understand this. The only thing that helps is prior experience with Safari. There is almost nothing here, plainly, that indicates these are buttons. Who’s to stop a developer from just… putting icons there? That aren’t clickable? And just provide information? Right.

This is just one example, but it’s emblematic of Apple’s continued decision (that kicked off with iOS 7 and Jony Ive’s takeover of the OS… which I also liked at the time) to prioritize visual cleanness over usability.

A menu in Big Sur. Everything is just rounded rectangle buttons now. [Image description: a screen shot of the Finder menu in Big Sur, showing ‘About Finder’ selected with a blue rounded rectangle around it.]

A menu in Big Sur. Everything is just rounded rectangle buttons now. [Image description: a screen shot of the Finder menu in Big Sur, showing ‘About Finder’ selected with a blue rounded rectangle around it.]

Everything is Button, Button is Everything

Here’s a menu from Big Sur, from Finder specifically. Aesthetically? Not terribly different from prior macOS versions. But the button-itis of macOS extends here too: all of these text items are just buttons. The panel itself? Also looks like a big button now. Even the hover in the menu bar… makes it a button. Seriously, Apple, you get rid of buttons on devices and put them all on screen? Is that the deal?

Anyway. Why would you need to buttonize a menu? If you wanted to transplant an iOS interface into a menu, basically – and that’s what Control Center is. A UI train wreck.

Control Center suffers from a crappy visual hierarchy and a design for touch interface that doesn’t translate cleanly to a mouse-based interface. Here, have a look.

Control Center in macOS Big Sur. Someone approved this. [Image description: a screenshot of Control Center in Big Sur, showing multiple rounded rectangle items and controls.]

Control Center in macOS Big Sur. Someone approved this. [Image description: a screenshot of Control Center in Big Sur, showing multiple rounded rectangle items and controls.]

Since day one, Control Center – even on iOS – has been problematic. The great news is that now those problems are on macOS. This makes sense if one has limited space to convey information – then it becomes a real design challenge. But take a moment and look at this. Not everything can be interacted with in the same way. All of these controls, when hovered or clicked on, act differently. So they look somewhat consistent but don’t act that way. How do they work? What do they do? No one knows until they’re clicked on. Some morph into menus. Some are visual panels.

Again, here, the lack of clear affordances means this is a hodgepodge of controls that – honestly? – would be better served by a menu! Nice one, Apple, nice one.

Beyond that? The redesigned dock icons and app icons… are also buttons. No joke. Those shapes you memorized and used to differentiate apps are gone now, with everything surrounded by a rounded rectangle.

The future is dimmer

This is a rant, no doubt. And OSes change – they have forever. But the push that Apple has put in place with Big Sur is wildly unimaginative and short-sighted. How we use computers and computing devices has changed, of course, in the past 40 years! It’s a big difference. But in Big Sur, Apple’s thrown out so much of the UI standardization it helped usher in to computing. Our interfaces today are making us do more work, more figuring things out, and throwing away consistency and adaptability.