[00:00:00] Nathan Wrigley: Welcome. So the WP Builds podcast, bringing you the latest news from the WordPress community. Welcome your host, David Waumsley, Nathan Wrigley.
Hello there. And welcome once again to the WP Builds podcast, you've reached episode number 277 entitled user experience and user interface. It was published on Thursday, the 5th of May, 2020. My name's Nathan Wrigley. And in a few minutes time, I'll be joined by my good friend David Wamsley, so that we can have a discussion.
It is series two in our WordPress business bootcamp series, and we're on episode number five in that series. But more of that later, firstly, ah, a little bit of housekeeping that we always do at the beginning. If you enjoy WP Builds, I would love for you to help spread the word in any which way that you can.
A good way to do that would be to review us on something like your podcast, player, apple podcasts, give us one of those five star reviews. It really does help swell the numbers of the podcast. And obviously that would be lovely. Other things that you could do would be to go to Twitter. Use our handle at WP Builds and go to our subscribed page.
WP Builds.com forward slash subscribe. And sign up to our newsletter. There you'll receive an email update. Each time we produce a new bits of content and you can also find our Twitter handle YouTube channel and so on and so forth. If you're into YouTube, we do repurpose absolutely everything over onto the YouTube channel.
So maybe a good idea to subscribe over there. Now, since the news broke that Elon Musk was taking over Twitter, a lot of people have been trying to find alternatives. It may be that you're entirely happy with that, and you're happy to stick with Twitter, but I know that a lot of people have been searching around for different ways to have a Twitter like experience.
As luck would have it. WP Builds has got you covered. We have a mustard on installed, which is a little bit like Twitter, but it's federated. But the idea is that you go and post short messages and you can friend people use the app symbol to message people. And so on is completely free, completely open source, but we've got it up and running.
It's this URL WP Builds.social. So instead of.com, it stops social WP build stop. Feel free to come and join the conversation over there. It's pretty quiet at the moment, but it may be that this fits a need for you. If you are looking for something a little bit different and again, feel free to share that with all of your friends and cousins.
The last thing I want to mention is our deals page. I always say it's a bit like black Friday, but every single day of the week, significant discounts of all sorts of WordPress products. It's a WP Builds.com forward slash deals. Go there, search and filter and see if there's a way that you can save some money.
The WP Build's podcast is brought to you today by GoDaddy Pro, the home of managed WordPress hosting. That includes freedom. SSL and 24 7 support bundle that with The Hub by GoDaddy Pro to unlock more free benefits to manage multiple sites in one place, invoice clients and get 30% of new purchases.
You can find out more by going to go.me forward slash WP Builds. That's go.me forward slash WP Builds. And we really do think GoDaddy Pro for helping us to put on the WP Builds podcast.
Okay. Let's get stuck into the podcast, the main content showy today, we're talking about user experience and user interface. This is a truly huge topic, and we really do get into the thick of it. In this episode, David and I are having a bit of a chat. We talk about what you are. Is to start with, and then we get into it in more detail. So for example, we're thinking about what makes good UI and UX, how can we test for this? Do clients really need all of this or is it just part of our job and how do we convince them anyway, that it's relevant for their website?
Especially if it's something new, we try to break it down into more manageable parts and hopefully we've done a good job of that. I hope that you enjoy the book.
[00:04:27] David Waumsley: Hello, welcome to another in the business boot camp series, where we relearn everything we know about building WordPress sites and running a web design business from start to finish where on season two, and we're looking at the design process in this season.
And today we are discussing user experience. And user interface. So Nathan and I are taking contrasting approaches as we're getting our new businesses running and making our first client site. She's a new lawyer with no previous site. And we're calling this a. Nathan's should we just do a quick recap?
Yes.
[00:05:06] Nathan Wrigley: First of all, congratulations for getting through the introduction without having to rerecord it for the first time in what feels like a
[00:05:13] David Waumsley: year. That was
[00:05:15] Nathan Wrigley: absolutely breathtaking. At my heart was in my mouth and you got there. So anyway, a little insight into how we record this. Yes. So we're taking a divergent approach.
David is going to describe his agile approach in a minute. My approach is probably the more traditional approach, perhaps the approach that you're still using. And certainly one that you've probably used in the past. You might call it waterfall the idea of my approaches that everything's fixed priced.
We discuss at the beginning, what the project involves have meetings and discussions and proposals and contracts set the expectations. Issue some kind of pricing invoice and then get on with it. And when it's finally finished, go back to the client and say, look, it's done. You have a weapon.
[00:06:00] David Waumsley: Yep. And I'm going with the right way, which is agile, where we are here.
We really attempt to have a minimal viable website that's out there where we can get some feedback on how it's going. And we have an iterative, ongoing improvement kind of exercise in collaboration with the client. So there is no proposal at the beginning. We really try and that the whole process determined it.
By its results. So that's the approach that I'm going with it. So it's very popular, has been for some time in web development and it's probably the majority, but when it comes to us more web designers who work with WordPress not really caught on there. No,
[00:06:44] Nathan Wrigley: no, it's my approach is more straightforward to comprehend.
Isn't it? Yours has got multiple moving parts, which really requires. Bit of a rethink. And that essentially is what this series is all about, presenting you with the options of how to rethink it. And anyway, today where we're UI and UX. Which I
[00:07:01] David Waumsley: think is unclaiming this one, there's something that we do as agile people.
So let's talk about what it is first. So I'm going to take the definition that I picked up from the web, from the NN group, which is Don Norman's website. And he's the person who came up with the term user experience when he was working for apple in the. Nineties and his definition is user experience encompasses all aspects of the end user's interaction with the company, its services and its products.
So does that
[00:07:36] Nathan Wrigley: mean literally everything? So in the case of apple, who obviously. Physical goods as well as software. Not only is it the website and the product that you hold in your hand, but also down to things like the box that it comes in and whether or not it ships on time and even down to, I don't know the color of the manual, it's the whole thing.
[00:08:01] David Waumsley: Yeah, you interesting. We didn't talk about this earlier, but there is another branch of this, which is now been called CX, which is a customer experience, which, what Don Norman's definition there would probably what they would claim for it now. But anyway he's the originator of this. There was a wonderful video I saw of him just it's very short one talking about when he worked for the apple, they were considering things as simple as the fact that when someone left their store.
That box with their computer in it. They were thinking about the size of that box and how it would fit into the boot of a car. They wanted to remove as much friction from anybody's. Interaction with their company, wherever possible. And I think, that's what we're trying to do with the UX here.
We're trying to, and the UI as well, trying to remove that friction. So we create delightful experiences. That's the thing that's often used in UX. I think
[00:09:00] Nathan Wrigley: it would be easy to dismiss Apple's success because they're now so successful kind of success breeds success. So you imagine that they're always going to be successful, but they really did.
For a long time, didn't they were really the underdog and had to fight for what they've gotten. I think they do exemplify amazing UX in so many ways. Think about the apple stores, the physical locations that you go to, they are like no other commercial vending space that I've ever been into.
There's acres of space between all the products, there's a good six to eight. Between me and the next iPhone to my left and the other iPhone to my right. It's just such a different approach. And their website is so fabulous all the time. There's no clutter, there's nothing getting in your way.
And if memory serves that, they're not trying to push upsells and all of that, they're just trying to get you down the path of doing the one thing which is to buy the one thing that your interest.
[00:10:00] David Waumsley: I think it does. Disneyland is also known for this aren't they for really anticipating the needs of everybody who goes to it, and that they're, again, someone who's really good on the UX.
Should we? We should distinguish, cause we're going to talk about one and then we'll move on to the UI. And it's, they're often used together as the same thing, particularly when it comes to web design, because generally UI is the thing that is the website, but. There is a thing which is used a lot to describe the difference.
And that's using the analogy of an iceberg. So at the tip of the iceberg, the bit that you see there is just the copy graphics and the UI, and then all the unseen stuff. Key underneath is the kind of research strategy, content strategy, all the behavioral science that goes into understanding people's needs and motivations.
And I think that's probably the key thing with the user experience. If you skip the user experience and only concentrate on the UI, you end up with having pebbly a business reason for your website, and then you've moved to the UI. You skip out how users might the users go. And motivations and needs that will make them use your UI.
And that's probably where user experience becomes important. So it's wider. Yeah. It
[00:11:22] Nathan Wrigley: Almost feels like you I know there's artistry in it, but there's also some kind of science underneath it all. Isn't that? Whereas the UX stuff is a little bit more ephemeral. It's harder to get hold of it's people's behavior and people's opinions about things as well.
So it's a little bit more messy and difficult. To pin down and therefore I imagine getting it right is much more difficult, which is why I think that in our industry, at least you are, is being thought about all the time. Everybody wants their website to look great, to have great copy, great graphics to be, just a pleasure to look at.
But I wonder how many people do the UX piece. And we're about to delve into all of the different pieces that it would involve. And I know hand on heart for me, very little of this stuff ever
[00:12:13] David Waumsley: got. Now let's say for me, and I'm trying to move towards ways of being able to do it low cost in some form or another.
I think the thing is about UI. We know effectively we could test it, we can sit someone there and say, okay, go and use this website and place an order or whatever, or fill in a contact form at the end of it. And we can see. Watch their behavior. We're trying to do the same thing with the soap, with the UI.
That is the UX. We're trying to do the same thing. We're trying to understand who might buy this product from things that they might tell us about it, to understand what they might actually do rather than what they see they might do. And that's really the difficulty with the UX thing. But should we just start?
I wanted to just line up again because. But going these different routes with agile and waterfall or traditional, I think the UX fits into the agile very well. So if we, if we take the web. The analogy is that being a commodity, like a car, which comes off the production line and the keys are handed over to the owner and it's put into maintenance mode.
That's the typical way we do it. We scope the project and then we put it into maintenance. Whereas I think, while I'm keen to explore now, as I thought about it more is the idea of the website as more like front of house staff, which needs to engage and communicate with this visitors and It also needs to change.
And it also needs to provide information that comes back to the organization. So staff make a company evolve, don't they, you don't leave them. And then come back to them five years later and see how they're getting on. You made a great point to me before where I think your analogy might even be better for clients to understand, which is you switch that to a Shopkins.
That should I just
[00:14:05] Nathan Wrigley: explain that? So I think most people. Who run a shop. They simply don't leave it alone. If you have a shop and you're serious about. You all going to be constantly tinkering with it, that you realize that the season is changing and the shorts and the sunglasses are selling better than raincoats now.
So you're going to remove the raincoats and you're going to push the shorts and the sunglasses to the front. And you're probably going to put up some kind of banner demonstrating that the. That the sunglasses are on sale over here, but also you're going to be moving the shelves around, we realized there's not enough space for a little crowd together over here, so let's make it a bit wider over there and maybe even, change the paint job around the whole thing.
So it's just constantly moving feast. It never ever stay still. And my model just doesn't fit. My, my model is build it, go away maybe two to three years later, whatever the cadence is for that comeback, have a refresh go away, come back in a few years, rinse and repeat basically. And I think that the shop analogy, anybody going into a shop realize this from one day to the next an exaggeration from one month to the next, it's not going to be the same.
It would be surprising if it was because the needs change and it changes based upon I'm going to say data. I don't suppose many small shop owners are actually gathering data. It'll just be on instinct, but it'll be on instinct, built up by little mini miniature data points throughout the, the monster in the years that they're working.
[00:15:43] David Waumsley: And I think also, if you get into UX, which I think, everybody is moving towards it's hard to have a traditional approach where you scope it because even if you decide, it will work in both systems. Some people will just have an and date for it and they will still do UX where they will go through various different exercises to work out how the design of the site.
But I think, yeah. UX could the information you get about what you're trying to do for who could lead you to entirely change the scope, right? From the beginning of the project. And then on top of it, you've got the fact that probably the greatest data you're going to get is when the site is. It seems to me I'm claiming it for the agile focus like that UX is for us.
[00:16:31] Nathan Wrigley: Yeah. We've tried to deliberately disagree on the majority of these episodes, but I really there's no way that I can disagree with this, my mind model, the waterfall model. Really doesn't. That's nonsense. What I'm about to say. Isn't true, but it's easier for it not to be true. All this user research strategy, content strategy, the behavioral science going on in the background, all of that is trying to figure out what people are actually doing on their website.
That really does come later. And. Trying to get people to, to do that whilst it's getting built would be really difficult. So your approach of let's put something out there, see what it goes let's examine the behavior of people coming to the website that all just fits beautifully. Mine is top heavy and a lot of this stuff is, the stuff that you do after the fact.
So yeah, granted.
[00:17:25] David Waumsley: You would make the point though. The thing is when you've got most people come saying, I want a website, they've got an idea of what they want to see. That's the, it's basically the you, I, rather than the UX. So to try and get them to think. Definitely it's very difficult, but I think with agile, you could do it.
At our level quite easily by just simply say this is how we work. We put Sonic out. Cause we don't want you to waste your money first and we'll see what comes back from it. And we'll keep adjusting all the time and use that analogy of, it's not like a car where it is like your staff.
And I think it's, there's something in it for them. Then you can bring them along the way. But of course, if you try to bombard people with all the UX terminology, then there would be out of Australia ways. So Jeez. I just want a website, doc.
[00:18:10] Nathan Wrigley: I think that's the master stroke of it really isn't it.
It's just another little thing which needs to be done on the bigger journey. Whereas for me, it feels like the bigger journey is complete and the whole thing is finished. We've arrived at the destination. I'm putting your website live, we are done. And then you come back and say, actually, do you know.
Not only am I talking about security and maintenance and updates and all that, but would you like to get involved in these other possibly modestly expensive things? And of course, for many people who just wanted the brochure web. That's not part of the remit. So your little incremental chipping away at tasks seems to work better.
[00:18:51] David Waumsley: Yeah. It sets in the right expectation from the beginning. It's difficult to do it as an upsell later because you've already set the expectation, the model of the car, the commodity, or the ship that's launched. We use that terminology. Completed and I think the iceberg. So our main distinguisher as I see it between UX and UI, is that the UX is the significant bit between the why you're doing it, the business reason and the UI.
And essentially it's about understanding the user's goals, needs and motivations. So if we're to do it in some way we probably have to try and find a user, somebody who is definitely going to need the service, those that we're selling and some way or another, we're going to have to try and find some way to understand what it is that they are likely to do.
Yeah. I was
[00:19:50] Nathan Wrigley: at the very least that would be ideal, I guess I would say at the beginning, would it be okay to just find some. To check out whether or not things are even working in the way that you anticipate. So whether or not, could get a friend or family relation to browse around the website and give feedback is actually I had no idea how to proceed from this point to this point.
Or are you saying right from the beginning, you want to really drill down to the target market, whoever they are, wherever
[00:20:18] David Waumsley: they are? No, I would just, it's about ready to order vet. I think you need the UX before you can put the UI in place because. What is going on. So let's try and break it down with our cause we tried to do it.
So if we were thinking UX with missay, we'd probably start by asking a first, because this is all interlinked with it. Her business aid is what she's expecting for the website who she's trying to reach. And why, how was she know what success looks like at all? And we know that probably with most people, if you ask them those questions, they just think, I just want more leads.
Yeah. I want
[00:20:54] Nathan Wrigley: people to pick up the phone, that kind of response, right? Yeah.
[00:20:58] David Waumsley: Yep. And that, but we are going to need, because they will know it. Whether they've really thought about it or they can express it through a conversation, we will be able to get something that they see themselves as being different.
Other people out there, there must be something either about that personality and how they deal with people or the particular service that they provide, or they might be after, without knowing it a target audience, which is different from the competitors or something. If we can latch onto that and then put it into their words, then we've got effectively somebody who we think it might be.
And then now we probably won't have the budget to go through a whole research user research thing first, but we'd probably do that as the next step. But we could do that in an easy way. And I D I've never really done this. There's lots of documentations about how you might be able to focus group people and do all of that.
But in the most simplest terms, it's happened by accident with me. That's a site I'm doing for somebody who's setting up something for electric radiator installers, and just happened that my brother has some properties, which has been fitting out with electric radiators. So he knows I got his insight as to.
He was, the person thereafter. But he told me about what made it so confusing, the kind of acronyms, how overloaded it was, but the stuff or what he wanted to know. So that kind of thing, finding a real user for that service and kind of asking them some questions is a way of doing it.
Now there's lots of stuff in UX to be able to do this properly. There's some documentation where you have this empathy mapping where you try and find out. People feel, and there's a skill in not trying to elicit from people, what they think they want. It's really what they need and what they likely to do.
And it's very easy to have our whole project fail because you've asked people, will they want this? And they will say, yeah, it sounds really good. Yeah. Yeah, I'll be up for that, but that's not what they do. And that's the part of the skill of that. But I'm just saying, I think as long as we know that, that's what we're trying to do.
Not to forget what people will actually do. Their goals needs and motivations. Before we start to build. Anything is going to help us. It's almost as if it's as important as the business aims in the first place. What you're trying to do. You had a
[00:23:25] Nathan Wrigley: really nice coincidence there didn't you with your brother?
That's just almost like lap of the gods stuff. That's ridiculously coincidental and beautiful, but I guess the problem here arises. With modest budget
[00:23:39] David Waumsley: builds is
[00:23:41] Nathan Wrigley: do you know, having that same stroke of luck, the chances are 99.9, 9% of the time. You won't have anything like that. And so you'll be trying to figure out this by yourself.
And that basically is where I always ended up. Was I cut to. What the user would want and figure it out, instinctively myself, and, you're modestly savvy on the internet. You can probably figure some of it out. But when you get into real niche markets, not that miss a, with her law practice is all that niche.
But if you did get into something really niche, it may be that if you did it yourself, you would miss step. And so I guess you have to have the conversation about doing this. With paid people, consultants or paying people directly to, to give you this advice. And I don't know, I personally wouldn't know even where to begin with that.
[00:24:36] David Waumsley: Now, and this is the challenge now. Cause I've decided it's a good idea. And in some ways maybe you can do a lot of it yourself. What this is saying is don't get carried away with an idea that you think will be really cool. You need to say whether, you need to be realistic about whether someone really would be motivated to do what you're doing.
You to get them to do, and they will use that service. And I think sometimes you can be that person and ask yourself that question and go get quite far on it. But after that, without making it a big deal for the client, there's nothing, I wouldn't imagine there's anything more difficult than to say into that.
Do you have a Naval customers that already use your stuff and that are, might be able to talk to for 15 minutes or something. And then there's more conversation if you use something like this empathy map and just point out the things that they say and pick it out, you might get some real indicators about what are blocks to them, how they feel about certain things, what information is going to be important to them?
Upfront and that's going to help you to design your pages and then do your structure of your site. So I think that's really all that we can do here, but I think there's ways around it that don't need to cost much could take up an hour of the whole project or something to just maybe grab, three or four people might be able to talk to you a little bit about.
Maybe why, there were go choose some services over another, but obviously you need to have somebody who would need that service. That's the key thing. Yeah.
[00:26:10] Nathan Wrigley: Couple of things about that the the first one is what's an empathy.
[00:26:17] David Waumsley: Yeah. Yes. I don't actually know where this comes from.
There's you probably want to put the link in the show notes. This is from the NN group. So it was Don Norman's group there. And he's got an article on empathy mapping. And if I can bring it up on my bill to say what it says, is it just a little quadrant of things that people say
[00:26:40] Nathan Wrigley: it's yeah, it's divided up into four sections, isn't it?
And it's the kind of things that you'll try. Determined. And if you've only got four things to think about it, it makes it a lot
[00:26:49] David Waumsley: easier. Doesn't it? Yeah. We can't discuss much in this episode itself because there's an apple little link I shared with you as well. And it comes from again, connected to.
The agile approaches. There's a guy who's been doing, before agile was popular, something called lean UX. And he has also a kind of strategy template where when you've got with your business idea, it's just a way of reminding you to ask all of the questions that make sure that you don't make this mistake of forgetting what the user's needs are.
Yeah. Yeah. Because you could. Carried away with it. And if you ask people, they'll say that's great. Brilliant. Yeah. I
[00:27:30] Nathan Wrigley: will be sure to link to those empathy mapping tools and what have you in the show notes. So the second thing was, if you, if in our particular case, Madam a miss a is
[00:27:40] David Waumsley: just a lawyer,
[00:27:41] Nathan Wrigley: a local lawyer.
We already know that there's a business model there. We, there's lawyers all over the place. Do we need to do this when it's something which isn't new and unique, or is it only reserved for. People branching out into some new industry or new area or new.
[00:27:59] David Waumsley: No, I think it helps most with that, the latter, but also I think, it's about competing.
Isn't it here. If her business is just a copy of everything else, that's out there, that's more established where she must have something about her business. If it's in her that we've needed to get out from the beginning, which are our aims something so we can follow on. So her website will reflect that our walls.
In some way, meet the needs of the target audiences she has. So maybe, maybe there's something about the fact that she wants law to be very accessible to younger people. I don't know. Maybe she's specialized in one particular law, more than others, anything that we can go and that kind of lead us to it.
And then we can find that type of person. So think often, we talk a lot about user profiles. I think in web design, that's soft and banded around from the UX perspective, they would say that's more demographic and that's maybe good for marketing, but when it comes to get into the needs of people and what information that they need and how a site is to be structured, we actually need to talk to people who need.
The product itself. Yeah. Yeah.
[00:29:15] Nathan Wrigley: Sorry.
[00:29:16] David Waumsley: You carry them. No, maybe she will tell us that there are particular law that she specializes in, Yeah. I don't know enough about the service itself, but I'm sure lots of lawyers that are more focused on B2B than, yeah.
[00:29:34] Nathan Wrigley: Or it could be that you're into, I don't know, you specialize in divorce, law or conveyancing or something like that.
We also spoke before we hit record about there's an opportunity here for just how they want to portray it as well. And it may be that for example, they want to make use of video. 'cause after a few conversations with miss eight, you realize she's just got this electric personality and. Putting her front and center would make a real significant difference.
And you spoke about I believe it was a plumber or something client that you had before, and they w they just had this magnetic personalities draw the attention when everybody's looking at them in the pub. Cause they've just got something about them that there is this possibly gains to be out there as well.
Not necessarily strictly related to what we're talking about, but it might affect.
[00:30:23] David Waumsley: Yeah, absolutely. The guy I'm thinking of that, it's not electric personality. What he's got is the thing that I guess most people are most fearful of when they book somebody, is that you're going to get this rogue trades person.
And he is the absolute opposite of that is the nice guy who you would just instantly trust. If this thing, gosh, you need to show that because it's just meeting you, you're just there and you would like them in the home, you'd know that they're going to be fair with you. And I think that's it sometimes, W I think business owners have got no clue of being able to find their own unique thing that they've have.
Our conversations would start with that. I think, and then it would lead us to it. And I think there is, if she was doing law that was aimed at business to business that getting to know that would tell her. Maybe, in a few sites I've done which alike that we don't concentrate on mobile first, any longer, because all of the people go into their site.
Pretty much all of them, 90% of them are doing it in office hours on desktops. Yeah. Yeah. So I just think, that. You know the thing about thinking about the type of user that you've got. There's only so much we can talk about that. So we probably have to move on to away from the UX, I think, onto the kind of UI stuff.
So this is the stuff we can see, the stuff we build. Yeah.
[00:31:47] Nathan Wrigley: Yep. Okay. What have we got to consider?
[00:31:49] David Waumsley: There's a little of the myths isn't there with it, but we do know these things like we do consider the number of clicks to a goal like, so somebody has to fill something out. I think we're moving a lot more to making contact forms accessible on any page so people can.
Do that straight away, rather than having to go to a separate contact page, which takes some time to load on mobiles, that kind of thing. That's
[00:32:14] Nathan Wrigley: the nice thing about your model here, as well as that you've really got a, you've got an in into keeping that conversation going my model really, I might install well, I have, and I'm sure everybody can empathize with this.
You install something like Google analytics. And then it's total silence. And it's pretty clear that was a pointless enterprise, which is only modestly, albeit slowing down the site. Nobody looks nobody's checking anything. Nobody's reacting to anything it's just absolutely pointless. And that's because I've dropped the project.
As soon as I've handed it over, that whole thing has gone. Now, maybe it's part of some sort of care plan, but you've got a good reason to be going back. You want to, maybe you'll set up her. I don't know an SEO sprint as part of the ongoing relationship and it's not a care package. It's a bit of work.
It's a timed piece of.
[00:33:11] David Waumsley: Yeah, I'm in the kind of deal is, and it gets snuck out quickly. It's not going to be perfect, but it's out there gathering data, but you get it out quick on the thing that we're going to look at it pretty soon as well. So it's not the thing isn't going out three months or a year later, it's going out as quickly as we possibly can get it out.
And then, because that's part of the deal that you're going to start to look at a little bit of the things that you're trying to achieve as it managed to, which of course. There's every advantage to getting something out quickly, even if it's just a homepage, if it's a new site for her. So if I wasn't doing it with miss a, I want to get a, if even if she hasn't got all the stuff that she wants there, let's get homepage out there with a new domain name.
So Google can be, it can be rising in SERPs possibly getting some income in who knows what the contact form there before we've even completed the job. Yeah. So that's the idea, sorry, I'm a little bit off the point. So we're back to you. I, so our user interface, so we have to consider the number of clicks to a goal, a contact form, or an order or whatever it is, a white space, the use of that to consider in scroll in.
And which of course, there's a lot of theories about and a lot of myths aren't there, if you ask people, they often say they don't like to scroll, but most of the time it's when it's inconvenient scrolling, go now button, this and the kids you have to scroll to get to it or something like that.
Yeah.
[00:34:34] Nathan Wrigley: Just from personal experience, I'm, it really is a lottery, whether I scroll and it's largely a product of where I am at the most. If I'm idly doing something, then the chances of me actually scrolling down a pretty slim. But if I'm sitting in a comfy chair, then you know, I'm at home, the chances are pretty great, but it's, yeah, it's a big part.
You've got this tiny little window now on a mobile phone to, to make an impact and you've really got to make the most.
[00:35:03] David Waumsley: Yeah, a school is not, isn't it, the thing that everybody does when you're on a mobile, you just go on with your finger and go all up and down. That is
[00:35:10] Nathan Wrigley: mindless scrolling, flick thing that you see everybody doing with.
[00:35:15] David Waumsley: Yeah. We have to consider choices, whether there's too many for the client, that's obviously something that we'll get out of the UX, understanding people's motivations, get into the information that they most want and hide in a way, the stuff that they don't need until they're interested, that sort of stuff.
And knowing what that is. And also, Knowing, and this is where the user testing comes in. That users don't necessarily when they're navigating make good choices, they don't go in the air. As you think they'll go in, they click a bit randomly, or they perceive things differently. So these are all things to think about.
Should we move on to talk about kiss? I think Peacher and that series you did with her and do that work. That was, I didn't watch all of that, but it was excellent what he was doing. She was really into being able to critique people's visual designs. Yeah, this
[00:36:10] Nathan Wrigley: is, this is a series that I have been doing with Peacher.
We call it the WP Builds a UYUX show and on a monthly basis. Get Peacher to take a couple of sites and just draw some conclusions from her expertise in this area. And there's an awful lot going on. And, she'll talk about the user journey and she's got a big thing about certain characteristics of websites, like the way that the eye performs and the way that the eye works over a website.
And obviously if you're using language like English, the fact that things should be left aligned so that it's easier and it doesn't make. Tie it out. And these things on the face of it seemed like they would be really trite and not that important, but I think they are important. So yeah, shaping things, putting things into different content areas.
She talks about fonts a lot. She talks about color choices, a lot alignment a lot, and definitely things like white space. It's a good show. And we just take it. Each time and critique them. Sometimes we're looking for particular things like dark patterns, or sometimes we might be looking particularly at fonts, but yeah, there's a lot that comes out of it.
And to be honest with you, I'm getting into the mode of thought that she's got now. So I can often now think what she's going to say next, but most of what she said when I first did the show was totally news to me and it's worth.
[00:37:38] David Waumsley: Yeah. And I saw, some of the earliest shows in it.
I learned some stuff, particularly with the alignment. With much of this, to get a delightful experience, a good user experience is where everything works as you would expect it to work with the minimal reflection friction, that's it also has to feel nice emotionally as well, but that's it.
And I think a lot of what she does in those kinds of things is to say, make sure that you're learning. You know there, so it doesn't, little bits just slightly out across your design. It creates problems for the eye. It makes it feel more busy and being able to use white space in the right place, be aware of how proximity to things makes a big difference, how you might want to keep your call to action button in an open space, away from something else.
So people can spot it very easily and that kind of stuff. Yeah, we could talk about this one for ever. There are some basic rules, which I think come under the whole umbrella of a UX that we do as well as the user journey as well. Once we've learned a little bit about our user's needs, it might indicate the layout of the structure of the site at the user and the various user journeys that different types of users might go through because obviously this lawyer will probably be doing different services.
So we'll think about that. Anyway. Should we just move on a little bit about another thing, which is the kind of flow and interactions, something else that we do with our UI design. So just to say, peaches really
[00:39:10] Nathan Wrigley: hot on this, she really hates the idea that if you're encouraging somebody to do a certain action and then they do it and it doesn't result in that action, then you really are falling.
So like labeling. With, I dunno subscribe, and then it doesn't allow you to subscribe. It just takes you to some other place where you could, if you wished find the subscribe page is just a complete no-no. In other words, if it says to do something, then make sure it does that.
[00:39:42] David Waumsley: Yes actually, should we mention the thing we were going to mention a bit later about the Gerald spool thing?
$300 million button? I guess a lot of people know about this, but it's a real, it's real great example of the importance of kind of UI testing. I think I can't remember entirely, but I think the American group that had the problem was target and they came in and the big issue they had on the checkout that people weren't going on and buying stuff as they wanted and all that really needed changing.
As I remember this month. Absolutely correct. But is that the button that they had that said register, put people off because it just sounded like, oh, here's work, change in that word into continue meant that they went on and registered,
[00:40:34] Nathan Wrigley: which just such a phenomenally small change. And yet if your number is remembered correctly, resulted in a difference of $300 million.
That's gotta be the best use of time. In yeah. In history almost. You mean how long did it take to make that?
[00:40:55] David Waumsley: No, there's just been, you told me a great story. You must tell it. Matches one.
[00:41:00] Nathan Wrigley: Yeah. This is lovely. This is about listening to your stakeholders really, and listening to the people who are the people that matter.
So this could be your target audience or whatever, and it was all about swung matches. Swan matches literally. Yeah. Matches you buy a box and you strike the match and light. They were desperate to cut costs because they realized their business wasn't as profitable as it could be. And so they went out all over the place, hired very expensive consultants and the net result of all of the hard work that they did to change branding.
And all of that was nothing changed. The sales didn't go up, it's matches for goodness sake. And eventually some bright sparks said why don't we ask the workers? And so they went to the factory. And amongst all of the factory workers who were literally packing the boxes, they asked the question, can you think of a way of making our business more profitable?
And one of the elderly ladies as the story goes, I said I've noticed that on both sides of the box, there's a piece of what's it called? Sandpaper to strike the match with why don't you just get rid of one of them? And they were like, what why? Okay. So they got rid of it and apparently they saved about $5 million.
[00:42:17] David Waumsley: It's fun. But all it took was to ask the question. Yeah. Ah, I think that's what all this is about. Isn't it for me, this whole UX has just happened to a list of questions you might ask and just try and gain that information and look out for the pitfalls. I think that
[00:42:34] Nathan Wrigley: for me is the thing. I never had the questions, so I never did that work because it made it, it made me afraid because it is in an area of discomfort for me, gathering data and going back because it just didn't fit.
The model. The model for me was handed over, move on. And I didn't have a process and that it feels like you've got more of a process going on, which would make me more comfortable with it, where I to do it.
[00:43:00] David Waumsley: Yeah. And also if you were to study all the UX stuff on that, it's become its own industry with people, pay them good money to sit there and run these focus groups and stuff.
And it becomes vain, against my agile kind of approach, fade document heavy, itself. So I want to avoid that, but. What's behind it, the thinking anyway, so we talking about flows and interactions. So yeah, the pictures onto that sort of thing, but we all do it. We need to make sure that we lead people in the flow of a page and the, there are certain science about how eyes zigzag across a page and where we might need to pace important information within how people view stuff.
That's leading them to the steps to achieve their goal. And we've got Needs to be the sort of progressive side of it. So what we're talking about is put in the information that people need most in clear areas, and then maybe things that might be overload need to be hidden, maybe under some advanced options, if it was software or computer based, those in tabs are now designed that sort of stuff.
Status. You mentioned again. The big thing a button should do what it does. I find the same with a lot of designs where I think the image is calling me out to go to a page and there's no hover over it and I click on it and it doesn't do any, you see the image bigger or something like that. It doesn't do what I expect.
And that's, that's auntie that user experience, to make it good. Behave the way you expect it to work. So I think I see that a lot of times images that for some reason, the nature of them make me think I should click on them and they're not, and it's disappointing. It's friction. And the other thing is a good key point.
And we were talking about how this goes wrong. The importance of recognition over recall. It's easy to recognize something it's less uses less brain calories if you like than to recall. And. I've seen someone get the example of when you're looking in a photo folder at the thumbnail view and the foul name.
So if you want a picture of your holiday and this one, you want five with your wifi is going to be a lot of hard work to try and do that from the names in the file names. But as soon as you see the thumbnails, you can see it. Yeah. We use that a lot in design. Following conventions. So people don't have to think we use it for icons as well as a quick way of being able to signify what that thing does without having to read it.
Yeah.
[00:45:30] Nathan Wrigley: The perfect example to me for that is just like the use of maybe the download icon. We seem to have settled on an arrow pointing down to a horizontal line, and it's just everybody associates that with download now. And so that would be the perfect place to use it. Not scrolled.
[00:45:48] David Waumsley: I feel like I've been in web design long enough to.
See the rise of icons being the thing. Yes. Yes. And I also
[00:45:56] Nathan Wrigley: poorly used so much of the time by me as much as anybody else, you go for the, oh, that kind of fits. We're trying to demonstrate that we're good value for money. Okay. We'll put the dollar sign in. That'll be fun.
[00:46:12] David Waumsley: Yeah it's back to that big problem of the cart before the horse.
Isn't it. With the, you end up with a design in your mind and then you try and fit the information to that design. This is a section where, oh, here I con should go. So it doesn't work if you've got it the wrong way round isn't it should be the other construct enhancing or, moving us towards recognition rather than the more painful task of recalling stuff.
Yeah. Yeah. Okay, so really we're getting to the end of this. So we just talk a little bit about UI testing. Okay. Yeah.
[00:46:48] Nathan Wrigley: We touched on it a little bit earlier, didn't we? But this is the this is the bit that I genuinely never really did. It just, it was me most of the time. And obviously you've got your lucky circumstance there with your brother being able to help you out.
But I think for most people. This is a place where you're going to reach out to a consultant or an external service. But you've got the idea of just getting, I think three people is what you.
[00:47:14] David Waumsley: Does the guy don't make me think book you remembered his name. Oh, Krog, but I've forgotten his surname.
Yeah. And he does I can't remember the name of the book. Sorry. It's rocket science. Something where he does others, a YouTube video. Should Freddy find that where he shows how to go through a testing of a UI and you just basically get somebody you can screen share. So it doesn't have to be expensive to go through a task.
Ideally. For the whole UX thing, you would have a genuine person who needs the service, but, and you would give them a task to do. And are, as far as he's concerned, three, we'll give you so much information. It's diminishing returns after that, so it can be cheap. But of course, with anything related to this, it's just one thing you do is better than nothing.
So just getting somebody, a friend or family to run through a task on that on your website can be very revealing. And we don't do it. I don't, you. Same as you. I did it once on my own project and it, I probably did three people I think might have done four. And honestly it just was so eye opening cause you found.
Oh, God, because, I built it, it works the way I wanted. They didn't go. They didn't make the decisions that I thought they would make, where they clicked. And they found things that were broken that I didn't know, were broken. They managed to do things. It was a, it was an e-commerce thing even before were commerce.
Commerce takes care of most of that for you. Yeah. Th there
[00:48:53] Nathan Wrigley: is a good point there, a lot of the things that we're building with WordPress, that, that flow is it has been fixed over time. And also because we've commerce is such a big part of it. E-commerce in general kind of feel that they've got a lot of that, obviously you can modify that with things like cart flows and whatnot, but but a lot of it's been done already, but I do take your point, just getting two or three eyes crossed over if it was that revealing. And if it was just two people, I guess the lesson there is that you were just so embedded in it.
You just didn't see what other people saw. And if you can get that right in early stages, before you hand it over as the finished product in my waterfall. Then you are going to make the whole thing better in the longterm for very little effort. What would that be like two hours of your time, two or three hours of your time?
I guess you got to book these people in and sit with them and watch what they do, or get a video or something, but it's not a big investment, isn't it?
[00:49:55] David Waumsley: You can do that. The tools that they have with screen sharing for free things like Werribee, which I use would allow you just to watch the screen, the real skill in it is just.
Deciding the tasks that people go through. So it would work on any site. If you say, we went to our lawyer site and you say, okay, we want to imagine now that you need the divorce service, you're getting divorced and you need to get the information that you want to do that. And you want to contact them about that.
Just go through that and then the real skill in it. And it's the same as asking open questions as you would do to get the user experience, get to the motivations is about that skill of being able to. Ask open-ended questions, avoid asking opinions, asking them about the behavior. How did you decide. Where to go next, and avoid questions that kind of lead a little bit, like how easy was it for you?
Why did you not, or whatever, because people just justify those and avoid prime in the user as to what to expect now. So you can, it's just a process of keeping it open, give them a clear task. And then, when you think they're hovering in the wrong place or going in a strange direction, just say, what did you decide to do that?
And then you. Probably get some insight as to, what's not standing out on the page. There's not the color contrast or the space in that you need. So I think it's invaluable, light you, I've not done it, but I think it could be something that is just a really minor thing. When you think about all the tone that you spend on trying to put a site together, you could literally get through.
Two people in half an hour and probably learn a great deal, I guess the
[00:51:34] Nathan Wrigley: sort of cart before the horse moment is when you realize that all of the hard work that you've done so far is totally wrong.
[00:51:42] David Waumsley: Oh, hold on. Those
[00:51:44] Nathan Wrigley: three people have told me this site really doesn't work. How does that moment as well that the, the fear of having that.
But I, I get it. If your three person survey indicate to you that actually nobody's doing anything that I would like them to do that's super important information.
[00:52:06] David Waumsley: Yeah, I think it's going to reveal. It's just interesting watching. I rarely do it, but I do have the advantage of my wife not thinking anything, like I think so I can occasionally observe her and she nearly always pulls out something I would have missed, on their websites.
So even something as simple as that's quite useful.
[00:52:25] Nathan Wrigley: So you rope her in. Helping out
[00:52:28] David Waumsley: with these things, do. Yeah, she just does it anyway. She just goes and critiques it, it's always right. And it's always what I wouldn't have seen. So I think that's the thing. It doesn't take many people.
You might run out of friends, you could do it on, but I don't think it has to be a big deal. The online tools aren't there. Yeah. Oh, it's
[00:52:48] Nathan Wrigley: probably loads of online tools. I would've thought,
[00:52:50] David Waumsley: but yeah. There were, just the flash test one where, you get a very quick flash of the design that you've done and then people judge it.
This is more for the emotional response. So we could do that with the lawyer site. We could say, do a quick flash and just say, just this feel like a lawyer site to you, does it seem credible? Yeah. How did this site make you feel? It's a bit dodgy kind of stuff, but it can be quite useful to see whether the first flash of something, because that's what we believe happens.
Isn't it? When someone lands on the site, they make that kind of decision, a soldier right away. That's right. Yeah. And there's a, the kind of click testing, but I've been told that. So if you go for free where you get people to click test through a site or online, there are some of those services out there.
I've never used them, but I'd been warned not to use the free versions because people learn points for going through the process. And of course they could just randomly click to earn that points. Yeah. Oh no. Do your research there. Yeah,
[00:53:55] Nathan Wrigley: I guess the bottom line with all of this is that some. We've covered a lot there, but something is better than nothing.
If you just do a little bit of this one or two bits, it's better than sitting on the fence and saying, oh, I'm not going to do anything. Whichever bit you're most comfortable with, which you can systematize for your workflow, that would be, yeah.
[00:54:19] David Waumsley: I think so. And that's really, I miss the point of having this conversation.
Isn't it really is that I think most of the time I'm turning that aim now. So I'll at least do one test of the UI and I will try and get. Potential user someone that needs the service I'm building a site for and try and do a little bit of this empathy mapping just to get something, if that's going to be my new minimum.
[00:54:46] Nathan Wrigley: Yeah. Yeah, maybe we'll have to do with this podcast again in a year's time and see if you actually did do any of it. And whether it's been successful or not. Have we wrapped that up? Is that you, are you ex? I think so.
[00:54:59] David Waumsley: Yeah. We missed some stuff out,
[00:55:01] Nathan Wrigley: but. Don't we always.
[00:55:04] David Waumsley: Yeah. Yeah. But the last one that this of this season too, next time round, we're going to look at kind of the aesthetics and inspiration side of the web design.
Yep. That'll be
[00:55:14] Nathan Wrigley: round in probably two weeks time. So final episode number six of season two. All right. That was a nice chat. Thanks David.
[00:55:22] David Waumsley: Bye.
[00:55:23] Nathan Wrigley: I hope that you enjoyed that. It's always a pleasure to chat to David Waumsley about these things. Hopefully you got something out of it. Maybe you strongly agree with what we're saying.
Maybe you strongly disagree. The best way to voice those opinions would be to head over to our WP Builds.com website search for episode number 277. Alternatively, you could go to our Facebook group. WP Builds.com forward slash Facebook and leave a comment in either of those two places. We would dearly love to hear.
The WP Builds podcast is brought to you today by GoDaddy Pro, the home of managed WordPress hosting. That includes free domain SSL and 24 7 support. Bundle that with The Hub by GoDaddy Pro to unlock more free benefits to manage multiple sites in one place, invoice clients and get 30% off new purchases.
You can find out more by going to go dot me forward slash WP Builds. And we thank GoDaddy Pro for their support of the WP Builds podcast.
Okay. We will be back next week. It will be an interview episode because we flip flop between David and I having a chat and doing an interview episode. Don't forget, we've got our, this week in WordPress show comes out, live 2:00 PM every Monday, 2:00 PM, UK time.
That is, and you can get it by subscribing on our subscribed page as a podcast episode, the following. Okay. The only thing that it remains for me to do now is to say bye-bye for now. And here comes some cheesy music.
