Conversion Rates

Many case studies that are online. One of my favorites with personas specifically is that with a redesign, Forrester found you can get a four times return on investment four times, which is a statistic that you want to keep in your back pocket. Now, bear in mind that personas made from field data, not just cooked up internally. There's a huge difference on where data comes from, inside out or outside in.

Right. And it's hard to do empathy when you don't have an outside in perspective. So we're framing why reframing has become very popular in organizations 50% more accurate estimation of build time and cost. And these are some studies with wireframes. 80% reduced request for clarification from the dev team. Right. So the dev team knows that they're building two. I've had this happen so many times.

Dev teams are like, Wow, great. Here's the user interface specification and, and it's not going to change as much as the business analysts who are classic or notorious for changing requirements all the way up to dev and during dev. Right. That's never happened before. Just kidding. 25% reduced rework and bugfixes post-launch. So wire framing is a good mitigation. You know, it's just very quick sketch test solution.

Don't have to wait for it to be designed and go through the whole formality. Right now, the third technique in the UCD process, so user centered design, field studies, wire framing, you know, interaction design and usability testing. There's a great study from MacAfee that they had a 90% drop in support costs. Basically, people stopped calling because why should you call in just to manage your antivirus software? That should be intuitive, right?

And so they found in usability testing that there were some major blockers for people understanding what to do, how to manage it. And they fixed those and the phone stopped ringing. The support phones, good business result.

Now, just to start off by saying responsive is a default. Responsive is not an option – *do it*. And the reason is because that's where the world is at. Everyone expects things to be mobile-optimized, and responsive just means that if I switch from my laptop to my tablet to my phone, the site's going to fit to that resolution; it's going to kind of follow me.

And we know that users do that; that's the default. So, by doing responsive design, you're supporting device switching, and that's why it's important. You're also potentially making things a little bit more accessible and SEO-friendly, which is a factor for Google's algorithm that prioritizes responsive sites.

We're going to be looking at how analytics  fits into the user experience profession. It's been around for a long time. Analytics have  been around for as long as the web, obviously. And so has usability and user experience. They've been around since before – *long before*, in fact, if we're talking about usability. But the two have really not come very much into contact with each other until fairly recently – I'd say in the last five or seven years,

we're starting to have much more interest in analytics from a user experience perspective. And bear in mind that analytics is really quite a big topic and that  there are people who spend their entire lives looking at analytics. We're obviously going  to be skimming the surface somewhat, but from a user experience perspective. So, the kinds of things that we're hoping to get out of analytics, whether we're talking about web  or mobile app – I'm not going to differentiate

between the two very much. In fact, Google Analytics treats them pretty much as   equivalent. But the kinds of things we can get out  are largely around the area of behavioral data – which is obviously of great interest to us from a user experience perspective. But we'll also be looking at some of the other kinds of data – typically demographic – which also can be useful for user experience. So, *bounce rates* is a number that is often quoted in analytics circles.

It's how *often people appear* at a page on your  website and then *immediately disappear*. So, they've bounced. Obviously, it's very disappointing for  web designers to see that they've got high bounce rates on certain pages; and, of course, it can be a  variety of issues that leads to that happening, and that's really one of the challenges facing us from  a user experience perspective: Is it the content? Is it stuff that directed people to our site without our particularly being aware of it?

Is it faulty information? What kinds of things go on? *Conversion rates* – really the queen of statistics from an analytics perspective: Are people doing what you want them to do? That's what a conversion is. Are people coming to your website and buying stuff? Or subscribing to your newsletter? Or voting for your candidate in whatever kind of organization this might be? Those are all examples of conversions. And, from a UX perspective, we tend to think of those as achievement of goals, and

there is also the question, which we'll be talking a bit  about later on, of our organizational goals versus users' individual goals; hopefully, those are aligned, but they may not be; and sometimes the analytics can help us with that. *Repeat usage* – how often  people come back; obviously very important for most websites – we don't want people just dropping  in and then disappearing forever. We really would like them to engage with our content in most cases.

