Main UI/UX Design Metrics and KPIs to Measure

This article deals with improving digital user interfaces (UI), interaction design, and overall user experience (UX) using data about people’s behavior. In the highly competitive market, where success may directly depend on a product’s look-and-feel, every product development team is bound for a continuous iterative UX design process. 

 

For example, they have to regularly address questions such as:

 

• Is their current user interface design efficient?
• How to measure UI performance?
• How to track the quality of their UX and UI design consistently? 

 

… and periodically conduct UX audits.

 

In this post, we’d like to pay attention to the UX metrics and key performance indicators (KPIs) used to measure design. Namely, we will list some of the most popular user experience KPIs and explain how Onix’s teams use them to improve digital products.

  

But let’s start with the significance of such KPIs for design teams and others.

 

Why Should Software Developers Measure UI and UX Design?

The meaning of a relevant KPI for UI/UX designer is comparable to students’ grades for a school teacher or growth metrics for a startup founder.

 

 

Data obtained from tracking UX design KPIs suggests and supports the best design decisions, helping improve the overall product performance and the bottom line.

 

• Effective use of this data helps balance customers’ needs with business objectives, facilitating the overall project success. 

 

• Insights delivered by UX data promote consensus and a shared vision among the product team members, client and vendor, software designers and developers.

 

• User behavior data tells a lot about the target audience’s preferences, pain points, what they like and dislike, how they interact with digital products, what devices they use, and much more.

 

A thorough understanding of the end-users enables product development teams to bridge the gap between the designers and end-users, expectations and reality, create competitive UX and interfaces, and influence user behaviors.

 

• The analysis, interpretation, and drawing out decisions based on actual UX data eliminates the risk of errors resulting from the participants projecting their own behaviors and reactions onto users.

 

• Data also reveals a digital product’s areas for improvement and how to solve UX issues, empowering designers to head off problems and behavior changes before they impact the bottom line.

 

• Data investigation reduces the risk of wasting money on ineffective or even harmful design choices and changes to the software product.

 

• Data-driven UX design and informed product development decisions can bring about a tangible improvement on ROI via increased conversion rates, higher sales, better customer retention, reduced number of support calls, and more.

 

• Customer analytics data also helps developers discover new trends, gain support for their ideas, and move beyond reliance on best practices, driving innovation.

 

• Positive dynamics of the monitored UX design metrics, such as customer satisfaction, lifetime value, segmentation, sales channels, social media, engagement, churn, and acquisition, prove that the team’s work is on the right track.

 

 

If you are interested in data-driven improvements to your product, please don’t hesitate to contact Onix. We may discuss your organization’s unique needs and suggest ways to meet them.

 

What Are the UI/UX KPIs and How to Measure Them?

Every metric or KPI quantifies a specific aspect of a user’s experience, e.g., counting the average minutes spent in an app daily to evaluate the user’s involvement and satisfaction with the product.

 

There is neither a general hierarchy nor a universally adopted classification of the UX and UI metrics. For example, when the team needs to understand customers’ needs and how they use software, they are likely to use two categories of UX KPIs: behavioral and attitudinal.

 

Read also: Most Important SaaS Metrics and KPIs

 

Behavioral UX Metrics

User experience metrics help understand how people really use and what they do in a digital product at each step of the customer journey, where they come from, what problems they encounter and where, etc. 

 

Behavioral UX KPIs are gathered via task-based usability testing. Usability itself is the lowest standard in user experience design. The UX/UI designer and app developers must ensure at least that the users can do what they want to do with the product. The four dimensions of usability testing are:

 

1. functionality
2. flexibility
3. learning ability
4. aesthetic user interface design. 

 

The primary behavioral UX metrics are monitored using specialized tools and services, the most popular including Google Analytics, Hotjar, Mixpanel, Heap, Localytics, Kissmetrics, Crashlytics, Firebase, and Crazy Egg.

 

Google Analytics (GA) (mobile and web analytics) is arguably the best tool to overview your UX design efficiency, and it’s free. Heap is a decent substitute to GA that helps users examine the most crucial data and build their own system of UX success metrics.

 

Localytics for mobile analytics is an excellent freemium multi-platform tool with advanced segmentation.

 

However, instruments tell only a part of the story. User research involving relevant KPIs is needed to understand why things happen. Here are three behavioral UX KPI examples.

 

 

Task Success

