UX Research & User Testing

Testing Your Design Concepts

Paul Boag

Paul Boag

Boagworld
UX Research & User Testing

Check out a free preview of the full UX Research & User Testing course

The "Testing Your Design Concepts" Lesson is part of the full, UX Research & User Testing course featured in this preview video. Here's what you'd learn in this lesson:

Paul discusses the importance of testing design concepts and mockups. He explains that testing can lead to a better product, resolve disagreements, ensure momentum, and save money. He also introduces different types of tests, such as testing comprehension and aesthetics, and suggests using tools like Lyssna for conducting these tests.

Preview
Close

Transcript from the "Testing Your Design Concepts" Lesson

[00:00:00]
>> Let's move on then to testing your design concepts. Now, if you happen to work on smaller projects, especially if they've got, you're creating a new website or maybe doing a little bit brand, identity work, and that kinda stuff, you're gonna love this section, right? If you work for a large organization that's got design systems and stuff like that, this is gonna be a little bit less relevant, the next section is gonna be more for you.

[00:00:27]
But if you live in a world where you still produce design concepts, right, design mock-ups, then I think this is gonna be really valuable. So you know those times, it hands a little bit less now than it did. But you've got a client and they wanna see what the design is gonna look like, and so you tend to do a high fidelity mock up, it's not interactive or anything like that.

[00:00:53]
You just mock up a page, often the homepage, or something like that, that you show to the client to get them to buy into the idea and all the rest of it. Well, that is an amazing opportunity to do a little bit of lightweight testing that is just going to make things so much easier for you, right, and cut through iteration hell, right?

[00:01:19]
When it's like, my logo bigger and I don't like that color green, and and fill up all the whitespace and all the other stuff that people spew. Get rid of all that, replace it with a bit of testing. And people tell me, I swear to you if you try this, you will have no iterations, right?

[00:01:43]
And nobody ever believes me when I say this, and until you try it yourself, you will not have iterations, unless of course the testing turns out that there's some fundamental problem. But you will get design sign off so much easier. And in fact, you probably don't even need to ask for designs sign off, right?

[00:02:02]
Anyway, okay, so why are we testing design concepts? I think I've almost oversold it already, but let's kind of drive the point home. First of all, of course, if you test your design concepts, you're gonna end up with a better product. Testing significantly reduces the chance of developing something that's not fit for purpose, a brand identity, or whatever else that's not fit for the purpose.

[00:02:23]
Second is, it's gonna resolve disagreements, right? Testing can ensure momentum, right? And that's such a critical thing, things so often grind to a halt with design concepts. You mock up something, someone doesn't like it, and so it starts going around and then they start suggesting things, right? And so you apply the thing that they suggest, and then they don't like the suggestion.

[00:02:49]
But instead of saying no, that was a bad idea, they then come up with another suggestion that they think might fix the first suggestion and it turns into a nightmare. So, it resolves all those kinda disagreements and it's gonna save you money, right? You, especially if you're an external person working with clients, testing can identify issues early, it's gonna reduce your costs, it's just great, right?

[00:03:13]
So what are we aiming to learn at this stage? Cuz you think we've not actually got a learning, now we've just got a page, right? A single page, high fidelity mock up, I mean, for crying out loud, what are we gonna learn from that? Well, there's three things that we can learn.

[00:03:30]
First, do people like it? Cuz that is the big thing, stakeholders go, don't like it. It doesn't wow me, whatever that means, I mean, what you're supposed to do with that. Those of you who are developers do not know how lucky you are that nobody cares about the quality of your code, right?

[00:03:48]
Cuz it's true, nobody understands your code, but everybody thinks they know design, right? And if it doesn't, nobody goes, your code doesn't wow me, I mean, what are you supposed to do with that as a designer? But anyway, so we're gonna establish, do people actually like the design?

[00:04:09]
Secondly, do they get it? Cuz that's another, I'm not sure our messaging is clear enough, or I don't think people are gonna understand. What do you base that on? Mr. stakeholder, your random opinion? No, I showed it to my nephew who didn't understand it. Yeah, your nephew's five, of course she doesn't understand it, but anyway, I'm going off on a ramp.

[00:04:31]
Can you tell that this is a bit that I'm particularly passionate about. And then the third thing is can they use it, right? Do they know that you can click on growth or whatever random word that the interface has got in? So to test this, these three things, we're gonna divide and conquer, right?

[00:04:52]
One of the big problems, when you test a high resolution concept, mock-up, is that stakeholders get all muddled in their heads, right? They reject a design that is a perfectly good design, cuz they don't like the color, right? Or they reject a really striking branding because the messaging is not right or it all gets muddled.

[00:05:18]
So what we're gonna do is divide the aesthetics from the usability. We're gonna kinda test the two separately through some really lightweight testing. And this testing can be done so, so quickly and will make an enormous difference to getting past the design mock up stage. The first is we're gonna test a wireframe version of the design.

[00:05:44]
And then we're also gonna test a style tile, or mood board, or whatever you want to call it, right? So one is the usability, right? And the other one is the aesthetics, the color, the styling, the typography, that kind of stuff, right? And that means that we can separate those two issues from one another and it will just make everything go smoother.

[00:06:07]
So we're gonna start off by testing the wireframe. Now, these wireframes need to be reasonable quality, right? We can't just do blocky wireframes where it's got no text in, or anything like that. It needs to be a bit more than that, it needs to be able to show, you have real text in and enough to be able to understand the interface, right?

[00:06:29]
But it doesn't need to be perfect layout, pixel perfect or anything like that. A grayscale, basic wireframe, does the job of what you think the page that you're gonna end up mocking up is. So that's that, and then we've got the mood board as well. Okay, so all of these tests that I'm gonna propose can all be done using Lyssna, and so there's a free tier of this, so you can easily do it.

[00:06:53]
And, let me be clear, you don't need to do all of these tests, you just do the ones that are relevant, right? So for example, if you know there's gonna be a big argument about branding and aesthetics, then do the aesthetics testing. If you know people are gonna be really worried about whether people understand what's going on, then do the comprehension test, and so on.

[00:07:17]
So, I'm not suggesting you do all of these every time, although you can do if you want to, cuz they're so lightweight. But yeah, again, do what you can.

Learn Straight from the Experts Who Shape the Modern Web

  • In-depth Courses
  • Industry Leading Experts
  • Learning Paths
  • Live Interactive Workshops
Get Unlimited Access Now