IMD09117 and IMD09118  Web Design and Development Usability and User Centred Design.
Reminder of the 5 planes model Last week we looked at the strategy plane. We discussed understanding both the client’s and...
What is Usability? “ Usability is a quality attribute relating to how easy something is to use.  More specifically, it ref...
People want things to work <ul><li>There is nothing more frustrating than not being able to use something that should be s...
Don’t Make Me Think
Usability is about making objects easy and  comfortable to use for anyone. <ul><li>It’s next to traffic lights. </li></ul>...
Tolerance <ul><li>10 years ago, Web sites were new and exciting.  As the world wide web has developed, it has become more ...
Frustration <ul><li>People expect Websites to be as easy to understand as a Pelican crossing. </li></ul><ul><li>Not being ...
Access <ul><li>If we look back to our first lecture we were trying to understand what a website is. If we consider the exa...
Access <ul><li>Not all users want the same information in the same way at the same time so we can’t just think about who u...
Factors to consider <ul><li>Who is using the site? </li></ul><ul><li>What do they want from the site? </li></ul><ul><li>Ho...
Cinema Website <ul><li>Pair up and consider this exercise. </li></ul><ul><li>You have been asked to develop a website for ...
Jakob Nielsen <ul><li>Jakob Nielsen is one of the world’s foremost authorities in Interaction Design. </li></ul><ul><li>Ni...
Main problems in Usability In the .net article from December 2006 Nielsen highlighted the primary problems people have usi...
Nielsen’s Top Ten <ul><li>These are from an online survey conducted by Jakob Nielsen. </li></ul><ul><li>Legibility problem...
Non standard links <ul><li>Links are one of the most important things people use on the Web.  </li></ul><ul><li>Make them ...
Google is usable <ul><li>Make it obvious where users will go if they use the link. </li></ul>Make them clear and obvious. ...
Nielsen’s Top Ten continued <ul><li>Flash </li></ul><ul><ul><li>This is a contentious issue. </li></ul></ul><ul><li>Conten...
Nielsen’s Top Ten continued <ul><li>Browser incompatibility </li></ul><ul><ul><li>Don’t design sites for only one browser ...
<ul><li>The title of a book by Steve Krug. </li></ul><ul><li>Good web design doesn’t usually get commented or congratulate...
Upcoming SlideShare
Loading in …5
×

Week 4 - A User Centred Design

416 views

Published on

Published in: Technology, Business
  • Be the first to comment

