Turning That UX Frown Upside Down

1. Turning that UX frown upside-down Saturday, October 2, 2010

2. #uxfrown @hellofisher Saturday, October 2, 2010

3. Hello. I’m a UX designer Saturday, October 2, 2010

4. A Drupal designer? Saturday, October 2, 2010

5. a simple answer Saturday, October 2, 2010

6. a simple answer Saturday, October 2, 2010

7. So what is UX design? Saturday, October 2, 2010

8. The creation, integration and harmonization of all user-facing aspects within an organization or project, with the goal of impacting perceptions and behavior. Saturday, October 2, 2010

9. The creation, integration and Make it harmonization of make sense all user-facing aspects within an and work well organization or for the site project, with the users goal of impacting perceptions and behavior. Saturday, October 2, 2010

10. Why bother? Saturday, October 2, 2010

11. Any project should have goals but most people seem to lose sight of who the audience is. Saturday, October 2, 2010

12. Even a little bit of time spent getting to know your users will improve the overall experience Saturday, October 2, 2010

13. Saturday, October 2, 2010

22. Ok. You’ve doing user research and testing. How long do you really stick with it? Saturday, October 2, 2010

23. If you have a group of 10 and the first 3 people tell you the same thing is broken it’s broken. Saturday, October 2, 2010

24. If you have a group of 10 and the first 3 people tell you Fix it now. the same thing is broken it’s broken. Saturday, October 2, 2010

25. Don’t make me talk to the hand! Saturday, October 2, 2010

26. Don’t make me talk to the hand! Saturday, October 2, 2010

27. If your site isn’t cute.com, don’t get cute use conventions Saturday, October 2, 2010

28. Make it obvious Saturday, October 2, 2010

29. People get lost at any turn. Too many choices, bad directions and noise create a bad situation. Saturday, October 2, 2010

30. People get lost at any turn. Too many choices, bad directions and noise create a bad situation. Saturday, October 2, 2010

31. What might be obvious to you isn’t obvious to someone who is new to the website. Saturday, October 2, 2010

33. Web Conventions Saturday, October 2, 2010

34. As a rule conventions only become conventions if they work. Use them. They are your friends! Saturday, October 2, 2010

35. All conventions start life as somebody’s bright idea. (Steve Krug - Don’t Make Me Think) Saturday, October 2, 2010

44. Oops Saturday, October 2, 2010

49. Problem Solving Saturday, October 2, 2010

50. Sample Prooocess Saturday, October 2, 2010

53. Define Saturday, October 2, 2010

54. 1. Identify the type of site 1. Branding, marketing, content source, task-based... 2. Determine the team make-up required 3. Discover and understand the client and industry culture 4. Define the project objectives 5. Understand the current state (Heuristic Analysis) 6. Gather ideas from stakeholders 7. CONTENT STRATEGY!!! Saturday, October 2, 2010

55. Research Saturday, October 2, 2010

