 Thank you very much. I'm really delighted to be here. I was here last year and had a great time. It was so good. I got the t-shirt But yeah, like I say, I really like WordPress and the WordPress community because it does empower people in a world full of kind of social media sites where you're restricted to a kind of little box As to what you can publish WordPress Gives us this opportunity to take ownership of you know, everything from The design of our sites the content all the photography and even you know security issues so what I'm going to be talking about today is The user experience of the sites particularly if you have downloaded a Site from the WordPress theme so pre-made themes So I don't know if you've seen this screen. This is what when you go on wordpress.com and You have a huge variety of different Designs that you can choose from Am I getting a bit of feedback? Now the thing is right like none of us live in California and the content we have doesn't look like any of this It more often looks like this and so The trouble is right like we have to adapt things to how Our sites work. We have to make decisions. We have to design things And so this is where user experience design comes in and So the first question we might want to ask is What is Okay, what is user experience design? So does anyone have a good definition of user experience design that they want to share? From our made at the back. Okay, and anyone else that's so good. That's good in an accessible way Does everyone put your hand up if you don't know what user experience? Designers or you've never heard of user experience design. So one person there. You may have seen this photo And I like this photo is problematic in some ways But what I like about it is that it illustrates the breakdown between the designers intent and the actual users experience and so you know like the designer had a good idea of how this was going to work and The consumer the user just walked straight over it. What is problematic about this photo is it doesn't show true usage So we don't know how many people are walking across the mud We don't know what it's like when it's rainy and people don't want to get mud on their shoes and Importantly, we don't know about accessibility requirements So the muddy path is not going to be good for people that you know, maybe can't get up the curb for ever reason so This is a diagram from Jesse James Garrett in his book the elements of user experience and this came out in about 2003 and really helped promote the idea of user experience design amongst the web design community and The way it's presented is as a design process So previously people would just design a site do some HTML put their content up and be done with it Whereas in here People started thinking about navigation design information architecture content strategy and user needs and project objectives This is Don Norman and He was the first person to have user experience designer in his job title in the 80s at Apple And he wrote this book the design of everyday things about Usability problems and his definition of user experience design is that user experience encompasses all aspects of the end users interaction with the company its services and its products So this is a very broad definition of user experience going way beyond just usability and Things like that. So I think it's more interesting to ask why is UX like why do we have it? Why do we need to think about UX? This is a good reason why we need to because we'll be in the middle of a presentation and The computer will stop showing. Okay. So why is UX? And I think it is helpful to think about this in the context of Maslow's hierarchy of needs So you may know Maslow's hierarchy of needs. It basically Suggests that if we're hungry and we lack shelter We can't think very much about the meaning of life about self-actualization And we can translate this Into terms on the web with a hierarchy of user needs So at the very base level your site must be functional for someone to access it. It must be reliable usable and convenient and Beyond that you get experiences which make something that you want to come back to again and again and We can see plenty of examples in web history where User experience was a differentiator. It was a competitive asset so An early example is the difference between Yahoo and Outer Vista and Google so if we go back to that hierarchy Whilst the Yahoo site is functional reliable more or less usable and It wasn't as Convenient or pleasurable or even delightful, you know that I'm feeling lucky Was just at that little addition which made something pleasurable We see it as well with MySpace and Facebook So both MySpace and Facebook did the same thing, you know, they allowed you to connect with your friends and to share photos and to Write little bits of text And that's not a typical MySpace, but that's what MySpace could look like it could look like a complete mesh and if we go back we can see that As well as being more usable and convenient I think Facebook's emphasis on Photos and you know family were the things that made it meaningful. It had personal significance and Then if we move on To my favorite example WordPress so 10 years ago I was asked by my company at the time to choose a CMS and I went through 10 different CMSs, Drupal, ModX and all these things But WordPress was the one that had this five-minute install and this five-minute install was great, you know, like it was the only one of all these PHP CMSs that was quick and easy to use And Talking more about meaning if you go to meetup.com, this is the message you get What do you love do more of it with Meetup? So If you can get to the point of meaning then you know you can get to a point of Creating users that come back again and again who find Pleasure in your side. I mean, I'm very interested in web experiences that help Bring people together and I think That is an extra example of meaning and so if we're talking about user experience what I'm going to do now is present a process so This is what I call the learning spiral of UX design And the idea with this is that we all start from a position of relative ignorance So no matter how old our site is we can always learn more and With each stage of this Design process we hope to learn more and by learning more we make better decisions And so we start off with some goals Now these can be anything a goal could be You know make more sales Get more visitors Get more sign-ups to your mailing list Anything that you can track and that you can use as a way of Focusing your efforts Regarding that one of getting people signed up to your mailing list. You have to be very careful because I mean we're all bugged by these pop-ups Asking people to sign up to the mailing list, right? But probably on the data end it works, you know, because people do just type in email just to get rid of it But how many people here have just closed down a site because they've been so annoyed by it so that's the everyone in here is the most annoying thing ever but When you're just looking at digits, you know, maybe think oh, yeah, we've got an extra hundred people on the mailing list a hundred possibly very gullible people that are Prepared to endure this. I mean I didn't know if you see the back end of this often you get people swearing in these lists But yeah, you also need to track your bounce rate And so once you've established your goals, I think it's helpful to actually get Some insight into your users or your potential users You can do this through Online tools so this is a demographics section of Google Analytics This is not Terribly helpful, but you know it does give you a little bit of insight and the type of people that are looking at your site This one I really like if you go to you give profiles You can type in any area of interest and they will use their data To give you your kind of correlations of what people who are interested in those things are like So what we have here, hopefully is people who enjoy yoga tend to be female they tend to be young They tend to be fairly well off and Pretty left-wing. I mean, I don't know. I think like this. Yeah, it's like a communist. So And it also tells us What kind of things they enjoy in terms of entertainment? So they like cast for the friendly ghost Marty Pello and Ken Morley, I mean, I don't know how they work out. I mean So, you know, in a way, this looks a bit like a stereotype I Think it's based on about like a sample site. So it's only a sample size of a hundred and twenty three Maybe not take it too seriously, but maybe you'll find some insight in there Of something that yeah, you know like maybe yeah This will be something that you can use in a future marketing campaign or something like that You can also do ethnographic research So a friend of mine set up this Instagram account called receipts from Tesco and What she does is she goes to the self-service tills at her local kind of Tesco local and she just takes Receipts and posts of my Instagram as a way of like getting an insight into what people are actually like Okay And so, I mean the example you saw there the person's got red bull pain killers and chocolate And like that's you know, that's quite interesting insight into that person's life You can also Actually Observe people so I mean, I really enjoyed Kenda's talk because you know, we're talking about a system one and system two like most of what we actually most of our insights into people come from What they do rather than what they say we often tell people that we are into this that and the other But we can you know really judge those by what we actually do so if you go into a cafe, you know Maybe you can you know observe in a non creepy way like what people what people the websites there are and what you know How they're interacting what kind of distractions they have and Yeah, I think I think you know even talking to people. Yeah, you know, like Can be very helpful But like I say, you know, I think it's often better to observe what people do rather than what people say I find this really helpful once we've got our goals business goals and once we've discussed our user needs we get this crossover where your business goals intersect with your user needs and So the idea is that you know, one of your business goals might be to sell Something but that's not necessarily a user need but maybe the user needs really informative content About you know wordpress or whatever and through them accessing the thing they need getting into your site through Google you can kind of push them on to you know hiring you to help out And so yeah, we just go back through this learning spiral get our goals do our research and the next stage Usually is to build a prototype So the idea is that we want to test our idea Thesis as soon as possible and there's plenty of Kind of applications that will help you do this. This is something called file Samik Which allows you to create a mock-up that looks it's all done in kind of comic sans And the idea with this is that you're not distracted by the design and you can just focus purely on the actions So you might present Typical user with something like this and then say to them, you know, can you tell me how to? Edit this page or something like that and see how they go on without being distracted by the design There's also acts you're which is a bit more high less like less lo-fi adobe experience design Invision and the idea is that each stage you don't need to worry about The you don't worry about the back end you can just build something very quickly test it you can click through this and Get some insights into how people use it But as a word camp, I would recommend just using a wordpress, you know You can go on wordpress.com Set up your content put a few images set up your pages and in what two hours You've got a site that is clickable workable readable and all importantly testable So again, there's tools that will allow you to do Testing if you haven't got lots of human beings near you usability hub Have a whole suite of things like they do this five second test Where they Flash up your site for five seconds and then ask the user, you know, what is this site about? You know, what is the message of this site and the idea is that you're tapping into that system one thinking They also have a kind of comparison test So this is one I did the city of Glasgow College when they designed their site And the new site had a 70% test rate This is not kind of, you know, it's not Amazing data is not going to change the world But it is often helpful when you're dealing with a client or helping to Inform your decisions to help make Different tests and different prototypes This is user testing which alongside What users do they allow you to send a site to actual users all around the world and to get them to use it speaking out loud doing the tasks that you set them and What they'll send you back is a video And at the end of that video, they'll do a website usability test And it's really really Insightful to get that information to see what people actually do Jacob Nielsen He kind of worked out that you only need about five Users to uncover 80% of your usability problems So you don't need to test it with thousands of people But you can get very good insights with just a few people so My wife recently finished a yoga teacher training course and At the end of that course, they did a little Marketing segment and they asked people to create their own site And so she what she did she went straight on to wordpress.com went through that big list of themes and she chose this one Karuna Which apparently is Sanskrit for compassion So we learn something every day And this Karuna theme, you know, it's just a free theme from wordpress.com. I think it is actually Yeah, it's made by automatic So, you know fairly trustworthy. It should have everything you need It's got a little kind of lotus flower logo and Photo of someone doing yoga But as we saw earlier, you know, like just because you start with a theme that looks good here Once you've got your content and your photos often looks very different and You know one size doesn't fit all so this This is what she came up with so I mean it didn't take her very long but this is what she came up with and What I did is that I got someone to test this website I asked them the task to find out how much Yoga class was So they went on the home page Got this massive advert, which is what you get when you have a free website on wordpress.com They scanned around the home page to see if there's anything on there Eventually clicked on classes and courses and then kind of scanned this information and What you'd be doing when you're asking someone to test is to speak out loud to ask them what they're thinking So this person they had that table Up there with the colored unit I don't know if actually I don't know if we can kind of rewind that So this table is just an image and that you see you can see them clicking on that clicking Can I make it bigger because I can't read this at the moment? then they found this list of Classes and days But I mean can anyone point out any issues with this just looking at it now too much Lots of scrolling So I got them to speak out loud as they were doing it Yeah, and I was looking over this holder so yeah, this is one that was done in Real life rather than with the automated tools so One of the things they noticed is that the the yoga studio is completely empty Like that's a bad sign right like we don't want to practice an empty yoga studio They also yeah pointed out the thing about the table, which is Not clickable and a bit all over the shop and If you go down you can see that The prices is like prices for students But you know like are we a student like do you have to be a student to get that rate? So there's lots of confusion. We got lots of feedback in what like two minutes of looking at the site looking at real content. So What I'm going to do is run through some heuristics some kind of rules of thumb Five things that we can look for on our own sites Either when we're just looking at what we've got ourselves or when we're doing testing Because we'll be a yogi like there's nothing in here that Requires any jargon. You don't need to know anything about yoga to get started with this The next thing is make sure your design is purposeful. I really love Duolingo's home screen So simple learn a language for free forever get started If we can boil down our USP into something that simple then You know, we're going to make it super easy for our users to get started I mean it does you know carry on and you can find out more about the subject But you know, why would you need any more? It's so simple In yoga terms, we've got something similar experience hot yoga today introductory offer very clear call to action Compare that to this one Santiago and no real call to action Lots of navigation options doing yogi reiki Swedish massage it's kind of all over the shop Coming to this site You can see what they're thinking. It's like oh if we cover everything people will come along. They'll do it, but actually You know, you may end up just losing them entirely because What is it decision fatigue? So I'm a bit ambivalent about this so I Would say in the first stages follow conventions. You may have seen This joke, which is the idea that all websites Look the same now, right? Like we see this again and again and again And you can understand the thinking that people want it to be frictionless So here's an example of that it's almost exactly the same right like the three boxes the big call to action and the navigation along the top I Think WordPress does a pretty good job of not making all the themes look like this, but there are plenty that do But yeah, like I say I think those conventions Need to be treated carefully So it's become a convention Recently to have a hamburger menu. Everyone's got a hamburger menu. It's simple. It's clean But the we should test these things Luke Robluski. He's a Designer he did some tests with Google Analytics on an app that changed from having a three Menu item. It's a very simple menu to a hamburger menu and they lost kind of 40% Okay, so I think I've got an example up here Oh, yeah, so hamburger menu. Sorry is those three lines there So this is a good example There's like people at a WordPress conference that don't know what hamburger menu is and lots of people won't so it's supposed to be a hamburger because it's got a top layer middle layer and a bottom layer and All your navigation is hidden behind there, but if you can test these things test it with users It's see if it makes a difference if you add the word menu, you know, like maybe that will make it clear enough For people that aren't aware of it But yeah, this is what you get when you have something that doesn't follow any conventions It's a little bit of a mess. You don't really know where you are. You've got to learn the site Every time it's not completely frictionless and And Finally clarity again this navigation There's a kind of a rule that says that kind of more than seven bits of information on a navigation Becomes too confusing to choose. So if you can kind of limit that down It'll often be a lot more helpful for users and to tap into system one if you compare these navigation items This one actually covers, you know in six in six words what this does in about 12 so things like You know like a studio and about You know, they can easily be put into one and maybe you know, you can break up the page to make that easier to use So this was the before We gave the usability testing and This is after so it hadn't changed radically. They've just been simplified a little bit the navigation item Listen, I should I should say the goal of this site is not to kind of take over the world It's just to establish herself as a yoga teacher and Yeah Yeah, she was very appreciative so Hopefully these kind of ideas this kind of awareness of what's going on when people are visiting your site actual Testing with human beings is something that you can all actually go home and use even if you're just Downloading themes from the WordPress theme library Any questions What have you got in your menu then? What's the I think you've got more problems than the drop-down? Yeah, it's like a that relationship with a client where you've got to I mean you can use data, you know, like do an AB testing maybe and And see which one leads to more conversions or clicks or something like that That's one way around it, but yeah usability testing If you can test both then you can arm yourself with data because otherwise design just becomes a matter of opinion I mean, yeah, absolutely. I mean, I think over 50% of visits on, you know, at least all the websites I made make our You know visits from a mobile phone Absolutely, but yeah, I mean, I think WordPress is a journey as well So you may start with a free site, but it's quite easy to transfer all of that content into a self-hosted solution And you know people might get more into customizing the site I guess what I'm trying to emphasize is that Improving your design doesn't mean adding a load of plug-ins Doesn't mean adding sliders. It could often just be taking away stuff and focusing on what your user needs are Just on the left that That's a good that's a good question. I mean if you can have your own photos, then ideally do use them I think especially Because people become clued in I guess it depends how kind of clued in your users are if that photo is seen in multiple places You may end up being associated with Other people, but yeah, it's a good question of like whether it's better to have a great photo There's a stock photo or a mediocre authentic Photo, I mean I would strongly recommend getting professional photography. It can make a huge difference to your site Do you have an example of that like how That Yeah, I think if you could get a room together of everyone in the same room, so you know, they're all working at the same time I think especially there's lots of community groups in Scotland So I've done some testing On a website In Renfruitsha, which is providing advice to people and we just got everyone on Around a table or using the sites independently But just it's very comfortable situation for people to speak out loud and to talk to each other Whilst they were testing So and I think yeah Yeah, I mean, I think if you could get that number of people using something that they're not already using like if they if the if the The thing you're offering is appealing enough that people will use it Because it's very difficult to get people to change their habits Anyway, and to do something new, but um, yeah, I would just try and get as many people as early as possible To use it because Yeah, I mean I know like people set up a minimum viable product just using Facebook, right? Like they didn't even they just created a group and got people to post every day Like how much exercise they've done how many calories they both they'd consumed it was like a testing for an app for like weight loss or ever and You know, it was impossible to get people using it for more than a week. We've got bored or you know, like it became You know a form of shame or embarrassment like maybe oh we haven't done as well as we did in the first few days It's like that kind of New Year's Resolution Syndrome where you give up after a little while. So Yeah, I mean without seeing it. I would I would suggest just Open it up and I don't know maybe what Kendall was saying about Giving it value. So yeah, maybe the way you frame That offer that introductory offer, you know as a big discount or something to present it as something that people will want to carry on using They're getting a lot, you know, like Thousands of pounds of value by years ago Time for one more if there is one Absolutely Absolutely, and yeah, that's why you know if you go on Twitter or something and say oh, we're offering 20 pounds to test something you often get people who aren't the type of people you want, you know, so Again, if you can contact a community group of something that people are interested in the thing you're offering so I recently did some user testing on Glasgow's sexual health website and there's plenty of kind of you know groups Interested, you know, like LGBT youth Scotland or whatever who provided a community center where we could go through the website, so yep Yeah, just a big room, but getting people one-on-one. I think he's more valuable often Relaxed environment keep her, you know, keep things flowing and just have very focused tasks the things that you Are interested in people achieving so whether that's Signing up for the site or Yeah Or whatever Yeah, anyway, thank you. Great. Okay. Thanks, you You