Transcript for:
Understanding User Experience Design Principles

[Music] in the field of user experience design one of the most important terms is user a user is any person who uses a product in addition the end user is the specific audience a ux designer creates something for our goal as ux designers is to think about problems and needs from the end user's perspective and design an experience to meet those needs think of it like this an animated movie about talking cars is designed with kids ages five to seven in mind those kids are the movies and users but adults and teenagers will be in the audience too so they're also users user experience is how a person the user feels about interacting with or experiencing a product do you think everyone in the theater experiences the movie the same way not likely but if the end users five to seven year old kids stay focused laugh a lot and cheer at the end it's safe to say it was a good user experience on the flip side if those kids don't want to watch the movie again they probably had a bad user experience when it comes to evaluating user experience there are a few key questions to examine is the product easy to use is the product equitable does the product delight the user does the product solve the user's problem answering yes to these questions are all goals of a good user experience as we previously learned and these are questions ux designers are constantly asking themselves to create great user experiences as a ux designer you will focus on the end user acting as the user's advocate and balancing business needs your team members might prioritize other goals for a product like sales or marketing and some stakeholders might forget the fact that they are not the end user that's why you as a ux designer need to keep the end user as your main priority for example imagine you're developing a children's toy your sales and marketing teammates might try to encourage parents to buy the toy but ultimately you need to design the toy to appeal to the child who is your end user okay now that you know the meanings of key terms like user end user and user experience so it's time to move on to frameworks [Music] why is it important that designs are centered on the user because the user buys and uses your product in addition it's also important to solve problems that people actually experience rather than only trying to solve problems you personally experience focusing on real user problems reduces the impact of designer bias larry page one of google's founders highlighted just how important user centered design is when he said there is no substitute for personally watching and listening to real people at google we take this to heart larry's statement has morphed into one of google's core values today focus on the user and all else will follow user center design puts the user front and center focusing on the user means considering their story emotions and the insights you've gathered about them to keep our focus on the user the user center design process has four steps understand specify design and evaluate following this framework helps us build products people actually want to use first understand how the user experiences the product or similar products really understanding the end user requires a lot of research and we'll talk more about this later next specify the end user's needs based on your research you'll narrow down which end user problem is the most important to solve then design solutions to the end user's problem this is where you'll come up with ideas for what the product might look like and actually start building the product and finally evaluate your design against your end users needs does your design solve the end user's problem you'll find out here and you'll also do it by testing your product with real people it's important to keep in mind that as you go through this process iteration is key iteration means doing something again by building on previous versions and making tweaks let's think about an example of user-centered design in the real world five years ago we launched google photos as a place to store photos and keep them organized over time we noticed that users also want to revisit memories and relive treasured moments to make it easier for users to do this we use the user center design process to redesign google photos now users can easily search to find their memories so now you understand the importance of user-centered design and why designers always keep the user front and center [Music] a framework creates the basic structure that focuses and supports the problem you're trying to solve you can think of frameworks like outlines for a project there are many ux design frameworks and over time these evolve or become obsolete thanks to the fast changing world of technology we've already discussed the user center design process now let's check out two other frameworks you might use the five elements framework and the design thinking framework the five elements of ux design is a framework of steps a designer takes to turn an idea into a working product this framework consists of wait for it five elements strategy scope structure skeleton and surface each element refers to a specific layer involved in creating the user experience and each layer is dependent on the one below it the bottom layer is strategy this is where you'll define the user's needs and business objectives the next layer is scope this is where you'll determine what you're building you'll decide on features and content to be included in the product the third layer is structure you'll figure out how to organize your design and how the user will interact with it the next layer is the skeleton which you can think of as the layout similar to how the layout of our bones shape our skin this layer helps detail how the design works but just like our bones the user won't see these inner workings instead you'll see the surface which is the top level of the user experience the surface is how the product looks to the user so to recap we have strategy scope structure skeleton and surface together these layers make up the five elements framework a second common framework is design thinking design thinking is a way to create solutions that address a real user's problem and are functional and affordable design thinking has five actionable steps empathize define ideate prototype and test the first step is empathize which is about discovering what end users really need and learning how to think and feel like them you might conduct surveys interviews or observation sessions to pin a clear picture of who your end users are and the challenges they face the next step is to define the problem by creating a clear problem statement the problem statement is a clear description of the user's need that should be addressed the problem statement should be based on user research and it focuses the team on a clear goal we'll talk about problem statements in more detail later once we've defined the problem we can start to ideate or brainstorm solutions you should aim to come up with as many ideas as possible by focusing on the quantity of the ideas not the quality you're more likely to come up with innovative solutions eventually we need to narrow down to a few ideas that we can prototype a prototype is a scaled down version of a product that shows important functions you should have a clear goal for your prototype in mind and finally we test the prototypes with users testing keeps the user front and center as it gives users an opportunity to provide feedback before the product is built based on user feedback you can make changes and improvements or come up with a completely new idea okay now you know three of the most used frameworks in ux design the user center design process the five elements framework in the design thinking framework adapting any of these frameworks to suit your specific design needs is really important depending on what company team or project you work on you won't use the same framework every time coming up my colleague shabi will talk about inclusive design enjoy hey there i'm shavi an interaction designer here at google my role focuses on scaling accessibility across google's design systems after high school i wasn't really sure what kind of career would be a good fit for me i was interested in technology but i didn't have any technical knowledge so i was afraid i wouldn't do well in the field but eventually i realized what a huge impact advances in tech had on society and my life i wanted to harness this power to positively affect the lives of people around me especially those who tend to be marginalized or forgotten as an intern in ux design i worked on products for people with chronic pain i realized how important and impactful it is to consider the needs of people with disabilities and how much i wanted to create products to help them so i continued researching and empathizing with those who are disabled to understand how i could uplift them with my work it's a passion i'm looking forward to sharing with you during this program so far you've learned about user-centered design which concentrates on meeting users needs as we mentioned before there are many ux design frameworks and those frameworks change over time in this video we'll talk about three more ways to put the user first in your designs universal design inclusive design and equity focused design let's start from the beginning when designers began considering how to include an even broader range of people in their designs they called it universal design universal design is the process of creating one product for users with the widest range of abilities and in the widest range of situations think of it like a one-size-fits-all approach designers propose one solution for everyone the problem is that when you focus on creating one solution for everyone the designs lose their effectiveness it's often difficult to achieve any goals with your product when you have so many intended users it's like when you go to a store that sells a hat in just one size the label might read one size fits all but the hat still won't fit a lot of people universal design had the same problem even though it had the intention of being inclusive it excluded a lot of people it turns out one size fits all isn't a great solution as ux designers realized that universal design didn't meet the needs of every user the approach to including people began to change designers started thinking about the concept of inclusive design which focuses on finding solutions to meet different needs inclusive design means making design choices that take into account personal identifiers like ability race economic status language age and gender inclusive design includes researchers and designers from traditionally excluded populations in the process so they can provide their unique perspectives during all phases of the design process if universal design is a one-size-fits-all solution then inclusive design can be described as solve for one extend to many with inclusive design you solve for one type of user and the benefit of that solution can extend to many other types of users our goal as designers is to build experiences that are accessible to users with the widest range of abilities in other words no one should be excluded from using a product that we built because we didn't consider their needs when building it in inclusive design there's no such thing as normal there's no average person or target audience that we should design for for example when designing we focus on the needs of people who are blind and deaf even more than we consider the needs of those who rely on their sight and hearing to communicate then as we build more versions of a product we design for additional excluded groups like those with physical or cognitive disabilities designing products devices services or environments for people with disabilities is called accessibility accessibility is just one aspect of inclusive design and we'll explore accessibility in more detail later but keep in mind that the idea of solve for one extend to many only benefits the group the design was created for and existing users many groups are still left out over time ux designers realized that inclusive design wasn't always enough and that's where we find ourselves today as equity-focused design becomes a new industry goal equity-focused design takes the idea of inclusive design one step further it asks designers to focus on designing for groups that have been historically under-represented or ignored when building products the goal of equity focused design is to uplift groups that have been excluded historically in order to design with equity as a goal we first need to know the difference between equality and equity the two words sound similar but they're actually two different concepts equality means providing the same amount of opportunity and support to all segments of society in other words everyone gets the same thing equity means providing different levels of opportunity and support for each person in order to achieve fair outcomes to better understand the difference between equality and equity check out this illustration the illustration on the left represents equality because every person gets the same box to stand on but because each person is a different height the tallest person has a better view the illustration on the right represents equity because each person is given what they need to view the game the shortest person is given the tallest stack of boxes to stand on the tallest person doesn't get a box because they don't need one in order to view the game so let's explore how this relates to design equity focused design is a newer concept in ux and one that we often discuss at google instead of building products for groups of people who are currently being excluded which is the goal of inclusive design equity focused design seeks to build products that meet the needs of specific individuals in groups who have been excluded in the past so what does this look like in the real world start by identifying a product you want to build then think about the groups that have not been served by this type of product in the past finally build your design while keeping the groups you identified as underrepresented front and center it's important to keep in mind that equity focused design doesn't solve all problems just like inclusive design and universal design don't either the key point is that these are all different approaches to solving issues of underrepresentation and designing for a more equitable future these issues are massive but vitally important often schools and companies consider accessibility inclusive design and equity focused design as methods to consider during the design process but not as a requirement but i'm a firm believer that every designer should know the basics of accessibility and why creating products for those who are underrepresented and excluded is a must as you continue through your career you'll gain more practice and understanding on how to implement these ideas we'll get to some more applications of this soon [Music] user experience doesn't just focus on the experience of existing users it also pays special attention to people who are about to become internet users these are the people around the world getting online for the very first time did you know that globally there are a billion people right now just starting to use the internet we call these folks the next billion users or nbu in this video we'll explain why understanding the next billion users is crucial as a ux designer and how to get into the mindset of people who are new to the internet to start let's break down the big issues facing our next billion users and what these issues mean for us as designers the first big issue is cost people might not be able to afford expensive phones with big screens and lots of storage the next issue is connectivity users might not have constant or unlimited access to the internet digital literacy is also a crucial issue people might not be familiar with certain design patterns calls to action or icons that we take for granted for example they might not know what swipe means in relation to a touch screen they may not even know what a touchscreen is this can affect their confidence and willingness to explore new technology and the final issue to keep in mind is literacy in general some users aren't able to read others might need to switch languages depending on what they're trying to do alright let's check out each of these four challenges more closely we'll start with cost for example people with fewer resources tend to buy less expensive devices with low ram and limited storage when a phone has low ram it means that the phone might load web pages more slowly and people might have problems trying to download files to solve this problem a company is not likely to lower its standard price instead it's up to us ux designers with a lot of help from engineers to figure out how to improve storage without raising the price point the ability to temporarily disable apps is one way ux designers and engineers can make this happen let's discuss connectivity a lot of our next billion users don't have continuous access to the internet this might be because the data they purchase has run out or because their network coverage is inconsistent or sporadic ux designers should try to find ways to make the offline experience as rich as the online experience for example giving users the ability to load video offline and making sure that feature and experience is well designed moving on to digital literacy it's important to mention that your users might not know how to use a phone download an app or set up an account without clear guidance they might only use the part of the app that they're already familiar with or worse they might stop using the app altogether when designing for our next billion users keep it simple consider things like video tutorials to help new users understand how to install and to use an app and explore new features with greater confidence finally there's the issue of literacy in general some users aren't able to read or type and others might want to switch languages on their device depending on what they're trying to accomplish for example a user might want to read in hindi but type using the english keyboard designing a multilingual keyboard option and using universally understood icons like an icon with a currency sign for a banking app are just a few key ways ux designers can make it easier for the next billion users beyond these four common challenges there is a lot more you need to consider when designing for the next billion users for example if you live in the united states canada or western europe you might have certain design biases like leaving white space to make a document look less crowded or designing for left-to-right languages alright now you have an understanding of the issues that the next billion users face our goal is to make every user feel like we designed the experience just for them no matter who they are where they live how much they earn or how highly they're educated gaining a comprehensive understanding of your users context is an important place to start and you're already on your way what are the advantages of using design tools first tools allow designers to prototype ideas and iterate on them second tools make it easier for designers to test their prototypes and third design tools make it possible for multiple teams to work on the same product ux designers use tools to create wireframes prototypes and more engineers use tools to make adjustments to the product before launch other teams like marketing use these tools to get a sneak peek at your new feature so they can create supporting content think of tools as a way to make designing easier and more collaborative the two tools you'll use in this program are figma and adobe xd as a learner you'll have free access to both tools the ux design industry evolves at a rapid pace the tools ux designers use are constantly changing so you'll learn new tools throughout your career in addition if you work at an agency or as a freelancer you'll need to adapt the tools you use based on client requirements the good news is most design tools have similar features once you know one design tool it's pretty easy to pick up a new tool keep in mind tools are simply there to support your work it's most important that you learn how to think like a designer we'll go into more details about how to use tools like figma in adobe xd later soon enough you'll be bringing your ideas to life [Music] a platform is the medium that users experience your product on such as desktop mobile web mobile apps tablets wearables tvs smart displays and more it's important to design with multiple platforms in mind because users want a product to look and feel similar no matter what platform they're using in the past ux designers could have focused on creating a website only for a desktop computer but today users might look at that same website on multiple platforms like their mobile phone smartwatch and tv ux designers now have to plan for a nearly infinite number of different devices and screen sizes even though ux designers need to think across platforms it's important to focus on one platform first when you build a new product the platform you select should be the one that best meets your end users needs later you can design for additional platforms in addition to having a consistent user experience across platforms it's also important to have a consistent brand identity in this case the brand identity refers to the visual appearance and voice of a company for example google search should look and feel the same on your desktop computer and mobile phone it's important to keep in mind that some functionalities only exist within certain platforms think about a voice assistant which allows you to ask questions or control your phone with your voice pretty clever right at first only mobile phones had voice assistance so if the product you were designing required the use of a voice assistant the only platform it would have worked on was a mobile phone but fast forward to the present and voice assistance are integrated into many other platforms like desktop computers tvs and even refrigerators today there are more platforms than ever which gives us even more opportunities to design features for our users it's definitely an exciting time to become a ux designer there's a big difference in the amount of time users spend on mobile phones compared to desktop computers an average mobile session is 72 seconds while the average desktop session is 150 seconds more than twice as long why is this important because it tells us that people use different devices in different ways mobile users tend to be goal-oriented and they're focused on completing a single task on mobile phones gestures like tapping and swiping help users move around the screen test this out for yourself next time you're using a mobile phone think about your own behaviors and remember the next billion users we discussed earlier as those users come online they're mostly accessing the internet from mobile devices this means the amount of desktop web traffic compared to mobile web traffic will continue to shift it's important for ux designers to consider mobile users connectivity limitations like slower processing speeds and longer load times to be inclusive we need to design for all types of phones whether they cost 50 or five hundred okay so users interact with devices in different ways now let's go through the design differences we need to consider based on the devices we're designing for first let's talk about responsiveness in the past most mobile websites were a mini version of the desktop site which often made the mobile websites difficult to use now almost all websites use responsive web design responsive web design allows a website to change automatically depending on the size of the device for example a website home page might have multiple columns when a user experiences it on a desktop computer with responsive web design when a user visits the same website on a mobile phone the multiple columns are automatically condensed into one column to better fit the smaller screen all the content is still there and the usability is way better internet browsing on desktop computers has been around for longer than on mobile devices but since mobile device usage has been booming designers have had to start focusing on designing for mobile so let's think about a few best practices when designing for mobile user experiences first call to action buttons should be placed front and center allowing the user to easily complete the desired task like joining an email list or adding an item to their shopping cart second navigation menus should be short and simple we want to simplify the user experience on mobile so menu options should only highlight the core functions of the product third use gestures that users already do like tapping and swiping gestures should be intuitive and familiar to users fourth designed for both directions a phone might be held we need to consider the vertical portrait view of a mobile phone and the horizontal landscape view we want users to have an effective experience no matter how they hold their phone and fifth reduce visual clutter mobile phones have smaller screen sizes so it's important to keep the visual experience simple that was a lot of new information to take in remember this main takeaway users behave differently depending on their device ux designers help make that transition happen as seamlessly as possible it's a big responsibility but a lot of fun too up next shavi will be back to talk to you about designing responsively to meet users needs the term assistive technology or at for short is used to describe any products equipment and systems that enhance learning working and daily living for people with disabilities in this video we'll examine several kinds of assistive technologies including color modification voice control screen readers and alternative text then we'll explore a few design considerations to keep in mind when designing for accessibility let's get started first it's important to call out that there are lots of people who don't identify as having a disability but still use assistive technologies that's because ats make our lives easier and help provide a better user experience when we think of assistive technology we might think of computers tablets and smartphones but at covers a wide range of devices like prosthetics pointing devices electric wheelchairs power lifts eye gaze and head trackers and a whole lot more at can also encompass something as low-tech as a pencil holder not only does a pencil holder keep your pencil from rolling away it also makes pencils easier to grip which can be essential for people with certain motor disabilities understanding how people with disabilities use your product is a critical part of the ux design process first up let's examine color modification color modification like high contrast mode or dark mode on a device increases the contrast of colors on a screen black text on a white background or white text on a dark background are both examples of high contrast high contrast makes the interface easier to see for people with low vision color modification also helps anyone who might experience eye strain when viewing screens in the dark or midday when the sun is creating an intense glare lots of people use it just because it's easier on the eyes next let's go through voice control and switch devices both of these help people with limited dexterity and can serve as an alternative to a keyboard or mouse voice control allows users to navigate and interact with the buttons and screens on their devices using only their voice lots of devices have settings with this feature a switch is an assistive technology device that replaces the need to use a computer keyboard or mouse switch devices can allow users to control technology like a computer or smartphone there are a lot of different kinds of switch devices but they all help people with limited motor ability use technology more easily next up screen readers screen readers are one of the most common assistive technologies for people with limited vision the software works on mobile and web devices and reads out loud any on-screen text screen readers also read any interactive elements like buttons along with non-visible text like the button names and any alternative text for images alternative text or alt text helps translate a visual user interface into a text-based user interface it essentially uses words to describe any meaningful image for someone who isn't able to see the image alt text is also super helpful for those with low bandwidth connections too if your device is unable to maintain a connection to the internet it may struggle to load a big file or image alt text is useful for context when an image fails to load as i said before you don't need to have a disability to benefit from assistive technology speech to text is a great example with speech to text a user composes text by speaking into their phone or computer the voice recording is automatically converted into text a lot of people find it much easier to text by talking to their device because it offers a hands-free experience and reduces the amount of mental energy needed to type let me show you here i am using the speech to text feature on my mobile device pretty cool huh there are tons of design considerations to take into account in order to meet the needs of all users later when we build wireframes we'll go through exactly how to incorporate accessibility into your designs alright that's it for now you've learned the common ux terms and frameworks what user-centered design means the tools that ux designers use and how ux designers work across platforms plus you've gained a deeper understanding of inclusive design in equity focused design you practice thinking like a designer which is a core skill you'll continue to build on throughout this program coming up you'll learn all about design sprints you'll explore the steps in a design sprint how to plan one and your role in a design sprint as an entry-level ux designer enjoy congratulations on finishing this course from the google ux design certificate you can access the full experience including job search help and start to earn your certificate by clicking on the icon or the link in the description below watch the next video in the course by clicking here and subscribe to our channel for more from upcoming google career certificates