It’s crucial to clearly define a realistic task success, e.g., to complete a profile in an online dating application. TS is typically calculated as a percentage.

 

For instance, if 8 out of 10 participants succeeded and two failed, TS would be 80%, but given the small sample size, we only can be 90% confident that the TS percentage lies somewhere between 55% to 100%. The margin of error will be smaller with a larger group of representative users.

 

Task Time

This is normally an absolute number. For instance, dating app developers can measure how long it took the participants to sign up and e-commerce developers — to make an order.

 

Then, the team calculates the Average Task Time either for the whole group or only for those who accomplished the task. Generally, faster task completion is desirable, but sometimes — just the opposite is optimal.

 

Problems & Frustrations

The best way is to ask the participants to think aloud while using a mobile app or site. This KPI for UI/UX designers may be the number of problems identified or the percentage of users that encountered a certain issue.

 

The collected behavioral KPIs are eventually compared with the same product’s KPIs over some time (e.g., quarterly) or with rival software.

 

3 Most Important Attitudinal UX KPIs to Track

Attitudinal UX KPIs show how users feel about a product and brand before, during or after using a product.

 

Web and mobile developers can learn this directly from customer feedback, including opinions, complaints, and suggestions. UX design metrics often require running surveys towards the end of a task-based usability study.

 

 

Among the attitudinal UX KPIs, three seem to be most important:

 

1. Net Promoter Score (NPS)

NPS helps measure customer loyalty based on direct questions like ‘How likely are you, on a ten-point scale, to recommend this dating application to your friends?. ’

 

Those who responded with a score of 9 or 10 are ‘promoters,’ those with a score of 7 or 8 are called ‘passive,’ and with 0-6 – ‘detractors.’ Calculate the percentages. NPS = Promoters – Detractors.

 

2. System Usability Scale (SUS)

Even measured on a small-size sample, SUS can indicate whether the user experience has improved or not. For every usability test carried out, users complete a questionnaire of ten items. They may click on an option from ‘strongly agree’ to ‘strongly disagree,’ e.g., “I think the app is easy to use.”

 

Each respondent’s scores for the questions are added together and multiplied by 2.5 to convert the original scores of 0-40 to a SUS score between 0 and 100 points. A score of 68 is considered the average SUS score; everything else is either above or below average.

 

3. Customer Satisfaction (CSAT)

CSAT is calculated by asking questions about the user’s experience, e.g., ‘How satisfied were you with searching for a date?’ A corresponding survey scale is used, which can be 1-3, 1-5, or 1-10.

 

Ideally, for measuring UX metrics, the behavior-related metrics should be matched with financial and sales and marketing-related measurements. The latter category includes, but is not limited to, social media impressions, brand trackers, and search metrics.

It makes sense to pay special attention to the financial aspect: after all, increased revenue is the goal and the ultimate measure of success for all who work on a product’s visual design, information architecture, deployment, marketing campaigns, and other activities. 

 

How to Measure ROI in UI and UX Design

To be more specific, the following metrics allow for evaluation of ROI in UI and UX design:

 

Conversion rate

The conversion rate is the number of visitors who performed the desired action, e.g., completed registration or purchased a yearly subscription, divided by the number of those who had the opportunity. One may even call it the ultimate KPI for UX designers: an optimization based on this figure can dramatically improve the sales numbers.

 

For example, creators of a landing page may need to conduct user tests to understand why specific components of its UX and UI convince users to accept the offer or drive them away.

 

Brand elements and accessibility are also relevant. If the number of conversions grew after a visual design change, and you can measure that user experience KPI accurately, you can also be confident the change made an impact.  

 

Drop-off rate

The drop-off rate, the opposite of conversion, generally shows how many people left the conversion funnel without performing the desired action. 

 

GA calculates this rate in different segments, tracking bounces over pages and screens and helping identify the steps in the funnel that are causing most visitors to ‘drop off.’ For instance, on an online store, we will likely look into the percentage of users who give up on filling out payment details.

 

Once the bottlenecks have been found, we can analyze the design and usability and suggest the necessary improvements. To learn why more users bounce, we combine this metric with attitudinal UX KPIs.

 

Single usability metric (SUM)

Standardized SUM measures task completion rates, task time, and user satisfaction, and counts errors. The analysis of design errors helps to understand how to avoid them, create the best UX design, and drive users into your conversion funnel. 

 

The above UX KPI examples can also be classified as low-level metrics, along with indicators like:

 

