Bad design

Design that doesn’t quite work

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.

Bad design: Websites that adopt the OS color scheme

Windows 10 and macOS both offer dark modes for their UIs, allowing the user to exchange light colors for various elements like window borders and backgrounds for darker ones, which is nice if you are viewing a monitor in a dimly-lit room (as an example). Some also just prefer the aesthetic. For myself, I prefer a lighter theme in Windows, but like the Mac’s dark mode implementation.

Depending on how an app is written, it may adopt aspects of the OS color scheme (such as for window elements) or just ignore them entirely. Take my browser of choice, Firefox. Out of the virtual box, it does not comply with the dark mode of either OS, but it does have an included dark theme you can switch to that brings most of the UI in line with whatever you have the OS set to. The current version (88) has some gaps–context menus don’t properly reflect the dark theme, but these appear to be addressed in version 89, which is giving all of Firefox’s UI a going-over. The Firefox dark theme leaves web pages entirely alone, as is to be expected. If you want all websites to be darkity-dark, you can use an extension like Dark Reader, which tries to intelligently make bright websites dark, and works fairly well.

But then you come to the Bad Design–websites that sniff out your OS preference and then set their site to match, thinking this is what the user would naturally want. This is a bad assumption and should never be forced onto the user. At minimum, it should be a choice offered as a toggle between light and dark. Forcing it on the user means that they may end up with an inconsistent browsing experience, or have to deal with a site that may not have been as carefully designed for a particular color scheme (ie. dark mode).

My go-to example for this is https://sixcolors.com, an otherwise excellent and nerdy site focusing on Mac/Apple stuff. If you view it on a Windows PC, it will always look bright. If you view it on a Mac, it will be bright or dark, based on the mode you have chosen for the OS. I find their idea of dark mode a bit too dark, resulting in text that is too high contrast, making it harder to read. My fix is to use something like Dark Reader to fiddle with the colors and make something that looks better (this doesn’t produce great results), toggle dark mode off (inconvenient for one site) or, ironically, view the site from a Windows PC. A simple toggle would fix this.

Holy cats, Scrivener 3 for Windows is out!

I have opined before on the travails of getting the Windows version of Scrivener caught up to the Mac version. Then I found out that version 3 for Windows was released six days ago (March 23, 2021 to be exact). I am not even sure how to react.

Since I qualified for a discount on upgrading, I decided to spend the $34, even though I don’t use Scrivener anymore, to check it out.

I had used the beta off and on through its years of development (the original release date was projected to be 2018–see here for more), so I was broadly familiar with the update (and have used version 3 on the Mac). The upgrade and installation processes were both quick and painless, and the program looked much as it did when I used the last beta.

And it remains as inscrutable as ever. To be fair, the UI has been tidied up a bit, but large parts of it are unchanged and it wouldn’t be so bad if it didn’t utterly ignore the conventions of standard Windows software–or any other software, for that matter.

Unlike other writing programs like iA Writer or Ulysses or, uh, Notepad, Scrivener is more like Microsoft Word in that it presents a WYSIWYG environment. As such, you can adjust indentation, font sizes and all of that, making the document look as pretty as you’d like. In the end this doesn’t matter as much, as you can specify different options when actually exporting your project to PDF, ePub or some other format.

To adjust how the text will look when writing, you go to File > Options. Pretty clear so far. The keyboard shortcut is cheekily Ctrl + , (CTRL and the comma), which is the same combo used to invoke Preferences on a Mac. You then choose the Editing tab from the vast array of options presented. OK, this mostly makes sense, as you are changing what the editor will look like. Here you have three more tabs: Options (er), Formatting and Revisions. Formatting is what you want. Here you will finally see where you can adjust the settings. Strangely, the sample text is highlighted–it turns out the preview will not actually show your changes unless the text is highlighted when the changes are applied, so it has pre-highlighted the text for you.

You will also see a strip of formatting options, much like you’d see in a typical word processor. You can change font, size and style, paragraph type, indentation and more. It does pretty much what you’d expect. Now when you create a new project, it will use these settings. Yay, all done!

But what if you want to change the look of a current document? Well, you can do that by going to the Documents menu, choosing Convert and then Text to default formatting. You get to choose a few options, but strangely (see a trend here), if you had somehow selected bold for the text in some scenes (maybe your fingers slipped and hit Ctrl + B), there is no way to change this across multiple scenes (that I have found). You have to go into each individual scene, hit Ctrl + A, then uncheck Bold from the formatting bar.