56. 1. User Research (internal and external) 1. Define user groups 2. Choose research techniques (what will the project's budget allow) 2. Personas 1. Really this could be just a short, visual reminder or representation for the people working on the project of the user groups. I like to have something in front of me that helps me keep my focus user-centric. Saturday, October 2, 2010

57. Visioning Saturday, October 2, 2010

58. 1. Envision features 1. This will allow us to flesh things out and see what it will take to build before to prioritizing 2. Prioritize requirements Saturday, October 2, 2010

59. Wireframe and Design Saturday, October 2, 2010

60. 1. Task flows 2. Wireframes and annotations (function) 1. Basic/draft wireframes 2. Filled out wireframes 3. Prototyping - functionality testing with users. 4. UI Graphic Design 1. Design testing 5. UI Design revisions 1. Design testing 6. Style guide documentation Saturday, October 2, 2010

67. 1.0 WBEZ 91.5 :VOCALO THIS AMERICAN LIFE SOUND OPINIONS 1.2 CONTACT US 1.1 LOGO 1.3 1. CPM Homepage - alt 1.4 MEMBERS SPONSORS SUPPORT CAREERS FINANCIALS BOARD ABOUT Components 1.0 Utility nav bar to separate nav elements that take you offsite to another CPM website. 1.1 Logo used as link to home and below utility nav bar to give the FEATURE CPM site a clear separation from the other site nav. 2.0 INFO INFO INFO 4.0 ITEM GRAPHIC GRAPHIC GRAPHIC 1.2 Global links to common actions. 1.3 Site search. Separated from utility nav to indicate that it will only search the current site. 5.1 1.4 Primary nav bar (see next LATEST PRESS OTHER LIST wireframe for functionality). 5.0 5.3 Defogging the Defogging the 2.0 Info graphics linked to related Economic Crisis Economic Crisis stories. This is done manually. 03.22.10 03.22.10 3.0 3.0 Homepage specific item. Created HOMEPAGE SPECIFIC ITEM TITLE Chicago Public Radio Chicago Public Radio just for the homepage and Presents... Global Presents... Global overwritten with new content as Under his leadership, Chicago Public Radio has developed its most significant national needed. Activism Expo 2010 Activism Expo 2010 initiatives and programs including The Third Coast International Audio Festival in 2000, 03.01.10 03.01.10 4.0 Feature item area. This could be Sound Opinions, in 2005, Wait, Wait. . . Don’t Tell Me!, a co-production with National another info graphic or a call to Public Radio in Washington, D.C. in 1998. In addition he has created numerous award- Defogging the Defogging the action to donate. winning local programs, among them Metropolis, in 1994, Odyssey and Eight Forty- Economic Crisis Economic Crisis Eight, both in 1998. 03.22.10 03.22.10 5.0 Latest press area shows the last 5.2 three press items in reverse cron order. Torey has an M.A. and B.A. in English Literature from Arizona State University and has More Press... More Lists... done postgraduate work at the University of Toronto in Middle English literature at U of 5.1 RSS feed link for press items. T’s Medieval Centre. 5.2 Link to view a listing of all press items. Under his leadership, Chicago Public Radio has developed its most significant national initiatives and programs including The Third Coast International Audio Festival in 2000, N ON - C ON TE N T 5.3 Additional list. This list would 6.0 Sound Opinions, in 2005, Wait, Wait. . . Don’t Tell Me!, a co-production with National have identical functionality to the Latest Press list. Public Radio in Washington, D.C. in 1998. SERVICES 6.1 6.0 Graphic Representing non- Torey has an M.A. and B.A. in English Literature from Arizona State University and has content related services. This Teaser text on the non-content related services graphic links to an overview done postgraduate work at the University of Toronto in Middle English literature at U of that CPM offers. Studios spaces, mobile page for the services. This will T’s Medieval Centre. also be found in the overall IA. application, training, and community room. 6.1 Teaser text for the non-content 7.0 7.1 7.2 7.3 related services. The text itself can deep link into the individual WE ARE SOCIAL: OUR WEBSITES: SITE INFO: Anchoring message that could be a final items. call to action for the site. A final call to f Join us on Facebook ▪ WBEZ 91.5 ▪ FAQ action for the site. 7.0 Listing of social network pages. Follow us on Twitter ▪ :VOCALO ▪ Site Map 7.1 Listing of related websites. See us on Flickr ▪ THIS AMERICAN LIFE ▪ Privacy Policy LOGO 7.2 General 2, 2010 Saturday, October site info. ▪ SOUND OPINIONS

70. All the other stuff Saturday, October 2, 2010

71. 1. Build... 2. User testing 3. QA (internal and with client) 4. It never ends! Saturday, October 2, 2010

72. delicious.com/ hellosteve/ ux Saturday, October 2, 2010

73. Find me at hellofisher.com Saturday, October 2, 2010

Turning That UX Frown Upside Down

You are reading a preview.

Check these out next

Turning That UX Frown Upside Down

More Related Content

Similar to Turning That UX Frown Upside Down (20)

More from Steve Fisher (12)

Recently uploaded (20)

Turning That UX Frown Upside Down

Editor's Notes