CS3240 Interaction Design Cheatsheet PDF

Preview

Summary

Lecture1/ Definition of Usability: ensuring that interactive products are easy to learn, effective to use, and enjoyable from user’s perspective. Must be: - Effective to use (effectiveness) - Efficient to use (efficiency) - Safe to use (safety) - Easy to learn (learnability) - Easy to remember (memo...

Description

Lecture1/2 Definition of Usability: ensuring that interactive products are easy to learn, effective to use, and enjoyable from user’s perspective. Must be: Effective to use (effectiveness) Efficient to use (efficiency) Safe to use (safety) Easy to learn (learnability) Easy to remember (memorability) Lecture 3 Design Process Empathize Define  ideate Prototype Test Contextual design process {What matters to users- characterizing what they do} Contextual inquiry: Talk to specific customers in the field Interpretation session: Interpret data to capture key issues Work models and affinity diagramming: Consolidate data across customers for a full market view {New ideas and direction} Visioning: Redesign people’s work with new technology ideas {Redesign activities and technology to provide value} Storyboarding: Work out the details of particular tasks and roles User environment design: Design system to support this new work {Iterate system with users} Paper mock-up interviews: Mock-up the interface using interaction patterns for testing Interaction & visual design: Design and test the final look and user experience Defn of User Centered Design: Iterative process where mix of investigative methods and tools and generative ones are used to understand user needs. Has 4 phases: 1) Understand context in which users may use a system 2) Identify and specify the user’s requirements 3) Design solutions 4) Evaluation, assess prototypes against user context and needs. See how close it matches context + needs for the user.

Mental Models: Mental structures of what is known Conceptual Design: what info/functions are needed to achieve overall purpose of application Physical Design: take the abstract concept and translate into concrete designs, how things will work. Operational Design: Specify how everything works and how content is structured Representational design: fixing on style & aesthetics

Interaction Design: allocation of functions to human agency or technology, structure/sequence of interactions. Envisionment: visualize designs for clarification + evaluation Evaluation: Evaluating representation based on nature and who is able to use the representation Experience Design Experience: sense of immersion Engagement: must draw the person in, key elements include flow, adaptivity, narrative, immersion, believability. 4 Fun model: hard fun(overcome adversity), easy fun(curiosity), serious fun(relaxation, provide rewards), people fun(amusement by networking) Do so by having challenges, different skill levels, reward system, collect/complete things, allow users to relate to other users thru competition. Pleasure: physio(from sensory organs), socio(enhanced status), psycho(cognitive/emotional pleasure), ideo pleasure(fit their value systems) 3 level emotional design model: Visceral(perpetual aesthetics), Behavioral (positive emotion), Reflective(issues of personal values) Service Design: more intangible/flexible than product, people walk away with results of the service, must consider the multiple touch points where ppl encounter a service, must also consider brand, people need to recognize they are interacting with the same entity. Lecture 4 User Study Methods: Interviews(1), Surveys(2), Observations(3), Contextual Inquiry(4) 1) Types have face to face(open ended/unstructured, structured, semi structured, focus grp)/remotely conducted(skype/phone), don’t pre-empt an answer by phrasing a question as well as avoid compound sentences. Challenges: Skills, Time, Resources, Dropped Connections 2)Ask user to answer questionnaire. Must prep, structure, schedule, conduct, account for time/effort and artifacts Q&A Format: Closed Questions(1 response) or Scales (stated below)  Likert (strongly agree/disagree that one)  Semantic Differential scale(ie bad to good), if got odd number scale, can take neutral stand 3) Literally just observe the user carry out the task. Must prep, schedule, conduct, time/effort, artifacts include audio/video recording, notes, user, user journey map, empathy map.  Direct in Field (passive or participant observer, low repeatability)  Direct observation in controlled env (think aloud technique, authentic data if controlled well)  Indirect observation(track user activities) 4) Combine interview & observation, longer time, user controlled, debrief Conventional interview  Transition  Contextual interview  Wrap Up User Study deliverables: User needs, mental status, emotions, thoughts, touchpoints/pain points, persona and scenario, and path Can encompass in a user experience map Empathy Map: classified into target users, needs, goals, expectations, behaviours, pain points Hierarchical Task Analysis (HTA) Focuses on physical and observable actions that are performed, Start point: user goal Break task into subtasks repeatedly Aka plans that specify how the tasks might be performed.

Lecture 5 Design principles

Consistency: similar situations require similar sequence of actions, reduce cognitive load Familiarity: Use familiar language & symbols, use metaphors for conceptual understanding Affordance: physical properties to provide visual cues to its function Visibility: Hide non essential fns till needed Feedback: state of system should be clearly visible to user Constraints: restrict inputs to reduce errors Recovery: undo user mistakes Aim to -> create clear visual hierarchy, make use of conventions, break pages up, make obv what is clickable, reduce cognitive load (brain power needed to learn something) App Design Guidelines: Registration: only ask user to register if essential Navigation: place calls to action up front and center, organize menus, let users to go back 1 step at a time Search: display prominently, autocorrect, filter & sort options Forms: ezy & quick General Usability: use the same terminology as users, responsive w visual feedback after impt actions Lecture 6 Data Analysis(Interpreting and presenting the findings) Data types: Qualitative(not numbers), Quantitative(numbers) Basic Analysis: Quantitative (averages, percentages, graphical representations) Qualitative (focus on key events, identify themes, categorizing data) Affinity Diagram : bundle & group information into area of concern then second grp labels, grp labels

