Therese Neil has compiled an impressing collection of current Mobile UI’s in this book. It serves both as an inspiring read and as a go to reference when designing Mobile User Interfaces.
In usability we trust
UX and all things web
Tag: Design patterns
Inspired by the User Interfaces of mobile apps on the iOS and Android platforms, I created a delete button using a design pattern that I’ve named the Action-Confirm design pattern. I created this for a web application that I recently worked on.
In a nutshell it’s an Action button that transforms into a Confirm button when clicked. It’s a compact solution that provides the user with a way to confirm a possibly destructive action without interrupting the flow of the application.
Designing Web Interfaces is a book about how to design rich interactions within web pages. In todays web with richer user interfaces, far from the static, full page load web applications we were once used to. We need patterns, guidelines and best practices on how to design those Interfaces to work well. This book is about just that.
In circumstances where you want to notify the user of something, like for example that some information have been saved, a non-modal alert is an excellent solution. It gets your message across without being intrusive and without the need for uneccesary user interaction.
In this article I will describe how to create it with the help of jQuery
Why is it that web apps very often lack something that we take for granted in most window applications, namely the undo function? Is it because it’s not needed? Is it too hard to implement or is it simply just because it’s something that developers don’t think is needed?
The most common solution to prevent user errors is to simply throw an alertbox warning about potential damage or loss of data that the action might cause. Even otherwise awesome web applications often resorts to this behavior. Take for example Backpack from 37 signals, which I regard a very usable and overall great product. When you try to delete a note they throw this alert in your face:
This is, from the developers point of view, the easiest way to handle it. It’s almost too easy to implement an alert and many developers habitually do it without giving it a second thought.
A far better solution is to use an undo function. Although harder to implement it maps so much better to the users mental model and behavior patterns. As Alan Cooper puts it in About Face 3:
Users generally don’t believe, or at least don’t want to believe, that they make mistakes. This is another way of saying that the persona’s mental model typically doesn’t include error on his part. Following a persona’s mental model means absolving him of blame. The implementation model, however, is based on an error-free CPU. Following the implementation model means proposing that all culpability must rest with the user. Thus, most software assumes that it is blameless, and any problems are purely the fault of the user.
Alan Cooper, Aboute Face 3
An undo function enables the user to easily recover from mistakes and also encourage him to explore the interface without fear of doing irreversible damage. It transfers the responsibility of handling errors from the user to the system, where it righteously belongs.
Locus of attention is a term that describes where our attention is focused. In contrary to focus of attention it’s not entirely up to us where we choose to have our attention. If, for example a bang goes of right besides us, our focus involuntarily is placed on that. And that is our Locus of attention. Our focus of attention is alway where we consciously choose to put our attention.
When we are designing user interfaces it’s important to be aware of where the users locus of attention are, so that we are able to show crucial information where the user has his or her attention.
© 2021 In usability we trust
Theme by Anders Noren — Up ↑