index
play

Index How to design UI ? 1 User Interface Design II: Process User - PowerPoint PPT Presentation

Index How to design UI ? 1 User Interface Design II: Process User research 2 J.Serrat Paper prototyping 3 102759 Software Design User testing 4 November 22, 2016 Forms 5 Readings Books 1. Slides of MIT course 6.813/6.831 User


  1. Index How to design UI ? 1 User Interface Design II: Process User research 2 J.Serrat Paper prototyping 3 102759 Software Design User testing 4 November 22, 2016 Forms 5 Readings Books 1. Slides of MIT course 6.813/6.831 User interface design and implementation. Spring 2011. Lectures on User-centered 1. Paper prototyping: the fast and easy way to refine user design, User testing, Prototyping. interfaces, Carolyn Snyder, Morgan Kaufmann, 2003. http://ocw.mit.edu/ www.paperprototyping.com 2. Getting the most out of personas, website UX for the masses by 2. Rocket surgery made easy: the do-it-yourself guide to finding Neil Turner, http://www.uxforthemasses.com/personas/ and fixing usability problems, Steve Krug. New Riders, 2010. 3. Personas: practice and theory, John Pruitt and Jonathan http://sensible.com/rsme.html Grudin, Conf. on Designing for User Experiences, 2003. 3. A project guide to UX design, Russ Unger, Carolyn Chandler. http://research.microsoft.com/en-us/um/redmond/groups/coet/ New Riders, 2009. Ch. 7 “Personas” grudin/personas/oldversions/pruitt-grudinold.pdf 4. User interface design and evaluation, Debbie Stone, Caroline 4. Prototyping for tiny fingers, Marc Retting. Communications of Jarret et al . Morgan Kaufmann, 2005. ACM Vol 37, No. 4, 1994. http://booksite.elsevier.com/9780120884360/ chapters 1-4, 6, 8, 10 www.marcrettig.com/prototyping-for-tiny-fingers/ available to download. 5. 7 myths about paper prototyping, www.userfocus.co.uk/articles/paperprototyping.html

  2. How to design UI ? User research Paper prototyping User testing Forms How to design UI ? User research Paper prototyping User testing Forms How to design UI ? How to design UI ? We have studied what’s a good UI: How to develop software ? Waterfall model behaves according to user expectations: the UI does what the user thinks it should, mental model good usability : easy to learn, use, remember + few errors, nice and fun − → what to do and not to do Today’s question: How to design ? How to start from scratch and get to a fully designed UI ? Problems: Scratch ? we don’t know everything we need at the beginning but as the project evolves we have got a requirements specification even with feedback between stages, mistakes made at an early maybe a rough idea of who the target users will be stage are discovered too late and are cost too much and which tasks do they need to perform, and why 5 / 47 6 / 47 How to design UI ? User research Paper prototyping User testing Forms How to design UI ? User research Paper prototyping User testing Forms How to design UI ? How to design UI ? Spiral model: Design Waterfall model is not suited either for UI development Design can not predict whether a UI design will succeed, don’t know Design how the user will think about it users appear in the process just at the beginning (requirements) and at the end (acceptance): don’t get to User research know we are wrong until the end Test Build errors require dramatic changes Prototype 1 Build Test Prototype 2 Build Prototype 3 7 / 47 8 / 47

  3. How to design UI ? User research Paper prototyping User testing Forms How to design UI ? User research Paper prototyping User testing Forms How to design UI ? User research What’s user research ? Get to know Spiral model: who are the users ? starts with user research: who is the user ? in an e-commerce website, shoppers : regular, bargain iterate: successive refinement hunters, connoisseurs first iterations based on cheap, low-fidelity designs: what do they need to do with the UI ? storyboards, paper prototypes to purchase an item, download catalog, return an item, check late iterations with higher fidelity designs: mockups, UI order status . . . implementation why ? evaluation with a well defined procedure: “formative testing” check order status because it has not yet been delivered, consult price to check discounts, download catalog to browse lab testing with selected users offline at one stage it is possible to test several alternatives in how ? where ? the context different prototypes from a smart phone while commuting, from a tablet at home, more iterations means better UI desktop computer at work . . . 9 / 47 10 / 47 How to design UI ? User research Paper prototyping User testing Forms How to design UI ? User research Paper prototyping User testing Forms User research: user groups User research: user groups How to get user How to get user data ? data ? User-research User-research techniques techniques 11 / 47 11 / 47

  4. How to design UI ? User research Paper prototyping User testing Forms How to design UI ? User research Paper prototyping User testing Forms User research: user groups User research: user groups Example (ATM user groups, from UI design and evaluation, Stone et al ., 2005) Make user groups on the basis of a list of relevant attributes like I am a member of a large, extended family. The teens in my family generally use their account only once a week —to deposit their allowance Demographics: age, sex, family (single, married, children. . . ), (or to make a withdrawal if they have saved enough for a particular income level, location . . . purchase). There are also occasions, such as Christmas and birthdays, where extra money, received as presents, is deposited. For them using a Physical disabilities card machine is “cool” and grown up, and it means they won’t have to Experience: education background, computer technology wait in line on a Friday afternoon or a Saturday morning when the banks familiarity, subject expertise . . . are already busy. Motivation or primary goal The young adults in my family use ATM facilities like a wallet. They withdraw small amounts of money frequently — maybe even several Attitude towards computers (at large) times a day— as and when they need it, rather than withdrawing a great wad of cash that they may spend recklessly. 12 / 47 13 / 47 How to design UI ? User research Paper prototyping User testing Forms How to design UI ? User research Paper prototyping User testing Forms User research: user groups User research: user groups Example (ATM user groups, from UI design and evaluation, Stone et al ., 2005) The family members between the ages of 25 and 50 are generally busy, working people. Banking is a necessary part of life, but the quicker it can be done, the better. Waiting in bank lines is something to be avoided, and they prefer to withdraw enough money from an ATM to last several days. The older members of my family bank even less often. They tend to make a single weekly cash withdrawal to cover the weeks expenses, although where possible they prefer to get their money from a person rather than a machine. 13 / 47 14 / 47

  5. How to design UI ? User research Paper prototyping User testing Forms How to design UI ? User research Paper prototyping User testing Forms User research: user groups User research: user groups 14 / 47 14 / 47 How to design UI ? User research Paper prototyping User testing Forms How to design UI ? User research Paper prototyping User testing Forms User research: personas 1 User research: personas A website for electronic child care (EEC) gives child care providers Personas the ability to view information about their agreements, attendance transactions, payments, and other program information. documents that describe typical user targets fictional characters that depict target user populations based on real data from user research paint a clear picture of who, why, when is using the application The idea of Personas originated in marketing and was introduced to UI design in 1999 by Alan Cooper’s book The inmates are running the asylum . 1 A project guide to UX design, Russ Unger, Carolyn Chandler. New Riders, 2009. Ch. 7. 15 / 47 16 / 47

  6. How to design UI ? User research Paper prototyping User testing Forms How to design UI ? User research Paper prototyping User testing Forms User research: personas User research: personas Another website focus on helping singles to start a relationship 16 / 47 17 / 47 How to design UI ? User research Paper prototyping User testing Forms How to design UI ? User research Paper prototyping User testing Forms User research: personas User research: personas Why personas ? help designers focus on users which are “not like them” what’s more, on specific target typical users condensed into a few characters ( < 10) provide a shared basis for communication and discussion, “ Fanya cannot use the kindergarten search tool of the ECC webpage ” but also help other developers to make decisions: testers managers, marketing people for instance: what are the key features of the application ? 17 / 47 18 / 47

Download Presentation
Download Policy: The content available on the website is offered to you 'AS IS' for your personal information and use only. It cannot be commercialized, licensed, or distributed on other websites without prior consent from the author. To download a presentation, simply click this link. If you encounter any difficulties during the download process, it's possible that the publisher has removed the file from their server.

Recommend


More recommend