Design Teardown

Design teardown: designing for personas with UserTesting

by

on

View all posts

The shiny new UserTesting homepage!

Eventually, every startup has to answer the million-dollar question: how are we going to make money from this? For many, that means appealing to enterprise companies—without turning off both existing users and other potential audiences. And that often means a redesign.

But how do you redesign with several important personas in mind, especially when one of those is the traditional enterprise buyer, with a board of executive stakeholders to persuade?

The old UserTesting homepage

The old UserTesting homepage

Step 1: Identify challenges

Before you can solve a problem, you have to have a deep understanding of its nature. We identified 2 major challenges for this redesign:

1. Appeal to enterprises with different research needs and capacities

Some of our clients have dedicated internal teams with plenty of bandwidth for research, while others rely on our full range of user-research services. We needed to convey that our product can scale to meet any client’s needs. We also wanted to demonstrate how our platform can meet all the diverse needs of enterprise marketing, design, and research teams: market research, conversion rate optimization, concept validation, usability testing, and more.

2. Retain high conversion rate

Even before our redesign, we were quite successful at acquiring loyal, happy customers. We had to make sure we could maintain our current success while maturing our aesthetics and brand positioning. To ensure this, we would need to:

  • Reduce barrier to entry. Make setting up a user test and creating test plans less intimidating for customers who didn’t have previous experience.
  • Avoid negatively impacting power users’ existing processes. We didn’t want to force experienced customers to go through a lengthy tutorial or relearn behaviors to get started.
  • Help users keep their “sense of place and flow” in the product. So both experienced and new customers can set up their tests more quickly and get results faster.

Step 2: Identify the right personas for revenue and conversion

We developed 6 different personas before we started the redesign. Personas helped us focus on the higher-level discussions of who we were trying to reach and what information they’d be looking for well before we got into design. This shared vision and concise language to describe our customers helped our team organize and prioritize content.

Redesign flows based on optimized personas

We ran numerous tests both internally and externally to determine where people expected to see certain sections. We looked at other companies that offer enterprise services and tried to learn from their information architecture (IA). We also debated names and structures internally, then tested our decisions with real users.

Step 3: Design with personas in mind

We tried to develop an enterprise-friendly aesthetic that clearly and effectively communicated the capabilities of our DIY research tools as well as our full range of client services.

When you design a site around personas, you eventually have to ask users which persona best fits them—but you can do it either explicitly or implicitly.

Some sites explicitly ask users to select which type of customer or persona they are when they first come to the site. We found this approach dull and annoying. “Don’t force me to make a decision—just show me the content,” we thought. Instead, we opted to design the site so that there was a clear flow for each of our 6 personas. The look and feel of the pages remains consistent regardless of which persona it was designed for, but the content varies to speak to each persona’s unique needs.

We avoided using photos or naming our personas because we’ve found that people can get lost in those somewhat insignificant details. Instead, we picked an image that we thought each person might use as a slide in a slideshow to better describe them.

Step 4: Prototype and test

Next, we prototyped our completed designs in InVision to:

  • Test assumptions and design elements that might affect conversion
  • Test overall design to find gaps in design process and information architecture

User testing helped us see how potential customers really saw and interacted with our site. It also helped us spot places where our structure wasn’t clear, designs weren’t helpful, and content wasn’t what people expected. The process led us to add and remove entire sections and increased our overall conversion rate substantially.

At one point in the design process we had a very different hero image. In testing, we showed the image to potential customers and asked them what kind of company they thought we were. The results were very surprising. While we thought the image clearly showed what we did, people assumed that we provided some kind of presentation or video conferencing software. We were able to change the imagery to better show what we do without running an A/B test on the public site and confusing half of our potential customers.

We also tried to make sure the page converted well. To do that, we kept the design simple to focus users’ attention on the primary message and call to action.

Striking the balance between new and power users

When we interviewed and observed new users interacting with the software, we found that we were stuck between catering to power users and onboarding new users.

UserTesting test creation interface before the redesign

Our old test creation interface

We realized that by giving all users a sample template for ordering tests, we’d give new users a nice head start. As a result, we were able to create a draggable interface for the tasks, which made our power users more efficient by allowing them to:

  • See popular tasks and questions at a glance
  • Easily rearrange the sequence of tasks in a test plan

UserTesting test creation interface after redesign

Our shiny new test creation interface!

Things to consider when you’re designing for personas

Here are 4 general principles we’ve taken from our redesign experience.

CTA for those not in hs to DO UI kit
Author

Hannah Alvarez
Hannah is a Marketing Associate at UserTesting. As a former nonprofit professional, she's dedicated to making the world—and the web—a better place. In her free time, she likes making things and going on adventures.

Join over 2 million designers

Who get our content first.

No sales pitches, no games, and one-click unsubscribe.

Over 2 million designers
get our newsletter
every week

Find out why

Get awesome design content in your inbox every week

Just like over 2 million of your fellow designers do.

Plus get 3 free downloads, just for signing up.

Give it a try—it only takes a click to unsubscribe.

Thanks for signing up!

You should have a thank you gift in your inbox now—and you'll hear from us again soon!

Prototype better experiences with InVision

Just like over 2 million of your fellow designers do.

I agree to InVision's Terms of Service.

Want a free t-shirt?

Join the 2 million+ designers who get our newsletter weekly for your chance to win!

We hate spam as much as you do, and you can unsubscribe anytime.

Double your chances to win!

Tweet and automatically get a second entry

Tweet Now

No Thanks

Stay in touch!

We share news, freebies, and more on Twitter.