Many times the interaction between the user and the product becomes a conversation, and when it comes to software there’s a lot of back and forth communication. Users need to know what’s happening, and with messages popping every time feedback is in order. We have to make sure these aren’t annoying or confusing.
Friendly messages have a lot to do with psychology and, from what I’ve learned working at LionMane Software, there are four key aspects to take into account: Color, content, wording and simplicity.
It’s no secret how people are used to relate certain colors to certain situations, such as white for peace or red for danger. So the basics for this messages would be:
Red – Error or warning
Green – Successful action
And I’d like to add a Yellow option for recommendations or reminders, like a “Don’t forget to save before you leave” kind of message.
Of course, we can’t always decide which colors we use since sometimes we have to stick to a design guide for the product with an established palette. But this restrictions have a benefit too! They let the user know this message is coming from the website or app, so is less likely to be ignored by thinking it’s the system asking for updates.
Using a plain dark design on the pop up, looked like a system message.
This site had a very defined palette so using this orange really helped this message
to stand out to the user’s attention.
There can’t be too much of a dialogue if little or no information is provided.
It’s not necessary to write extensive messages, but they must be clear about what’s happening. When there’s a problem it needs to specify if it was on the product’s side or the user’s. I often see an “Oops something went wrong” message after filling out a form but… what went wrong? What do I need to fix? Was it my email or my password?
Is this a wrong email or already registered email?
It’s not always what we say but how we say it.
We should be careful about the words we use for a message specially if the problem is the user’s fault (like a wrong password), there’s no need to sound like we’re scolding them for their mistakes.
Don’t be alarming, unless you’re running an extremely secret classified government site, it’s probably not the end of the world. Even if it was the user who made a mistake, our messages can still convey the “Ok, there was a problem but no worries, let’s work it out” kind of vibe.
And of course, by all means if the message is for something good, like a successful action, use positive words! Don’t start by saying “Alert” or “Attention” just to make the user look at it, this words usually mean trouble and you’ll give the user a mini heart attack before they even read the rest of the message and realize is actually a good thing.
Alert! Everything went well!
Big tech error blabbery makes everything look worse. Nothing says to the user “you broke this” like complicated lines and lines of code. Sure, some may know what it means but to the majority a little error becomes way more frightening if it’s presented in a language they don’t understand.
Take error 404 for example, having a specific page with a little explanation to show instead of the error stack becomes very handy, so much that many sites now add some jokes to it lowering the negativity of the message.
See the difference?
This page doesn’t only explain what’s wrong but also provides you helpful links
Don’t take the user to another page just to display the error message, specially if they were filling out a form. It’s not the best experience to go back and find all the information you filled is gone when you just needed to change one of the fields.
And remember! We’re here to guide the user and make everything a lot easier.