Evaluating Designs

Approaches that don’t need the presence of users during the evaluation.

Radhushani Samundeeshwaran
10 min readAug 2, 2021

In this article I am eager to clear up inspection evaluation methods, focusing on heuristic evaluation and walk-throughs, which are usually done by specialists , who role-play users’ interactions with designs, prototypes, and specifications. They use their knowledge of the kinds of problems that users typically encounter, and then they offer their opinions. If you are an interaction designer definitely, you will come across bellow topics to make people interact with your creations and create products that give the best possible user experience.

  • Heuristic Evaluation
  • Walk-Throughs
  • Web analytics
  • A/B Testing
  • Predictive models

1.Heuristic evaluation

Heuristic evaluation was developed by Jakob Nielsen and his colleagues and later altered by other researchers for evaluating the web and other types of systems. In the user interaction design by using this method we can identify usability problems. In a heuristic evaluation, usability experts evaluate our site’s interface and analyze it against accepted usability principles (heuristics). Simply, we can end up with “it tests the site’s usability”.

10 Heuristic Principles — Jakob Nielsen’s (Usability Heuristics)

#1: Visibility of system status

“The system should always keep users informed about what is going on, through appropriate feedback and within reasonable time. “

This heuristic refers to how well the state of a system is conveyed to it’s user.

Example of Usability Heuristic #1:

waiting for an elevator

Imagine waiting for an elevator: you press the call button, and expect it to light up to reflect that the system knows you are waiting and will send an elevator soon. You might be able to see what floor that elevator is currently at, so you can determine how long you’ll need to wait.

Understanding a system’s current state is all about allowing users feel in control.

#2: Match between system and the real world

“The system should speak the users’ language, with words, phrases, and concepts familiar to the user, rather than system-oriented terms. It should follow real-world conventions, making information appear in a natural and logical order.”

Example of Usability Heuristic #2:

digital vs physical

The digital experience of reading a book or an article is closely aligned to the physical experience such as highlighting text, turning pages and so on. So, we have to care about speak the users’ language and follow real-world conventions.

#3: User control and freedom

“Users often choose system functions by mistake and will need a clearly marked emergency exit to leave the unwanted state without having to go through an extended dialog. The system should support undo and redo.”

Example of Usability Heuristic #3:

Gmail’s undo sent message feature
discard feature on several social networking websites

When it is easy for people to back out of unwanted processes or undo an action, it fosters a sense of freedom because they realize they don’t need to be afraid click on that link or test any feature. They always in control of the system, and aren’t going to get stuck somewhere they didn’t intend.

#4: Consistency and standards

“Users should not have to wonder whether different words, situations, or actions mean the same thing. Follow platform and industry conventions.”

There are two types of consistency as it applies to UI design:

  1. Internal consistency refers to maintaining consistency with product or family product.

Example of Usability Heuristic #4:

Google’s mail, maps and drive

Google used the same colors across several applications. When viewed at a any devices, the similarities between these icons remain as they are.

2. External consistency refers to maintaining consistency out side the product.

Example of Usability Heuristic #4:

LinkedIn and Facebook placing of the notification icon.

#5: Error prevention

“Good error messages are important, but the best designs carefully prevent problems from occurring in the first place. Either eliminate error-prone conditions, or check for them and present users with a confirmation option before they commit to the action.”

Example of Usability Heuristic #5:

Delete repository method in GitHub

As you can see from the image above, unless I type the above text, I would not be able to delete the repository. When you’re looking through your designs take the time to find out ways that you can stop error before they happen.

#6: Recognition rather than Recall

“Minimize the user’s memory load by making objects, actions, and options visible. The user should not have to remember information from one part of the dialog to another. Instructions for use of the system should be visible or easily retrievable whenever appropriate.”

Example of Usability Heuristic #6:

Visual studio code showing recognition rather than recall

The VS code gives its user an option of open recent files. So that users do not struggle with the exact name of the file they might have created a few days back.

#7: Flexibility and efficiency of use

“Accelerators — unseen by the novice user — may often speed up the interaction for the expert user such that the system can cater to both inexperienced and experienced users. Allow users to tailor frequent actions.”

Flexible processes can be accomplish in various ways so that people can pick whichever methods fits them.

Example of Usability Heuristic #7:

Simple copy action can be successfully done with different ways so simply we can use ctrl + c in windows.

#8: Aesthetic and Minimalist Design

“Dialogs should not contain information that is irrelevant or rarely needed. Every extra unit of information in a dialog competes with the relevant units of information and diminishes their relative visibility.”

Example of Usability Heuristic #8:

Add sign in medium platform

We know that medium platform contains blank piece of paper and if you want to add anything beyond text, you just need to click on the + sign which relate user again is the universal sign for adding something.

#9: Help Users Recognize, Diagnose, and Recover from Errors

“Error messages should be expressed in plain language (not codes), precisely indicate the problem, and constructively suggest a solution.”

Example of Usability Heuristic #9:

This clearly shows that an error has occurred as well as easily user can identify solution for an error.

#10: Help and Documentation

