Design

Highlighting designs both good and bad

Speaking of buggy software: Everything Apple produces

When you speak to old Mac geezers (OMGs), they will often wax poetic about Snow Leopard as being the best version of OS X (and remind you it’s the Roman numeral 10, not the letter X), not because it came with a boatload of new features, but because it didn’t. Apple advertised it as having “0 new features” because it focused on improving existing features and fixing bugs found in Leopard, the previous version of OS X.

Back then (roughly the first decade of the 2000s) Apple released its updates on a “when they are ready” schedule, which meant you could go almost two years between updates. That changed in 2012 when Mountain Lion (OS X 10.8) came out a year after Lion. Henceforth, all Mac OS updates would come out on a yearly basis, ready or not.

Ready or not.

iOS updates and the rest of Apple’s lowercase-Uppercase OS releases followed suit, and now yearly releases are the norm.

And they are a bad idea, bad for the industry, bad for users, and Tim Cook should feel bad.

Why? One word: Bugs.

Apple has tacitly admitted it can’t keep up with yearly releases, because it now regularly leaves out major features until “later”. Just this year they delayed iPadOS 16 altogether from September to October just to get things working properly. Yearly releases are not sustainable, they’re dumb, and serve no one when they come with incomplete or missing features and copious glitches. Apple is the 800 pound gorilla in consumer electronics, so if they change course, the industry is likely to follow. And they should!

And the thing is, if Apple switched to updates every two years or “when they’re ready” people would still buy tens of millions of iPhones, plus oodles of iPads, Macs and AirPods, not to mention staying subbed to the cash cows that their services have become. But Apple is not only gigantic, they are incredibly conservative and unlikely to change course unless forced by circumstance or the law (but mostly the law).

Why do I think this? Why am I posting now?

Because watchOS 9 is a bug-riddled mess and since I use my watch for my running workouts, the glitches affect me on a regular, ongoing basis. None of these issues happened before watchOS 9 was released (Apple eventually forces updates, so you can’t even just stay put, eventually you’ll need to upgrade).

Among the bugs I’ve encountered:

  • Stuttery or missing animations (not a big thing, but annoying)
  • Unreliable heart rate monitoring, especially at the start of a run (this is a big thing)
  • Music playback on the watch being permanently muffled when interrupted by a notification. It happened today (again) and even closing the music app did not fix it. I restarted the app and tried three albums before the music finally popped back to regular volume.
  • Pausing music playing from the watch via the AirPods (clicking the touch control on one of the earbuds), then unpausing, and the playback switches to whatever you were previously listening to on the iPhone. It’s like having someone come into your living room, quietly pick up the remote, change the channel from whatever you were watching, then just as quietly leaving the room.

I suppose I should be happy most things are still working. But bleah, the yearly updates are clearly not going to improve, so I really wish Apple and the whole industry would move away from them.

Bad design: Hiding common options behind extra clicks

There are a bunch of examples for this one, but I came across the one below when I was using the venerable Microsoft Word.

The design problem is especially common on mobile OSes, but as you can see, it’s not limited to smaller screens where companies might argue space is limited and there is a need to compact options down to only showing the most essential out front.

Word checks spelling and grammar using its AI-driven Editor, which is also available in Edge (browser) and the online version of Outlook, among other apps.

It works as expected, highlighting a misspelled word and offering options when you click on the word. Observe:

Note the three-dot menu at the bottom, next to Ignore All. What do we have here?

Two of the options, Ignore (basically “ignore this one instance”) and Add to Dictionary are pretty common options for spell checking, and having these in the main pop-up menu would not take up much more room, particularly for a program that is going to be running on desktop and laptop PCs with decent-sized to humongous-sized screens.

So why is the user forced to click on three dots to even see these options? There is no good reason, which is why it’s bad design. It’s simply in line with the current fad of minimizing UI, even when it makes no sense to, and makes the experience worse for the user.

Good design would at least offer the first two options to the main pop-up, so you’d have:

