In this blog post, I would like to simplify and share the knowledge that I got from The Basics of User Experience Design By INTERACTION DESIGN FOUNDATION. This is a free ebook that you can download from here. This book explains and introduces the basic guidelines in designing a UX as well as interaction design.
I make this kind of key takeaway post because I would like to accommodate to those who struggle to read (like me!) but still want to get the knowledge from books.
So, without further ado, let’s jump into it!
Chapter 1 : A Brief Introduction to User Experience (UX) Design
User experience design is about designing the ideal experience of using a service or product.
You can add all the features and functionality that you like to a site or application, but the success of the project rides on a single factor: how the users feel about it.
As a UX Designer, we should have these questions in our mind : “Does the site or application give the user value?” , “Does the user find the site or application simple to use and navigate?”, and “Does the user actually enjoy using the site or the application?”
The definition of UX (User experience) is how people feel when they use a product or service
The definition of UX Designer is someone who investigates and analyzes how users feel about the products he or she offers them. (please note that UX Designer and Interaction designers are different. Which I will explain later)
Chapter 2 : What is Design Thinking and Why Is It So Popular?
Definition of design thinking : an iterative process in which we seek to understand the user, challenge assumptions, and redefine problems in an attempt to identify alternative strategies and solutions that might not be instantly apparent with our initial level of understanding
Five main design thinking processes (these are not mentioned in order) are : Emphatize, define, ideate, prototype, and test. Sometimes, or usually, designers will repeat some processes.
The challenge of design thinking : Ingrained Patterns of Thinking. We human, tend to have a way of thinking something repetitive and access common knowledge. The challenge is to not doing this ingrained patterns of thinking and understanding what we don’t. This is what’s commonly called “think outside of the box”
But think outside of the box is not necessarily the correct representation of design thinking. Design thinking also about think in the corner, the edge, on its flap, and under the barcode.
Mainly, design thinking is used for problem solving.
Design thinking seeks to generate a holistic and empathic understanding of the problems that people face.
Chapter 3 : The 7 Factors that Influence User Experience
Usually , UX is confused with usability. UX has grown to accommodate much more than usability, and paying attention to all facets of UX in order to deliver successful products to market is vital.
The 7 factors that influence user experience are : Useful, Usable, Findable, Credible, Desirable, Accessible, and Valuable.
Useful : It’s worth noting that ‘useful’ is in the eye of the beholder, and things can be deemed ‘useful’ if they deliver non-practical benefits such as fun or aesthetic appeal. For example, a game can be useful to the user even though it doesn’t seem to give any meaningful usage.
Usable : enabling users to achieve their end objective with a product effectively and efficiently. For example, a game controller that is too difficult and complicated to use for people with generally 2 hands are not usable.
Credible : the ability of the user to trust in the product that you’ve provided—not just that it does the job it is supposed to do, but also that it will last for a reasonable amount of time and that the information provided with it is accurate and fit-for-purpose. The example of credible : it is hard for customer to use your product if user thinks the creator of the product is a scammer. So if you want to build a landing page that has good UX, picture your company as a credible and trustworthy company.
Desirable : it is conveyed in design through branding, image, identity, aesthetics, and emotional design. Example of desirable : Ferrari and Toyota both make cars that move. But if you asked people if they were to be given free latest model of Ferrari or Toyota car, most people would answer Ferrari. This is because Ferrari has this brand image that says “look at me!” and it makes the user of this product proud.
Accessible : providing an experience which can be accessed by users with a full range of abilities—this includes those who are disabled in hearing, vision, motion, or learning impaired. Example of accessible : a website for ebook that also lets user with hearing disability to hear what the contents are.
Valuable : It must deliver value to the business which creates it and to the user who buys or uses it. For example : user would enjoy a product that costs $10 and fixes $100 problem rather than a product that costs $100 but only fixes $10 problem.
Products that fulfills these 7 factors, which are usable, useful, findable, accessible, credible, valuable, and desirable are much more likely to succeed in the market.
Chapter 4 : An Introduction to Usability
The ISO 9421-11 standard on usability describes it as: “The extent to which a product can be used by specified users to achieve specific goals, with effectiveness, efficiency and satisfaction in a specified context of use.”
Usability is important because : if user do not find the product usable they are likely to seek an alternative solution to reach their goals (a.k.a : your competitor)
5 characteristics of usable products are : Effectiveness, Efficiency , Engagement, Error Tolerance, and Ease of Learning.
Effectiveness : whether users can complete their goals as accurate as possible. Example of effectiveness : a credit card number field only allows 16 digit numbers to prevent user from entering invalid characters such as letters and symbols.
Use clear and simple language in your product. To check your copy, try Hemingwayapp.com ! The perfect goal is to reach Grade 6 readability score.
Efficiency : How fast can the user get the job done? Example of efficiency : The number it takes to sign up to a website is only 3 steps (enter email, create password, and click SIGN UP) means it is efficient!
Engagement : Proper layouts, readable typography and ease of navigation all come together to deliver the right interaction for the user and make it engaging. Example of good engagement : a website with nice animation and graphic that makes user understand clearly what the product is for and want to know more about it.
Error Tolerance : offering the opportunity to ‘redo’ an action. For example : when you delete a Google mail, there is a snackbar that has the UNDO option. This makes your product more humane as it tolerance mistakes.
Ease of learning : If you want a product to be used regularly, then you want users to be able to learn their way around that product easily. For example, Facebook wanted to roll out new UI for the entire platform, so Facebook teaches user how to go about with coachmark that is simple and easy to understand.
Chapter 5 : How to Conduct User Interviews
Some down side of user interviews : Firstly, interviews tend to give insights into what people say they will do, and this is sometimes not the same as what they actually do. Second, human beings have memory issues and can often not recall details as clearly as they would like, so we tend to try and create these details. And third, we shouldn’t try and get them to suggest improvements because users are not designers.
It is ideal to have 2 UX researchers and 1 user in the interview. One UX researcher to ask the question and converse with user and the other one to take notes. If you can’t get 2 UX researchers into this, you can get a camera to record the interview.
Typical topics in user interview : user’s background, the use of technology in general, the use of the product, the user’s main objectives and motivations, and the user’s pain points.
To prepare, you have to ensure that you recruit a representative sample of users for your interviews.
Some scripts tips : explain the purpose of the interview , explain how the person’s data will be used, keep questions simple and short, reduce the number of leading question.
When scheduling your interviews, leave 30 minutes or so between each interview.
How to conduct interview : make your interviewee comfortable, keep the interview on time and heading in the right direction, focus on the interviewee (not on making notes), and don’t forget to thank the interviewees.
To report on the user interview, Word clouds (graphical representations of word frequency) and mind maps are good ways to do so.
Chapter 6 : 7 Great, Tried and Tested UX Research Techniques
Card Sorting : write synonym words in each card and ask your users to sort them by priority. It’s a very easy technique for users and for clients to understand.
Expert Review : asking an expert to give feedback on the product.
Eye Movement Tracking : use an eye movement tracking tool and software to see where users are looking from time to time. The cheapest tool for this is the webcam (but lower accuracy).
Field Studies : going out and observing users ‘in the wild’ so that we can measure behavior in the context where users actually use a product.
Usability Testing : observation of users trying to carry out tasks with a product. Give users a task and observe how they accomplish that task with your product.
Remote Usability Testing : same as usability testing but done remotely.
User Personas : a fictional representation of the ideal user. Create user personas from other forms of user research (example : user interview)
Chapter 7 : What is Interaction Design?
Interaction design is part of UX. It is the design of the interaction between users and products.
The interaction between a user and a product often involves elements such as aesthetics, motion, sound, space, etc.
Difference between UX design and interaction design : UX design is about shaping the experience of using a product that involves user research, creating user personas, etc. While interaction design focuses on the interaction between user and the product.
The 5 Dimensions of Interaction Design are : words, visual representation, Physical Objects or Space, Time and Behaviour.
Words : communicate information to users, but not too much that they end up overwhelming users.
visual representation : use of image, typography, icons, colors, etc. As an extremely visual-oriented species, humans value images immensely.
Physical Objects or Space : this is about what object user surround themselves with and what kind of space they are at when using your product ? Example : a user use Facebook usually in the train that has a lot of people around them.
Time : in this context, it is about media that changes with time. For example, sound, animation, and video.
Behavior : User’s reaction and behaviour while using the product.
Chapter 8 : Mobile Web UX Design: Some Simple Guidelines
Space and occasion should be foremost in your mind when designing for mobile.
You want to focus on a ‘mobile first’ approach, which means designing for the smallest mobile platforms and increase complexity from there.
Define content rules and design adaption rules that enable you to display things well on each group of devices.
Adhere as closely to web standards as possible when implementing flexible layouts.
Prioritize navigation based on the way users work with functionality—the most popular go at the top
Minimize the levels of navigation involved
Remember to offer a 30x30 pixel space for touch screen tap points
Ensure that links are visually clear and make it clear when they have been activated.
Make it easy to swap between the mobile and full site
Don’t overwhelm your users with too much content as the screen size is small.
Reduce the inputs required from users
Keep scrolling to a minimum and only allowing scrolling in one direction
Remember that mobile connections aren't stable
Remember to maintain continuity. If they log into your webstore on mobile, they should be able to track orders and make purchases just like they would on the desktop.
The visual has to be consistent on both platforms or else you will lose trust from your mobile users.
Chapter 9 : Information Visualization – A Brief Introduction
There are 3 common uses of information visualisation : presentation, exploration, and confirmation.
Presentation : it is to persuade. Example : a map is a visualised information that tells user where a place is at. It’s use is to just present an information.
Exploration : to let users explore themselves of the data. For example : a colored map to show the distribution of COVID-19 cases in Malaysia. This way, user may explore the possibility that the geographical aspect may link with the number of infected people.
Confirmation : this is to let user know and to confirm whether some action/implementation has any effect. Example : Every weekend, the company gets the more sales.
So that is all the key takeaways from this book, all 72 of them.
See you in my next post!