Creating Considerate Web Applications Bojhan Somers & Jimmy Berry Google Summer of Code Project July 2008
About me <ul><li>Student </li></ul><ul><li>Usability Consultant at Usendes </li></ul><ul><li>Google Summer of Code Co-ment...
 
Why does most software suck? <ul><li>“ Know thy user, and you are not thy  only  user” -  Arnie Lund </li></ul>
Why does most software suck? <ul><li>How do you expect to do X? </li></ul>
 
Don Norman
User-centerd Design <ul><li>Manage expectations </li></ul><ul><li>Design first, code second </li></ul><ul><li>Adding a fea...
<ul><li>Disclamer : This is not how you do it. </li></ul>
Finding functionality <ul><li>Drupal jargon </li></ul><ul><li>Optimize for muddeling trough </li></ul>
Finding functionality <ul><li>Do you really readme.txt?  </li></ul>
Finding functionality <ul><li>Card Sorting </li></ul>
Online Card Sorting <ul><li>Optimal Sort </li></ul>
<ul><li>Picture Wordpress Dashboard </li></ul>
 
 
Finding functionality <ul><li>Visual seperation of functionality </li></ul><ul><li>How do users categorize and label funct...
Flexibility <ul><li>Interface focused on to many target groups </li></ul><ul><li>Inflexible interface </li></ul>
4 diffrent screen states <ul><li>Regular </li></ul><ul><li>Blank </li></ul><ul><li>Error </li></ul><ul><li>Flooded </li></ul>
Blank state <ul><li>Why? </li></ul><ul><li>Introduce the concept </li></ul><ul><li>Good first impression </li></ul><ul><li...
 
 
 
Blank state best practices <ul><li>Quick introduction  </li></ul><ul><li>Give a sample screenshot or screencast to see how...
Flooded State <ul><li>What happends to your interface if you have 20.000 nodes? </li></ul>
 
 
 
 
Flooded state best practices <ul><li>Don’t let it constraint your design. </li></ul><ul><li>Reconize flooded state </li></...
 
Copywriting is interface design! <ul><li>Instructions is a last resort </li></ul><ul><li>Stop writing for everyone </li></...
Killing good ideas <ul><li>Problem A participant was confused of the terminology to describe the web site’s main page. The...
Killing good ideas <ul><li>+1 </li></ul>
Killing good ideas <ul><li>“ I'm not sure why Home page should be more consistent than Front page in anyone's vocabulary.”...
 
Killing good ideas <ul><li>“ How are we going to solve opinion wars, so we can improve the usability of Drupal?” </li></ul>
Allowing good ideas <ul><li>Data! </li></ul>Usability testing
Contact Information <ul><li>Bojhan Somers </li></ul><ul><li>[email_address] </li></ul><ul><li>Jimmy Berry </li></ul><ul><l...
Upcoming SlideShare
Loading in …5
×

Creating Considerate Web Applications

1,476 views

Published on

A talk I gave on Drupalcamp Colorado

Published in: Business, Technology
0 Comments
0 Likes
Statistics
Notes
  • Be the first to comment

  • Be the first to like this

No Downloads
Views
Total views
1,476
On SlideShare
0
From Embeds
0
Number of Embeds
90
Actions
Shares
0
Downloads
18
Comments
0
Likes
0
Embeds 0
No embeds

No notes for slide

Creating Considerate Web Applications

  1. 1. Creating Considerate Web Applications Bojhan Somers & Jimmy Berry Google Summer of Code Project July 2008
  2. 2. About me <ul><li>Student </li></ul><ul><li>Usability Consultant at Usendes </li></ul><ul><li>Google Summer of Code Co-mentor </li></ul><ul><li>Bojhan.nl </li></ul>
  3. 4. Why does most software suck? <ul><li>“ Know thy user, and you are not thy only user” - Arnie Lund </li></ul>
  4. 5. Why does most software suck? <ul><li>How do you expect to do X? </li></ul>
  5. 7. Don Norman
  6. 8. User-centerd Design <ul><li>Manage expectations </li></ul><ul><li>Design first, code second </li></ul><ul><li>Adding a feature to core is dangerous </li></ul><ul><li>Remove features that are not neccesairy </li></ul>
  7. 9. <ul><li>Disclamer : This is not how you do it. </li></ul>
  8. 10. Finding functionality <ul><li>Drupal jargon </li></ul><ul><li>Optimize for muddeling trough </li></ul>
  9. 11. Finding functionality <ul><li>Do you really readme.txt? </li></ul>
  10. 12. Finding functionality <ul><li>Card Sorting </li></ul>
  11. 13. Online Card Sorting <ul><li>Optimal Sort </li></ul>
  12. 14. <ul><li>Picture Wordpress Dashboard </li></ul>
  13. 17. Finding functionality <ul><li>Visual seperation of functionality </li></ul><ul><li>How do users categorize and label functionality? </li></ul><ul><li>Workflow </li></ul><ul><li>Embedded functionality? let the user know.. </li></ul>
  14. 18. Flexibility <ul><li>Interface focused on to many target groups </li></ul><ul><li>Inflexible interface </li></ul>
  15. 19. 4 diffrent screen states <ul><li>Regular </li></ul><ul><li>Blank </li></ul><ul><li>Error </li></ul><ul><li>Flooded </li></ul>
  16. 20. Blank state <ul><li>Why? </li></ul><ul><li>Introduce the concept </li></ul><ul><li>Good first impression </li></ul><ul><li>Avoid beginners questions </li></ul>
  17. 24. Blank state best practices <ul><li>Quick introduction </li></ul><ul><li>Give a sample screenshot or screencast to see how the page would look it it has data. </li></ul><ul><li>Explain how to get started </li></ul><ul><li>Refer to extra documentation if its available </li></ul>
  18. 25. Flooded State <ul><li>What happends to your interface if you have 20.000 nodes? </li></ul>
  19. 30. Flooded state best practices <ul><li>Don’t let it constraint your design. </li></ul><ul><li>Reconize flooded state </li></ul><ul><li>Adaptive interface </li></ul>
  20. 32. Copywriting is interface design! <ul><li>Instructions is a last resort </li></ul><ul><li>Stop writing for everyone </li></ul><ul><li>Let someone else do it </li></ul><ul><li>Read your interface outloud, does it sound right? </li></ul>
  21. 33. Killing good ideas <ul><li>Problem A participant was confused of the terminology to describe the web site’s main page. The participant expected to see Home Page used instead of Front Page. </li></ul><ul><li>Solution Rethink the term front page. Consider using a more conventional term such as home page. </li></ul>
  22. 34. Killing good ideas <ul><li>+1 </li></ul>
  23. 35. Killing good ideas <ul><li>“ I'm not sure why Home page should be more consistent than Front page in anyone's vocabulary.” </li></ul><ul><li>“ I'm not suprised that people are more familiar with the term home page -- but its a very non specific term used in a wide variety of contexts.” </li></ul>
  24. 37. Killing good ideas <ul><li>“ How are we going to solve opinion wars, so we can improve the usability of Drupal?” </li></ul>
  25. 38. Allowing good ideas <ul><li>Data! </li></ul>Usability testing
  26. 39. Contact Information <ul><li>Bojhan Somers </li></ul><ul><li>[email_address] </li></ul><ul><li>Jimmy Berry </li></ul><ul><li>[email_address] </li></ul>

×