sims 213: user interface design & development marti hearst thur, feb 3, 2005
Post on 20-Dec-2015
215 views
TRANSCRIPT
![Page 1: SIMS 213: User Interface Design & Development Marti Hearst Thur, Feb 3, 2005](https://reader035.vdocuments.us/reader035/viewer/2022062516/56649d4e5503460f94a2dd0b/html5/thumbnails/1.jpg)
SIMS 213: User Interface Design & Development
Marti HearstThur, Feb 3, 2005
![Page 2: SIMS 213: User Interface Design & Development Marti Hearst Thur, Feb 3, 2005](https://reader035.vdocuments.us/reader035/viewer/2022062516/56649d4e5503460f94a2dd0b/html5/thumbnails/2.jpg)
Personas (from Cooper)
“Hypothetical Archetypes”– Archetype: (American Heritage)
• An original model or type after which other similar things are patterned; a prototype
• An ideal example of a type; quintessence
A precise description of a user and what they want to accomplish– Imaginary, but precise– Specific, but stereotyped
• Real people have non-representative quirks
![Page 3: SIMS 213: User Interface Design & Development Marti Hearst Thur, Feb 3, 2005](https://reader035.vdocuments.us/reader035/viewer/2022062516/56649d4e5503460f94a2dd0b/html5/thumbnails/3.jpg)
Reasons for Personas
Avoid the “elastic user”– If the description is not specific, it
can easily wiggle to suit the design needs of the moment
Piston analogy
Helps prevent designer / programmer from imagining they are the user
Image from www.howstuffworks.com
![Page 4: SIMS 213: User Interface Design & Development Marti Hearst Thur, Feb 3, 2005](https://reader035.vdocuments.us/reader035/viewer/2022062516/56649d4e5503460f94a2dd0b/html5/thumbnails/4.jpg)
Reasons for Personas
Puts an end to feature debates– Makes hypothetical arguments less hypothetical
• Q: “What if the user wants to print this out?”• A1: “The user won’t want to print often.”• A2: “Emilee won’t want to print often.”
User Persona, not Buyer Persona– This is one way HCI differs from marketing– Eventually it pays off in more sales
![Page 5: SIMS 213: User Interface Design & Development Marti Hearst Thur, Feb 3, 2005](https://reader035.vdocuments.us/reader035/viewer/2022062516/56649d4e5503460f94a2dd0b/html5/thumbnails/5.jpg)
Cooper on Scenarios
Daily Use– Fast to learn– Shortcuts and customization after more use
Necessary Use– Infrequent but required– Nothing fancy needed
Edge Cases– Ignore or save for version 2
Example: image cropping application– It works so intuitively, it feels like magic
![Page 6: SIMS 213: User Interface Design & Development Marti Hearst Thur, Feb 3, 2005](https://reader035.vdocuments.us/reader035/viewer/2022062516/56649d4e5503460f94a2dd0b/html5/thumbnails/6.jpg)
Cooper’s Perpetual Intermediaries
Beginners
Intermediates Experts
Programmers design for experts
![Page 7: SIMS 213: User Interface Design & Development Marti Hearst Thur, Feb 3, 2005](https://reader035.vdocuments.us/reader035/viewer/2022062516/56649d4e5503460f94a2dd0b/html5/thumbnails/7.jpg)
Perpetual Intermediaries
Beginners
Intermediates Experts
Marketers design for beginners
![Page 8: SIMS 213: User Interface Design & Development Marti Hearst Thur, Feb 3, 2005](https://reader035.vdocuments.us/reader035/viewer/2022062516/56649d4e5503460f94a2dd0b/html5/thumbnails/8.jpg)
Perpetual Intermediaries
Beginners
Intermediates Experts
People spend most of their time as intermediates
![Page 9: SIMS 213: User Interface Design & Development Marti Hearst Thur, Feb 3, 2005](https://reader035.vdocuments.us/reader035/viewer/2022062516/56649d4e5503460f94a2dd0b/html5/thumbnails/9.jpg)
Perpetual Intermediaries
Beginners
Intermediates Experts
Paradoxical Curves
![Page 10: SIMS 213: User Interface Design & Development Marti Hearst Thur, Feb 3, 2005](https://reader035.vdocuments.us/reader035/viewer/2022062516/56649d4e5503460f94a2dd0b/html5/thumbnails/10.jpg)
Case Study using Personas
Sony TransCom’s P@ssportInitial design: Conventional solution– Deep hierarchy of screens
• “Uninformed consent”• Reflected the internal design of the software
– This design decision forced them to throw out the natural choice of a touchscreen
– 3D graphics, artistic icons, map-and-globe metaphor• But no substance• “Painting the corpse”
![Page 11: SIMS 213: User Interface Design & Development Marti Hearst Thur, Feb 3, 2005](https://reader035.vdocuments.us/reader035/viewer/2022062516/56649d4e5503460f94a2dd0b/html5/thumbnails/11.jpg)
Case Study using Personas
Procedure:– Interviews inside Sony
• What are their goals?• What is the project history?
– Interviews in the field• Airline personnel, particularly flight attendants
– Every new story lead to a new persona• 30 personas at one point
– Eventually, see commonalities, collapse them down• 4 passengers, six airline employees• Passengers are the hard part
![Page 12: SIMS 213: User Interface Design & Development Marti Hearst Thur, Feb 3, 2005](https://reader035.vdocuments.us/reader035/viewer/2022062516/56649d4e5503460f94a2dd0b/html5/thumbnails/12.jpg)
Case Study using Personas
Passenger Personas– Chuck Burgermeister– Ethan Scott– Marie Dubois– Clevis McCloud
Goal: satisfy all of them, make no one unhappy, but don’t have to make any of them exceptionally happy– (contradiction of earlier point – captive audience)
Interesting development: one persona became a “common denominator” and a “touchstone”
![Page 13: SIMS 213: User Interface Design & Development Marti Hearst Thur, Feb 3, 2005](https://reader035.vdocuments.us/reader035/viewer/2022062516/56649d4e5503460f94a2dd0b/html5/thumbnails/13.jpg)
Case Study using Personas
Interesting design decisions– No navigation
• Only one screen – This isn’t really accurate – they had different screens for different kinds of
entertainment• This means – not very many movies to choose from – and is not what a
computer scientist would design for– Physical knob like a radio dial– Few clicks means touchscreen is ok– Content provided much of the value
• Movie vendors surprised the designers by being enthused about having to supply content
• Consequence of the fact that every movie is carefully marketed already
Other interfaces needed for airline personnel
![Page 14: SIMS 213: User Interface Design & Development Marti Hearst Thur, Feb 3, 2005](https://reader035.vdocuments.us/reader035/viewer/2022062516/56649d4e5503460f94a2dd0b/html5/thumbnails/14.jpg)
Course Scheduler Example
Explanation and Justification– Target user base: UCB Students– Developed from
• 8 interviews • personal experience as students
– Discovered differences in approaches to tasks and needs• Some students shop around and interact intensively with the course scheduling
system• Others consider only a narrow range of courses and/or have strict requirements
to fill– Diversity in student body
• Age, educational status, computer experience– Must work for all students since it is a must-use application
![Page 15: SIMS 213: User Interface Design & Development Marti Hearst Thur, Feb 3, 2005](https://reader035.vdocuments.us/reader035/viewer/2022062516/56649d4e5503460f94a2dd0b/html5/thumbnails/15.jpg)
Course Scheduler Example
![Page 16: SIMS 213: User Interface Design & Development Marti Hearst Thur, Feb 3, 2005](https://reader035.vdocuments.us/reader035/viewer/2022062516/56649d4e5503460f94a2dd0b/html5/thumbnails/16.jpg)
Course Scheduler Example
![Page 17: SIMS 213: User Interface Design & Development Marti Hearst Thur, Feb 3, 2005](https://reader035.vdocuments.us/reader035/viewer/2022062516/56649d4e5503460f94a2dd0b/html5/thumbnails/17.jpg)
Course Scheduler Example
![Page 18: SIMS 213: User Interface Design & Development Marti Hearst Thur, Feb 3, 2005](https://reader035.vdocuments.us/reader035/viewer/2022062516/56649d4e5503460f94a2dd0b/html5/thumbnails/18.jpg)
Course Scheduler Example
![Page 19: SIMS 213: User Interface Design & Development Marti Hearst Thur, Feb 3, 2005](https://reader035.vdocuments.us/reader035/viewer/2022062516/56649d4e5503460f94a2dd0b/html5/thumbnails/19.jpg)
Course Scheduler Example
![Page 20: SIMS 213: User Interface Design & Development Marti Hearst Thur, Feb 3, 2005](https://reader035.vdocuments.us/reader035/viewer/2022062516/56649d4e5503460f94a2dd0b/html5/thumbnails/20.jpg)
Course Scheduler Example
![Page 21: SIMS 213: User Interface Design & Development Marti Hearst Thur, Feb 3, 2005](https://reader035.vdocuments.us/reader035/viewer/2022062516/56649d4e5503460f94a2dd0b/html5/thumbnails/21.jpg)
Course Scheduler Example
![Page 22: SIMS 213: User Interface Design & Development Marti Hearst Thur, Feb 3, 2005](https://reader035.vdocuments.us/reader035/viewer/2022062516/56649d4e5503460f94a2dd0b/html5/thumbnails/22.jpg)
Course Scheduler Example
![Page 23: SIMS 213: User Interface Design & Development Marti Hearst Thur, Feb 3, 2005](https://reader035.vdocuments.us/reader035/viewer/2022062516/56649d4e5503460f94a2dd0b/html5/thumbnails/23.jpg)
Course Scheduler Example
Sample Scenario– Alicia is new to the registration process
Its Monday morning and Alicia has just spent the weekend partying and getting to know more of her dorm-mates. Alicia has her first Tele-Bears session this morning and although she already has three good classes in mind, she needs to find 1 more, but she'll have to figure out her GE requirements first. Alicia logs onto the system. First, she signs up for Nutritional Science 10 because apparently heaps of cute water-polo guys take this class. Alicia is thinking about majoring in French Literature and so she signs up for English 1A which she must take before taking anymore English classes. Alicia then signs up for her third class, Biology 1A because she might want to major in this too. Then Alicia browses for her last class by searching all the GE classes, and decides to sign up for American Studies 10. Unfortunately this class must be really popular because its already full! So, Alicia decides to go on the waitlist for it just in case. She then adds another GE class that looked quite interesting called Film 24. This class is a Freshman Seminar on Film so Alicia hopes that she'll get to watch some cool movies! Someone is yelling Alicia's name down the hall, so she logs off.
![Page 24: SIMS 213: User Interface Design & Development Marti Hearst Thur, Feb 3, 2005](https://reader035.vdocuments.us/reader035/viewer/2022062516/56649d4e5503460f94a2dd0b/html5/thumbnails/24.jpg)
Course Scheduler Example
Sample Scenario– Mike needs to make a minor schedule change
– Mike is already well into his second week of this semester. As usual, Mike had no problem signing up for his classes as he had planned them ahead of time out in Excel. Unfortunately he needs to switch sections for his Dynamics and Control of Chemical Processes class. Mike is loving the lecture and enjoying the laboratory for the class, but the T.A who is teaching his discussion section is clearly inexperienced. Mike quickly logs onto Tele-Bears and changes to the discussion section on Fridays at 9am. Although Mike is certain that this small change to his schedule doesn't conflict with his job, he reviews his schedule and, satisfied that this is fine, prints out his new schedule and logs off Tele-Bears.
![Page 25: SIMS 213: User Interface Design & Development Marti Hearst Thur, Feb 3, 2005](https://reader035.vdocuments.us/reader035/viewer/2022062516/56649d4e5503460f94a2dd0b/html5/thumbnails/25.jpg)
Doing Your Needs Assessment
How to do it well?Interviews vs. SurveysAdvice on Survey Writing:– List of links:
• http://www.css.edu/USERS/dswenson/web/ONLINE.HTM
– Qualities of a good question:• http://www.statpac.com/surveys/question-qualities.htm
– Developing a questionnairehttp://www.css.edu/users/dswenson/web/question.htm
![Page 26: SIMS 213: User Interface Design & Development Marti Hearst Thur, Feb 3, 2005](https://reader035.vdocuments.us/reader035/viewer/2022062516/56649d4e5503460f94a2dd0b/html5/thumbnails/26.jpg)
Doing Your Needs Assessment
Interviewing links:– Conducting an interview:
http://web.cn.edu/kwheeler/researchassignment3.htmlhttp://ksuweb.kennesaw.edu/~shagin/interviews.html