Ignore
Ignore All
Add to Dictionary

Then you could bury the other options behind the three-dot menu, though I think it would be better to just include all four of the sub-menu options in the main pop-up. What if the menu is too long because someone is using Word on a 2005-era netbook they got for $10 at a garage sale? Just dynamically have the pop-up appear above instead of below the misspelled word. Even the tiniest usable screens would be able to accommodate the pop-up menu somewhere.

Bad design: Ambiguous UI buttons

Yes, I promised to be more positive, so think of this as me highlighting a UI issue in hope of a positive change. It’s a stretch, just go with it!

The Cider app is currently in beta, and generally I find it to be a superior and certainly a much better-looking experience for listening to Apple Music than Apple’s own decrepit iTunes program (the fact that it still exists on PC years after being retired on Mac shows the contempt Apple has for people who don’t fully buy into their ecosystem).

If you have an album in Cider queued up that is in your library, you’ll see a strip of icons above the list of songs like this:

Remove from Library is pretty clear, so let’s move on to the other two.

Play: The button is red. Does this mean it is waiting to be clicked, then the music will start to play?

Shuffle: This button is also red. Does that mean shuffle mode is currently toggled on? Or off?

Answers:

Play: This is what the Play button looks like when music is playing. It’s also what the button looks like when music is paused.

Shuffle: This is what the Shuffle button looks like when shuffle mode is off. It’s also (go ahead, guess!) what the button looks like when shuffle is on.

In other words, these buttons convey nothing about their current state. To me, this is bad design, but as you’ll see below, it’s actually pretty common, so it would seem to be the expected convention as I’ll explain below.

By comparison, the new Media Player for Windows 11 is…well, it’s exactly the same. The Play and Shuffle buttons don’t change state when these options are on:

Both buttons will highlight on mouseover, but neither otherwise changes when clicked. How do you know shuffle mode is on? You don’t!

I believe the thought here is these are “top level” buttons used to initiate an action, and are not meant to represent the current state. For that, you look at the full set of controls, which do reflect changes when music is paused or playing. Cider again:

Music paused

Here, the shuffle icon is highlighted, indicating shuffle is on. The Play arrow indicates music is paused. We can confirm this by clicking on Play and seeing the change:

Music playing

So, am I complaining about nothing? Maybe, a little, but I still think a button should change to reflect the current state regardless of where it sits in the UI, so I’m still hoping UX gnomes will fight to get these changed.

P.S. I am obviously not a UI/UX designer, so if all of this seems silly and obvious, remember that…I am not a UI/UX designer! I’m just a slob with a website who would prefer more informative buttons, regardless of what current conventions are.

I am not tired of “Woke Sci-Fi”

I don’t even know what “Woke Sci-Fi” is, so I can’t be tired of it (I think), but apparently it’s a thing because it made it into this randomly-served ad in today’s BookBub newsletter:

I’m also unclear if “Gamer Kids vs. The Deep State” is the plot of the novel or a part of “Woke Sc-Fi” that I should be tired of. I do know that appealing to my alleged political leanings negatively in order to induce me to read your novel is a strategy that will never work. Convince me you write an interesting story and I might click your link. Otherwise, pass!

(I also made sure the image won’t link directly to BookBub’s ad server this time and make my post look like lunatic nonsense, or at least no more than usual.)

Good design: The Design Lobster newsletter

I figure it’s time to accentuate design that works, not just design that stinks.

The first is simple:

The Design Lobster newsletter by

You can read and subscribe (it’s free!) here: Design Lobster on Substack

Here’s what I like about it:

  • Ben Strak seems like a genuinely nice guy
  • It’s concise–no filler or fat here. Every week, Ben discusses:
    • One question
    • One object
    • One quote
  • Each newsletter has a theme, with interesting and/or quirky examples from history

Check it out!

Bad design: Cryptic firmware updates

Yes, Apple again. Apple makes this too easy.

