1 / 22

Exploring Metaphors in Web Design: Benefits, Dangers, and Best Practices

This presentation by Jade Anderson, delivered on October 5, 2006, delves into the role of metaphors in web design and navigation. It discusses how metaphors bridge complex concepts and enhance user understanding by connecting new information to familiar ideas. The presentation outlines historical context, major theories, and key figures in the field while exploring the advantages and pitfalls of metaphor usage in design. Understanding these elements is crucial for creating effective and user-friendly digital experiences, highlighting the importance of usability and sustainable growth in web design.

serina-adkins
Download Presentation

Exploring Metaphors in Web Design: Benefits, Dangers, and Best Practices

An Image/Link below is provided (as is) to download presentation Download Policy: Content on the Website is provided to you AS IS for your information and personal use and may not be sold / licensed / shared on other websites without getting consent from its author. Content is provided to you AS IS for your information and personal use only. Download presentation by click this link. While downloading, if for some reason you are not able to download a presentation, the publisher may have deleted the file from their server. During download, if you can't get a presentation, the file might be deleted by the publisher.

E N D

Presentation Transcript

  1. Metaphors in Web Design and Navigation Presented by: Jade Anderson INF385E October 5, 2006

  2. METAPHORS: THE ORDER • What is Metaphor? • History & Context • Discussion by major players • Benefits • Dangers • Bottom Line

  3. WHAT IS METAPHOR? • Relates new information to the familiar • Tool for communicating complex ideas and bridging complex concepts • Tool for generating enthusiasm

  4. www.cnet.com

  5. www.creative.gettyimages.com

  6. www.halfbakery.com

  7. HISTORY • Lackoff & Johnson 1980s • Metaphor integral to thoughts and actions • Not just a literary device • Metaphor is ubiquitous • E.g. theories as buildings • E.g. the mind as container

  8. Cooper & Reimann: About Face 2.0 Three dominant design methods for visual interface, based on: 1. Understanding 2. Intuiting 3. Learning

  9. Cooper & Reimann Continued • Understanding • Implementation-Centric Model • Must learn how program works in order to be successful • By engineers for engineers • Users would rather be successful than knowledgeable

  10. Cooper & Reimann continued • Intuiting • Metaphoric Model • No need to understand mechanics of system • Definition of Intuition: “knowing something without rational use of thought.”

  11. Cooper & Reimann continued • Learning • Idiomatic Model • Definition of Idiom: “expression whose meaning is not predictable from the usual meaning of its parts” • E.g. Kick the bucket, caught red handed • E.g. Drop down menu, close box, resize function • All idioms must be learned; good ones need only be learned once

  12. Rosenfeld & Morville: IA for World Wide Web • Organizational • Familiarity with physical organization leads to understanding of virtual organization scheme • E.g. Auto dealership • Functional • Familiarity with tasks in traditional environment leads to understanding of virtual tasks • E.g. Library • Visual • Familiarity with images, icons, and colors of traditional object leads to connection with virtual object • E.g. Yellowpages

  13. Vanderwal: Metaphor of Attraction • Metaphor of Attraction • 1. User searches for information • 2. Results attracted or repelled • 3. User attracted to meta information • 4. Process continues until information found or attraction lost

  14. Maglio & Matlock: Metaphors we Surf the Web by • Spatial metaphor of web • People moving toward information rather than information coming to them • Relates to how we obtain info in the real world: walk towards it, reach for it, grasp it • If people naturally grasp web as physical space, tools for navigation can be improved to exploit this connection

  15. Nielsen: Designing Web Usability • Geographic Metaphors almost always bad • Shopping carts are interface standard • Not shopping sleds • Even standard metaphors are not without problems

  16. BENEFITS & BEST PRACTICES • Can make the site memorable • Relate new information to the familiar • Better for sites not expecting repeat visitors

  17. DANGERS & DOWNFALLS • Limiting • Sacrifice later growth for a little initial quick recognition • Suck for intermediates • Tie interfaces unnecessarily to physical world • Hold back functionality with relationships to obsolete technology

  18. DANGERS & DOWNFALLS continued • Don’t scale well • Can’t grow with process • Rely on associations • Cultural • Human mind is idiosyncratic

  19. DANGERS & DOWNFALLS continued • Oversimplified • Tiresome • Graphic nature can slow down site • Only a shallow representation • No Metaphors for processes

  20. BOTTOM LINE • Popularity of metaphors has waned • Few work well • Make empowering, not limiting • Usability testing

  21. REFERENCES Cooper, A. (2003). About Face 2.0: The Essentials of User Interface Design (2nd Edition).: Wiley Publishing, Inc. Fleming, J. (1998). Web Navigation: Designing the User Experience. Sebastopol, CA: O’Reilly Associates, Inc. Kuhn, W. (1993). Metaphors Create Theories for Users. Retrieved September 30, 2006 from http://citeseer.ist.psu.edu/332805.html Maglio, P. P., & Matlock, T. (1998). Metaphors we surf the Web by. Paper presented at Workshop on Personalized and Social Navigation in Information Space, Stockholm, Sweden. Nielsen, J. (2000) Designing Web Usability: The Practice of Simplicity. Berkeley, CA: New Riders Publishing branch of Peachpit Press. Norvig, P. (2004) Review of Metaphors we live by George Lakoff and Mark Johnson. Retrieved September 30, 2006 from http://www.norvig.com/mwlb.html Powell, T. (2002). Web Design: The Complete Reference. New York: McGraw-Hill Professional. Rosenfeld, L., & Morville, P. (2002). Information Architecture for the World Wide Web (2nd Edition). Sebastopol, CA: O’Reilly Media, Inc. Vander Wal, T. (2001, March). The Model of Attraction. Retrieved September 30, 2006, from http://www.vanderwal.net/essays/moa1.html

More Related