User Experience Design: 5 Techniques for Creating Better Websites and Applications
Upcoming SlideShare
Loading in...5
×
 

User Experience Design: 5 Techniques for Creating Better Websites and Applications

on

  • 1,311 views

 

Statistics

Views

Total Views
1,311
Views on SlideShare
1,311
Embed Views
0

Actions

Likes
0
Downloads
6
Comments
0

0 Embeds 0

No embeds

Accessibility

Categories

Upload Details

Uploaded via as Adobe PDF

Usage Rights

© All Rights Reserved

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
    Processing…
Post Comment
Edit your comment

User Experience Design: 5 Techniques for Creating Better Websites and Applications User Experience Design: 5 Techniques for Creating Better Websites and Applications Presentation Transcript

  • User Experience DesignFive Techniques for Creating Websites and Applications ICE Conference | November 3, 2011
  • About Us• Founded in 2003• Edmonton & Toronto- User experience research, strategy & design - Evaluate performance of websites, apps and intranets - Understand customer needs to create better products - Design: requirements, content analysis, information architecture, interface and interaction.
  • Clients
  • “We’re getting a lot of callsabout ________”
  • “It looks great but I can’tdo ________”
  • “Our customers can’t find________”
  • The Problem- Success rates for IT Projects - 32% Succeed - 44% Challenged - 24% FailedSource: 2009 Standish CHAOS Reports
  • Why does this happen?Top reasons were...- Lack of user input- Incomplete requirements- Changing requirementsConsistent over the last 10 years!
  • User experience can help.
  • What is UX?“A term used to describe the overallexperience or satisfaction a user has with aproduct or service”
  • What is UX?A holistic practice of designing a product orsystem to achieve a set of objectives:- Positive experience for the user (useful, pleasurable, fun, unobtrusive, helpful)- Specified business goals (increased revenue, cost avoidance, streamlined processes)
  • Five Techniques1. Design Early2. Test Early and Often3. Make Prototypes4. Focus on Behaviour5. Make Good Mistakes
  • Why Bother?- People expect good software because they use it every day- More successful projects- Reduce ongoing expenditures like training and support
  • 1. Design Early
  • What is “design” anyway? Typical Approach on IT ProjectsRequirements → Development → Design System & business Building system Colours documentation components & fonts
  • Rethinking Design“The engineer, and moregenerally the designer, isconcerned with how thingsought to be - how theyought to be in order toattain goals, and tofunction.” Herbert Simon
  • Rethinking Design“In most people’svocabularies, design meansveneer. It’s interiordecorating... But to me,nothing could be further fromthe meaning of design. Designis the fundamental soul of ahuman-made creation that Steve Jobsends up expressing itself insuccessive outer layers of theproduct or service.”
  • Rethinking Design“Design is how it works” Steve Jobs
  • How do we design earlier?• Think of design as part of the requirements process• Use low-fidelity techniques to generate lots of ideas• Use visual deliverables to get agreement
  • Design as Requirements• Recognize that user experience and business analysis are complementary activities• Visual BA: using design to create better requirements
  • BA/UX Functional Interface Development Visual Design Users Stakeholders Process Modelling & Improvement Data Modelling & Analysis Use Cases TechnicalAdapted from Business Analysis & User Experiencehttp://www.modernanalyst.com/Resources/Articles/tabid/115/articleType/ArticleView/articleId/1892/Business-Analysis-and-User-Experience.aspx
  • BA/UXAdapted from Business Analysis & User Experiencehttp://www.modernanalyst.com/Resources/Articles/tabid/115/articleType/ArticleView/articleId/1892/Business-Analysis-and-User-Experience.aspx
  • 2. Make Prototypes
  • What’s a Prototype?• A prototype is a visual model of a system.
  • Kinds of Prototypes• Sketches• Flows• Mock-ups• Wireframes & Documentation
  • Why Prototype?• A common language that everyone understands• An inexpensive way to make mistakes• An inexpensive way to explore ideas• A tool to iterate and refine• A way to document design
  • Common Language• Pictures can be understood by everyone• Pictures raise questions• Pictures reveal hidden problems
  • Iteration• Prototypes let us iterate easily• Explore options and ideas• Throw away bad ideas (no sunk costs)• Test vehicle (crash them and see what happens)
  • 3. Engage Users Early & Often
  • • UAT vs. Usability Testing• Evaluation methods• You vs them
  • UX, Usability & UAT Positive experience for users UX System can be used efficiently Usability User Acceptance Testing System meets requirements
  • You vs. Them• Intelligent• Analytical• Comfortable with technology• Comfortable with complexity• Hackers or tinkerers• Not always comfortable with ambiguity• Invested in your projects
  • Them• Not as smart as you• Less comfortable with technology• Less comfortable with complexity, abstraction• Just want things to work• Can describe problems, not great at describing solutions
  • Ways to Engage Users• Conversations!• Workshops• Surveys• Usability Evaluation
  • Survey Tools• Surveymonkey• Optimal Workshop• Usertesting.com
  • 4. Focus on Behavior
  • Video from The Simpsons episode 215 where Homer designs his own car (removed)
  • What can we do instead?• Ask questions about what people do instead of what they want.• Keep questions open-ended• Listen to their problems• Do not sell ideas or attempt to get their agreement on a solution • E.g. “would it help if you had a really robust search interface?”
  • 7 Kinds of Questions Task Can you show me how you make tea? Sequence Walk me through the steps. Specific Example What did you do the last time you made tea? Peer Comparison Do other people do it that way? Project Ahead How do you think you’ll make tea in 5 years? Exhaustive List What are the things you use when you make tea? Other Viewpoint What do coffee drinkers think about the way you make tea?Adapted from work by Steve Portigal
  • Teatumbler from Kicker Studio
  • 5. Make Good Mistakes
  • Mistakes!Good Mistakes Bad Mistakes- Recognized early - Cause critical failures and corrected - Are expensive to fix- Part of an - Caught late (end of exploratory process project or in- Teach us something production) new about a problem
  • "He was gifted with the special capability ofmaking many mistakes, mostly in the rightdirection. I envied him this and tried in vain toimitate him, but found it quite difficult to makegood mistakes." Yutaka Taniyama
  • “Mistakes are the portalsof discovery.” James Joyce
  • "Anyone who has never madea mistake has never triedanything new." Albert Einsten
  • How do we make good mistakes?- Start with low-fidelity tools- Generate lots of ideas
  • Sketches Mockups Design
  • http://culturedcode.com/things/iphone/makingof/ThingsTouch-PaperCollage.jpg
  • Which option do you prefer? 1 2 3 4 5 6
  • 3-5-3 Exercise• 3-5-3• Give everyone three minutes to sketch out 5 ideas• Repeat three times• Post the ideas on a white board and discuss.
  • Five Techniques1. Design Early2. Test Early and Often3. Make Prototypes4. Focus on Behaviour5. Make Good Mistakes
  • Benefits- Reduce costs - Less rework, more clarity - Less training and support- Reduced risk - Lower chance of failure- Improve adoption, satisfaction
  • Development Cheaper to find and fix problems early in the project Design $1 $5 $10
  • Budget Too often we catch user experience problems late in projects when there’s no budget to fix them. Time
  • Resources UX Cards http://nform.com/cards
  • Thank you!gene.smith@nform.com | @gsmith http://nform.com | @nform