UX Best Practices (Part 3): Interactions driving connections
#30dayUXchallenge [Day 19]
We started the UX best practices series covering how patterns and Gestalt can help us designing interfaces that are easy to digest. Today we want to cover how to approach the behavior behind these patterns: commonly known as interaction design or IxD ❤.
So, first things first: good interaction is driven by good human connection. But how do we achieve it?
There are a few different sets that can help us understand what makes an interaction “good”:
Usability
Usability is definitely one of our favourite terms. Overall, it should be kept in the heart of everything we do as UX designers, so it obviously should be no different when we talk about interactions. Nielsen and Schneiderman explained usability as being made up of five principles:
- Learnability: how easily can our users learn to use the interface?
- Efficiency: how quickly can they perform tasks?
- Errors: how many errors do our users make? How quickly are they overcome?
- Memorability: how much can users remember when they come back to the interfaces after a while?
- Satisfaction: do user enjoy using our product?
The four dimensions we need to keep in mind
- Words: copy is a huge part of any interaction, if not the most important. Keeping it natural will helping to build that special human connection we were just talking about!
- Visuals: images and objects should complement the interface, so we need to be careful here not to overwhelm our users. Moderation is key.
- The space: refers to the machine itself. Is the interaction happening on a phone? Laptop? Apple watch?
- Time: how long do our users spend on our interface? Based on that, what are the opportunities for interaction?
Affordance & Signifiers
The concept of affordances suggests that a function should be self-explanatory. Basically, it should speak for itself. For example, if you see a P with red cross over it, you probably understand you can’t park in that space. Signifiers are the elements that make “affordance” even clearer. On the “no parking sign” example above, the signifier is the red cross over the P (for parking). It just makes the message clear!
Without signifiers, users won’t be able to perceive the affordance.
The play button on a video invites you to watch it, whereas a video with no play button might be mistaken for a static photograph.
Signifiers, in interaction design, are the elements that make our interfaces intuitive and familiar. There is no need to think about what is happening, it is just… clear. If our users need to think about what is happening on our interfaces, there is something wrong!
A signifier can be anything that suggests meaning. It could be a shape, a word, a movement or even a color.
For example, a button is an affordance and the aspects that make it look clickable are the signifiers: the shape itself, the depth, the color, the interaction when the mouse hovers over it. Everything was designed in such a way so that even someone unfamiliar with the concept of buttons will still understand how to interact with it.
Feedback & Response Time
Feedback is what makes an interaction interactive. Sounds redundant, but it is important. If interactions are dialogues between our users and our interfaces, the feedback is the “confirmation” that the interaction was successful. And it better be friendly and intuitive, otherwise we will just be adding unnecessary cognitive load to our users.
The interaction could be a beep, a micro-interaction or an animation. Anyway, any response gives the user the certainty that the task was accomplished. Or not :). The key is to help users visualise the results of their actions
However, if the response doesn’t happen in a timely manner, the momentum is lost. Any lag time can potentially kill the conversation between our users and our interfaces.
So, let’s go through a few benefits of implementing interaction in our designs:
#1: keep your user informed about what is going on. They don’t have time to wonder.
#2 Keep that {special} connection. Make it natural.
#3 Give it a purpose. And don’t do it without one.
#4 Give feedback (and keep they informed, as #1 above)
#5 Navigation as clear as a compass
(No, not really. Clearer than a compass, please!)
And that’s it! Have you got any great examples of how interactions can be applied to increase usability?
Share with us and don’t forget to tag #30dayUXchallenge ❤