*User profiles*, *demographics*, *platforms* – these are all the kinds of things that the analytics tools can tell us. And some of this information has been available since year dot in the web arena – information that's passed back to a web server by the browser, for example. But it has become much more elaborate and much more sophisticated of late, especially with platforms like Google Analytics  doing a lot of that work for us. *Search behavior* – this has become a little bit complicated in recent years,

mostly because the search information used to be passed in with the request for a page. So, if you went to Google or Bing and you typed in a search string and then clicked on one of the resulting links, the search page would very kindly tell the server what the user was searching for at the time, but for various reasons that isn't happening so much now – some of it for information privacy reasons.

So, search behavior is dealt with slightly differently these days. We're not going to go into great detail on that particular topic, but if you're working with Google Analytics, which  is what we're going to be using as an example of an analytics platform, then rest assured that  you can get to the search behavior, but it involves integrating Google's search analytics with the web analytics for your interactive solutions. *User journey* is obviously very interesting from a user  experience perspective –

Where are people going? What kind of people go where? How long are they spending at various locations? Does visiting one page or another improve or decrease the chances of them actually converting – buying something or signing up, what have you? Analytics is a really huge field,  and we're going to be just kind of skimming in and looking at some of the highlights there and  trying to understand how it all fits in. So, how this data is collected and reported

– what's good about it? What's bad about it? There are inherent weaknesses in some of the data that we're going to  be looking at, and you obviously need to know and understand that. And that is one of the things that  I'm planning to do for you – is to point out some of the really important weaknesses and obviously some of the important strengths, too, but a lot of this data can be very helpful when it comes to locating and possibly even fixing user experience problems.

Personas are one of these things that gets used  in very, very many ways during design. A persona is a rich description or description of a user. It's similar in some sense, to an example user, somebody that you're going to talk about. But it usually is not a particular person. And that's for sometimes reasons of confidentiality.

Sometimes it's you want to capture about something slightly more generic than the actual user you talked to, that in some ways represents the group, but is still particular enough  that you can think about it. Typically, not one persona, you usually have  several personas. We'll come back to that.   You use this persona description, it's  a description of the example user,   in many ways during design. You can ask  questions like "What would Betty think?"

You've got a persona called / about Betty, "what would  Betty think" or "how would Betty feel about using this aspect of the system? Would Betty understand this? Would Betty be able to do this?"   So we can ask questions by letting those personas  seed our understanding, seed our imagination.   Crucially, the details matter here. You want to make the persona real. So what we want to do is take this  persona, an image of this example user,   and to be able to ask those questions: will  this user..., what will this user feel about  

this feature? How will this user use this system  in order to be able to answer those questions?  It needs to seed your imagination well enough.  It has to feel realistic enough to be able to   do that. Just like when you read that book  and you think, no, that person would never   do that. You've understood them well enough that  certain things they do feel out of character. You need to understand the character of your  persona.

For different purposes actually, different levels of detail are useful. So I'm going to sort of start off with   the least and go to the ones which I think are  actually seeding that rich understanding.  So at one level, you can just look at your  demographics. You're going to design for warehouse   managers, maybe. For a new system that goes into  warehouses. So you look at the demographics, you might have looked at their age. It might be that on the whole that they're   older. Because they're managers, the older end. So  there's only a small number under 35. The majority  

are over 35, about 50:50 between those who are in  the sort of slightly more in the older group.  So that's about 40 percent of them in  the 35 to 50 age group, and about half   of them are older than 50. So on the whole  list, sort of towards the older end group.   About two thirds are male, a third are female.  Education wise, the vast majority have not got   any sort of further education beyond school. About 57 percent we've got here are school.  

