Reduction in UX

Susie Hu
4 min readJan 1, 2021

Have you ever think there are too much information when you are looking at some websites? Do you sometimes find it frustrating of looking for specific information? Maybe you need to apply Reduction into the design.

Problem

There are too much content and too many elements shown on the page.

Solution

Reduction helps reducing elements, choices and content on the page. Reduction is the fundamental principle of simplicity. Thoughtful reduction can help achieve simplicity on the design.

“Make everything as simple as possible, but not simpler.”

— Albert Einstein

Application & Examples

  1. Remove elements

Remove information from any given page or screen help users easier and faster to consume information and reduce their cognitive loads. Practitioners can consider UI components, content load, words and colours.

When we took look at RBC’s previous home page and current home page, we found that previous home page was trying to show as much information as it could to present to customers. However, the current home page is simpler.

RBC Home page 2004
RBC Home page 2020

2.Reduce choices

Practitioners need to consider to balance presenting options for users. How many choices presented can affect people positively or negatively. According to Miller’s law, the number of objects an average human can hold is 7±2.

Airbnb 2018

3.Hide complexity — Progressive Disclosure

Users want both powerful features and simplicity that satisfying their needs in an efficient way. one of other ways to demonstrate reduction is to hide complexity including components and content.

Progressive disclosure is a useful strategy to offer users balancing between the complexity and the simplicity. It shows users only a few of most important options and presents more specialized options only if users request for them. Applying task analysis and field studies will help practitioners decide what users need.

Progressive disclosure benefits both novice users and expert users. Novice users can digest the basic functions first and then learn the advanced functions later. Expert users can find what they need most at the first moment and use the advanced functions if they need. It also improves three of usability’s five aspects: learnability, efficiency of use and minimization of error rate.

There are two important criteria when designing for progressive disclosure:

  • Practitioners need to get good balance between the primary and secondary features. Primary disclosure level includes most frequent and important features without presenting too many options.
  • Users can clearly notice and understand the progress from the primary to the secondary disclosure levels. Practitioners need to set clear expectations and visual cues including links and buttons to let users find the function.

Progressive disclosure can be achieved through the following different ways:

  • Show only preview for content. For example, use it for news websites, blogs and articles.
  • Show only titles of sections and make information in each section expandable. It usually is used in Frequently Asked Questions and help center.
  • Use Mega menus to show essential labelling for users and hide some secondary options.
  • Apply Hamburger menu to hide more options.
  • Apply Step-by-step design to guide users on frequent actions.
BestBuy Mega Menu 2020
Amazon Hamburger Menu 2020

Related UI Components to Reduction

  1. Accordion
  2. Tab
  3. Mega menus
  4. Hamburger menu

Rationale

People have limited cognitive load and limited attention. When they look at the screen, people will apply selective attention to focus on a particular object and selectively ignore other objects based on design, past experience and background environment.

Hick’s law states that people are presented with more choices, they will take longer time to make decisions. Reducing choices on the interface helps users to efficiently make decisions of choosing options.

Reference

Maeda, John. The Laws of Simplicity. MIT Press. Cambridge, MA, USA, 2006.

--

--