“It’s best if the system doesn’t need any additional explanation. However, it may be necessary to provide documentation to help users understand how to complete their tasks.”

Always make sure your system provides documentation to help the user and keep it concise, and list concrete steps that need to be carried out.

Example of Usability Heuristic #10:

help center

Its help center is very clear and easy to navigate. You will get into all its portions right on the home page. Looking at the home page itself, users will instantly know which portion they want to go to. Altogether, heuristic evaluations permit you to identify and focus on specific issues without having to speak to users.

2. Walk-Throughs

As the name suggests, walk-throughs involve walking through a task with the product and noting problematic usability features.

Some of the walk-throughs are Cognitive and pluralistic.

Steps to conduct cognitive walk-through

  1. Define the user goal you want to explore.

For example, Goal : “Create single screen application to user record and save a audio”.

UI

2. Identify the tasks you must finish up to accomplish that goal.

  • User presses record
  • User presses stop
  • User presses save

3. While finishing the tasks document the experience.

Pluralistic Walk-Throughs

Pluralistic usability walkthrough is a usability evaluation method that brings representative users and system designers together into a design session to discuss new ideas.

Characteristics of the pluralistic usability walkthrough:

  1. The method includes three types of participants in the same walkthrough session: users, system designers and usability experts.
  2. The system is presented with hardcopy panels and these panels are presented in the same order as they would appear in the system.
  3. All participants take the role of a user.
  4. The participants write down the actions they would take to perform the given tasks.
  5. The group discusses the solutions to which they have reached. The administrator first presents a correct answer. Then the users describe their solutions, and only after that, do the designers and usability experts offer their opinions.

3. Web analytics

Let’s say you own an clothing stores, and it looks beautifully , has different collection of trendy dresses for all gender and customer service unbeatable. But you forget to pay attention to customers’ actual behavior. So it kind of important matter for any business to sustain and it works same online.

Web analytics is the process of examining the behavior of visitors to a website. This concerns tracking, reviewing and reporting data to measure web activity, including the use of a website and its components, such as webpages, images and videos.

There are lots of web analytics tools out there, they can do variety of things. For example: Google analytics, Spring Metrics, Woopra, Chartbeat and so on.

Types of web analytics

On-site analytics are used by website owners to measure visitor behavior. Off-site analytics measure a website’s visibility and potential to acquire an audience on the Internet regardless of who owns the website.

Five key web analytics you should be tracking

  1. Overall traffic
  2. Bounce rate
  3. Traffic sources
  4. Desktop vs mobile visits
  5. New and returning visitors
An example of web analytics in the free Google Analytics tool

4. A/B Testing

A/B testing is the process of evaluate a website, part of a website, an application, or an app running on a mobile device is by carrying out a large-scale experiment to evaluate how two groups of users perform using two different designs. You do this giving one version to one group which acts as the control and the other version to another group as the experimental condition, that is, the new design being tested.

Why You Should A/B Test

Individuals, teams, and corporations can utilize A/B testing to make small adjustments to their user experiences while collecting data on the results. This enables them to form hypotheses and better understand why particular aspects of their experiences influence user behavior.

A/B Testing Process

First it will begin with collecting data then you need to identify your goal so goals can be anything from clicking a button or link to product purchases and e-mail signups. Once you’ve find a goal you can begin generating A/B testing ideas and hypotheses for why you think they will be better than the current version. Create variations by changing the color of a button, swapping the order of elements on the page, hiding navigation elements, or something entirely custom. Here after ,you can run your experiment and wait for visitors to participate. Their interaction with each experience is measured, counted, and compared to determine how each performs. Finally you can analyze the results.

Example of A/B testing on a website. By randomly serving visitors two versions of a website that differ only in the design of a single button element, the relative efficacy of the two designs can be measured.

5. Predictive models

Like inspection methods and analytics, predictive models can be used to evaluate a product without users being present.

Fitts’ Law

Fitts’ law is used to compare different design layouts for virtual or physical objects, such as buttons on a device or screen. Fitts’ law is an example of an evaluation method that can be used to predict user performance by determining whether a proposed interface design or keypad layout will be optimal.

Fitts’ law is useful for analyzing systems where the time to place an object physically is critical to the task at hand. In particular, it can support designers think about where to place objects on the screen in relation to each other. This is fairly flexible on mobile devices, where there is a limited amount of space on the screen for icons and buttons.

User experience designers use Fitts’ law when creating user interfaces. When designing graphics, text and screen icon always consider their size. And consider making any text labels into links, try making whole phrase a link rather than just one word. When you are developing a touch screen interface always pay attention to check all the elements are big enough and have space properly to allow your user to pick just one.

References:

Interaction Design_ Beyond Human-Computer Interaction-Wiley (2019)/ Helen Sharp, Yvonne Rogers, Jennifer Preece

10 Usability Heuristics for User Interface Design (nngroup.com)

Pluralistic walkthrough — Wikipedia, A/B testing — Wikipedia

A/B Testing (optimizely.com)

Hope you all understand this blog. I will come back with another interesting topic. Happy reading!

THANK YOU!!!

--

--