1 / 92

Information Architecture and Usability

Information Architecture and Usability. Introductory Lecture David Rashty. User Interface Domain What is the Lecture About ?. User Centric Design. Information Architecture. Usability. Testing and Evaluation. Design and Implementation. User Interface. User Interface Domain - Terms.

jrentschler
Télécharger la présentation

Information Architecture and Usability

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. Information Architecture and Usability Introductory Lecture David Rashty

  2. User Interface Domain What is the Lecture About ? User Centric Design InformationArchitecture Usability Testing and Evaluation Design and Implementation User Interface

  3. User Interface Domain - Terms • MMI (Man Machine Interface) • GUI (Graphical User Interface) • CHI (Computer User Interface) • CHI (Computer Human Interaction)

  4. Information overload

  5. Disinformation overload

  6. Information overload

  7. Information overload

  8. How much Information ? Over 93 percent of the information produced in 1999 was in digital format.

  9. How much Information ? Worldwide PC hard drive capacity shipped

  10. Culture Diff 1 News News

  11. Culture Diff 2 Shopping Shopping

  12. Culture Diff 3 Siemens China

  13. Culture Diff 4 Siemens Germany

  14. Culture Diff 5 Siemens Canada

  15. Culture Diff 6 Siemens Saudia Arabia

  16. Which design makes it easier ?

  17. Is this usable?

  18. Terrible designs!

  19. Confusing designs!

  20. This is hard to read. In fact, many people have gone stone blind from reading horrible pages on Web sites. You could be next! Well, that's a bit of an exaggeration. Please, please, never do this. This is easier to read. The colors may not be very pretty, but they sure are easier to read than the example above. Also avoid colors that look ugly together. Color Problems !

  21. Cognitive Problems !

  22. Eye Tracking Problem !

  23. Unusable Metaphors !

  24. How bad can it be?

  25. Definitions Definition • Information Architecture is the process of organizing and presenting information in an intuitive and clear manner. • Richard Saul Wurman – “The building of information structures that allow others to understand” • When architects design a house they need to: • Learn about the client’s wishes; • Organize those wishes into a coherent pattern; • Design a house that will meet the occupants’ needs.

  26. Definitions More Definitions • The information architect must understand what users are trying to accomplish; he must learn the users’ goals/tasks. This means including users in the design process • The information architect must answer the question: “what will people do on the site”; not just “what content should be on the site.”

  27. Definitions Why is IA important? • Wasted expense: most sites will waste between $1.5M and $2.1M on redesigns next year. • Forfeited revenue: poorly architect retailing sites are underselling by as much as 50%. • Lost customers: the sites we tested are driving away up to 40% of repeat traffic. • Eroded brand: people who have a bad experience, typically tell 10 others. Forrester Research – Why Most Web Sites Fail (Sept 98)

  28. Definitions The role of the Information Architect • Clarify the mission and vision for the website; • Determines the information structure and functionality of the website; • Defines the navigation, labeling and searching systems; • Defines how the website is will accommodate to future changes.

  29. Definitions Disciplinary background Graphic Design Management & Marketing Usability Engineering Technical Writing Computer Science Information Science Cognitive psychology

  30. Building an Information Architecture Building an Information Architecture Information Organization & Clustering Labeling Systems & Metaphors Navigation Systems Searching Systems

  31. Building an Information Architecture Information Architecture work process • Plan • Research • Analyze • Design (Functional Design) • Evaluate (Usability) • Implement (Visual Design and Templates) • Evaluate (Usability) • Document (Design Guide) • Train Why ? How ? Maintain

  32. Building an Information Architecture Information Architecture metrics • Cost of finding(time, clicks, frustration, precision). • Cost of not finding(success, recall, frustration, alternatives). • Cost of development(time, budget, staff, frustration). • Value of learning(related products, services, projects, people).

  33. Building an Information Architecture Information Architecture metrics Log file analysis

  34. Building an Information Architecture Visual approach to IA

  35. approach > Overview Overview of Method • Seven step methodology for defining the needs of customers and for building an appropriate information structure: Research Whiteboard Clustering Highlighting Focusing Labeling Functional structure Interaction Design User Experience

  36. Building an Information Architecture > Information organization Organize information in accordance with the users…

  37. Information Architecture Information Organization & Clustering

  38. Building an Information Architecture > Information organization Information organization • The most important step in planning your website is organizing your information. • Steps to build a usable information structure: • Divide the content into logical units; • Chunk the information into sections and subsections (clusters); • Think about which sections are more important; • Think about how the sections relate to one another; • Build links between related sections.

  39. Building an Information Architecture > Information organization Why is it difficult? • Ambiguity – Language is ambiguous. Is a tomatoes a fruit, a vegetable, or a berry? • Heterogeneity – The web is a heterogeneous media and this makes it difficult to impose a rigid information structure to websites. • Differences in perspective – Different users approach your website differently (culture, age, language).

  40. Download About Help Authorware attain Director Dreamweaver Fireworks F.A.Q. Ordering options Flash Freehand Generator Pathware Developers centers Technologies Tech support Online store Test Licensing Advertising Support Software Magic program Beta programs Training Search Webmaster feedback Advertising Help Shockwave About the company Contact us Press room Press releases Sites Jukebox Flash leading edge Director leading edge Home Page Shockwave Japanese French German Canada DHTML Zone Investors Jobs Events Education Shocked site of the day Gallery guide Arcade About us Shockzone

  41. Information Architecture Labeling Systems & Metaphors

  42. Building an Information Architecture > Labeling Labeling • Labels are concepts that represent chunks of information. • The About us page of a website, for instance, may include: • background information; • Relevant addresses; • Other contact information. • Labels must be clear and intuitive to be effective.

  43. Building an Information Architecture > Labeling Labels are not definite The menus in this slide are all from consulting companies. Pay attention to the differences…

  44. Building an Information Architecture > Labeling Some conventions • Main, Main page, Home, Home page; • Search, Find, Browse, Search/Browse, Site map, Contents, Table of contents, Index; • Contact, Contact us, Feedback; • Our work, Expertise, Solutions, Company X solutions, What we do, Process; • News, What’s new, News and events; • About; About us, About company X, Who we are, Our Company, Company info.

  45. Building an Information Architecture > Labeling Labeling problems… • The Web site of Richard “Dick” Armey is a victim of many of the software solutions which he advocates. All of them filter his site because it contains the word “dick”. • The Navy’s censorware blocked a user from accessing the A+ Exam site. The site was blocked because its URL, www.aplusexam.com, contained the word “sex”.

  46. Building an Information Architecture > Labeling Metaphors • When choosing a label we often make use of metaphors – a word denoting one kind of idea is used in place of another to suggest an analogy between them. • For example: • someone that is drowning on money is not really drowning… • food for thought is not food… • time is not really money.

  47. Building an Information Architecture > Labeling Metaphors – example

  48. Building an Information Architecture > Labeling Metaphors – example • The VCR metaphor to control the printer doesn’t make sense: what does the rewind button means?

  49. Information Architecture Searching Systems

  50. Building an Information Architecture > Searching Searching • When designing a searching system for a website, the information architect have to consider the following points: • The level of searching expertise users have; • The kind of information users want; • The type/format of information being searched; • How much information is being search, i.e., what is granularity of the information.

More Related