This MacRumors story outlines a firmware update for AirPods today. Here’s the relevant quote:

Apple does not offer information on what’s included in refreshed firmware updates for the AirPods, so we don’t know what improvements or bug fixes the new firmware brings.

Why would any company push out updates to a product and not tell the customer what the updates contain? I cannot think of any reason for this that is not consumer-hostile, and the Apple executives who have signed off on this policy are wrong-headed and dumb.

And on top of being needlessly secretive, Apple has pushed out firmware updates that have actually degraded the user experience, but with no way to opt out of the updates and no way to see what has changed, the user is effectively held hostage to the hope that Apple won’t screw up.

It’s just such a bad way to treat customers. It really baffles me. If anything ultimately brings down Apple, it will be the hubris behind its “we know best” policies and actions.

Bad design: The Facebook Like button (iPad app version)

This could be a “maybe it’s just me” issue, but I’m reasonably certain it isn’t.

Facebook (how I loathe thee and wish the few people I communicate with on it used something else, even Fidonet) famously features a Like button. How it works depends a bit on the platform you’re using, but it’s roughly the same:

  • Tap on Like to add the generic “thumbs up” to that adorable post showing a cat trying to walk on ice*
  • Do a long press (mobile) or hover over the button (desktop) to get a choice of several emojis, ranging from sad to angry to sympathetic, to add the needed nuance to your wordless reaction

Here’s my problem, and it only happens in the iPad version of the Facebook app: When I tap on the Like button, which is actually a small thumbs-up icon and the word Like, it will sometimes turn the icon a bold blue, adding a Like to the post–as intended.

But way more often when I tap on the Like button, it instead takes me to the separate page for that post–while also not actually adding the Like (the Like button is also on the separate page for the post, so you can tap it there, too, where it always works as intended).

The maddening part for me is the inconsistency. Sometimes I tap and a Like gets added, as I want. Sometimes it takes me to the post’s page–which is *never* the desired response. It doesn’t even make sense that tapping the Like button even does that. It’s either a bug or bad design.

The inconsistency makes it that much worse, because doing the same thing can yield different results. I can get a Like added, or be taken to the post’s page (with no Like added) by:

  • Tapping on the thumb icon
  • Tapping the word Like next to the thumb icon
  • Tapping somewhere over both (it’s not a big target)

I may experiment with running the desktop version on the iPad, which has the bonus of actually having a working dark mode. I’ll also see if I can replicate this behavior on another iPad and if not, will be willing to amend this post to “Facebook continues to undermine democracy and poison our world but the iPad app is working as intended.”

* Aw yes, another chance to post this:

Bad design: Unnecessary self-promotion in product reviews

This is probably more a complaint than actual bad design, but it’s my blog, so here it is!

There are a billion or so tech sites out there that review tech products. One such product commonly reviewed are laptops.

Apple just released updated MacBook Pro laptops that “correct” many of the features of the previous model, released in 2016.

Tech sites are reviewing these. And a few choose these reviews to indulge in a little branding:

They put their own website up on a browser running nearly full screen on the laptop’s display. You know, in case you were reading a review on engadget and forgot you were on engadget, or on The Verge and forget you were on The Verge.

The Verge is especially bad at this when reviewing phones or tablets, as they’ll use their own wallpaper for the background, which more often than not, is some hideous-eye-bending vomit of neon color, festooned with their logo.

You’ll never guess which site this product review image came from. (Bonus points for giving Sony some extra ad exposure.)

This is VERY SUBTLE, The Verge:

Notch on new MacBook Pro
In which The Verge chooses to associate itself with Apple’s notch

Really, looking over the first batch of reviews for the new MacBook Pro, it seems The Verge and engadget are the primary culprits here. And I should add a caveat–The Verge piece is only a “first impressions”, not a full review. We’ll see how they handle that shortly.

UPDATE: Here’s a screenshot from The Verge’s full review:

Hmm, what site could be reviewing these laptops? Hmm!

