Skip to main content
Blog

How to Create Successful Web Designs with User Testing

Feb 11 2022 |

A designer may think they have created the perfect design after crafting impactful branding, getting the layout just right, iterating based on feedback, and determining they have met client goals. But beyond meeting this criteria, how do we know if a design is really successful?

One way is through user testing. User testing is the stage of the design process where we get to put our designs into the hands of real users. This enables us to gather valuable feedback such as identifying which areas of the design frustrate users, and what’s keeping them from converting. User testing can also help us make decisions with copy and images by seeing how users react to different variations. Here’s a guide on implementing user testing into your design projects.



1. Define the scope & project objectives


To guide the user test, determine the purpose of the test and identify what will be tested. In a recent user test for our client Jack.org, we wanted to know which version of a homepage redesign of Bethere.org would perform better with different imagery, copy, and navigational elements. We also wanted to see how participants would respond to the overall tone to help us determine how well it aligned with the brand. Write down the hypothesis with what you’d like to test against so you can compare it with the results.

1.png    2.png


We A/B tested variations of the BeThere.org homepage to validate the design with it’s target demographic.


2. Choose a user testing method


There is a variety of methods you can take to conduct user tests including contextual inquiry, card sorting, guerilla testing, and many more. Depending on your project, you’ll need to decide if you’ll conduct moderated or unmoderated testing, and you’ll need to decide if you will conduct the test in-person or remote. For our recent client project, we decided to conduct unmoderated testing as this allowed us to easily send the test to a large number of participants and collect results in a short amount of time. Using a usability testing tool called Maze, we crafted A/B tests that we could easily send to our clients and their contacts with a sharable link.

Screen-Shot-2021-12-13-at-4-40-38-PM.png

We used a remote user testing tool called Maze to conduct our A/B tests.


3. Source participants


It’s helpful to ask screening questions to make sure to source the right participants. Source those that match the target demographic to get the most aligned feedback for the design you’re testing. You may also want to source participants with varied prior knowledge of the brand to get a mix of perspectives.



4. Write a script


Plan out how you will introduce yourself and the project to the participant. Be sure to tell the participant key information about what they can expect from the test, such as how long it will take and what format the test will be in. Remind them that the purpose of the test is to gather their candid feedback. Ask open-ended questions and give participants clear instructions on how to interact with the prototype. Don’t forget to thank the participant for contributing to your design research.



5. Create the test


For our recent client project, we used Maze to create a test with multiple choice questions, questions with a rating scale, and open-ended questions. We then asked our testers a series of first-click questions, where they interacted with a prototype (integrated from Invision) that resembled the look and had some of the functionality of the website.
Screen-Shot-2022-01-06-at-5-55-35-PM.png


Maze provides templates with built in copy you can use to make your tests.


6. Analyze the results

 
data.jpg

Results from a section of our user test.

After participants have taken the test, it’s time to close the test and analyze the results. Data is shown in bar graphs that are easy to read. For click tests, we were able to see heatmaps of where the majority of users clicked. Using this data, we created a 26-page report with statistic results with our analysis and recommendations. Many of the design decisions were validated by the data, but there were also some results that surprised us. Testing can also be a great way of showing the impact of a redesign to stakeholders, as you can present factual data from how users responded to the design.

3.png    4.png

The before and after homepage design for BeThere.org.

Contact us if you’d like to learn how you can incorporate user testing into your next design project.