• Page views or the number of screens viewed by a user;
• Engaged page views per visit;
• Latency (the time it takes the app to respond to a user’s action), and so on.

 

The following chapter describes high-level UX KPI metrics.

 

Google HEART Metrics

 Google’s HEART framework combines the essential KPIs listed above and adds others to deepen the understanding of how a product’s design works:

 

H – Happiness. This measures  the extent to which users enjoyed using your product. The data is often collected via surveys at the end of UX tests.

 

E – Engagement. It’s rather easy to measure weekly numbers of visits per user, taps, screen refreshes, steps taken, or other actions that show the extent to which users are involved in a mobile app or website, a direct indicator of its quality.

  

A – Adoption. This means gaining new users of a product or feature. Adoption can be traced, e.g., by the number of upgrades to the latest version, new subscriptions, or purchases made by new users.

 

R – Retention. This includes the number of people that are consistently using the app or visiting the website within a specified time frame, repeat purchases, renewal or churn rates, and so on.

 

T – Task Success. In this case, Task Success covers a broader range of metrics tracking a user’s actions, such as how well the task was accomplished, how long it took, and how many errors occurred.

 The HEART metrics framework is integral to our company’s UX design process too. Let us share some advice drawing on Onix teams’ experience.

 

Onix’s Tips on How to Evaluate User Experience Design

 

1. Keep in mind the “big picture.”

Onix’s experts start by analyzing the existing website or mobile app from a business point of view, and namely its business model, monetization methods, and strategy. Simultaneously, they explore the competitors to find out any shortcomings and what can attract customers.

 

This research helps define the goals of the planned design improvement, determine the signals of success, and convert those signals into actionable metrics.

 

Then, we make sure that everything is configured correctly in GA and that all data is relevant. It is important to understand where the data comes from, how it moves, and how to perceive each KPI for the design team. 

 

2. The fewer UX KPIs, the better; the more UX data, the better.

Key UX metrics are those that bring the most value to customers and greater profit to the business. The more relevant data is available for each metric, the higher the likelihood of making the right decision.

 

Our UX efficiency toolkit normally includes at least: 

 

1. conversion rate
2. drop-off rate
3. returning users rate, which shows how many people came to a site or app more than once compared to the total number of visitors

 

Then, the team brainstorms how to improve performance and develops actionable plans.

 

3. Discover correlations and build hypotheses.

Onix’s UX experts don’t rely exclusively on numbers, e.g., monthly visitors, but always dig deeper to find out why they visit the site, where they come from, how they behave on the website and why, and so forth.

 

GA helps by tracking behavioral metrics critical to each particular case, such as:

 

• device usage, which tells us on what devices users access the product
• the percentage of visitors that left after 5-15 seconds
• the page(s) or screen(s) where most users leave the website or mobile app
• average time on a page, which identifies pages where users spend most of their time
• the amount of time a user has spent “engaged” on the page
• the average number of pages/screens viewed per session and clicks or taps made on the pages
• number of likes, comments, shares, copy/paste, and clicks on content
• returning users within a certain period
• how many times a new feature was used within a specified time
• number of tasks that were executed correctly from the beginning to endpoint
• time spent to complete a task
• number of wrong entries, etc.

 

By establishing correlations between this UX data and how the interface works, we can hypothesize possible improvements.

 

For example, the conversion rate may be affected by the number of text fields on the registration page, especially if compared with competitors. Reducing their number or changing the visitors’ perception of the online form’s length might improve the situation.

 

Read Also: Correlation vs. Regression

 

4. Test the hypotheses quickly and scrupulously evaluate the improvements.

Sometimes, A/B testing provides the answers. In the case of a registration form, half of the audience would see fewer text fields and half — a new layout for the same number of text fields.

 

The number of registrations on either page would be counted over some period. After that, the team would approve the version that proved more popular with the end-users.

 

Sometimes, we prove or disprove the hypotheses by basically comparing the past indicators with numbers obtained after the changes. Here is a recent example.

 

Onix was tasked with improving the UX design of a content subscription platform. It generates revenue through commissions from transactions, such as subscriptions and tips to the content creators. The owner wanted to increase revenue by encouraging consumers to spend more.

 

The main UX metrics we were interested in included the average session duration, user engagement (basically, the frequency of interactions with content), and conversion rate. The designer started with competitor analysis and compared the services’ KPIs. Among other facts, he found out that:

 