Still, every other review or first look I’ve checked so far does not advertise the site in shots of the laptops themselves. I almost wonder if engagdget and The Verge are mandated to do this. They lean more toward “filthy casual” than sites like TechRadar, so it’s possible.

Anyway, it’s annoying and unnecessary, and I already have enough ads in my life without cute versions of the same being snuck into product reviews or similar articles.

Bad Design: Mac bezels (2021)

In which I argue you Apple made the bezels on the new 24″ iMac white for reasons of fashion, not functionality.

Earlier this year Apple revealed their first M1 iMac, a 24″ model that replaced the Intel 21.5″ one. It comes in a bunch of colors. All of them have white bezels, as show in this image from Apple:

Image from Apple

This week, Apple introduced the first M1 MacBook Pro laptops. Here’s an image that I grabbed from the Apple site:

Image carefully pruned by me from Apple

As you can see, the bezels are black. What you can’t see in the shot above is the notch housing the camera that is at the top of the display. Apple is not shy about making it as close to invisible in their promotional shots because secretly they know it looks dumb. Because it’s dumb.

But I’m not here to rage against the notch, I’m here to rage about bezels.

The closest Apple comes to describing the white bezels of the iMac in the initial press release is:

iMac features softer colours and thinner borders on the front to allow users to focus on their content, while the back pops in bold, saturated colour.

Thinner borders, softer colors. To allow users to focus on their content. Remember that.

So why aren’t the bezels on the new MacBook Pros white as well? Shouldn’t white bezels there also allow users to focus on their content? Or is black now a “pro” color?

I believe Apple actually wants people to think that.

The actual reasons for black bezels continuing on the MacBook Pro are more likely:

  • MacBook Pros are used for video and photo editing and white bezels can be distracting, whereas black bezels tend to blend into the background, allowing the user to focus on the content they are editing. Notice that every professional monitor in existence (that I have seen, though I admit I have not seen every single one) has black bezels, including Apple’s own Pro Display XDR. To put it differently, no one ever averts their eyes while shouting, “That black t-shirt is blinding me!”
  • The black bezels are necessary to help hide the notch/camera module as much as possible

Rumors are suggesting the redesign of the M1 MacBook Air will also feature white bezels. If this is true, it further underlines that Apple sees the white bezels as being a “consumer/non-pro” thing.

If true, this is dumb, because the practical arguments on black vs. white bezels stand regardless of how Apple positions its computers. Someone editing photos on an iMac will still notice a white bezel more than a black one. A minor distraction, sure, but still there.

I admit some bias because I think the white bezels look cheap and plastic.

Still, this seems like an affectation and I hate when Apple does this kind of design, because it almost always looks bad.

At least the Mac mini has no bezels.

Bad design: Losing your place after logging in

Usually, for reasons of security, some websites will only allow you to automagically login for a limited time. After that, the sites will stop and force you to enter your credentials again. They will then work automagically again for whatever the specified time is.

This is an inconvenience, but a minor one, and I can see the justification for it.

However, a surprising number of websites–so many I won’t even attempt a list–completely mess this up by following this pattern:

  1. You have a link to an interesting article/feature in a newsletter to a site you have an account on. I’ll use Goodreads because their site is generally terrible and it’s the most recent one where this has happened.
  2. When you click the link in the newsletter, you are taken to the site–you can see the article, but over top of it is a pop-up demanding that you log in (or create an account).
  3. You enter your credentials.
  4. You are taken to the main page of the site.
  5. You must now find the article you came to read, or go back to the newsletter and click the link again, which will now take you, logged in, to the article in question.

This is bad design, because it adds multiple steps to what should be a simple click and worse, sends the user off to somewhere they never meant to go, forcing them to retrace their virtual steps to get back. It wouldn’t surprise me if this extra friction results in a lot of people just not bothering at all.