There is, still, no way to select an entire document/project at once and apply settings globally, apart from the Convert method above, which doesn’t actually convert everything. It is odd. It’s not even wrong, per se, but Scrivener continues to chart its own course when it comes to interface.

I’m not sure how much I’ll use it, but the upgrade costs less than a single year of subscription to Ulysses, so I’ll at least tinker with it for a bit.

Why are wireless mice so bad on the Mac?

Seriously, this should be a solved problem, but the only way to get consistent performance on a mouse when I’m using any Mac (I have owned three in the past four years) is to use one that plugs in using old-fashioned cables.

Tonight I have been using my MacBook Air with the Logitech Marathon mouse and it started out fine, but over time the mouse cursor starts to become slow and then erratic, glitching across the screen. It improves for a bit, then starts glitching again. If I dig out one of my old wired mice it works just fine, so it seems like there’s something up with both Bluetooth and Wi-Fi connectivity on Macs.

This never happens in Windows. In fact, I can take this exact same mouse and use it in Windows right now and it will operate perfectly fine. My regular Windows mouse is a Logitech G703 wireless gaming mouse. It works perfectly when untethered.

I just don’t get it. It’s like Apple optimizes the OS to only work with their mice and nothing else. It’s incredibly annoying and reminds me why I never manage to make it long whenever I try using the Mac. For an OS that gets lauded for its stability and design, it has some pretty deep flaws.

At least the keyboard works properly. Oh wait, it’s plugged in. Bleah.

EDIT: Here, have an amusing (?) semi-related gif:

Bad Design: Conan Exiles keybinds

Conan Exiles is a survival/crafting game that is sort of like an MMO, with servers, private and public, in which you create a barbarian (complete with endowment if you like) and go forth into the desert and jungle terrain, building, hunting and gathering. You can even craft a wheel of death. It’s very pretty and there is always satisfaction in making stuff.

But the UI is not great. The crafting part of it tries to be so helpful it actually confused me, because it includes a non-interactive “demo” of the crafting UI next to the actual crafting UI and I tried interacting with both until I realized that only one worked. Sure, I was being a bit of a noob, but at the same time it’s a cluttered mess.

But the worst part are the keybindings.

You can rebind most keys to your liking, which is good. Way back in 2001 I switched from the classic WASD layout to the default used in the game Tribes 2, ESDF. You can argue over which is better, but WASD is still the default for moving around, and so it is in Conan Exiles. I changed it to ESDF and called it good.

Then I discovered that when you open a box or container, there are certain shortcut keys to do things, like Loot the selected object or Loot All to take everything.

The Loot All key is set to F by default. You see the problem here. If I looked into a box filled with a dozen items and then stepped to the right, I would grab everything as I shifted slightly over. I did this a few times before wondering why my barbarian was becoming spontaneously over-encumbered.

I went into the keybindings to change this and, oddly, could not find a key for Loot All. Because there isn’t one.

I could not believe there was no way to re-bind the key, so I hit the internet and DuckDuckGo led me to a Steam Community Forum post that gave me the info I needed–buried deep within the game’s subfolders is an input.ini file, and you can manually edit it to change these otherwise un-bindable keys. The Loot All key looks like this. I set mine to P for Please Don’t Loot All Anymore:

https://cdn.discordapp.com/attachments/589323104271073284/759643990000926720/unknown.png

This is bad design for two reasons:

  1. Burying some of the keybindings in an ini file that must be edited manually
  2. Allowing the player to re-bind a key to one that can only be changed through the method described above

The Solution: Add another section to keybindings, titled Containers or something to that effect, and allow players to easily change these keys–and when you use a key that is already bound to something, tell the player and then unbind it if they confirm the new binding.

Any other way is barbaric.

Bad design: Goodreads’ review editor

As terrible as 2020 has been, we still have modern conveniences, like toasters, washing machines and keyboard shortcuts for formatting when writing text on the web.

Unless you use Goodreads’ “What did you think?” text box to add a review of a book you’ve read. In this case what you get is a text box that could have existed in 1998, unchanged.

