 So let's get started. When talking about UX, please interrupt me at any time with questions. It's more important to me that you get your questions answered than I get through all my slides. I'm pretty good at adjusting those so we can go fast if we need to. And I'm also going to be at the Happiness Bar later today from 1.15 to about 2.30. So if you have any questions that you feel like don't get answered or something comes up later or during lunch, please come find me then and we'll talk about UX. So just so you know who I am, I live in Durham, North Carolina. I do content strategy. I do user experience research. And I work with a place called the UX shop and we're a collaborative team. And we're doing interaction design. We do a lot of usability testing for iPhone apps and websites. A wide variety of user experience sort of things. And I'm excited to talk about UX with you all because a lot of times we learn about making websites and design without actually thinking about the user and not learning about user experience. So do we have anybody in here who's never made a website before? See, this is great. You're not going to make all the errors that all the rest of us have done that have frustrated people that have made them go, oh, forget this website. You're going to avoid those. You're going to skip ahead. So do y'all say this about websites very often? Because I don't. Oftentimes I'm like, where is this thing? I can't find this thing. I do a lot like that. I fail a lot online. I don't know how often you fail, but so I'm technically a web professional and I've done website design. I've done different things for a number of years since I started on the web in 1997. I did the website design stuff starting in 2007 and I still fail and I have problems when I go to websites occasionally. And so then I wonder, you know, how's my mom doing? Who has no web experience? Who's 30 years older than me? That sort of thing. And every time I go to this site, I have major problems. The YMCA. This template is all over the nation too. And one day I'm going to do a talk and I'm going to run into somebody who is like, that was my template. But seriously, I'll go here. Last summer I went here a few different times for the pool schedule and I would spend five minutes searching around for the pool schedule. No luck. A couple weeks later I'd be like, I'm going to look again for the pool schedule. No luck. And then finally I found it. This was like about four weeks after I tried. I mean I was like just calling them and doing that. And then I found it and it was a PDF and I couldn't understand it. It was like written for the staff or something and I couldn't even get it. And I was like, that was just such a fail. And it really made me feel like a loser. It made me feel like a loser. And that's not what you want to do to your website visitors. That's not a good sign to help them come back. So let's look a little bit at success rates online. So these are from the Nielsen Norman Group. They're really kind of leaders in the world of UX and we'll talk a little bit more about them. But so success rates, so this is like you're in a lab and you're hopefully paying attention and you're not on your phone at the same time. You're like looking at the screen and the researcher says, hey can you find a pair of shoes to buy that's under $50 and you go to the shoe website they're testing and you're able to complete the task. And then it's success if you get the task done, it's success. And you can see that there's a difference on mobile versus desktop which makes sense probably with our own experience it's harder to find things on mobile with a smaller real estate, that sort of thing. But I just think this is way too high. I think these are way too high. In real life situations, I don't know about y'all but like I'm going through the grocery store, I'm dragging my three-year-old, I am like trying to find something on my phone that people have told me about and I'm like running into people. I mean it's just a whole different experience than in a lab with a researcher. So we need to help people be as successful as possible at our websites. And these are our goals today. We're going to try to learn these four big ideas that are kind of high level ideas that will help you when you approach any kind of issue. And then we're going to also just get into some like nitty-gritty practical tips for you. So let's just make sure we're all on the same page about user experience. Now I want to be honest, if we had designers in a room, we could have an argument about what UX is and it could last five hours because there's a little disagreement around the whole thing. But I'm going to use this definition here and it's really all interaction with the company. And we're going to talk today about the digital interaction, right, the website. I believe that UX is everyone's job. I don't think it's just the job of the person with UX in their title. A lot of places nobody has UX in their title. It's the job of the developer who makes sure that the site loads fast because we know from all kinds of research that a slow site, people leave really quickly. Speed comes up almost on every usability test that happens. We know that it's important that the writers, the people who are writing the content for the site, understand UX and understand how people actually read on the web, right, that people scan a lot, they don't read, they're starting at the front of the sentences, they may not make it even to the end of sentences, that sort of thing. So it's important. Of course, the designers. They're the mental models of people who are approaching websites, right? So you can't just be creative with things that are going to break the mental model of people who are actually going to visit the site. So I always want people to be creative more with their content and some of the things than say the navigation. We'll talk a little bit more about that. And right now, UX is a competitive advantage. You can still go to a lot of sites and you've got like, this is a mess. Or like, I can't find this and you fail. But one day that won't be the case. Or you're serving business owners, you can really help your business owner have an edge up and be more competitive. Now, why is this hard? Why is it hard to have good UX? Well, first off, there's not a typical user. And so that's a problem. Everybody uses the web idiosyncratically. People use computers differently. So that makes it really hard to make generalizations. Because, for example, I can think of the first time I did a usability test. I was with a gentleman and I was testing some real estate site like that and I said, hey, can you look for X? And he immediately went to the search bar in the upper right corner, which is where it should be, right? Because that's generally where most people expect it to be. And I've never done that. I never go to the search bar. Like, the search thing is the last thing I ever go to. But when I talked to him later, he said, oh, I never look at the navigation. I go straight for the search. So there's this whole group of people who only are looking at the search box. And we're talking like up to 30% has been estimated. And so if you don't have a search box on your site, it's not a typical user. So that's hard. That makes it hard. And then we have these computers that are way outnumbering users, right? One billion smartphones are sold each year. So we have all kinds of different screen sizes and devices and we have to make sure our website looks good on a big screen and a small screen and a medium screen. This is hard. But there are some things we know. People have been researching this stuff since the 50s, human-computer interaction. And we have some four kind of big ideas that we can get in our head and we can use no matter what. Making something for our wearables down the line. You know, the Apple Watch, that sort of thing. These ideas are applicable to all. The first one is home. Users want a sense of place. It is important that they understand where they have hit. So they've come to some search results. Let's say they're coming through Google. You've got the search results and they're clicking through and they need to know that they landed where they thought they were going to land. You may think, oh, that's so, of course, that's not a big deal. But this starts with the logo and the tagline. This is not a company, a consultancy. The Institution for Innovation in Public School Choice. They asked me to do their logo. They didn't pick either of these logos. They actually did the most non-innovative logo you could possibly get. But they're economists. They're not designers. And so what was happening was, during the conversation with them, I wasn't going to be able to change their name, which was really super long. And if you work with anybody in academia, you'll see they really like these long names and blah, blah, blah, blah, blah, blah, blah. And you aren't going to get them to change their name. But so I remember talking to Neil, the executive director, and I was like, do you ever actually use your long name? And he was like, no, we're like the ipsy guys. I'm like, ipsy guys. Okay, so I think when somebody's coming to your website, they're going to be looking for something that looks like ipsy, not like the Institute for Innovation in Public School Choice and making sure where they are. And you may think, oh, well, that'll only take a few seconds for them to figure out they're at the right site. But that's like seconds lost. And somebody who's like looking for the ipsy guys hit on the site, they see this logo on the bottom. ipsy, these are the guys. And what we ended up doing was doing a simple logo with the initials and then a tagline because they wanted to talk about innovation in school choice. So just be mindful of that sort of thing. Consistency helps users have a sense of place and a sense of home, making sure that navigation is clear. So this is Teach for America, great organization. Check out the page that I hit. If I click on Choose More, there's a great name for a button because I don't actually know where I'm going or what I'm choosing exactly. I go here. And that looks pretty different. Here to here. Am I on the same website? I am. But we don't want things moving around like the logo looks good again. Here, here. They look different. So you want users to be having the sense of place of them in the same place all throughout. So this is the Business Insider. It's kind of a business magazine online, I would say. And you can see kind of here that life is the section we're on because it's a little bit darker than blue. But it's not obvious by any means. And this is kind of what comes up a lot in web design is that there's just things that are a little bit too subtle. So we're making this assumption, well somebody will notice that that is actually like a hex color that's like a dark navy and it's not like the medium blue. And that's not true. And they're not going to be able to tell you that they're on the same page very quickly. And so they probably won't notice that this is where they are. They're on the life section. And even the life, the page title is really small. So it's easy for people to get lost in a site. And I've noticed that occasionally some sites that are kind of light on content will use the same picture on multiple pages. And then that's really confusing because you're like did I change pages or am I back on that other page or what's going on? Anyway you can help, you just have a sense of place. Breadcrumb trail. So if you have a heavy site that's just really deep with lots of layers, you're going to just help out your users by giving them a breadcrumb trail. Really common on, I feel like clothing sites. We see a lot of this. It's pretty common on academic sites. And it's nice because everything in there is a link. So if I want to go back up one level to shirts I can kind of do that. So right now users are so really dependent on the back button. It's like the most used button in the interface in the browser, it's the back button. But we want to try to help them out so they're not forced to use that. You can also give users a sense of place by letting them know where they can go next. And so these are not helpful links. Click here, click here, click here. Because we know people don't tend to read too much online. They tend to scan. And so the links pop out. And when links are popping out, they just say click here, I have no idea where I'm going. So I want descriptive links. I want helpful descriptive links and a sense of what's next. R, X, Y, Z services. Okay, I know I'm going to click on services. Here's one that says our wide range of clients. Click on that. I'm going to get a list probably, right? Or some logos. Read details about our new program. So when you're doing links on your website, avoid the click here unless you're going to say click here with something else that actually shows where they're going to go. And this is something that's come up so much that I just wanted to put it in my presentation. I don't know if you can see this at all. Or if you just put it in into Google, you'll see there's lots of conversations about it and people really get up in arms. So the hamburger menu, some people like it because it's very minimalist, right? It hides a lot of the content and it's just in the upper right corner, the upper left corner, and you click on it and the menu pops out and that sort of thing. And some designers really like that. The problem is that the content's really hidden. Very hidden. So that's very problematic and I've heard people argue against it for that reason. Also, some people actually don't know what it is. So we have this assumption that everybody knows what the hamburger menu is because I know what it is. And that's actually not the case. Research is showing it's mixed. Certainly younger generations are a little bit different than older generations, but you may have noticed that Facebook and some of the big companies that can spend a lot of money on research are starting to let go of the hamburger menu with the word menu underneath or on top. So it's really clear, like, this is a menu. But I really want to tell you, it's like, why are you using it? Are you going for this total minimalist effect or would it be better if you put, like, our projects or these different things that you really want somebody to click on in center so somebody can see them? So I would say don't use the hamburger menu unless you have this good reason to do it. Any questions so far? Users want to sense a place. This is a summary slide. You all will have access to these slides later on. We get our number one thing that I didn't mention is that people come in not through the home page anymore. A lot of times people come in through a blog post or some news or that sort of thing or social media. So if they're coming in, often the second place they go is the home page because they're trying to orient themselves as to, like, what's here? So you need to be thinking about, okay, does the page they enter look like they're in the same place as the home page? What's going on there? I'm going to start moving fast. Users act as if something is on fire. This is how they act when they hit your site. It is called satisfying. This is not a new term. This was developed in the 50s. And it's the idea of you make decisions that are good enough. And it's this combo of the word satisfying and sufficing and it's kind of awkward word. But you really have to plan for really fast moving people. So they're not going to be like, is there news or should I click on stories or should I do do that? They're just going to look and whatever looks like it's reasonably going to meet their needs, they're just going to hit it and click it. And it's interesting when you do usability testing because you're just going to be like, wow, they're just not even seeing things because they're just going and going with whatever looks like it reasonably might meet their need. So we have to plan. We do things like put the most important things first. So when we're writing, so this is some research that was done so 81% of people would read the first paragraph and 71 next. And then you see the drop off to 32% on the fourth paragraph. So if you're like me and you've ever like slaved over the language in like the seventh paragraph, you wasted your time. Don't do it again. We'll all let that go. And so you really want to get the stuff kind of do what journalists do, which is kind of like you get the main stuff up front. You would also want to add in bullet points and scandal headers and that sort of thing. We don't have time for a wall of words online. This is on Ebola. This is Wikipedia. I feel like it's really, they've got lots of walls of words. It's just bam, what a wall. Oftentimes users will say a wall of words and go I don't even want to go there. That's just a lot of words. So you can see this is an article on Ebola that's a little bit different. I'm not sure the virus needs to be that big, but it is more interesting the way this is set up. I have options of how to interact with it. I'm not forced into the wall of words. So we're moving fast. And so users want websites to move fast. And if you can get it in a tenth of a second, it feels like, ooh, instantaneous. Love it, great. One second, still pretty good. Here, this is based on research, right? Ten seconds keeps the user's attention. And I'm like, really? Because I kind of lose attention much more quickly than ten seconds. I think it very much depends on user motivation. If I'm trying to get into med school at UNC, I have to wait if it takes two minutes for the site to load. I will wait because that's where I'm going to go. But if I have competitors and other people I could look at, like if I'm looking at Airbnb and VRBO, and one is taking a long time, I'm just moving over to the next one. So you may think, OK, of course I know you need to be fast, but it's really important. It's important to pay extra money if you need to to get the service you need to get a host that's fast. I waited 25 seconds for this picture to load. And I have the fastest internet you can possibly have in my house. And I'm not even sure exactly, like, what they're trying to communicate. And I didn't want the annual report after all. And it was in a carousel, which we're going to talk about in a little bit. And so it was showing me, like, one inch of the picture, and then it would rotate to the other one, and then two inches of this picture. And it was just a mess. So check your speed. There's lots of tools that are available. You can just Google, like, how to check my website speed. They're free. And you can usually fix some things quickly and easily, right? It's pretty easy to take an image and make it so it's a smaller size. Things like that's going to help it load more quickly. There are two main questions to ask yourself. Am I saving my self-time at the expense of the user? Am I taking a shortcut that's going to, in the end, hurt me? And how do you save the user time? Make it easy for them. Because, again, they're acting like stuff's on fire. Just a summary of the different things we're talking about. Do we have any questions on this? That's good. Ellen, any questions? Okay, so my site, which shows the size of the images, haven't changed, et cetera. The site was down for a few days back. The load time went from seconds or milliseconds to, like, 30 seconds or more. The size of the files, which none of that had changed. Call your host company. So if you're on a shared server, oftentimes, I definitely kept having that experience in general. And I ended up moving toward Press Engine because I was just like, I can't deal with this anymore. I ended up going to WP Engine because I can consistently bank on it. And before that, I feel like I was at domainsandseconds.com, which is owned by GoDaddy. So oftentimes, the host will be like, oh, it's your plugins, which it could be. Oh, it's your images, blah, blah, blah. But after you've checked out the main things, you need to go back to your host and be like, what is going on? And you can Press. And what my experience was was that I'd Press them, and they'd be like, it'd be like better for a couple weeks, and then I would be back to, like, the same old super slow. And finally, I was like, so I think you need to look at your hosting solution. Okay? Because that affects your server. Your server. What they can handle. It wasn't anything with my site. No. It was just that they have too many things growing on one server. Yeah. So we can talk more about that later, too, if you want. Let's keep moving. Users prefer using minimal brain power. They don't want to use the brain. They don't want to be thinking. They just want to do their task, right? They don't want to be, like, wondering what your navigation means. Meeting user expectations is really important. So I don't use my brain power. So, like, here, this is the UNC site. And it's got great students as a link. And then I go here, why student aid matters. And it looks like a different thing. And the logo moved. And I think where they want me to be is on the Profiles page, which is the next one. But so you just kind of threw me off. Because I started to think about, am I still on the right site? Am I on the right page? That sort of thing. So if you have something like, I don't know, maybe you're a bakery and you have cookies. When I click on cookies, the page should say cookies. So I know I'm on the cookie page. All right? So it sounds really elementary, but this kind of little stuff builds up and it sends people away after a while. Because you just get frustrated. Our brains can only handle so much. We have cognitive load going on. You don't want to waste your cognitive brain power on navigation stuff. You want to spend it on the good stuff, the content, what you're trying to sell me. That kind of thing. Like, what are the benefits? So navigation, too. There used to be this trend in web design. Break things up by category of what type of media it was. And so some sites will do that. I hit the people for ethical treatment of animal sites. They're always up to interesting things. And you can see they've got features, videos, blog, issues, interactive media center. And I'm like, what's the difference in videos and media center and interactive? Should I hit on issues? If I wonder about dogs, features? Like, where should I go? Maybe I'll just go to the search box. Not great navigation. It raises a lot of questions. This is the Shed Aquarium. It's a really fun aquarium in Chicago. And I think it's much more clear. It's like, plan a visit. Animals in care. Conservation research about us. Just really want to think about your navigation to make it really easy way finding. So I approach websites with a mental model, right? And I always like, this is alternative apparel website. And I actually really like some of their stuff and what they do. But I'm just like, why? Like, why is the live chat button over in that corner? There's a search box over there when everybody, most people, do the research like expected to be up in the upper right. And why is the logo in the middle? Is it just because it's the trend to have the logo in the middle now? Because most users actually expect it to be in the upper left. So if you're going to do something that's different, I just think you have a reason to be doing it. Not just because I'm bored with this. I'm going to do something creative and different. Because if everybody's expecting one thing and they're looking for a logo and you've got live chat up there, I don't even know what I'd chat about. I haven't even gotten into the site. I'm not sure what I would talk about yet. So really making informed decisions. We help people use less brain power when we have visual hierarchy. And oftentimes sites don't, where the headings are all the same size. And you really want to be guiding them through your site, right? Like, hey, look at this. Now look at this. Now these are even less important. Somebody sent me a slide. They were like, I totally found a slide that was your example. Like, things were very much like the same level for a lot of this. They were like, this is an example of not great hierarchy. And I was like, yeah, you're right. A lot of things are about the same size. Make it obvious. And it's confusing. So here, crayons for calculators. It's a great organization, helping kids, get what they need for school, that sort of thing. But there's so much competition going on here. I don't know what you look at first. But I looked at the click here to donate now button. I don't even know what the organization does yet. They've got competing red up there and there and the logos in the middle. And then there's this backpack that also caught my eye. So maybe it's like a backpack lunch program thing or do we put school supplies in the backpack? Or I don't know. I'm missing a lot. Bloomberg, I feel like it's hilarious. I just feel like it's like Times Square, like right here, you know? And you know what? Maybe that's what they're trying to do. Like, we're in the middle of Times Square. This is exciting. I'm not sure, but I don't even know what to look at. I don't know what to look at. So I think more clean examples, websites are better examples. So this is Charity Water, which I'm sure many of you have heard of. It's a great charity. But so what's interesting about this website is the numbers would, there was some JavaScript on them, so the numbers would rotate. And so it just did it like three seconds. So I could see the numbers would pull my eyes right there and they really wanted me to click on this button, start a campaign. There's not a lot of things competing. If you just look for Charity Water on Google, you will find it. They're well known. Yeah, yeah, no problem. Again, Trader Joe's, it's really obvious what they want me to look at here. I'm going to look probably at their logo and then I'm going to be looking at their new products and then they allow me to scroll through. So we have to help users especially now because flat design is a big trend. So you probably remember when the web was first getting going and in the early 2000s, everything tried to look real. So buttons had 3D shadows. They had shadows on them, drop shadows and you would click them and skew morphic design and it looked a little bit more like this, Web 2.0, which even sounds really dated, Web 2.0. And now everything's really flat, flat design, which is really clean and minimalist and that sort of thing. And that's totally fine. That's the design choice. But it can make it hard to see what's a button and what's not a button. And it's super hard on mobile, right? Because when I'm on my phone, I don't have the courtesy of the little hand that hovers. I'm just like, ooh, maybe that's a button. Maybe that's a button. Like I'm doing that. And that's them using my brain power and trying to figure out what's the freaking button, right? So we want to try to minimize that sort of thing as much as possible, right? So just follow on your proven conventions unless you've got a reason not to. Got some exciting thing you're trying to do or you're trying to like pave the way for new navigation to the world, which is fine. But you just need to be thinking about this deliberately. And just be careful. Be careful with flat design. So this is my favorite part we're going to get into now. Users want information-rich visuals. I made up information-rich. It's meaningful to users. It's authentic subjects and it's full of helpful information. I know this from research with users. So this is the GERD Institute. It's some kind of digestive disorder. They help people with that. You can see this is a heat map. So the areas in red are where there's lots of eye fixations. Yellow is a little bit less and blue is a little bit less. And so they're tracking people's eyes to see where they're looking. And you can see, so this is actually a case where people will scroll down, right? Because they're reading pretty far because this is written for the web and things are spaced out well and that sort of thing. But look at how good they are at ignoring the woman with the groceries. They're totally caught on. This picture has no meaning for me. Nobody's groceries actually look like that when you come out of the store. It's not that pretty. And it's just a filler photo. And filler photos, we know, we know, we know that users ignore them. And so why put them there? So this is another example, right? Human Rights Campaign, great organization. But on mobile, totally make us sad, right? Because if I'm looking at a filler, I think this is a filler photo, you know? I don't need a picture of someone's shirt and this sort of ribbon thing. I think they could do that in a really small area. They don't need to take up all that room. So if you're going to be doing photos that might be stock photos or something like that, facts on top might be a good reason to actually pack it with some information that's useful because users totally caught on to stock photos. So they did a research study in January at the Pointer Institute, it's a news organization, and they basically were showing people photos. They would just have them look anywhere from like 100 to 300 photos and could they identify what was user-generated and could they identify what was professional? And they totally could do that. And they actually nailed that one very well. They could say, this is professional, this is not professional. Users know that difference. They also were able to say that what they really liked the most about photos were photos that showed them something that they don't normally get to see. Real images are really appreciated. So this is one of Live United and it doesn't mean that real images aren't a little bit staged because I'm sure they all weren't wearing the same t-shirt, right? Like all the kids got this t-shirt that day and they took the picture with the coach and that sort of thing. There's probably some thought around this. So I always tell people like, don't leave the trash can in the shot. Like move the trash can. This isn't hard journalism, right? But you don't want to have that stock photo feel because users have caught on and they're just like, whatever. And I see this opportunity sometimes. So this is great bakery in Durham. Daisy Cakes. Delicious. And this is the About page. I am dying right here for a picture of like a baker in the back, you know, who's like sweating over donuts or having a flour fight with somebody or even just somebody I might see when I walk in. So there's really opportunities there to show behind the scenes of what's happening in a person's business. Y'all were talking about 3D printing. I don't know much about 3D printing. I'd love to see an interesting picture of like what do you do with a 3D printer? I mean, I don't know. So opportunities there. So hero images. If you're a homepage user's one, it has to be good. It needs to be really good. So you need to be careful when you're picking themes because sometimes I've seen people pick themes and then they don't really have the resources or the skill to get the right pictures in there and then it gets really wacky. Like this is Penn State, right? Penn State, they're trying to answer why Penn State and instead of like telling you why Penn State, I kind of get this picture of this confused person and it's a pretty mediocre thing and I can tell you exactly what happened here because I've worked at a university. I know how this thing just goes. The Penn State undergraduate admissions people did not pick what kind of website template they had. They were like giving it. They were like giving it to them. Like here's your website template. Figure out a picture that's huge. It's going to look awesome on your front page. And they were like, oh no. We don't have a photographer. We don't have anything for this. And I bump into this a lot in carousels. This is a school in Durham. I'm like, you didn't even try. Like this is just the sky. You know, like what? I mean, there's a lot of issues with overlays too in carousels because it does not over somebody's face or something important. And it takes a while to find the right pictures for a website. I know because I've managed websites and I can spend days trying to find the right photo because it has to look really nice. We need it to be tack sharp. We need it to fit the space. It takes a while. This is a hero photo. So this is for cat scarf. If you want to buy your cat a scarf, it's about $59 to $79. It'll be artisan, handmade in Brooklyn and sent to you. And I think this is a great hero photo because you can see the scarf right here. You have a beautiful cat. And my probably biggest issue is like, I don't like the wording on it. I'm like, get the wording off the cat and put it over here or make it so it's easier to read. But that's a hero image. That's a good shot. I wish you could see it on my screen. It looks nicer than projected up there. This is a great action shot. You've got things blurred out. It's an interesting action shot going on from an angle I would never see personally. Here's another example of it used well. Here's the Komen Foundation. They did a really good job here, right? They figured out where to put the words into the picture where you still get to see these women celebrating. They've actually done some blurring behind it so the words are popping out. I'm seeing a trend a lot now where people will put words on top of a picture and you can't really read the words. It's really problematic. I think that's something that's important to test. I think that's a really good point. It's not easy. This stuff actually takes a lot of time to get right. Does anybody remember this quote? What is he talking about? This Supreme Court Justice. Pornography, right? I know it when I see it. This is the answer I get sometimes when I have new photography students or people who are kind of new picking pictures for a website, they'll be like, I know great photography when I see it. They'll be like, you don't. It's something you learn. It's not pornography. It's got very clear rules for what's a good picture and what's not a good picture. If you're making decisions about photos on websites and you've never taken any photography, learn some photography. It doesn't actually take that long to learn to get enough skill to be able to photo at it better. You can take a local class with a live teacher which is always the ideal thing to do. But also lynda.com, Ben Long, is awesome. He wrote a book, too, so if you prefer reading in book form, but he's great and you literally, lynda.com, the way it's broken up the videos, you can just go to exactly the ones you want. Composition, lighting. You would be making better choices already and that would probably be about 12 minutes of your time. So I think it'll also raise your video standards as well which is really nice. So we're going to take a quick detour now because this is the issue I see on websites that I think we want to avoid, and I knew to making websites. They're never going to do this. We do not want to send eyes away, right? Here we have an example. Okay, we've got words over the kid's head. Not so great. This guy's looking off the screen. He's actually looking at, like, my doc, saying, hey Melissa, go to Microsoft Word. Don't even stay on my website. Go and look and see what else you need to do. So this wasn't up very long, so I think somebody at Whole Foods was like, wait a minute, change this picture, and I'm guessing that they want you to either play the video or actually go to this area because this is all connected. This is weekly address, but instead he's kind of looking over here at the search box. And right, you can choose this image. It's a video, but you get to choose your JPEG that's the front image, whether it's a YouTube or a Vittimia or whatever you want. So he's kind of looking over there. And you may be thinking right now, Melissa, you're kind of picky, you know? What are you thinking? Actually, that makes me want to click on it and realize that it's in the middle of something, so I want to find out what it is because he's looking in the wrong direction. That makes you want to? So it works for me. Well, that's good. So maybe it works for... That's a good example of... Well, idiocy, every user's a little bit different. But I can tell you that what we know from some research or some heat maps is we have an idea of where users focus. So this is actually not a website. This is an ad that was put on a screen so they could do some heat mapping with it. And you can see that, oh my gosh, it's on websites and on screens. So here everybody's looking at the baby's face. If you ever had the choice to put up a face or a building, always put up the face, right? We know that faces attract eyes. So here they're spending 20 seconds looking at the baby, not so much on the words. If the baby looks at the words, now there's about 10 seconds spent on the baby and 10 seconds spent on the words. So what you want to do is you want to make sure that the people in your pointing towards where you want them to go, the buy now button or the call to action, whatever it is you have, you want to do that. And if you're on LinkedIn, and I hope you're on LinkedIn, it's a good place to be, you want to check and make sure your profile picture doesn't show you like looking off over this way, but that it's actually looking towards this great information about your skills and that sort of thing. So this is minor stuff, but you're guiding eyes. Again, you're helping your users. So we're going to talk about carousels or sliders for a minute. Just so I'm sure we're all on the same page, although I'm afraid I'm going to lose my place. Well, that's okay. We'll just deal with that later. I'm going to just record, make sure we all know what I'm talking about when I talk about carousels and sliders. Let's see if that'll go. Come on, quick time player. Where are you? Don't know where it is. Oh, you're good. It's up there, but it's not up here. That's so funny. Okay. So is it playing? How funny. It's not moving though. Interesting. It's moving on my screen. We've got these little things at the bottom and it's sliding through. And we call them carousels. We call them sliders. Now I've messed myself up here. Well, I'm stuck. I can't really get anywhere here. That's okay. I'm going to talk about them anyway. So we know that people ignore them or are annoyed by them. We know this. This is a fact. This comes up in every usability test I've ever done. It comes up regularly. I mean, I was doing one for a yoga website a few weeks ago and someone goes, this is a beautiful picture and it just went away. I'm like, yeah, that's exactly what happens. I was looking at this beautiful picture and then it went away. Yeah. Well, actually you can send your clients to a website called should I use the carousel.com. Which is terrific. And it actually has research on carousels in a carousel. It's hilarious because you can't get through it. Yeah. It's one of those things that, you know, I was just reading like chief content officer magazine which is magazine for CMOs basically that was recommending carousels. And I was like, dude, this is 2015. Like, we learned that carousels were a problem in 2012. But the thing is, is people like them. Okay, let me tell you a story. So in 2009 I was working at Duke University, right? And I was working in a big department that had a lot of people who wanted to be on the homepage. And so the web designers were like, Melissa, we have this great new template for you and it's got a carousel. And I was like, this is awesome because you can be on the homepage. And you can be on the homepage. And we're all going to be on the homepage. And we'll just rotate through. And it totally solved my problem of prioritizing things for my website because everything could be on the homepage. Right in the front. And nobody could complain to me anymore. But the problem was, I can remember even a user in 2009 being like, it's annoying the way it moves. And then, so more and more people were doing research on it in 2011, 2012, and it's problematic for a number of reasons. But I think the most important reason, the most compelling reason not to use them is that if users are ignoring them anyway, I mean literally ignoring them like the task the researcher will give somebody he's testing will be like, can you find the washing machine on sale? And they'll be like, I couldn't find it. They'll like fail the task. And it will have been like the big banner image on the homepage that was taking up four inches of the real estate. I think appropriate use for a carousel would be like, I'm a photographer and I have a controlled carousel or I'm an interior designer and I'm showing different things in like a gallery format. You could see a carousel used in that way but not auto-rotating. So we want to give the user control. So if you've got a carousel on your website right now the first thing you do is stop it. Like stop. Just have it stop so it doesn't do that whip away thing because often times people are looking elsewhere on the page they might pop back up to the carousel and that's when it goes. And then you're like, oh you mean it's kind of moving a little bit? Parallax scrolling where things are going in different. I haven't seen research on that but it kind of sounds similar in that it's not in control of the user and I imagine that somebody might start looking at it and that's when it fades away. So anytime when people don't have control user experience is very much like putting choices in the hands of the users and making it clear for them and empathizing with them and you don't know at what time they're going to start paying attention to that or not or if they're like how do I get back to that slide that transitioned away, that sort of thing. You know it's funny I was actually in a book group recently and we asked Steve Krug whose book I'm going to recommend in a minute about that and if it matters and he had not run into any problems with a new page a new picture happening upon page refresh I have my doubts honestly I have my doubts about where somebody might think they are I just think the way to go is to find an awesome image that just embodies what you're trying to get across and what your users want to hear and that will take time or it could be an infographic it could be a great fact it could be a great quote with somebody's face next to it I think there's other ways to do it that I think are more user friendly Yes you had a question sir I've seen it done a lot of different ways right sometimes there's arrows on the image sometimes they disappear because they don't want to interfere with the image there's a lot of issues because you don't want somebody looking at an arrow instead of what they need to be looking at but fine depends on the hover there's a lot of different ways but I haven't seen any research that's like this is the best way to do it I think it's a good question Yeah the dot thing in general doesn't seem to be very helpful at the bottom I have seen some ones like that that are good Anybody else have any comments or questions? Yeah because you could just have kind of different sized pictures and then you click on it and that's the one that kind of pops up to look they are all about carousels I totally agree with you because they feel like they You have to realize that nobody's following that story though like nobody's even seeing the beginning of the story everybody's like I'm avoiding that story because they probably didn't guess what I came to the website for Yeah I agree Yeah I mean there's not good stats on this What about the statistics or visibility for the long page? Research has shown that people will scroll down people will scroll down when it's written for the web and when there's also an indication that there's something below the fold because I've certainly, and this is our last thing in this session, I've certainly seen websites that I come to and it has such a nice big image and I didn't even realize there was content below and I've done usability testing where like they didn't even scroll down so you can't make this assumption that people know they're going to scroll so you need to make sure that if there's content below that it's coming up into for a smaller screen they would recognize and it's not an arrow that says hey point down there make it more obvious than that so we're at the end here I need to wrap it up we got through all my slides really we were just like hey here's how to reach me and that sort of thing I will be at the Happiness Bar later today you can reach me at melissaeg.com is my website please talk to me about UX and thank you for showing up today and listening this is interesting