The correct way–and the way all properly managed sites handle this, is to let the user enter their credentials, then keep them on the same page, so they can see the content they had come for. It sounds astoundingly obvious and logical, yet even in 2021 many sites fail to offer this.

The incomplete list of websites that force dark mode on you (if you are on a Mac)

  • Six Colors
  • MacSparky
  • 512 Pixels

And probably others I’ve forgotten or haven’t visited. By coincidence, these are all Apple-related sites (though not officially affiliated with Apple).

I’ve written about this before, but after seeing multiple sites doing this, I am compelled to once more highlight this as bad design.

It’s bad design because dark mode should be an OS-level choice, one that provides a dark frame around content that may or may not be dark itself.

A good example of doing this right is the writing program Ulysses. Here’s how it handles dark mode:

  • It lets you toggle dark mode on or off, regardless of the OS setting
  • It lets you choose to match the OS setting if you prefer
  • It lets you set just the outer UI elements to dark mode
  • It lets you choose to make the “inner” elements dark as well–in this case, it’s the actual area where you write, which can be dark or light

A bad example is the iOS Maps app, which simply matches the OS setting, turning the map backgrounds into a dark gray mud that is hard to read. On the Mac, you can sensibly toggle this on/off. On iOS, you can’t because Apple is a trillion-dollar company and can no longer function properly (see also: the mind-bogglingly inept Safari beta that rolled out this summer as part of iOS 15 and macOS Monterey).

The best part is the fix for the three websites mentioned above if you don’t want to be forced into dark mode and don’t want to have to toggle an OS-level display setting every time you visit: Check them on a Windows PC, because even if you have Windows 10 set to Dark mode, the sites will not display as such–it only happens if you’re using a Mac, where these sites take an Apple-like approach of “our way or get out.”

I should point out that all three sites are quite fine in and of themselves, content-wise. I even pay for Six Colors! You should read all of them if you are a Mac geek.

The solution as I’ve mentioned before, is to offer a user toggle. The 9to5Mac website (among others) does this and it works just fine. There’s no reason the others listed can’t do the same. That two of them actually went through recent redesigns and still omitted this is not insanely great.

Bad design: Most music apps

But the one I’m going to highlight here is, of course, Apple’s. Apple makes itself such a juicy target because the company’s leadership extols its superior design aesthetic while charging a premium price for the experience.

Specifically, I want to highlight one thing about the interface of the iOS music app, which is pre-installed on every iPhone. You can see it in this screenshot:

First, let me acknowledge the prehistoric nature of the songs highlighted (the newest is from 1992). I am old as dirt, and so is the music I like. Plus, I was sampling some music Apple has highlighted that supports the Dolby Atmos spatial sound standard (more on spatial music in another post) and I didn’t recognize the majority of suggested tracks (again, due to being an out of touch dinosaur).

(Also, the fact that the time was 4:20 p.m. when I grabbed the shot is not some sly signalling that I love the mary-ju-wanna, it’s just a coincidence. Sorry, my BC buds!)

You can see the currently playing song at the top of the screen. It’s Blondie’s well-known classic, “Hanging on the Telep.” It’s “Telephone,” of course, but because the song title is too “long” (four entire words) for the UI, it gets truncated. Apple’s solution (as with nearly all music players) is to slowly scroll the title from beginning to end, allowing the music lover to eventually piece together the entire title of the track they are listening to.

Look at the rest of the music app and ask yourself, “Is there enough room here to fit the entire four word title of a song so it doesn’t have to scroll?” and you may find the answer is, in fact, yes.

And yet this is almost never done. The UI of the music app isn’t actively bad or anything (Apple has much worse stuff tucked away in other areas of iOS), but this tiny space for song titles has always baffled me, because when you’re listening to music this is always going to be the active part of the interface. It just grates on me, especially since there is enough room to easily manage any title of reasonable length. I mean, okay, I don’t expect a music app to properly display Pink Floyd’s “Several Species of Small Furry Animals Gathered Together in a Cave and Grooving with a Pict”, but still.