We've got a certain number that have done basic  college level education and a small percentage   of warehouse managers have had a university  education. That's some sense of things.   These are invented, by the way, I should say, not  real demographics. Did have children at home. The people, you might have got this from some big  survey or from existing knowledge of the world,   or by asking the employer that you're  dealing with to give you the statistics.   So perhaps about a third of them have got children  at home, but two thirds of them haven't. 

And what about disability? About three  quarters of them have no disability whatsoever.   About one quarter do. Actually, in society  it's surprising. You might... if you think   of disability in terms of major disability,  perhaps having a missing limb or being   completely blind or completely deaf. Then you start relatively small numbers.   But if you include a wider range of disabilities,  typically it gets bigger. And in fact can become  

very, very large. If you include, for  instance, using corrective vision with   glasses, then actually these numbers  will start to look quite small.  Within this, in whatever definition they've  used, they've got up to about 17 percent with   the minor disability and about eight percent  with a major disability. So far, so good. So now, can you design for a  warehouse manager given this? Well,  

you might start to fill in examples for  yourself. So you might sort of almost like   start to create the next stage. But it's hard. So let's look at a particular user profile. Again,   this could be a real user, but let's imagine  this as a typical user in a way. So here's Betty Wilcox. So she's here as a typical user.  And in fact, actually, if you look at her, she's   on the younger end. She's not necessarily the  only one, you usually have several of these.  And she's female as well. Notice only up to  a third of our warehouse ones are female. So  

she's not necessarily the center one. We'll come  back to this in a moment, but she is an example user. One example user. This might have been  based on somebody you've talked to, and then you're sort of abstracting in a way. So, Betty Wilcox. Thirty-seven, female, college education. She's got children at home, one's  seven, one's 15. And she does have a minor disability, which is in her left hand. And  it's there's slight problem in her left hand.  

Can you design, can you ask, what would Betty  think? You're probably doing a bit better at   this now. You start to picture her a bit. And you've probably got almost like an image   in your head as we talk about  Betty. So it's getting better.   So now let's go to a different one. You know, this  is now Betty. Betty is 37 years old. She's been a   warehouse manager for five years and worked for  Simpkins Brothers Engineering for 12 years. She didn't go to university, but has studied  in her evenings for a business diploma.

That was her college education. She has two children  aged 15 and seven and does not like to work late.   Presumably because we put it  here, because of the children.   But she did part of an introductory  in-house computer course some years ago.   But it was interrupted when she was promoted,  and she can no longer afford to take the time.   Her vision is perfect, but a left hand movement,  remember from the description a moment ago,   is slightly restricted because of an  industrial accident three years ago. 

She's enthusiastic about her work and  is happy to delegate responsibility   and to take suggestions from the staff. Actually,  we're seeing somebody who is confident in her   overall abilities, otherwise she wouldn't  be somebody happy to take suggestions.   If you're not competent, you don't. We sort of see that, we start to see a   picture of her. However, she does feel threatened  – simply, she is confident in general – but she   does feel threatened by the introduction of  yet another computer system. The third since she's been working at Simpkins Brothers. So now, when we think about that, do you have a better vision of Betty?

Do you feel you might be in a position to start talking about..."Yeah, if I design this sort of feature, is this something that's going to work with Betty? Or not"? By having a rich  description, she becomes a person. Not just a set of demographics. But then you  can start to think about the person, design for the person and use that rich human understanding you have in order to create a better design.

So it's an example of a user, as I said not  necessarily a real one. You're going to use this as a surrogate and these details really, really matter. You want Betty to be real to   you as a designer, real to your clients as you  talk to them. Real to your fellow designers  as you talk to them. To the developers around  you, to different people. Crucially, though, I've already said this, there's not just one. You usually want several different personas because the users you deal with are all different.

You know, we're all different. And the user group – it's warehouse managers – it's quite a relatively narrow and constrained set of users, will all be different. Now, you can't have one persona for every user,   but you can try and spread. You can look at the range of users.   So now that demographics picture I gave,  we actually said, what's their level of education? That's one way to look at that range. You can think of it as a broad range of users.

