L4 — Human Computer Interaction Laboratory 4

Universal Principles

“Principles” consiste of laws, guidelines, human biases and general design considerations. Follow some of the main principles, heuristics and approaches for effective web design.

For more information read “Universal Principles of Design” by William Lidwell, Kritina Holden, Jill Butler

Stroop Effect

The Stroop effect in psychology is a demonstration of interference in the reaction time of a task.

When the name of a color (e.g., “blue”, “green”, or “red”) is printed in a color not denoted by the name (e.g., the word “red” printed in blue ink instead of red ink), naming the color of the word takes longer and is more prone to errors than when the color of the ink matches the name of the color.

Stroop Effect – Position Test

Stroop Effect – Name the color 1

Stroop Effect – Name the color 2

7±2 Principle

Human brain has some limits on its capacity for processing information.

According to George A. Miller's studies humans' short term memory can retain only about 5–9 things at one time.

This was an argument for limiting the number of options in navigation menus.

2–Second Rule

User shouldn't need to wait more than 2 seconds for certain types of system response.

3–Click Rule

Users stop using the site if they aren't able to find the information or access the site feature within 3 mouse clicks.

80/20 Rule (Pareto Principle)

The rule asserts that approximately 80 percent of the effects generated by any large system are caused by 20 percent of the variables in that system. The 80/20 rule is observed in all large systems, including those in economics, management, user-interface design, quality control, engineering, etc.

80 percent of a product's usage involves 20 percent of its features
80 percent of a town's traffic in on 20 percent of its roads
80 percent of innovation comes from 20 percent of the people

If the critical 20 percent of a product's features are used 80 percent of the time, design and testing resources should focus primaly on those features.

Identify the critical 20 percent of the functions of a product and make them more quickly available to the users (ex. toolbars).

80% of the effects come from 20% of the causes

The first recognition of the 80/20 rule is attributed to Vilfredo Pareto, an italian economist who observed that 20 percent of the italian people possessed 80 percent of the wealth.

Fitts' Law

It predicts the time required to rapidly move to a target area, as a function of the distance to the target and the size of the target.

The law is usually applied to the movement of the mouse visitors have to perform to get from point A to point B.

Fitts' Law Demonstration

Affordance

Balls are for throwing or bouncing;
Round wheels are better suited than squared wheels for rollings;
Stairs are better suited than fences for climbing;

This is not to say that square wheels cannot be rolled or fences climbed, rather that the physical characteristic of them influence the way they function and are likely to be used.

“When simple things need pictures, labels, or instructions, the design has failed. ” — Donald Norman

Affordance of Doors: Door hardware can signal whether to push or pull without signs.

A drawing of a three-dimensional button on a computer screen leverages our knowledge of the physical characteristics of buttons and appears to afford pressing.

The knowledge of button affordances exists in the mind of the perceiver based on experience with physical buttons — it is not a property of the representation. Therefore, the affordance is said to be perceived.

Many windows started sprouting three little ridges on the bottom right corner which look like a grip. It affords dragging.

Physical characteristics of an object influence its function

For more informations read “The Design of Everyday Things” by Donald Norman

Inverted Pyramid

The summary of the article is presented in the beginning of the article

Satisficing

Web users don't prefer optimal ways to find the information they're looking for. Instead they permanently scan for quick'n'dirty-solutions which are “good enough”.

Baby–Duck–Syndrome

The tendency for visitors to stick to the first design they learn and judge other designs by their similarity to that first design.

Banner–Blindness

Web users tend to ignore everything that looks like advertisement. They focus only on the parts of the page where they would assume the relevant information could be, i.e. small text and hyperlinks.

Eye tracking is the process of measuring either the point of gaze (“where we are looking”) or the motion of an eye relative to the head.

Heatmaps from eyetracking studies: The areas where users looked the most are colored red; the yellow areas indicate fewer views, followed by the least–viewed blue areas. Gray areas didn't attract any fixations.

See the Click Survey

Cliffhanger–Effect

(Zeigarnik-Effect): based upon the fact that human beings can't stand uncertainty (movies, articles with an abrupt ending, often leaving with a sudden shock revelation or difficult situation). This often tend to force them to read the ad, click on the banner or follow a link.