Category Archives: Tutorials

Cognitive Load

In a nutshell, Cognitive Load is the amount of “Brain Power” required to understand something. This could be perception, problem solving or juggling things in memory.
There’s a well known rule that we are only able to process 7 plus or minus 2 pieces of information at a time – it’s the magic number 7. [...]

Posted in Tutorials | 13 Comments

Case Study: Empty State

Earlier this week I wrote about Empty State. I wanted to follow this up with a case study on how this might work on an example.
Fotolio
I’m going to base this example around an imaginary website. I’ve called it Fotolio, it’s a portfolio site for photographers to upload their photos. Imaginative names aside, I want to [...]

Posted in Tutorials | Tagged | Leave a comment

How to Write a Good Empty State

What is the empty state?
The Empty State is your software in its initial state before the user has entered any data or set anything up. It’s what your new users are exposed to the first time they use your application. It’s a crucial phase; this is before your users have experienced what your application can [...]

Posted in Tutorials | Tagged , | 4 Comments

Fitts’ Law

Fitts’ Law is a mathematical model that predicts how long it will take to “point” at a target. It was first proposed by Paul Fitts in 1954. It takes into account where you are currently pointing relative to the target; How far away the target is and how big the target is. It has been [...]

Posted in Tutorials | Tagged , , | 3 Comments

The 80/20 Rule

The 80/20 rule, also known as Pareto’s Principle, states that 80% of an observable effect is caused by 20% of the variables at play. The first recognition of this rule was by Vilfredo Pareto, who in 1906, recognised that 80% of Italy’s wealth was owned by 20% of Italy’s population.
The same 80/20 split can be [...]

Posted in Tutorials | Tagged | Leave a comment

How to write an alert box

Alert boxes are a user interface element that pops up to alert the user of some critical piece of information. This post explains how to write them.
Lets start off by getting something out of the way. Don’t use alert boxes. They are jarring, often steal focus, interrupt the flow of what a user is doing [...]

Posted in Tutorials | Tagged , , | Leave a comment

Aesthetic Usability Effect

The aesthetic usability effect is where a user will perceive an attractive product as easier to use than an ugly one. It doesn’t actually matter if they are easier to use or not they are perceived as such so users will make subconscious concessions and overlook many difficulties. The seminal work on this principle is [...]

Posted in Tutorials | Tagged , | 49 Comments

Five Hat Racks

The Five Hat Racks was first developed by Richard Saul Wurman in his book Information Anxiety. It’s a bizarre name, but makes sense: the hats are information…. hat racks organise hats…. and there are 5 ways to do it. Fine, call it what you like – at least it’s memorable! In a nutshell, there are [...]

Posted in Tutorials | Tagged , | 6 Comments

The Importance of Conventions

Conventions are important. They emerge as the ‘way things are done’. As such, when we see a control on a device, we apply our previous knowledge of similar systems and make assumptions about what will happen when the control is activated. The more experience you have in a particular field, the more conventions you know. [...]

Posted in Tutorials | Tagged , , , | 1 Comment

Usability Issues When Integrating Systems

Sometimes it is necessary for us to integrate our software with another system in order to offer its features to our customers, in fact a new class of applications has emerged where separate systems are created from integrating other products – the ‘mashup’. Allowing a user to take advantage of another system from within your [...]

Posted in Tutorials | Tagged | Leave a comment