The obvious thing to do is to have the absolute  average user. So you almost look for them:   "What's the typical thing? Yes, okay." In my  original demographics the majority have no college   education, they were school educated only. We said that was your education one,   two thirds of them male – I'd have gone for  somebody else who was male. Go down the list, bang   in the centre. Now it's useful to have that center  one, but if that's the only person you deal with,   you're not thinking about the range. But certainly you want people who in some sense  

cover the range, that give you a sense  of the different kinds of people.   And hopefully also by having several, reminds  you constantly that they are a range and have   a different set of characteristics, that there  are different people, not just a generic user.

User research is a crucial part of the design process. It helps to bridge the gap between what we think users need and what users actually need. User research is a systematic process of gathering and analyzing information about the target audience or users of a product, service or system. Researchers use a variety of methods to understand users, including surveys, interviews, observational studies, usability testing, contextual inquiry, card sorting and tree testing, eye tracking

studies, A-B testing, ethnographic research and diary studies. By doing user research from the start, we get a much better product, a product that is useful and sells better. In the product development cycle, at each stage, you’ll different answers from user research. Let's go through the main points. What should we build? Before you even begin to design you need to validate your product idea. Will my users need this? Will they want to use it? If not this, what else should we build?

To answer these basic questions, you need to understand your users everyday lives, their motivations, habits, and environment. That way your design a product relevant to them. The best methods for this stage are qualitative interviews and observations. Your visit users at their homes at work, wherever you plan for them to use your product. Sometimes this stage reveals opportunities no one in the design team would ever have imagined. How should we build this further in the design process?

You will test the usability of your design. Is it easy to use and what can you do to improve it? Is it intuitive or do people struggle to achieve basic tasks? At this stage you'll get to observe people using your product, even if it is still a crude prototype. Start doing this early so your users don't get distracted by the esthetics. Focus on functionality and usability. Did we succeed? Finally, after the product is released, you can evaluate the impact of the design.

How much does it improve the efficiency of your users work? How well does the product sell? Do people like to use it? As you can see, user research is something that design teams must do all the time to create useful, usable and delightful products.

User Interface Design Patterns are recurring components which designers use to solve common problems in interfaces. like, for example, when we think about those regular things that often are repeating themselves to kind of appear in, you know, in complex environments We need to show things that matter to people when they matter and nothing else. Right. it's just really sad what we see. Like, for example, if you look at Sears, right? Sears is just one of the many e-commerce sites, you know, nothing groundbreaking here. So you click on one of the filters and then the entire interface freezes

and then there is a refresh and you're being scrolled up. And I always ask myself, is this really the best we can do? Is really the best kind of interface for filtering that we can come up with, or can we do it a bit better? Because we can do it a bit better. So this is a great example where you have galaxies and then galaxies, you have all this filters which are in rows. Sometimes they take three rows, sometimes four or sometimes five rows. That's okay. Show people filters, show people buttons if they important show them.

Right. But what's important here, what I really like is we do not automatically refresh. Instead, we go ahead and say, "Hey, choose asmany filters as you like", right? And then whenever you click on show results, it's only then when you actually get an update coming up in the back. Which I think is perfectly fine. You don't need to auto update all the time. And that's especially critical when you're actually talking about the mobile view. The filter. Sure, why not? Slide in, slide out, although I probably prefer accordions instead.

And you just click on show products and it's only then when you return back to the other selection of filters and only when you click okay, show all products, then you actually get to load all the products, right? Designing good UI patterns is important because it leads to a better user experience, reduces usability issues, and ultimately contributes to the success of a product or application. It's a critical aspect of user centered design and product development.

Accessibility ensures that digital products, websites, applications, services and other interactive interfaces are designed and developed to be easy to use and understand by people with disabilities. 1.85 billion folks around the world who live with a disability or might live with more than one and are navigating the world through assistive technology or other augmentations to kind of assist with that with your interactions with the world around you. Meaning folks who live with disability, but also their caretakers,

