Interaction Design Guest Lecture - UVA CS 3240

3,464 views
3,331 views

Published on

Guest lecture for CS 3240 - Advanced Software Engineering at University of Virginia, by Colin Butler

0 Comments
3 Likes
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total views
3,464
On SlideShare
0
From Embeds
0
Number of Embeds
453
Actions
Shares
0
Downloads
0
Comments
0
Likes
3
Embeds 0
No embeds

No notes for slide
  • I chose to title this Interaction Design because while it isn’t the broadest of the disciplines discussed here, it is broad enough without becoming vague or partially irrelevant. IxD is the closest match I can think of to the set of concerns most relevant to software engineering and development.
  • Ergo…
  • Technically, the Venn diagram should be a 3D tetrahedron. Technically, it should also have about seven or more disciplines and be some kind of crazy 3D shape I don’t know the word for. But if it was a tetrahedron…User-centric design: allUsability design: IA, CP, GDUser experience design: allUser interface design: CP, GD, IDInteraction design: allHuman factors engineering: CP, ID, IAErgonomics: CP, IDTake questions.
  • Also: game systems. Before this generation, what was the UX of any system?Wii is fastest-selling system in history
  • N-Gage: side-talkin’ was part of the user experience, and that user experience was to feel like an idiot every time you tried to use your phone.
  • * Kindle is probably about to get beat up and have its lunch money stolen, but that doesn’t mean it didn’t have a very good user experience. User satisfaction has been good, and it wrote the book on modern e-readers with the concept of an available-anywhere bookstore, long battery life, and eye-friendly screen.
  • Allow me to digress.Emotional affect, by way of Don Norman: Consider a plank resting on two cinder blocks. Walk down it.Now raise it 200 ft. off the ground. It’s a different game, but shouldn’t be.Happy people think breadth-first, depressed/frustrated people think depth-first.Breadth-first tends to solve problems more easily.Happy person -> fewer problems -> more gooder
  • Misapplying a design pattern will often do far more harm than good.
  • Google Wave scrollbars are awful.So how do we feel about it? Ready to talk about making it happen? Any questions?
  • Not really “doing usability” but “implementing a user-centered design process”
  • If you’re Netflix, for example, it’s better not to have your developers refer to a “MailableInventoryItem” when they could just call it a “DVD”
  • With the definition of “mental model”, the goal becomes somewhat self-evident.Mental model: how your user perceives the system to work.
  • Office 2007 ribbon was usability tested using Powerpoint. When a user stated he “really liked that the mouse wheel changed tabs in the ribbon,” the designers ended up adding that functionality.
  • Usability professionals are still a good idea, but reading Rocket Surgery Made Easy will help more than it hurts for most.
  • Educate everyone on the teamConsider UX early and often (always)Information/Architecture - Each affects the other (not a fan of this bit-- fix?)Information: the contentArchitecture: the system displaying the contentFresh perspectives whenever possibleInterviews and user researchMarket surveys-- what is everyone else doing?Usability tests (fast and cheap)Hallway interviews and testsStay up to date with the current state of the art through research, conferences, etc.Know your user and let them design for youAlways ALWAYS involve users or representatives of the users if possibleUse the terminology they would use, even in developmentGet as much user input as possible
  • Also, http://www.colingrantbutler.com
  • http://www.wired.com/wired/archive/11.09/ppt2.htmlhttp://www.edwardtufte.com/bboard/q-and-a-fetch-msg?msg_id=0001yB
  • Interaction Design Guest Lecture - UVA CS 3240

    1. 1. Interaction Design<br />Colin Butler<br />BS Computer Science, NCSU<br />MS Human-Computer Interaction, NCSU<br />March 15 2010<br />
    2. 2. Many, many names<br />User-centered design<br />Usability design<br />User experience design<br />User interface design<br />Interaction design<br />Human factors engineering<br />Ergonomics<br />And more…<br />
    3. 3. Userbilitexperinterfactornomic Design<br />Colin Butler<br />BS Computer Science, NCSU<br />MS Human-Computer Interaction, NCSU<br />March 15 2010<br />
    4. 4. Making users happy<br />Colin Butler<br />BS Computer Science, NCSU<br />MS Human-Computer Interaction, NCSU<br />March 15 2010<br />
    5. 5. Incorporating the user into the design process is a good idea.<br />
    6. 6. A good idea is one that makes money.<br />
    7. 7. The money your business makes probably comes from the user.<br />
    8. 8. Incorporating the user into the design process is a good idea.<br />QED.<br />
    9. 9. Back to the names<br />User-centered design<br />Usability design<br />User experience design<br />User interface design<br />Interaction design<br />Human factors engineering<br />Ergonomics<br />
    10. 10. What’s the upshot of it all?<br />Well, it depends.<br />Different people do different things for different projects.<br />
    11. 11. Why bother?<br />What’s the dollar value of usability?<br />It’s a [productivity/admin/reference/functional] tool, not a video game.<br />The user can live with having a few extra clicks in there once in a while.<br />What, do we get paid for each happy user?<br />
    12. 12. In an existing market<br />Differentiate your product and gain the upper hand<br />
    13. 13. In a new market<br />Do it right: land on your feet, make money<br />
    14. 14. Mint.com<br />Personal finances online<br />
    15. 15. In a new market<br />Do it wrong: crash, burn.<br />
    16. 16. User experience success stories<br />Apple (OS X, iMac, MacBook, iPod, iPhone)<br />Windows 7<br />Flip Video<br />Kindle*<br />
    17. 17. Here’s where it gets interesting…<br />“Attractive things work better.”<br />Emotional Design, Donald Norman<br />
    18. 18. But how do you do it?<br />
    19. 19. There are 10 types of people in the world…<br />Tradition vs. innovation<br />Design patterns vs. novel interaction<br />Old vs. new<br />
    20. 20. Stealing others’ work<br />
    21. 21. Design patterns<br />No need to reinvent the wheel<br />Scroll bar<br />Tabs<br />Breadcrumbs<br />Wizard<br />Preview pane<br />Tooltip<br />And so on…<br />
    22. 22. Design patterns<br />The work’s already been done<br />Users are probably already familiar<br />They’re patterns because they work<br />Use these whenever possible.<br />Caveat: Not everything has been solved, and you should NEVER use a design pattern to solve the WRONG problem.<br />
    23. 23. Novel interactions<br />I’d list some, but they haven’t been invented yet.<br />
    24. 24. Novel interactions<br />Tailored to a specific problem<br />Can be fresh, exciting to a user<br />BUT<br />Users still have to learn how to use it.<br />Caveat: NEVER innovate for the sake of innovation.<br />
    25. 25. Doing usability in ∞easy steps<br />Review<br />Design<br />Test<br />Repeat<br />
    26. 26. Doin’ some usability, step one: Review<br />Domain research and requirements gathering<br />When in doubt, ask the users: interviews and surveys<br />Pro tip: Develop your lexicon and live (i.e. develop) by it. Trust me, this will be useful later.<br />
    27. 27. Ergonomication, step two: Design<br />a.k.a. “The fun part”<br />The tools of the trade: mockups, prototypes, personas, and use cases<br />The goal: create a mental model in your user that matches the operational model of your system as closely as possible.<br />Buy a very large whiteboard.<br />
    28. 28. Human factoring, step three: Testing<br />Test early, test often.<br />Test during design: paper prototypes, interactive mockups<br />Test during development: if it doesn’t crash the computer, explode your server, and erase your Tivo’ed episodes of Jersey Shore, you can put it through a usability test.<br />
    29. 29. Usabilitating, step three point five: Usability testing<br />Very complicated, difficult, and highly involved process :<br />Watch a user use stuff.<br />
    30. 30. Usabilitating, step three point five: Usability testing<br />Ask the user to think out loud<br />Stay removed unless help is absolutely needed<br />Record as much as you can<br />Cheap and easy usability testing:<br />Rocket Surgery Made Easy by Steve Krug<br />
    31. 31. Best practices (or at least some Good Ones)<br />Educate everyone on the team<br />Consider UX early and often (always)<br />Incorporate fresh perspectives whenever possible<br />Know your user and let them design for you<br />
    32. 32. Questions?<br />Thank you!<br />Picture credits<br />Flickr: clodius_maximus, Jeezny, KaworuKoneru, Move The Clouds, silgeo, Steve Wampler, Yannig Van de Wouwer<br />www.edwardtufte.com<br />www.bruceongames.com<br />colin.butler@gmail.com<br />http://www.arghonomics.com <br />Twitter: cbutlerUX<br />
    33. 33. Sidebar: PowerPoint is evil<br />“PowerPoint is evil.” – Edward Tufte<br /> Bulleted hierarchy can alter information relationships.<br /> PowerPoint templates create gaudy, chaotic visuals.<br /> Low-density slides lead to information spanning time, whereas people consume information better visually.<br />

    ×