Week 4 - A User Centred Design

  1. 1. IMD09117 and IMD09118 Web Design and Development Usability and User Centred Design.
  2. 2. Reminder of the 5 planes model Last week we looked at the strategy plane. We discussed understanding both the client’s and the users point of view. We considered how a website was built from 3 main perspectives. This week we will discuss what is meant by Usabillity and User Centred Design.
  3. 3. What is Usability? “ Usability is a quality attribute relating to how easy something is to use. More specifically, it refers to how quickly people can learn to use something, how efficient they are while using it, how memorable it is, how error-prone it is, and how much users like using it. If people can’t or won’t use a feature, it might as well not exist.” Nielsen &Loranger (2006) This image is copyright free and was distributed to promote World Usability Day.
  4. 4. People want things to work <ul><li>There is nothing more frustrating than not being able to use something that should be simple. </li></ul>Images courtesy of baddesigns.com
  5. 5. Don’t Make Me Think
  6. 6. Usability is about making objects easy and comfortable to use for anyone. <ul><li>It’s next to traffic lights. </li></ul><ul><li>There’s a picture of a man waiting and another of a man walking. </li></ul><ul><li>There are special surfaces on the pavement and markings on the road. </li></ul><ul><li>There are often crash barriers either side. </li></ul><ul><li>You probably have previous experience of road crossings. </li></ul>We know how to work it because there’s only 1 button. If you don’t read English, you can still understand it’s a crossing by visual cues. Although it helps if you read English, pelican crossings are reasonably straightforward to use. Picture courtesy of HMSO
  7. 7. Tolerance <ul><li>10 years ago, Web sites were new and exciting. As the world wide web has developed, it has become more mundane and is seen as a tool, an everyday object. </li></ul>
  8. 8. Frustration <ul><li>People expect Websites to be as easy to understand as a Pelican crossing. </li></ul><ul><li>Not being able to get information they want or buy something quickly and easily makes people feel stupid. </li></ul><ul><li>If you make people feel stupid, they will just walk away. </li></ul>
  9. 9. Access <ul><li>If we look back to our first lecture we were trying to understand what a website is. If we consider the example of a road crossing, we can imagine the user on one side of the road and the information, service or entertainment they want on the other side of the road. </li></ul>
  10. 10. Access <ul><li>Not all users want the same information in the same way at the same time so we can’t just think about who uses our Website. </li></ul><ul><li>We need to consider many other factors. </li></ul>
  11. 11. Factors to consider <ul><li>Who is using the site? </li></ul><ul><li>What do they want from the site? </li></ul><ul><li>How long are they going to want to spend on the site? </li></ul><ul><li>When are they using the site? </li></ul><ul><li>How often will they visit the site? </li></ul>
  12. 12. Cinema Website <ul><li>Pair up and consider this exercise. </li></ul><ul><li>You have been asked to develop a website for an independent local cinema. </li></ul><ul><li>List the different questions that someone might use the website to answer. </li></ul><ul><li>How long do you think people will be prepared to spend finding this information? </li></ul>
  13. 13. Jakob Nielsen <ul><li>Jakob Nielsen is one of the world’s foremost authorities in Interaction Design. </li></ul><ul><li>Nielsen has been at the heart of the usability debate for many years. </li></ul><ul><li>His website www.useit.com is the first resource for usability. </li></ul>Picture from .net magazine 157 dec 2006 used with permission
  14. 14. Main problems in Usability In the .net article from December 2006 Nielsen highlighted the primary problems people have using a site. We will look at the top ten.
  15. 15. Nielsen’s Top Ten <ul><li>These are from an online survey conducted by Jakob Nielsen. </li></ul><ul><li>Legibility problems. </li></ul><ul><ul><ul><li>Poor fonts. </li></ul></ul></ul><ul><ul><ul><li>Fonts that are too small. </li></ul></ul></ul><ul><ul><ul><li>Poor contrast between </li></ul></ul></ul><ul><ul><ul><li>text and background </li></ul></ul></ul>
  16. 16. Non standard links <ul><li>Links are one of the most important things people use on the Web. </li></ul><ul><li>Make them clear and obvious. </li></ul><ul><li>Differentiate between visited and unvisited links. </li></ul><ul><li>Make it obvious where users will go if they use the link. </li></ul>
  17. 17. Google is usable <ul><li>Make it obvious where users will go if they use the link. </li></ul>Make them clear and obvious. Differentiate between visited and unvisited links.
  18. 18. Nielsen’s Top Ten continued <ul><li>Flash </li></ul><ul><ul><li>This is a contentious issue. </li></ul></ul><ul><li>Content not written for the web </li></ul><ul><ul><li>Content should be short scannable and to the point. </li></ul></ul><ul><li>Bad search </li></ul><ul><ul><li>If your site has a search tool, it is worth paying for quality. </li></ul></ul>
  19. 19. Nielsen’s Top Ten continued <ul><li>Browser incompatibility </li></ul><ul><ul><li>Don’t design sites for only one browser on one platform. </li></ul></ul><ul><li>Cumbersome forms </li></ul><ul><li>No contact information </li></ul><ul><li>Frozen layouts with fixed widths </li></ul><ul><li>Pop-ups </li></ul>
  20. 20. <ul><li>The title of a book by Steve Krug. </li></ul><ul><li>Good web design doesn’t usually get commented or congratulated. A well designed site does what is expected and simply becomes a tool for the user. </li></ul>Don’t Make Me Think

×