their loved ones, their friends. All of this relates to the purchasing power of this community. Disability isn't a stagnant thing. We all have our life cycle. As you age, things change, your eyesight adjusts. All of these relate to disability. Designing accessibility is also designing for your future self. People with disabilities want beautiful designs as well. They want a slick interface. They want it to be smooth and an enjoyable experience. And so if you feel like

your design has gotten worse after you've included accessibility, it's time to start actually iterating and think, How do I actually make this an enjoyable interface to interact with while also making sure it's sets expectations and it actually gives people the amount of information they need. And in a way that they can digest it just as everyone else wants to digest that information for screen reader users a lot of it boils down to making sure you're always labeling

your interactive elements, whether it be buttons, links, slider components. Just making sure that you're giving enough information that people know how to interact with your website, with your design, with whatever that interaction looks like. Also, dark mode is something that came out of this community. So if you're someone who leverages that quite frequently. Font is a huge kind of aspect to think about in your design. A thin font that meets color contrast

can still be a really poor readability experience because of that pixelation aspect or because of how your eye actually perceives the text. What are some tangible things you can start doing to help this user group? Create inclusive and user-friendly experiences for all individuals.

If we were working with music content and  we said, 'Here's a bunch of songs; arrange them,' we might see some people arrange them by band, we might see some people arrange them by genre, we might see some people say, 'Don't like any of those – toss them out.' So, we can learn about the *ways* that content can be organized, as well as the things that go together within those ways.

If you just focus on the evaluation activity typically with usability testing, you're actually doing *nothing* to improve the usability of your process. You are still creating bad designs. And just filtering them out is going to be fantastically wasteful in terms of the amount of effort. So, you know, if you think about it as a production line, we have that manufacturing analogy and talk about screws. If you decide that your products aren't really good enough

for whatever reason – they're not consistent or they break easily or any number of potential problems – and all you do to *improve* the quality of your product is to up the quality checking at the end of the assembly line, then guess what? You just end up with a lot of waste because you're still producing a large number of faulty screws. And if you do nothing to improve the actual process in the manufacturing of the screws, then just tightening the evaluation process

– raising the hurdle, effectively – is really not the way to go. Usability evaluations are a *very* important tool. Usability testing, in particular, is a very important tool in our toolbox. But really it cannot be the only one.

In a world overflowing with information, how do we find exactly what we're looking for, both online and offline? Enter Information Architecture, or IA: the discipline that helps us navigate through vast data landscapes. Information architecture is the framework of organization and labeling we use to structure and categorize content and data, primarily within digital products to make it easy to understand and navigate. Is like organizing a massive global library so you can find that one book without getting lost.

Whether it's grouping Jurassic Period fossils in a museum, or arranging your favorite snacks in the supermarket, IA can guide us through physical and digital spaces alike. At its core, IA focuses on arranging the part of something to be understandable as a whole. In the context of UX design, IA is akin to the blueprint of a building: it lays out the foundation and structure upon which user experiences are built. It operates on the understanding that we perceive information as places

made of language: labels, menus, visuals that can be organized for better navigation. Good IA is shaped by the content available, the context in which it's sought and the users seeking it, forming a complex information ecology. For UX designers, this means starting with understanding users needs, which leads to the creation of intuitive site maps, navigation and user flows that make digital experiences seamless.

After a designer identifies user needs and content requirements, they will create a hierarchy that aligns with user behavior and psychology. This involves defining how information is grouped, how it flows from one section to another, and how users access it through navigation and search functionalities. Effective IA results in a coherent, intuitive user interface that allows users to find information quickly, accomplishes tasks efficiently, and understand the location within the digital space at any given time.

Effective information architecture isn't just an initial step. It's the foundation upon which effective user experience is built, ensuring that every digital interaction is meaningful and easy to navigate.