SIMS 213: User Interface Design & Development

1. SIMS 213: User Interface Design & Development Marti Hearst and Tues, Jan 30, 2007

2. Today • Personas

3. Observation (from Cooper) • Being a victim of a problem does not necessarily bestow the power to see the solution • An individual is not always representative • Company president example

4. 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

5. The Essence of Personas • Describe a person in terms of their • Goals in life (especially relating to this project) • Capabilities, inclinations, and background • People have a “visceral” ability to generalize about real and fictional people • We can have detailed discussions about what Harry Potter, Scarlett O’Hara, or Colin Powell will think or do. • They won’t be 100% accurate, but it feels natural to think about people this way

6. Reasons for Personas • A compromise design pleases no-one • The broader you aim, the more likely you miss the bulls-eye • 50% of the people 50% happy doesn’t work • Car example – soccer mom, carpenter, dot-com exec • “Every time you extend functionality to include another constituency, you put another speed bump of features and controls across every other user’s road.” • A targeted design can achieve • 10% people 100% ecstatic • Examples: • Ram pickup truck • Sony aibo • There is no such thing as an average user

7. Reasons for Personas Examples of results of targeted design • Dodge Ram pickup • Roller suitcases • Sony Aibo • Isn’t useful for anything • Not fuzzy and warm • Too delicate to let children use it, but • Passionate fan clubs • Brisk sales despite steep price – and prices now coming down

8. 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

9. 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

10. Case Study using Personas • Sony TransCom’s P@ssport • Initial 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”

11. 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

12. 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”

13. 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

14. IS 213 Example: UC Berkeley Calendar Network Problem Statement: • Although UC Berkeley boasts an incredibly rich array of public events taking place on any given day — from a Management of Technology lecture at the Haas School of Business to a film series at the Pacific Film Archive, from a physics colloquium to a dance performance at Cal Performances — because events can currently be found in over 80 web-based calendars, it can be difficult for people interested in these events to find out about them. • Because the purpose of a calendar is to publicize events, many of these calendars would like to share their events with each other. • Currently there is no automated way to do this. • Often this is done by manually entering the event data into several different web forms • Or, even more inefficiently, by emailing the event data • IS213 Website: http://www.sims.berkeley.edu/academics/courses/is213/s04/projects/EventCalendar/

15. Persona #1: Megan Richardson • Persona #1 - Megan Richardson • Technology level: Med-low • Interest in sharing events: Medium • Unique situation: Currently has no calendar, would like to send events to other calendars and receive events from other calendars • Megan Richardson is the 22-year-old UC student and member of CalPirg, the California branch of a student organization whose mission is “to deliver persistent, result-oriented public interest activism that encourages a fair, sustainable economy, and fosters responsive, democratic government.” She is from Boston and has been maintaining the CalPirg website in her spare time. Megan created her first website as a high-school senior using Dreamweaver. She understands basic HTML, but is not very familiar with data-driven websites or cascading style sheets. As she has not yet worked in the business world, she has also never used a personal calendaring system such as Outlook. • CalPirg sponsors 8-10 campus events each semester, such as rallies against hunger and homelessness or for clean and affordable power. The organization attempts to publicize these events to its members and the general public by posting them on their website and sending emails out to their mailing list in order to increase attendance and catch the attention of legislators. However, because Megan is very busy with schoolwork and activism during her senior year and not many of the other CalPirg members have website design expertise, they have not had time to redesign their website in order to present their events in a coherent, easy to use, calendar-oriented format. Megan would love to have a tool that would automate the creation of a functional, well-designed calendar for the CalPirg website. CalPirg might also be interested in publicizing other campus and community events that support their mission in their calendar, as well as publicize their events in other calendars to increase attendance at their events. Megan would not want to spend more than an hour setting such a system up, and could spend only about a half hour per week maintaining information on CalPirg events. CalPirg has about 4-5 major events a semester, and 2-3 events that occur on a weekly basis. If a nicely formatted calendar could even increase attendance at their events by 10%, it would be well worth her time. • Megan’s Goals: • Create a simple calendar or list of events as well as send out emails on events that her organization sponsors on their website in order to encourage the participation of members and the public in these events without having to hire a programmer • To ensure that their website supports the organization’s mission, which is to deliver persistent, result-oriented public interest activism that encourages a fair, sustainable economy, and fosters responsive, democratic government • To spend most of her time on schoolwork and activism, and less time on the technical details of managing a website