Principle of Turn taking: Peter Hodgson identifies turn taking as the mechanism by which we resolve ambiguity and repair conversations. Principle of Context: Focus on the user’s physical and emotional context and kinds of convo that can serve, ie keep qns short for mobile Convo Interface Design: Define the user(who are ur users, needs, how do they solve, what phrases do they use, what situations trigger this, what is their context)  Form user personas(2-3 personas and their journeys) Define chatbot type, ie AI(use NLP) or Rule based(give convo designed options, so less freedom)eDesign chatbot persona(personality + identity)**Outline Dialogue flow(write script and design buttons)Read convo thread out loud Personas Elements: name, age, gender, image, tagline, experience and relevant skills, context on how they would interact with the product. Attitudes/concerns when using the product, brief scenario Scenario: informal narrative description, describes task in story form. Beginning: presents actor & what persona wants to achieve Middle: what persona does & motivation for pursuing the goal End: describes whether persona succeeds in his/her intention + specific & use language that is understandable +explains why interaction is impt +gives understanding of experiences that result in successful accomplishment -obsession w details -false sense of assurance that everything covered by the scenarios -lacks evidence of how to get data Lecture 7 Prototype

CHOICE depend on: 1. Goal of evaluation 2. Completeness of design 3. Tools used to create prototype 4. Resources available before and during proto evaluation/budget(time&money)/project phase/interaction complexity/depend on user’s sophistication level Fidelity: based on interactivity, visuals, content & navigation Horizontal Prototype: wide range of functions but less details Vertical Prototype: Few fns implemented deeply Wizard of Oz: user thinks they interacting with computer but human doing the work. Serial: iterative prototyping, all teammates are focused on 1 prototype Parallel: Creating multiple prototypes at a time. Many people making multiple prototypes. Benefit: have many different ideas then you can merge them and choose the best Lecture 8 Chatbot Definition of Chatbot: A machine agent that serves as a natural language user interface for service providers. Why people use: Productivity, ease, speed & convenience for help & info. Side: entertainment, social experiences, convo skills, novelty, preference. Cooperative Principle: If both sides respect and understand conversational implicature (implied info based on shared knowledge), then convo can have big shortcuts Maxims: Quantity: give as much info as necessary to further the convo Quality: Give truthful, complete, current, correct info Relevant: Give relevant info Manner: unambiguous info

Lecture 9/10 Evaluation Methods: usability testing, a/b testing, controlled experiments, heuristics When: formative(during design stages), summative(end of design) 3 types: 1)Controlled settings w users Usability testing: usually with concurrent think aloud technique(say while doing, -unnatural(awkz), -hard to talk if focused), there’s also retrospective think aloud(do then say, +more relaxed, +higher level verbalizing) - Plan: goals of the test, participant characteristics, procedure, task list, test environment & logs, test facilitator role, data collected & eval measures - Metrics: successful task completion(percentage), critical & non critical errors, error free rate, time taken, task level satisfaction(to flag difficult tasks or evaluate how user felt about overall experiences) - Task Design: must be actionable, avoid cueing to the answer, unambiguous, appropriate level of details, find out task dependencies A/B testing: tests diff product alternatives Steps: Collect information, observe behavior, construct hypothesis, test it, analyze data & draw conclusions Controlled experiment(A/B counts) steps: formulate hypothesis, identify variables(independent & dependent), target sample(set inclusion/exclusion criteria), set conditions, decide how to organize participants to experimental conditions Organizing: -Within subject: each participant tested on all levels of IV Ordering of conditions could impact -Between Subject: each participant tested on 1 condition(1 lvl of IV) 2) Natural Settings w users (eg online studies/products used in public places) 3) Settings w/o users Heuristic Evaluation: examine UI and check for compliance with heuristics Process: briefing  evaluation period (each expert work separately, take 1 pass to get feel for the product and take second pass to focus on specific features)  Debriefing, experts rate the severity of problems(shld have 5 evaluators) + Experts normally have knowledge on UI guidelines + fewer ethical & practical issues to consider - difficult/expensive to find certified experts - experts have biases due to their preconceptions Nielson Heuristic H1: Visibility of system status => Users should know what’s going on in the system through appropriate feedback and display of info H2: Match between system and real world => Image of system perceived should match mental model H3: User control and freedom => Give impression that users are in control H4: Consistency and standards => No need to think if different words/situations/actions mean the same thing H5: Error prevention => Prevent errors from happening at all

