Designing Better Experiences - UX London 2013

  • 1,375 views
Uploaded on

Slides from the workshop @danny_bluestone and @duckymatt from Cyber-Duck Ltd gave at UX London 2013. The workshop focused on how by putting the user at the centre of design decisions you can deliver a …

Slides from the workshop @danny_bluestone and @duckymatt from Cyber-Duck Ltd gave at UX London 2013. The workshop focused on how by putting the user at the centre of design decisions you can deliver a better experience. With a mixture of theory and hands-on activities the workshop covered user research, activity mapping, card sorting and participative sketching techniques.

  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
    Be the first to comment
No Downloads

Views

Total Views
1,375
On Slideshare
0
From Embeds
0
Number of Embeds
9

Actions

Shares
Downloads
19
Comments
0
Likes
2

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

Transcript

  • 1. DESIGNING BETTEREXPERIENCESTHROUGH A USER CENTRED APPROACHDanny Bluestone | @danny_bluestoneMatt Gibson | @duckymatt
  • 2. WHAT ISUSER CENTREDDESIGN?
  • 3. The central premise of user centred design isthat the best designed products and servicesresult from understanding the needs of thepeople who will use them.
  • 4. SOME BENEFITS OF UCD1.  Qualitative - Find out what customers actually want.2.  Context – Discover the exact context to design for.3.  Creativity – Combine UCD with branding.4.  Focus - Avoid ‘analysis paralysis’.5.  Remove egos– Verify decisions with real customers.
  • 5. h"p://xkcd.com/773/  GIVING USERS WHAT THEY NEEDNOT WHAT YOU THINK THEY NEED
  • 6. h"p://www.flickr.com/photos/matski_98/8259750205/  TAKE TIME TO OBSERVEHOW PEOPLE USE YOUR DESIGN
  • 7. TIMOTHY PRESTRO, CEO of DMT  DESIGN FOR PEOPLE, NOT AWARDSh"p://designthatma"ers.org/por@olio/projects/  
  • 8. DESIGN FOR OUTCOMES  www.ted.com/talks/Cmothy_prestero_design_for_people_not_awards.html  and  h"p://www.designthatma"ers.org/pictures/dtm_blog/Baby_in_Firefly.JPG    
  • 9. If the engineers could, theyd give you 40 buttons, butwhen youre driving its not that easy to use them all, soits better to have the ones you really need.The key thing is to make it simpler without getting rid ofstuff that I might need to make the car go quicker.h"p://www.flickr.com/photos/simonw92/8534697674/  LEWIS HAMILTON ON UCD
  • 10. As we reform the delivery of public services,they are designed around the needs of the user, ratherthan has been far too often the case in the past, beingdesigned to suit the convenience of the government.Francis Maude, MP
  • 11. Approaches DisciplinesUser centred designSelf designActivity centred designGenius designInteraction designInformation architectureUsability testingResearch
  • 12. IS UCD ALWAYS THE BESTAPPROACH?
  • 13. h"p://www.flickr.com/photos/centralasian/5577225117  
  • 14. USERS ARE NOT DESIGNERSIT IS USER CENTRED DESIGN,NOT USER CONTROLLED DESIGN
  • 15. THERE IS NO SUCH THINGAS A ONE-SIZE-FITS-ALLAPPROACHFOCUS ON OUTCOMES NOT DELIVERABLES
  • 16. USABILITY IS NOT A FEATUREIT DEPENDS ON THE USER, THE ENVIRONMENT,THE TASK, AND OTHER CONTEXTUAL FACTORSh"p://www.flickr.com/photos/oewf/2924217723/  
  • 17. HOW WE APPROACH UCD1. Research2. Design / prototype3. Test4. Improve
  • 18. RESEARCHING REQUIREMENTS
  • 19. FRONT-LOADINGSTAKEHOLDER INTERVIEWS• Why is it being made?• Who are the key stakeholders and what are their goals?• How does it fit in with the wider company objectives?• Gain insight into market and target audiences• Identify competitors early onh"p://goodkickoffmeeCngs.com/2010/04/stakeholder-­‐frontloading/    
  • 20. TECHNIQUES FOREFFECTIVE INTERVIEWS• Create an informal and relaxed atmosphere• Stay flexible• Keep it one-on-one• Allow them to speak ‘off-the-record’
  • 21. The turning point in many interviews is when theinterviewee gets up and closes the office door andlowers their voice.Paul Boag, Headscapeh"p://boagworld.com/business-­‐strategy/how-­‐to-­‐improve-­‐your-­‐site-­‐using-­‐stakeholder-­‐interviews/  
  • 22. DEFINING CONTEXT OF USE1.  User profiles2.  Activities3.  Environment
  • 23. •  Speak to existing users if possible•  Competitors•  Ethnographic studies / research•  Expert insightTIPS FOR GETTING INSIGHTINTO USER PROFILES
  • 24. THE BEST USER PERSONASARE BASED ON REAL USERSh"p://www.flickr.com/photos/patloika/7946438528  
  • 25. •  Ethnio for existing users•  Social media•  Go to the physical locations where you’ll findyour users•  Use professional recruitersHOW DO I FIND MY USERS?h"p://www.flickr.com/photos/oatsy40/6783078815/  
  • 26. Accessibility is the degree to which anyone can access anduse a website using any web browsing technology.RNIBh"p://www.rnib.org.uk/professionals/webaccessibility/background/Pages/background.aspx  h"p://www.flickr.com/photos/furbyx4/2968376257/  
  • 27. WHAT ACTIVITIES DO YOURUSERS NEED TO PERFORM?h"p://www.flickr.com/photos/fernando/36759033  
  • 28. FREQUENCYWHAT WILL THE USER NEED TODO MOST OFTEN?
  • 29. CRITICALCAN BE INFREQUENT,BUT IT IS CRITICAL TO SUPPORT THEM
  • 30. ENVIRONMENT ANALYSIS•  Physical•  Social / cultural•  Technical
  • 31. DESIGN / PROTOTYPING
  • 32. CARD SORTING•  The ‘base’ for your information architecture.•  Gets insights and patterns into users ‘mental model’.•  It helps to increase findability in a system.
  • 33. The current recommendation is to test 15 users for cardsorting in most projects, and 30 users in big projects...Jakob Nielsen, Nielsen Norman Group
  • 34. TECHNIQUES FORCARD SORTING• Use lots of post-it notes or cards• Get users to sort the cards in open or closed groups• Your main job is to observe and keep the momentum• Learn from the patterns of different groups via analysis• Helps to create a record of the structure/taxonomy
  • 35. HICKS’S  LAW  “THE  MORE  CHOICES  YOU  HAVE  TO  CHOOSE  FROM,  THE  LONGER  IT  TAKES  FOR  YOU  TO  MAKE  A  DECISION.”  h"p://www.cirencalui.com/  
  • 36. INTRODUCINGINTERACTION DESIGN (IxD)• Helps to map out ‘flows of control’• Progresses to sketching and prototyping• Pivotal at delivering functional specifications
  • 37. “THE  TIME  REQUIRED  TO  RAPIDLY  MOVE  TO  A  TARGET  AREA  IS  A  FUNCTION  OF  THE  DISTANCE  TO  AND  THE  SIZE  OF  THE  TARGET”  FITT’S  LAW  h"p://modetro.com/mb-­‐games-­‐simon-­‐says-­‐vintage-­‐retro-­‐game-­‐70s  
  • 38. TECHNIQUES FORINTERACTION DESIGN (IxD)•  Use personas and interviews to inform the design.•  Competitor research see what is already out there.•  Ethnography can help you to understand real users.•  Validate what you do with real users as early as possible.
  • 39. IxD –FLOW OF CONTROL EXAMPLEh"p://wc1.smartdraw.com/examples/content/examples/01_flowcharts/4_other_flowcharts/control_flow_epc_diagram_flowchart_l.jpg  
  • 40. IxD – PROTOTYPEh"p://www.infoq.com/resource/arCcles/wireframes-­‐start-­‐development-­‐projects/en/resources/3fig1.jpg  
  • 41. START PROTOTYPESWITH PEN AND PAPERh"p://www.flickr.com/photos/furbyx4/2968376257/  
  • 42. I do not know the cognitive reasons behind this, but Ihave never seen this not be true. The more human yourpicture, the more human will be the response.Dan Roam, Back Of The Napkinh"p://www.thebackokhenapkin.com/  
  • 43. PARTICIPATORY SKETCHING TIPS•  Encourage low fidelity•  Review as a group•  Frame critique with user stories
  • 44. TEST / EVALUATE
  • 45. DESIGNS ARE HYPOTHESESITERATE QUICKLY AND TEST ASSUMPTIONS
  • 46. ETHNOGRAPHYh"p://www.flickr.com/photos/alui0000/4814280779  
  • 47. GUERILLA USER TESTINGh"p://www.flickr.com/photos/5tein/3609261904  
  • 48. Lets us see how our study participants scan thesearch results page, and is the next best thing toactually being able to read their minds.Anne Aula and Kerry Rodden, User Experience Researchers, GoogleGOOGLE ON EYE TRACKINGh"p://www.japantoday.com/images/size/x/2013/03/urn%3Apublicid%3Aap.org%3A83a7bae63f044nc938d2f4bea94d862.jpg  
  • 49. INTERVIEWSh"p://uxmag.com/arCcles/eye-­‐tracking-­‐the-­‐best-­‐way-­‐to-­‐test-­‐rich-­‐app-­‐usability  
  • 50. OTHER METHODS OFUSER FEEDBACK•  Click tracking tools•  A/B and MVT testing•  Remote user testing•  Expert reviews
  • 51. BALANCING UCD WITHCLIENT’S NEEDS
  • 52. WHAT WE’VE COVERED•  What is user centred design – Benefits / pitfalls•  Usability is not a feature•  Researching users and activities•  Paper prototyping•  Getting user feedback
  • 53. THANK YOU!Danny Bluestone | @danny_bluestoneMatt Gibson | @duckymatt