16. Persona #2: Harold Jackson • Persona #2 - Harold Jackson • Technology level: Med-high • Interest in sharing events: High • Unique situation: Campus Event Aggregator, they don’t “own” any events • Harold Jackson is a 40-year-old Program Manager in the Public Relations office of the UC. He is a Los Angeles native who enjoys walking his dog and playing tennis with his wife, who is a programmer. He is responsible for overseeing the maintenance of the UC website and Calendar of Events. It is essential that the website project a professional image, as it is an important means of advertising the university to the general public, alumni and potential donors. Harold’s background is primarily in public relations, but he has also acquired technical skills along the way, and is the primary maintainer of the UC website. Although he is familiar with the concept of building a data-driven website, the back-end of the university website was built by an outside contractor, and most of the staff in Harold’s department are not as technically savvy as he is. Harold and most of his group are familiar with calendaring systems such as Outlook or ICal, and use the CalAgenda calendaring system to schedule meetings. • Harold’s ultimate goal in relation to the campus calendar is to publicize as many events occurring on the UC campus as possible, and to highlight especially important events on the website. Currently events are submitted to the university calendar via a web form, and not many departments currently enter their events in this fashion. As a result, Harold’s staff has to spend time contacting various departments to find interesting events to post to their calendar. Harold thinks that if he could somehow find a way make it easier for campus departments and organizations to send him events, he could greatly increase the number of events he would receive and be able to publicize. In evaluating a new system, however, he would want to ensure that it is at a minimum an improvement over the current system in terms of functionality, and offers a design that integrates with the overall UC website. • Harold's Goals: • Create a web-based calendar that will be the ultimate aggregator of all events at his university, which will be used by the public as well as people at the university • “Market” the university to potential contributors and the general public by highlighting the diverse and exciting events that occur there • Ensure that the calendar looks professional and eye-catching, and integrates with the overall “look and feel” of the university website • Make the process for entering and approving events as easy as possible so that even “low-tech” users in his department can do this • Encourage other calendar owners to send him events

17. Persona #3: Sally McNeil • Persona #3 - Sally McNeil • Technology level: High • Interest in sharing events: High • Unique situation: Model must handle parent-child event relationships & allow the use of cascading style sheets • Sally McNeil is the 35-year-old webmaster for the university’s science museum. She is from Michigan, loves to travel, and often takes exotic vacations with her husband and two children during school breaks. Her manager has tasked her with revamping the organization’s website in order to draw more visitors to the museum. As families and schools usually only visit the museum once a year or so, they would like to encourage new people who may be traveling from farther distances to visit. She feels that giving visitors to her website information on related events and activities occurring on campus might be a good way to bolster attendance. Sally has extensive web programming experience, and her website is currently dynamically generated. She works with a java programmer on the website, and both of them are familiar with XML. She and her programmer have thought a lot about the best way to format a calendar-oriented website, and have even prototyped their best ideas. She wants to find an easy way to include events from other departments, without having to cut and paste them into her calendar. She also would like to be able to maintain the appearance of her website using cascading style sheets. • Sally's Goals: • Use the website to increase attendance at the museum • Create an eye-catching, dynamically-generated calendar that will allow parents and teachers to easily plan trips to their museum • Include events occurring at the university that may be of interest to their patrons, so families and groups traveling great distances to reach the museum can “make a day of it” and attend other events during their time in town • Clearly list events that have a “parent-child” relationship on the website so that it is easy for visitors to find what they are looking for (e.g. “Forces that Shape the Bay” event during which many different daily presentations occur) • Use cascading style sheets to maintain website look and feel

18. Persona #4: Nina Sanchez • Persona #4 - Nina Sanchez • Technology level: Low • Interest in sharing events: Low • Unique situation: Political constraints on event listings & need to send email when new events are added • Nina Sanchez is a 27-year-old Program Coordinator of the Center for Middle Eastern Studies. She is single and has a very active social life. She lives in the Mission in San Francisco where she often attends art openings, musical events, and goes dancing whenever she gets the chance. She manages the office of her small department, including scheduling seminars and classes, fundraising, and maintaining their website. As their department often deals with political figures that may hold strongly opposing viewpoints, the members of her department must always be careful to avoid potential clashes between their visitors. This includes ensuring that people who would not want to be associated with each other are not featured prominently on their website at the same time. • Nina works with the Program Director to recruit potential speakers and secure funding, and uses the website to advertise their many events. They would not want to include events other than their own, as they see the website as a marketing tool for their organization only. Making sure the website presents a professional image is an important consideration for Nina’s team. She would also like to keep events posted even after they have passed, as new visitors to their site are often people searching for terms used in their descriptions of past events. Nina has no experience with programming, and her webmaster maintains the Center’s website. The calendar is very basic, consisting only of a list of events. • Nina would be interested in a new calendaring system if it would be easy for their members and visitors to use and would enhance their reputation by presenting an even more professional image. She would also like to maintain the current system of sending out an email to their mailing list whenever a new event is added, and ensure that she is able to modify events on their website at a moment’s notice, as locations are sometimes changed right before their events. Nina would love to be able to include links for their users to create maps to their events, as they often hold events off-campus. She favors the current list format of their calendar, and does not currently use a personal calendaring system, although she has used a PDA in the past. • Nina's Goals: • Create a web-based calendar which will showcase only the events that occur in her department • Present a professional image that will encourage potential speakers and contributors to work with their organization • Manage the sometimes heated political climate that surrounds their speakers, including making sure two speakers who have opposing political views are not featured together on their website • Drive traffic to their website by keeping past events listed there • Send email to mailing list when a new event is added • Modify events on a moment’s notice • Allow users to easily create maps to their events

19. Task analysis may eliminate personas

20. Personas in Posters/Placemats • Creates a visual representation of the users • present a snapshot of the most important characteristics of each user • Bring the person to life for the design team/developers

21. Possible Poster Skeleton Name/Title User Type Adapted from Usability in Practice: 3-Day Intensive Camp, Nielsen Norman Group, 2005 quote Photo/ captions Photo/ captions quote Description of user’s business/ job/work environment Core Competencies User goals Bottlenecks Tasks Tools Used Needs

22. Let’s practice creating personas