Here’s the set of formatting tips it includes, which could have been cribbed from Learning HTML for Dummies, 1999 edition:

They do have a few concessions to the 21st century, mostly related to allowing easier linking to content on its own site (a coincidence, to be sure), and if you use a proper link, it will automatically make it clickable, a true miracle of modern web magic.

But looking at the warning about improperly nesting tags really does take me back to when I was building websites in HTML by hand and yes, it really was in 1999.

Given how trivially simple it is to offer simple and easy formatting controls (keyboard shortcuts and a formatting bar, both of which are available to me as I write this post in WordPress), the only reason I can think for a massive site like Goodreads to not offer the same is sheer laziness. And that’s not a good reason. It’s bad design.

Bad design: Expired cart and recommendations on Kobo

Maybe running an online bookstore is hard.

Yesterday I got an email from Kobo with this:

I click the link because the title interests me enough to expend the effort to find out more. I get this:

Indeed, using the search bar I am able to find other books by Jeremy Robinson, and none of them are named Flux. (The books is available on amazon.ca at a current discount price of $5.99, so I bought it there.)

So why was Kobo recommending a book that was clearly no longer in the store? That simply shouldn’t happen.

It reminded me of another deficient part of Kobo’s site. If I leave a book in my cart for [x] amount of time, later buy the book (while it is still in my cart), I will get an email a day or so later urging me to buy the book, because their system obviously checks value [x] but does not check value [y] (has the book been purchased since [x]?)

These are both examples of not just bad design, but actively making the user experience worse and undermining the user’s confidence in the stability of the Kobo ebook store.

Kobo can and should do better.

Bad design: The iPhone camera shutter sound

I accidentally turned off live photos on my iPhone 8 the other day when fiddling around with some settings in the camera app. I discovered I had done this when I took a picture while on an early evening stroll tonight and heard that horrible fake shutter sound go off after snapping a photo of a flower.

I checked the photo in the Photos app, and sure enough, it looked like live photos was turned off. For those not familiar, live photos basically starts recording a short video snippet just before, during and after taking a photo. These snippets can be treated like animated GIFs, or you can grab a still from the stream if your main/actual photo didn’t turn out the way you liked. I actually used this once for a selfie where the main photo had my eyebrows up and the frame just before had them down–and looked better.

But the main perk in having live photos is it kills the phony shutter sound that otherwise plays when you take a picture.

Now, I get why Apple added the sound. Back in the early days of iOS Apple design traded heavily on skeuomorphism, and this is the audio equivalent of that. What happens when you click to take a picture with a camera? You hear the shutter activate! Ergo, simulating this sound will reassure the user that the phone captured the photo and remind them that their expensive slab of glass is also a camera.

Except the sound is so meticulously loud and overdone it feels like the phone is mocking me. Every time I snap a photo it feels like the phone is announcing to everyone within hearing distance, “Hey! Taking a photo here! Did you hear that? You know what it is? Photo-taking! Yep, right here. Hope we’re not disturbing you! Photo in progress, lol!” I don’t really have a need to discreetly take photos–I’m not a private detective chasing down philanderers–but I don’t have any need or desire to draw attention to taking a simple picture, either. It’s obnoxious and unnecessary.

Currently there are two workarounds:

  • mute the audio on the phone
  • enable live photos

If you don’t care about any audio on your phone, the first workaround works. If you like live photos, the second workaround is fine.

But there shouldn’t be any need for workarounds. The shutter sound shouldn’t exist at all.

But I’m willing to compromise. Apple could offer an option in the Camera app settings: Enable shutter sound Y/N.

Anything else is bad design.

Oh Siri, Part 87

Adding containers to a shopping list.

Attempt #1: Kool Aid
Attempt #2: Cooler
Attempt #3: Containers. Hooray.

I pronounced the word “container” the same way, with the same inflection each time. This is why the reports that say Siri is better than Alexa ring false to me (or they are testing something else, like depth of trivia knowledge). When Alexa fails, it’s usually because it can’t process the command, either because I’m asking something impossible, or just phrasing it in a way that it’s not been programmed to recognize. It could be as simple as omitting a key word.