H6: Recognition rather than recall => Don’t have to memorize info H7: Flexibility and efficiency of use => Allow customization and shortcuts to speed up actions (templates, macros, etc) H8: Aesthetic and minimalist design => Remove extraneous info H9: Help users recognize, diagnose, recover from errors => Have good error messages which are informative and allow recovery H10: Help and documentation => Allow users to get help when needed Severity Indicators (4) Catastrophe: Imperative to fix before release (3) Major problem: Important to fix, high priority (2) Minor problem: low priority (1) Cosmetic: Need not be fixed unless extra time is available Chatbot Evaluation Approach: see how it works under expected scenarios, then possible scenarios, then almost impossible scenarios. Chatbot Heuristics: - Personality: Does the chatbot have a clear voice and tone that fits with the users and with the ongoing conversation? - Onboarding: Are users understanding what is the chatbot about? and how to interact with him from the very beginning? - Understanding: Requests, Smalltalk, idioms, emojis... What is the chatbot able to understand? - Answering: What elements does the chatbot send and how well it is doing it? Are they relevant to the moment and context? - Navigation: How easy is to go through the chatbot conversation? Do you feel lost sometimes while speaking with the chatbot? - Error management: How good is the chatbot dealing with all the errors that are going to happen? Is able to recover from them? - Intelligence: Does the chatbot have any intelligence? Is able to remember things? Uses and manages context as a person? Question Types Exclusion criteria: people with visual impairments/cognitive impairment/young children/elderly unable to give consent Plan(write in bullet points): Give context: Where, when, what, what type also, number of users, talk about what the user groups are, time frame - Interviews: Semi structured, structured, unstructured - Role Allocation - How you do note taking - Same for observation, survey(must say what kind of questions), interview Conduct Experiment/User study/Evaluation: Briefing: setting it up State the task u will give, then while u doing how you record data, (basically the plan part u just execute just need to add the brief and debrief) Debriefing: debrief the users, can also do survey at the end with users Nielsen Heuristics: put most confident one first, use 1-2 heuristics, if have time can justify why u choose this heuristic Hypothesis: Template: X is better/faster than y and z in doing some task under some context. Can make multiple hypothesis if need to Dependent Variable usually: effectiveness (errors) & efficiency(time) IV/DV/Experimental conditions: just write the levels and multiply Data Analysis: Process: Problem (ideation)  user study  Data analysis  Solution (ideation)  Prototype (ideation)  Evaluation Data analysis Storyboarding: Essential elements: actor, goal, setting(context), action - Can label/use text if u drawing sucks - Must give 1 specific case/scenarios - Can draw more panels if u need to, or don’t use all

Learning Points 18/19 Sem 1 Paper Q1 - Must answer the question, emphasize on interaction - Interaction is a 2 way communication where the user does an action and receives feedback, must link answer to interaction Q2 Must target your question according to wizard of oz o Eg who is the wizard, facilitators, what are the roles allocated, also plan out dialogues for the wizard Q4 - Must answer in terms of the user centric approach, so for affinity diagram talk about bottom up design approach based on user notes & build it up to the design ideas. Q5 - Can elaborate more on the process, ie. go through various solutions before settling on making a mobile app. Q6 - Evaluation strategy not includes how u actually evaluate but the entire process, including the fact that u used prototypes and what fidelity - In general for any plans you must talk about the who, what, when, where, how Q7 - A)must link to the user study and its goals o When choosing target demographics must talk about the purpose of choosing each group the user study o If cannot justify with the reasons from the question then justify with

-

-

-

your own reasons for picking those user groups B) Must write assumptions like if the product is already made o Must also talk about the reasons for choosing that user study method aka the pros of choosing that user study method o Your plan must also correspond to the user study method chosen C)When talking about analysis must talk about what kind of data you get ie whether it is qualitative or quantitative, o What data like video recordings, notes, o How u transcribe and highlight the points etc o Rmb the affinity diagram is the final product after you distil the user’s voice

-

Q2 -

If you want to test navigations in a rush, you need something higher fidelity like an interactive prototype or maybe a mixed prototype.

-

When answering questions about serial and parallel prototyping must talk about the team members Serial: All teammates are focused on 1 prototype Parallel: many people making multiple prototypes. Benefit: have many different ideas then you can merge them and choose the best

Q3

-

Q8 -

-

Q4

Hypothesis, must mention all the independent variables Dependent variables is what you can actually measure, don’t just copy from the question Experimental conditions is 3*3 from each independent variable When conducting the experiment must talk about how you would actually carry out the experiment, you have to brief, debrief, bring 1 user in, state the task you will give, the data recordings you make

-

-

-

 18/19 Sem 2 Paper Q1 - Read the question, if cannot choose one group of people to interview then don’t use

When justifying why you choose a target demographic, try to be more specific on the reasons you choose them. Also answer both parts of the question, key aspects you want to inquire means what you would want to ask.

Q5

H3 User control and freedom means give choices to the user H7 Flexibility and efficiency of use means the product has something for both novice and expert users. H10 Help & Documentation means if there is no button and there’s no help given in the error message(like don’t even say what’s wrong) Don’t add too many heuristics, just put 1-2 heuristics Put whichever heuristic you are most confident of first. If have time feel free to write the argument for choosing the heuristic...