1. The average session duration was twice as short as with the major rival
2. The average number of visited pages was 1.4 times lower
3. The bounce rate was higher than the rivals’ by 3-15%
4. 82% of users were accessing the service via mobile devices

 

The designer suggested a number of improvements to the app’s UI and UX, such as:

 

• Relocating the ‘Language’ button, which on mobile phones stood in the way of users’ communication with content creators.

 

• Moving the ‘Tips’ button from the creator profile to the position next to ‘Like’ and ‘Comment’ under each piece of content. The designer hypothesized that if users are constantly aware of an opportunity to reward and encourage content creators, they will be donating more often.

 

Moreover, if they donate right after watching a video, still impressed by what they’ve seen, they can be more generous. The creators, in their turn, will see what their audience appreciates most and generate more content in this line.

 

• Dark mode for the interface by default, like in rival apps. It tends to relieve eye strain, especially in low-light conditions, while saving mobile devices’ battery life.

 

We assumed that since users mostly watch the content at night, this change should enable longer user sessions and more user activity while reducing the bounce rate.

The first two ideas have been realized already. The change to ‘Tips’ is a particularly good example of data-driven design improvement.

 

The little € next to the heart and comment icons makes donating seem as natural and easy as giving a like or writing a compliment. Users can do it in just two clicks or taps: first on the € icon and then, after indicating the amount, on the ‘Send’ button. 

 

The UX design metrics proved that the hypothesis was correct. After the subtle change was released unannounced in early October, the app received 1.5 times more tips than the monthly average in less than a month. The average amount of individual donations doubled.

 

Learn more: How to design a Mobile App UI

 

Conclusion

The UI and UX design process is all about constant improvement through endless iterations. Product development teams need to plan the process and keep their design efficiency measurement running.

 

Various user experience KPIs enable teams to measure and enhance the convenience and comfort of the end-users, the popularity of the product, and ultimately its success on the market.

 

Choose the UX KPIs that matter most to the business, get users involved, and obtain instant feedback from experimental design phases.

 

The conversion rate is arguably the definitive KPI for UI design assessment, but avoid making decisions based solely on low-level metrics or marketing or financial numbers: they can be misleading unless you consider the users’ opinions.

 

Run surveys and interviews, user journey research, and analyze feedback from those in direct contact with end-users, such as the customer support team and salespeople.

 

 

Only a combination of various data will give you the correct vision for steering your product towards success.

 

• Do you wish to boost your sales through the power of UX design KPIs?
• Do you feel it’s time to update your product’s look-and-feel?
• Are you disappointed with recent changes to its visual design?

 

If yes, please don’t hesitate to contact us today!

 

 

FAQ

 

What is UI design and what is UX design? 

UI stands for “user interface,” the point of human-computer interaction and communication. In web and mobile development, UI design is about arranging a product’s graphical layout and content into a consistent and appealing experience according to the best design principles.

 

UX means “user experience.” UX design is a human-first approach to digital product development and improvement that focuses on identifying and solving problems and ensuring an efficient, easy, relevant, and delightful interaction with the product for as many people as possible.

 

UI design complements UX design by taking care of a digital product’s visuals, presentation, and interactivity. Both elements work closely together and are essential for success.

 

Why do you need to measure design quality and performance?

The development of most successful products is data-driven, i.e. backed by quantitative data that helps understand the target audience. The product’s UI and UX also have to be measured so that the team can improve them.

 

Particularly, teams measuring user experience can determine whether one version of their design is better than another or a competitor’s product, see what exactly users are doing with the product, what problems they need to solve, and more.

 

What are UX KPIs?

UX KPIs (Key Performance Indicators) are metrics that product development teams collect and analyze to measure the success of their design activities in a quantitative manner.

 

They turn various data about the users’ behavior and interaction with the UI into digestible information for the teams to draw conclusions and make decisions. Tracked over time, they indicate how close the developers have come to achieving the set design goals. 

 

The Net Promoter Score, bounce rate, and returning users rate are prominent UX design KPI examples.

 

When is it best to measure design performance?

Software developers should address design metrics and KPIs at least:

 

• When preparing product improvement, e.g., before a routine design sprint, after a problem has been identified, or following a UX audit that pinpointed usability issues and defined critical areas for improvement. The team needs to gather UX data going 1-2 months back.

 

• After implementing any improvements, to see if the changes have reached the set goals.