Red Light! Green Light! Stop Hurting Your Users!

Written by jamestrenda | Published 2022/11/24
Tech Story Tags: ui | ux | ui-ux | user-experience | ui-design | web-development | ux-design | optimization

TLDRUse appropriate colors when displaying feedback to your users. Red means no. Green mean go. Yellow means here's some other info.via the TL;DR App

It’s a simple concept.

So simple, in fact, a child can understand. Well, almost.

“Green light!'“

All the children (aka players) take off running towards “it” (the person shouting out colors).

“Red light!”

All the players freeze. Anyone caught still moving when “it” suddenly turns around is eliminated.

“Green light!”

The remaining players take off again towards “it”.

“Red light!”

More players are eliminated.

This simple and repetitive cycle continues until a player finally reaches and tags “it” or until all players have been eliminated. The first one to tag “it” wins. If it’s a tie … I really don’t know what happens in that case, actually.

Colors Matter

In America, red means stop, green means go, yellow means … caution.

You wanted me to say, “Slow.”

In South Korea, those colors mean the same thing; they just take it far more seriously.

I’m only kidding; that’s just a TV show.

Actually, I’ve never been to South Korea, so who knows?

What does this child’s game have to do with anything? Glad you asked.

I went to my local garden center the other day to purchase yet another snake plant. No, not because I keep killing them, but because I keep finding spots around the house that need some greenery.

What? I want my house to look nice. Is that crime? 🪴

Also, we have a Border Collie and pet dander is a real thing. Supposedly, these plants purify the air. I’ve never ran any tests to verify that claim (who’s got time to write tests?), but that’s what the tag on the nursery pot says, so it must be true. The blades on my ceiling fans would suggest otherwise, but what do I know? 🤷‍♂️

I went to checkout and put my card into the chip reader. After a few seconds, the machine made a noise and displayed a short message with a yellow background.

“Uh, what’s the matter?” I thought. 🤔 I hope I didn’t overdraft again.

As I peered closely at the screen 🧐, I saw a message.

“Approved. Remove card.”

😑

With squinted eyes, I jerked my debit card out of the slot on the second try—I was using one hand.

The clerk handed me the receipt. “Have a nice day,” she said with a puzzled look on her face.

$80 and an eye roll later… I walked out carrying a house plant as tall as my six year-old and three black plastic pots. 🙄

Why all the pots?

Why all the questions?

Okay, I’ll tell you.

You see, you’ve got the nursery pot, which the plant comes in and it has holes in the bottom for drainage. You can re-pot it with fresh potting soil and a bigger nursery pot if you want or just leave it as is.

Then you’ve got a pot that doesn’t have any holes in it, like the three that I bought, and that’s just to set the nursery pot down into after you’ve watered the plant—or while you water it. This pot acts as a barrier between the likely dirty, and still dripping, nursery pot and the main, or outer, decorative pot. It basically keeps your main planter or basket clean.

Look, it’s just what you do, okay? Leave me alone.

You’re one of those “faux” plant people, aren’t you? Faux sho.

What’s the matter? You can’t keep a little plant alive that only needs some indirect sunlight and that you have to water every other week or so? I hope you don’t plan on having children any time soon.

I’m kidding, of course. I know it’s far too much to ask a developer to crack the blinds every now and then. I’m probably the only developer I know with a year-round tan.

And kids are just as easy as plants. I only water mine every other week or so and I haven’t lost one yet. They kind of smell, though.

What are we even talking about?

Oh, right. User interfaces. Of course.

You know what really grinds my gears? A user interface, whether it be an online form or a chip reader, that uses the color red or yellow to assert positive feedback.

Success!

People, it’s real simple.

Red === bad. 😡

Green === good. ✅

Yellow === keep trying until you get green. 😂

Choosing the wrong color to convey these universal truths not only makes you look out of touch with reality, but it causes users pain. Not so much real pain, I suppose, but emotional pain.

Look, I get it. People are too emotional nowadays, but that’s no reason to make yourself look like an idiot, not to mention the possibility of losing customers by making them think too much. Users don’t want to think. It’s not because we’re dumb. It’s because we’re lazy. I mean it’s because they’re lazy.

I know this is basic stuff, but I also know that the world we live in has thrown basic out the window. So here’s a reminder: all colors matter. 😬 And this is especially true when it comes to displaying messages on a screen.

[INSERT OBLIGATORY POP CULTURAL REFERENCE TO DEMENTED NETFLIX GARBAGE LABELED AS ENTERTAINMENT HERE]

Congrats! You’ve successfully finished this article.


Written by jamestrenda | Don't build products people use. Build products people love.
Published by HackerNoon on 2022/11/24