UX Design Institute - Professional Diploma Final Exam
3 statistics about mobile apps
- 25% of users will delete an app after first open - 45% of time spent on mobile device occurs in one app - 85% of time spent on mobile occurs in the top 5 used apps (WhatsApp, Facebook, Instagram, Twitter, Messenger)
What are the inputs and outputs of UX?
- Inputs: user testing, interviews, wireframes, journey maps - Outputs: money
How do you justify having a native app? Should you commit to building a native mobile app?
- Volume: Do you have a lot of users? - Frequency: How often do they use the app? - Unique: Does your app need native capabilities a web app won't provide? Like fingerprint login or facial recognition - Cost: Is the cost of building and maintaining worth the benefits?
definition: stakeholder brief
- a brief for the rest of project - 2-3 page summary of notes from interviews
what is an empathy map?
- a chart based on 5 labels about users: says, thinks, feels, does, goals - should include insights like what users want to know, notes about mismatched mental modes, benefits of product, pain points
What are pattern libraries?
- a collection of scenes to explore what others have designed and established conventions - used as a starting point to designing
What are customer value curves?
- a competitive analysis tool showing what really matters to users - PROS: provides strategic direction, identifies competitive gaps and differentiations, help to understand performance of product against competitor
What is a customer journey map?
- a diagram that visualizes what the customer experience is like when interacting w/ product - based on patterns seen by analyzing research - PROS: highly structured output, understandable, sharable, can help to understand users' POV
definition: competitive benchmarking
- a research technique that doesn't need users to be tested --> designers study what top competitors are doing
What is inline validation?
- a technique to tell users how they're doing as they're completing a form - should only occur after users leave a field and only notifies user if there is an error - TAKEAWAYS: can reduce user errors and increase speed/satisfaction, BUT is not easy to implement and requires lots of testing
concept: alignment
- aligned objects are more orderly and are easier to comprehend - benefits: makes interface more perceivable, leads users through an interface, helps prevent errors
concept: how does "rules for rules" benefit users and the production team?
- benefits for users: must be easy to understand, learn, and facilitate the overall flow - benefits for product team: everybody knows how it works, reduces guesswork, allows developers to focus on development instead of design decisions
what are some solutions for label alignment?
- best solution: top aligned labels --> less eye movement and good for mobile - alternative: have labels in fields like placeholders --> saves space, visually appealing, BUT can be difficult to correct errors and placeholders are meant to be clues (not tell you what data to input)
What is an affinity diagram?
- best tool for organizing unstructured data - made by Jiro Kawakita, called the K-J method - conduct research, brainstorm, organizing post-its by group and labels --> now structured data - PROS: collaborative, fast analysis, high quality output, creates a shared understanding, allows for buy-in and a voice for everyone - CONS: does not reduce margin of error
concept: Paradox of Specificity
- by getting more specific about the goals/behaviors/context of target audience, the product will be more likely to be used by wider audience
definition: feedback
- communicates what's happening on software --> confirms an actions, communicates results, and tells you what to do next - every micro-interaction requires feedback to tell users what's happening
definition & example: observational research
- conclusions based on culmination of collected data - ex. Google Analytics for ads
What is open card sorting?
- conduct open card sorting --> put everything on a post-it and have users organize them into groups
definition: heuristic evaluation
- determines whether your software adheres to user experience best practices or not - based on rules of thumb, best practices, and criteria to measure against
example: attitudinal research
- ex. interviews, open-ended survey questions
concept: danger of features
- features involve trade-offs --> each new feature crowds an existing one; adds too much complexity and cost (time & money)
possible problems w/ software development
- focus on features vs. goals - failure to follow the design process and produce high-fidelity designs - failure to prioritize
3 types of design that go into high quality products
- functional design - aesthetic design - experience design
What can you learn from usability testing?
- goals: what user is trying to do - behaviors: what user is doing - context: in what situation is user doing it - pain points/roadblocks - comparison to competitors - product desirability and problem solving capabilities
what is a flow diagram?
- identifies the most critical flows and ensures that software works for those - fllow is not about the number of screens but about the number of screen "states" when someone moves through an application
What are the business benefits of UX?
- increase revenue, customer acquisitions, conversions, customer satisfaction, customer retention, sales/sales per visitor/revenue per sale - reduce cost, customer turnover, time to market
What are personas?
- made by Alan Cooper - PROS: avoids sed-referential design, creates a target for design team by providing context, behaviors, user goals, and design goals - CONS: involves friction (fake data), usually created w/out research and can be confused w/ marketing personas, time consuming, may not have intended effect
concept: perceivability
- make it easy for users to figure out what to do just by looking at it - easily answer: what does it do? What do I need to do?
what are the benefits of including progress indicators?
- makes steps look sequential - tells users what they have done and what they need to do - indicates time and effort required - aides predictability
examples of design pitfalls
- not carrying out customer research - designing for yourself - being technology-led rather than customer-led
definition: controls
- objects that allow you to control a product - digital controls ex. drop-down menus, buttons, switches
concept: progressive disclosure
- only tell users what they need to know when they need to know it - benefits: reduces complexity and info overload, helps users make decisions and take actions, smoothens the flow
concept: predictability
- people need to know what they are going to get before they invest their time - tell people: how long it takes? What do I need to do? What you're going to get? What happens next?
benefits of usability testing
- presents user's experience and product from user's perspective - unites stakeholders behind common cause - challenges/validates assumptions about product -produces variety of user data to learn about goals/behaviors/context - helps build consensus - cost effective
what is horizontal navigation?
- primary (global) navigation sits at top of page and is on every page - secondary (local) navigation changes depending on where you are on website
what does interaction design do?
- provide an explanation of what the interaction is supposed to do and where it leads to and feedback defines: - how the system behaves - how it responds to actions - how it communicates results - how it helps fulfill intentions
what is the importance of low-fidelity design?
- reduces ambiguity on what a product could be like - gives time and space to validate a design before building - reduces rick of spending extra money/time, creating low-quality products, and damaging the brand
what is information architecture (IA)?
- refers to how we organize, structure, and label content in software; defines where content "lives" - purpose is to help people achieve goals / complete tasks w/ least amount of friction; has a big impact on user experience - influences primary navigation in 1 to 1 mapping, but not all navigation - should follow conventions and competitive benchmarking
definition: call to action
- should tell users what to do, why they should do it, and what will happen after
what is pattern bar for mobile navigation?
- sliding drawer navigation or off-canvas navigation - global navigation can be accessed through hamburger icon - local navigation will appear when necessary
definition: design patterns
- specific methods/approaches - brings design principles to life - specific to software
What is app unbundling?
- splitting an app into two smaller apps that will be better at doing what they're designed to based on defining characteristics - ex. Facebook split into consumption app (Facebook) vs. utility app (Messenger) - ex. Google Drive split into Docs, Sheets, Slides, etc.
Who should you talk to for stakeholder interviews?
- sponsoring executive - anybody w/ a stake in project - anybody who feeds requirements - anybody who provides sign off
concept: Fitt's Law
- states that it's faster to hit larger targets that are closer to you than small targets further away - use as primary call to action - ex. large button near thumb placement vs. small button in top left corner
definition & example: quantitative research
- structured, numerical, measurable, objective, statistical, broad insights - larger sample size; - "hard" science - ex. multiple choice questions, analytics
concept: Hick's Law
- suggests that time it takes to make a decision depends on the number of options presented --> more options means longer time to decide what to do
what are the common mobile navigation patterns?
- tabs: primary nav appears on top or bottom of screen - off-canvas (AKA sliding drawer option): menu opens up from slide --> best for broad content/functionality, too many options that are equally important - floating buttons: prioritizes certain use cases --> best for utility apps w/ one main function - content as navigation ex. Netflix - blended: combination of common patterns
concept: chunking
- technique to help process data faster and remember easier - benefits: assists short-term memory, scannability, and comprehension
What should you do if there isn't a product yet to test?
- test the current version, prototype of new version, or test the competitors' product
definition: margin of error
- the extent to which you can expect your survey results to represent the views from the overall population - ideal: 5%
definition: context
- the social and physical environment where the product is being used
definition: A/B testing
- two options --> serve 50% of users wi/ one option or the other - benefits: encourages experiments, (in)validates assumptions, allows for data-driven design choices
objectives of stakeholder interviews
- understand business/goals, problems w/ product, and the competitive landscape - get buy-in from stakeholders for later
benefits of card sorting
- understand mental models and vocabulary/language preferred by users - gives designers confidence
definition: design principles
- universal truths - apply across many disciplines - increase probability of success
definition & example: qualitative research
- unstructured, not measurable, subjective, focus groups, deep insight - smaller sample size - "soft" science w/ grey areas - ex. usability tests, open-ended survey questions
How do you provide help in your design?
- use tooltips in hover mode --> contextual help (only appears when interacted with) - help should be available but not intrusive - better to have info on the interface under/next to each section rather than in tooltips
concept: visual hierarchy
- used to indicate what elements are most important and what you should look at first --> use color and size contrast to prioritize most common actions
what is vertical navigation?
- useful if there is a long list of subsections that won't fit across top of screen - more commonly seen as local navigation
definition: card sorting
- user-centered technique to organize content - should correspond w/ user's mental model of how info should be arranged
What are the benefits of digital affordances?
- uses natural qualities to help people understand how a product operates - make actions obvious, interfaces perceivable, and features discoverable
definition: triangulation
- using two/three research methods to get more accurate result
what are the 4 app types?
- utility: simple & structured ex. online banking or calendar app - process: complex & structured ex. insurance claim app - consumption: simple & random ex. newspapers or streaming services - commerce: complex & random ex. Amazon or Walmart
what are the benefits of the design process?
- vision is clear - product is visualized in high-fidelity - process has a natural structure that is easily understandable - ideas can be iterated cheaply - 3 success factors (viability, feasibility, desirability) are given equal importance
definition: affordances
- visual cues that tell us how a product should be used or operated - affordances can override instructions and experience - make it obvious how a product/interface/control works, make it clear what to do next, and assist learnability
Usability test questions to TRY
- what and why questions - specific questions about past usage - task questions - open ended questions
what is closed card sorting?
- when there are pre-established groups and the user only rearranges content b/w groups
Usability test questions to AVOID
- yes/no questions - leading questions - future-focused/hypothetical questions - design questions
concept: Steve Krug heuristics - "the reservoir of goodwill"
1. don't force me to do it your way 2. save me steps whenever possible
questions to ask to identify desirability
1. is there a problem? 2. is our product solving it? 3. is the experience great?
2 main types of flow for mobile
1. linear sequence: natural/logical, has dependencies (step-by-step), commonplace transactions 2. hub-and-spoke flow: best to use when sequence is not natural, minimal dependencies, more involved transactions --> users can travel b/w parts of flow without having to undo everything
2 responsibilities of an experience designer
1. product integrity; they represent the user AND the integrity of the product itself 2. product desirability
concept: Alan Cooper heuristics- "Software should be polite"
1. software should be interested in me 2. should be forthcoming w/ info 3. should be self-confident 4. should have common sense
3 key ingredients of a successful product
1. viability (business) - product has to make or save money for the business 2. feasibility (technology) - product has to be buildable at a viable price 3. desirability (customer) - product has to be solving a problem to make a customer want to use it
concept: Jakob Nielson heuristics - "Usability heuristics"
1. visibility of system status 2. match b/w system and real world 3. freedom and control 4. recognition rather than recall
concept: 3 golden questions to ask in usability testing
1. why did you visit our product/app/website today? 2. were you able to complete your task today? 3. what would you change about our website? what improvements would you make?
What do you need to provide professional recruiters if you need users to test?
2-page screener document w/: - guidance - criteria for participants (demographic, how many people needed, product usage history) - duration of test and pay - location and contact details
Concept: general rules of thumb for interviews
DON'T - talk about your product/idea - talk about hypothetical scenarios and what they might do in the future - talk a lot DO - ask about their life - ask about specific things they did in the past - listen
what are the rules for prioritizing?
NOT ALL USE CASES ARE MADE EQUAL - things that most people do most often - things that some people do somewhat often - things that few people do infrequently (edge cases)
Why does experience matter?
Negative emotions have a multiplier effect; one negative experience can outweigh many positives
What are the suggested nav patterns for utility apps?
Utility apps are simple and structured --> floating for primary actions AND off-canvas for extra options
definition: software application
a computer program built to perform certain functions
definition: web application
applications designed to run on a web browser
definition: constraints
can help limit options and keep users focused on the right track
definition: conventions
established ways of doing things --> people don't need to learn something they already know how to do
How can a good interface be forgiving?
expect mistakes by having: - strong affordances - reversibile actions - confirmations - warnings - help by providing instructions
definition: design model
how a product actually works
definition: mental model
idea of how a product works
How should the interface handle errors?
if users make mistakes, error messages should tell them clearly where the error occurred, what went wrong, and what they need to fix
concept: anatomy of an interaction
intent --> controls --> action --> rules --> feedback --> result
concept: "interaction is similar to sentence structure"
interaction = intent + action + result - intent to do something - action to make it happen - result is either successful or unsuccessful
concept: mobile vs. desktop design
mobile design development has to be a priority b/c most people access sites through mobile now
concept: UX design process
research -> define -> design -> prototype -> validate/test
what do rules define?
rules define: - how an interface works - what it can/cannot do - actions leading to success/failure - what feedback is given after actions - what happens next after user completes an action - what data is used and from where - macro-rules and micro-rules - express rules by using if-then statements
concept: Golden Thread
set of concepts/ideas that articulate UX design process; 1. UX design is a problem solving discipline 2. UX is a process 3. UX is a research-based discipline 4. Qualitative research is more insightful than quantitative 5. Flow is important to creating a pleasant experience 6. UX is a tool for minimizing risk of wasting time/money and of building poor quality product
definition: native applications
software applications built for specific use on mobile ex. Facebook's mobile website vs. desktop website vs. mobile app
How does workflow determine app types?
two aspects of workflow: - structure of flow: ordered or random - complexity of flow: how involved is the workflow, how much work is required, how many steps are there, how much processing is required
definition: edge cases
use cases that occur less frequently; things that few people do infrequently
definition: responsive website
website that adjusts its appearance based on access through mobile or desktop
concept: risk-reward
when the reward is unknown, people are less likely to take the risk
