Your SlideShare is downloading. ×
0
You Don't Know C.R.A.P. about UX/UI
You Don't Know C.R.A.P. about UX/UI
You Don't Know C.R.A.P. about UX/UI
You Don't Know C.R.A.P. about UX/UI
You Don't Know C.R.A.P. about UX/UI
You Don't Know C.R.A.P. about UX/UI
You Don't Know C.R.A.P. about UX/UI
You Don't Know C.R.A.P. about UX/UI
You Don't Know C.R.A.P. about UX/UI
You Don't Know C.R.A.P. about UX/UI
You Don't Know C.R.A.P. about UX/UI
You Don't Know C.R.A.P. about UX/UI
You Don't Know C.R.A.P. about UX/UI
You Don't Know C.R.A.P. about UX/UI
You Don't Know C.R.A.P. about UX/UI
You Don't Know C.R.A.P. about UX/UI
You Don't Know C.R.A.P. about UX/UI
You Don't Know C.R.A.P. about UX/UI
You Don't Know C.R.A.P. about UX/UI
You Don't Know C.R.A.P. about UX/UI
You Don't Know C.R.A.P. about UX/UI
You Don't Know C.R.A.P. about UX/UI
You Don't Know C.R.A.P. about UX/UI
You Don't Know C.R.A.P. about UX/UI
You Don't Know C.R.A.P. about UX/UI
You Don't Know C.R.A.P. about UX/UI
You Don't Know C.R.A.P. about UX/UI
You Don't Know C.R.A.P. about UX/UI
You Don't Know C.R.A.P. about UX/UI
You Don't Know C.R.A.P. about UX/UI
You Don't Know C.R.A.P. about UX/UI
Upcoming SlideShare
Loading in...5
×

Thanks for flagging this SlideShare!

Oops! An error has occurred.

×
Saving this for later? Get the SlideShare app to save on your phone or tablet. Read anywhere, anytime – even offline.
Text the download link to your phone
Standard text messaging rates apply

You Don't Know C.R.A.P. about UX/UI

2,672

Published on

I taught a class titled "You Don't Know C.R.A.P. about UX/UI" for SkillShare Philadelphia on 8/23/11. For more information on the class visit: …

I taught a class titled "You Don't Know C.R.A.P. about UX/UI" for SkillShare Philadelphia on 8/23/11. For more information on the class visit: http://www.skillshare.com/You-Dont-Know-CRAP-about-UX-UI/1632896614/

Published in: Technology, News & Politics
0 Comments
3 Likes
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total Views
2,672
On Slideshare
0
From Embeds
0
Number of Embeds
4
Actions
Shares
0
Downloads
33
Comments
0
Likes
3
Embeds 0
No embeds

