UX Design Patterns

Recurring design patterns are widely applied across many fields, industries in order to take advantage of best practices and reduce the learning curves. In this read, we are going through 3 kinds of design patterns in UX Design: Design Patterns, Anti-Patterns, and Dark Patterns.

Design Patterns

UX Design Patterns are recurring, reusable and optimal solutions for popular design problems. All UX Design Patterns we’ve seen can be fall into one of these 3 buckets:

 

🗑️ Structure

We usually see these structure design patterns on product categories pages from e-commerce website.

 

🗑️ Flow

There're the same steps to withdraw money at ATMs, no matter which bank it belongs to. This can be a reference to digital world where money transferring steps on bank apps are similar to each other.

 

🗑️ Interface

UI components such as buttons, selections, dialogs, form fields,... can be seen as design patterns.

A good design pattern will contain following aspects:

  • Familiar & recognizable, ease to use correctly.
  • Optimal & effective, especially when being applied to done a task.
  • Relevant to context and goals.
  • Don’t require much cognitive work.

Reusing design patterns will improve consistency and connections, making the product more easy to use, learn, and remember.

Anti-Patterns

Anti patterns are (also) recurring, reusable, familiar and popular solutions, but not optimal when applying in real use. Let’s take a look at an example down here:

There are many more examples that we can explore from common UI Anti-patterns.

But why do we keep using Anti-Patterns?
  • Popular doesn’t mean optimal. Because of their popularity, people keep reusing them without really re-evaluating the quality.
  • Products from different companies copy each other with the reason that “users familiar with this” make these anti-patterns widely spread.
How to detect and eliminate Anti-Patterns?
  • Look for similar patterns: research on patterns that solve similar problems, don’t focus only on the current ones.
  • Don’t assume: if you’re not sure if this popular solution is the best one, try to test & evaluate it.
  • Eyes on other solutions: seek for different viability, feasibility and optimality.
  • Evaluating and learning from it: review & test UI options to make sure they fit with users needs, expectations and goals.

Dark Patterns

Dark Patterns are designs that intentionally make people select wrong options or go with a wrong decision. Usually, these patterns are created to serve shady business goals.

Harry Brignull - a UX specialist who coined the term Dark Patterns (or Deceptive Designs) - had researched and pointed out 12 popular types of Dark Patterns and detail examples of each type.

To avoid Dark Patterns in designing products, we can use Heuristic Evaluation on a design before going on with it:

Perceivable
Contents and interactable elements are understandable.

Findable
Task actions are easy to find.

Honest
Be honest. Say no to misinformation.

Transparent
Provide users all the options and let them know the outcomes.

Notify
Tell people what will happen next, what they will get after that.

Clarity
Be clear, no shady purposes.

Comparison
Help users to compare between options and make proper decisions.

Confirm
Confirm on the selected option.

Reversible
Easy to undo or cancel with minimal consequence and cost.

Usable
Follow fundamental usability design rules.