Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.

Designing Web Interfaces

764 views

Published on

MCAD lecture to interactive study students on the basics of web interface design, its evolution in the world of human-computer interaction, and the importance and impact it has in user experience design.

Published in: Design
  • Be the first to comment

Designing Web Interfaces

  1. 1. <ul><li>Designing Web Interfaces </li></ul><ul><li>MCAD Lecture 3.13.2009 </li></ul>
  2. 3. <ul><li>academic stuff </li></ul>things to consider examples & discussion activity background
  3. 4. <ul><li>design </li></ul>+ economics > law > brand identity > interactive design
  4. 6. You’ve completed your research.
  5. 7. You’ve outlined your strategy.
  6. 8. You’ve built your architecture.
  7. 9. Collaboration is critical .
  8. 10. Design is… an activity that requires us to develop empathy for others, which involves a deep understanding of how people will interact with something. It is a process of problem solving that uncovers obvious flaws as well as hidden truths. It is a creative exercise that generates things we can react to and helps us draw conclusions and make decisions .
  9. 11. <ul><li>People have a fundamental need to emotionally </li></ul><ul><li>connect with things. The interface is the doorway to </li></ul><ul><li>those experiences. </li></ul><ul><li>It’s not about the drop shadows. It’s about how </li></ul><ul><li>people react to them. </li></ul>
  10. 12. Photo credit: http://www.flickr.com/photos/gibbons/2722815615/
  11. 13. Photo credit: http://www.flickr.com/photos/garyjd/74946837/
  12. 14. Aesthetic Usability Effect: A phenomenon in which people perceive more-aesthetic designs as easier to use than less-aesthetic designs. Lidwell, Holden, Butler. Universal Principles of Design Rockport Publishers 2003.
  13. 15. Photo credit: http://www.ecojoes.com/wp-content/uploads/2007/10/old_school_cellphone.jpg
  14. 16. Photo credit: http://upload.wikimedia.org/wikipedia/commons/4/47/Cell_phone_Sagem_my202X_ubt.jpeg/
  15. 17. Photo credit: Apple, Inc.
  16. 18. Aesthetic Usability Effect: Sites that made the effort to craft a nice, professionally designed look made a lot more headway with users, even if those users had few other reasons to trust those sites. Stanford Web Credibility Project credibility.stanford.edu
  17. 19. <ul><li>layout & grids </li></ul>What are the building blocks? typography color visual motifs and metaphors images cultural references texture & rhythm interaction
  18. 20. Consider: What is the site’s intended purpose? Who is the intended audience? What is the intended emotional experience?
  19. 24. <ul><li>conveys information </li></ul>… an interactive experience that: helps accomplish a routine task entertains creates desire
  20. 25. Activity! What is the site’s intended purpose? Who is the intended audience? What is the intended emotional experience?

×