Design and Human-Computer Interaction.

Let’s close the gap between cognitive theory and web design.

Melanie Herrmann
Vizzuality Blog
6 min readApr 5, 2019

--

Have you ever played the ‘red-or-blue’? game at a team building event? In every round of the game, you make a red-or-blue decision. Depending on your team’s choice and the other team’s choice, you win or lose. The payout matrix allows you to play one of two strategies. A competitive strategy: win for your team, but lose overall. Or a co-operative strategy: accept smaller profits, for overall success.

The only way to achieve a positive total is for both teams to play red.

For a positive overall outcome, both teams have to play red. The bottom-line is (you guessed it): collaborate to achieve the best result. But is this just about soft skills? Or should we consider team-spirit a method for good design? In this post I want to talk about why working together across teams is the best path to good design.

Mixed Teams as a Method.

To illustrate what I mean, I’d like to tell you a second ‘red-or-blue?’ story from the Human Factors & Ergonomics class during my undergrad. Imagine you are on the Research & Development team of a car company. You need to make a decision about the cockpit’s illumination for night drives. Which one do you pick: red or blue? The sociologist on the team might go with semantics: we associate blue with calm and reliability, stability and safety. Red is emotionally intense and represents danger. Less desirable in this context? One may think this is the human-centric approach, right? Considering how people feel about a colour?

Red or blue? Which cockpit illumination would you choose?

What might not be immediately obvious is that the colour choice has implications on road safety concerns. Therefore, we need to bring a neuroscientist onto the team. The blue illumination triggers the rod cells in the human retina to fire. The rods are the cells that adapt to darkness and allow us to see under poor light conditions (much needed for night drives). The blue light will cause them to lose their dark-adaptation. The red illumination, on the other hand, triggers only the red cones in the retina, but not the rods, leaving your dark-adaptation unaffected.

The sensitivity curves of the receptor cells in the human retina show that blue cones (cells that allow you to see ‘blue’) respond to 500 nanometers, but so do the rods — the cells which facilitate vision at low light levels. Looking at the blue cockpit, the rods lose some of their dark adaptation. The red cockpit display, with a wavelength of above 700 nanometers, does not affect the rods.

This seemingly innocuous design choice is a powerful illustration of how design decisions affect people’s ability to interact with a system. It’s my favourite example for a second reason. It is human biology meeting automotive engineering. It’s psychology going hand in hand with design. It’s theory and practice coming together. It’s an example of how different research areas come together as one team to make a better product. Team work is more than a merry mix’n’match exercise. It’s a method for creating the best design possible.

Overcoming the Theory-Practice Gap with Team-Work.

We need to consider people if we want to use data to change the world, that’s what I argued in my last blog post. By people, I meant users. But what about us, the people building information systems for users? How do we factor in as data miners, designers, developers, engineers, and storytellers?

A recent conversation between Jessica Hullman and Ben Shneiderman highlights that we are more successful when researching applied problems, and when researchers and non-academics work together. Maybe human-centred design means considering our practices as much as users’ experiences. We research the ‘value-action gap’, and the ‘information-deficit model’ on the side of the user. But we should also bring the question closer to home: which gaps are ours to close? What are we not considering? Who are we not talking to? How could we enrich and complement each other?

Czerwinski and Larson (2002) wrote a compelling piece on the gap between cognitive theory and web design. They found that complex web pages pose more questions than existing design guides answer. Simplified stimuli and tasks in psychological lab experiments limit the applicability to web design. The mental load in experimental tasks isn’t high enough, and they aren’t driven by real-world goals. In the real world, experiments are often unfeasible given time and resource constraints. But we have the means to bring the real world and the psychologist’s lab a step closer together.

Why Design and Human-Computer Interaction Research make a Great Team.

Marc Hassenzahl has examined the correlations between perceived beauty, goodness, and usability. There is variability in the findings, but form and function go together. Design and ergonomics go hand in hand, they are two pieces of the same puzzle. Research in psychology and Human-Computer Interaction should be part of user-centric design. Equally, psychology and Human-Computer Interaction should learn from design work.

Czerwinski and Larson (2002) outline how cognitive scientists and web designers can work together. Sometimes, the scientist has to set aside the lab experiments, and instead engage in methods used in web design. These methods include observational techniques, field studies, contextual inquiries, heuristic evaluations, cognitive walk-throughs, rapid prototyping, and focus groups. The qualitative approach lacks the rigour of statistical analysis, but it generates brilliant research questions. Respectively, web design would benefit from a methodical examination.

Moving from theory to practice, how do we close the gap? How do we go further than applying basic principles from psychology to web design — I’m looking at you, Fitt’s law. Isn’t there more to form and function than Gestalt laws, and graph theory badmouthing pie charts? And then we have Hick’s Law. The more options you offer, the longer somebody will take to make a decision. Practical, yet generic.

The reality of building complex web platforms brings up far more specific questions. For example: How many layers of data can we show on a map? How many nodes can I add to a Sankey diagram without gutting human working memory? Is it the realism of platforms like Global Fishing Watch that makes them so popular? Do 3D graphics correlate with immersion and increase engagement? Without sacrificing the ease of 2D information processing?

Visual concepts like stress, clutter, and complexity are well researched in cognitive science. But how do they impact on user experience on web platforms? Are there any ‘Big Five’ core aspects of websites? Like the five main traits used in psychology to describe an individual’s personality?

These are the kind of research questions we ought to be targeting. But most importantly, we ought to stop seeing cognitive theory as a constraint for design. Instead, both disciplines should draw inspiration from each other. After all, kicking a ball, or running, one thing at a time, don’t make a football game. Bringing the two together makes for mastery and a good match. Bringing disciplines together is a method. It allows us to conduct meaningful research, and to create magnificent designs.

References

Czerwinski, M. P., & Larson, K. (2002). Cognition and the Web: moving from theory to Web design (pp. 147–165). Erlbaum: NJ.

Hassenzahl, M., & Monk, A. (2010). The inference of perceived usability from beauty. Human–Computer Interaction, 25(3), 235–260.

Melanie is a Human-Computer Interaction Researcher who aims to understand the psychology behind effective data visualisation and how we can make better, more impactful data visualisations. Melanie’s research is made possible through the Knowledge Transfer Partnerships scheme managed by Innovate UK, the UK’s innovation agency, and is conducted with the support of our partners in the Department of Psychology at Cambridge University.

--

--

Melanie Herrmann
Vizzuality Blog

Psychologist, Environmentalist, Human-Computer Interaction Researcher.