Making things easy is hard.
But I often tell developers that extra time spent making software easier to use is time well spent. If an hour or two of development saves users 10 seconds thousands of times, the net gain of time spent just grows more and more valuable the longer the software is in use. Not to mention that an attractive, informative, frictionless UI makes a great impression on your user.
So, where can you spend your time to make your UI help your users save time?
Be Consistent
Users come to your software with experience and expectations. They “know” that a magnifying glass indicates search. Without a good reason to do something else, be consistent with industry standards. But if you have reason to be distinctive, at least be consistent across parts of your system.
“Any Standard Is Better Than No Standard”
Be Specific
They say 90% of programming is error handling. (The other 90% is user interface.) A lot of that is defensive programming that keeps your software running in unusual circumstances. But some of those circumstances are not so unusual. And if the program knows something that would help the user, it should be communicated to the user. I’ve been guilty of writing code that handled several errors by responding with a message like “Error: Could not complete operation.” And I’ve been the victim of code like that, too. I ask “Why? What ‘error?'”
Lately, I’ve found AI programming support to be a great help here. Where I may have had code like:
// Validate, then apply change.
if (firstConditionNotMet()
|| secondConditionNotMet()
|| thirdConditionNotMet())
return -1, "Something went wrong."
DoSomething()
return 0, "Success."
I can highlight it or point to it and have an AI coding agent turn it into something like:
if (firstConditionNotMet())
return -1, "Condition 1 not met; unable to apply change."
if (secondConditionNotMet())
return -2, "Condition 2 not met; unable to apply change."
if (thirdConditionNotMet())
return -3, "Condition 3 not met; unable to apply change."
...
The agent often generates better messages than that but just the mechanical restructuring gives me a place to compose better messages. And this code also returns more specific error codes for the calling function to handle.
Let the AI do the grunt work of creating the scaffolding so you can focus on the messages.
Be Supportive
Roughly 5% of the population has “color vision deficiency” and more have some other form of vision impairment. A first draft of a new UI we created recently had state indicated by colored circles:
- 🟢= all good
- 🟡= might need attention
- đź”´= not good
But we heeded the maxim that you should not use only color to convey information in our UI and undertook a refinement. We kept color but added shapes.
- âś…
- ⚠️
- ❌
All convey a positive connotation in two dimensions: shape and color.
And we added a grey circle⚪for when no reliable state information was available. We support colorblind users with shapes but we don’t stop there.
The important word in “don’t use only color to convey information” is “only.” A rich UI has more than one dimension.
Bonus: Be Grammatical
This is more about making a good impression than making the UI easier to use, but it doesn’t hurt to impress your users.
I find a message like “3 change(s) applied” to look unpolished. And it gets worse when you’re dealing with an irregular noun: “3 policy(s) updated.” But the technique of generating specific error messages that was described above can be applied to creating specific success messages. An AI can help you restructure:
msg = "{n} changes applied."
into
switch n {
0: msg = "No changes applied."
1: msg = "1 change applied."
default: msg = "{n} changes applied."
}
Again, let the AI take a crack at it and refine the messages if you need to. (But you might be surprised how well the agent knows plurals.)