Report content
Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
No notes for slide
  • This is how we figure out what the user wants
  • Baby steps. The first way to get your eyes thinking in the right direction. People like symmetry, and interfaces should be even, aligned.
  • Class Participation
  • What would you put the emphasis on? What are the most important things people should know?
  • This is where consistency and standards go a long way.
  • Transcript

    • 1. You Don’t Know C.R.A.P. about UX & UI
    • 2. Who am I?
      Philadelphia (‘burbs) born and raised.
      B.S. in Systems & Information Engineering from UVA – 2005
      Masters of Information from UC-Berkeley – 2007
      First UI Design Project: Touch Screen Treadmill Interface
      Current Position: Lead Interaction Designer at The Cadient Group
    • 3. Who are you?
    • 4. Lets Play a Game!
    • 5. What is User Experience?
      All aspect’s of user’s interaction with the company, its services and its products. Not only in relationship to software.
      Meet the needs of the customer.
      Make the products enjoyable.
      Go beyond what the customer says they want.
      *Nielsen-Norman Group
    • 6. Gulf of Evaluation
      We want a small gulf!
      The common goal of all products
      The user:
      Starts with a goal
      Translates to an intention
      Translates to a sequence of actions
      The amount of effort a person must exert to interpret a display:
      Perceive
      Interpret
      Evaluate
      *Norman, D. The Gulf of Evaluation
    • 7. Small Gulf of Evaluation
    • 8. I am not the user
      …your teammates are not the users. And, the customer is not always the user.
    • 9. User Centered Design
      Needs Assessment
      Personas
      Goals
      Task Analysis
      User Scenarios
      Comparative Analysis
      Design
      Initial Sketches, Interaction Diagrams
      Low-Fidelity Prototyping
      High-Fidelity Prototyping
      Build
      Evaluate
      Low-Fidelity Usability Testing
      Heuristic Evaluation
      Formal Usability Tests
      Repeat, Repeat, Repeat
    • 10. The user is always right
      …but they never know what they need.
    • 11. Personas
      When to use: The end-users’ goals are unclear, the team isn’t sure how to prioritize features
      Why:
      Identify your most important customers
      Identify user goals and objectives.
      Capture use cases for the product
      Develop an idea for the market
      Have a common “person” to point to
      Tool to Try:Usersbox.com
    • 12. Personas:
      Who are the students?
      What matters from students’ point of view?
      What are their goals?
      What about the teacher?
      What matters for the business?
    • 13. Task Analysis
      When to use: At the beginning of every design cycle.
      How to use:
      Break a goal into specific tasks.
      These tasks may be referred to as requirements
      Assign a priority to these requirements based on user research and business needs.
      Low, Medium, High or N/A
    • 14. Task Analysis
      Lets Try an Example
    • 15. Are we ready to sketch?
    • 16. Prototype & Test
      Repeat, repeat, repeat
    • 17. Lo-Fidelity Prototyping a.k.a wireframes
      When to use: To signal the flow of interaction, To separate the content from layout & display, When the designer is not the developer
      Value: Save on development time, realize design problems early before making big investments.
      Heavyweight Tools: Visio, Fireworks, OmniGraffle
      Mediumweight Tools:Balsamiq(Cross Platform)SimpleDiagrams (Mac), Mockingbird (Web)
      Lightweight Tools: Marker & Paper or Whiteboard,
    • 18. Visual Design in UI Design
      Contrast: If they’re not the same, make them different
      Repetition: Repeat colors, shapes, fonts & sizes. Reuse patterns.
      Alignment: Line things up. Make it clean.
      Proximity: Group LIKE things. Put similar information close together. Organize & De-Clutter
    • 19. User Scenarios & Interaction Diagrams
    • 20. Design Exercise
      Re-organize a flier
    • 21. Point out C.R.A.P. in Google Search
    • 22.
    • 23. Metaphors and UI Patterns
      Map to some facet of the real world task
      Direct engagement & manipulation
      Lots of resources out there:
      UI-Patterns.com
      Yahoo! Design Pattern Library
      Book: Designing Interfaces by Jenifer Tidwell
      Site: http://designinginterfaces.com/firstedition/
    • 24. Example Metaphor
    • 25. Why we test:
      VCR Buttons to Control a Printer
      Tabs of Arbitrary Groups
      Samples from Interface Hall of Shame
    • 26. Usability Testing
      Test if a page becomes more usable because of the layout.
      What does the layout communicate?
      Guidelines:
      Test the interface, not the user
      Give clear scenarios and tasks to accomplish
      Quick & Dirty: Not much time, Grab a co-worker
      Formal: Determine time requirements for task completion, compare two designs on measurable aspects
      Requires Experiment Design
    • 27. Discount Usability Testing
      Usability Heuristics
      Visibility of system status
      Match between system and the real world
      User control and freedom
      Consistency and standards
      Error prevention
      Recognition rather than recall
      Flexibility and efficiency of use
      Aesthetic and minimalist design
      Help users recognize, diagnose, and recover from errors
      Help and documentation
      How
      Use on Lo or Hi-Fidelity Prototypes, or built products
      Use a small set of 3-5 evaluators
      Check for compliance with usability principles
      *Jakob Nielsen
    • 28. What’s wrong with this website?
    • 29. Is this familiar?
    • 30. Training is Not an Excuse for Poor Design
    • 31. Resources
      Books
      The Design of Everyday Things by Donald Norman
      Usability Engineering by Jakob Nielsen
      The Inmates are Running the Asylum by Alan Cooper
      GUI Bloopers by Jeff Johnson
      PhillyCHI
      Websites
      DesigningInterfaces.com
      Use-it.com
      UI-Patterns.com
      UXMag.com
      AListApart.com
      Local Groups

    ×