Siri is different. Siri will sometimes just fail completely, offering up a baffling “no internet connection” error when the internet is right there, or asking me to try again later because maybe someone at Apple has tripped over the server’s power cord again or worse, insisting that I have no such list to add an item to, after which I will ask Siri to show me that list and it does–then still refuses to let me add items to the list because it still doesn’t exist. But more often than these, Siri will misinterpret what I am saying, giving me Kool Aid instead of containers.

It does this often enough that it doesn’t surprise me. It doesn’t even bother me, really, I just accept that it’s part of the whole Siri experience. But Siri has been around since the iPhone 4S (2011)–it really should be a whole lot better than it is. Bad Apple.

Bad ad

I subscribe to the Bookbub newsletter, which delivers a daily list of bargain-priced ebooks covering any genres you highlight as your favorites. It’s a handy way to find the occasional bestseller for cheap, but better still for finding new authors with minimal financial risk. I’ve started reading several new authors, so can recommend at least checking it out.

This post is not about the Bookbub newsletter.

Rather, it’s about the coveted ad space that appears at the bottom of the newsletter. This is where authors can highlight their efforts and reach a potentially wide market.

Most of the ads are new, but I’ve seen a few repeats. This is about one of them. It is a bad ad.

Here it is:

Why is it a bad ad?

The image of a young woman with blood splattered on her face and finger is obviously meant to be provocative, but something about it just screams stock photo. Visually, I find it dull. I guess the story is about a murderer?

There’s no description of the story, not even a pithy little blurb or one of those mash-up quotes. “It’s Jaws meets the Stepford Wives!”

There’s no title. What is this story called? Beats me. You have to click the link (where does it go?) to find out. But why would I? If the author can’t be bothered to even include the title of their own novel, how much should I care about it?

The quotes feel a little too selective. “Evocative of Stephen King” sounds positive, but for all I know the rest of the quote could be, “but fails to match the horror master’s craftsmanship.”

Also, the author expects people to know what KU is. I do, because I’ve been a longtime Bookbub subscriber, have read up on self-publishing and am familiar with Kindle Unlimited. But what about someone who is new to Bookbub? I’ll concede this part may be aimed at a more specific segment of the Bookbub readership.

This ad has come up a few times and I have yet to click on it. I was tempted to for this post, but still couldn’t be bothered enough. It’s a mystery, but not one I care to solve.

It is a bad ad.

UPDATE: But it is also a ubiquitous ad, as it ran for the next week in the Book Bub newsletter. This prompted me to finally click the link and discover that I had actually checked out the book before, then forgotten about it. I don’t blame the book for this, just my addled mind.

It’s called The Demon King and the basic plot reads a lot like Stephen King’s IT, which is where they “evocative of King” quote likely comes from. It’s also the first book of three in something called “The Bloodletters Collection”, is rated 4.5 out of 5 stars on amazon.ca, and costs $4.25 in Canada thanks to our lowly Canadian dollar. Each book appears to be longer than the previous, also evocative of King. The price is fine, but I ain’t committing to a trilogy from an author I’ve never read that spans over 2,000 print pages. But I’ll probably remember it now.

Death of a butterfly

Today Apple released the updated 13 inch MacBook Pro. As updates go it was pretty tepid. The lower end version is essentially unchanged, still shipping with 8th gen Intel processors, but now with more base storage and the revised Magic keyboard. The magic part is that it’s not prone to fail like the butterfly keyboard. The higher end models include 10th gen processors, but are otherwise pretty much the same as well.

This has led people to speculate that another update is coming later this year, that may include a larger display and other niceties. We shall see.

The important thing here, though, is that with today’s update, Apple is no longer selling any laptops with the butterfly keyboard. From the introduction of the new MacBook in 2015 to today that means that users have been suffering through one of the worst keyboards to ever be fitted into a laptop for five years.

Watching Apple’s flailing attempts to fix the design (multiple times) was painful. And nothing could fix the actual typing experience that some loved, but many actively disliked, or even found uncomfortable (raises hand).

At long last, though, the butterfly keyboard is dead. Hopefully it has taken along with it the obsession with thinness over function that seemed to have Apple designers in its thrall. Yes, the butterfly keyboard was thin. It was also terrible. I still find it amazing that it made it into an actual shipping product (ironically that first product, the new MacBook, was killed after only four years).

Anyway, good job, Apple, for finally purging the butterfly keyboard. But next time don’t make your users suffer through years of a deeply flawed product, OK?