Information Architecture

Transcription

1 Information Architecture Why, What, & How Internet Technology 1

2 Why IA? Information Overload Internet Technology 2

3 What is IA? Process of organizing & presenting information in an intuitive & clear manner. Building of information structures that facilitate discovery, understanding & use of information Ease of Learning Is it easy to learn to use (at first)? Ease of Use Is it easy to use (each time)? Ease of Information Discovery Is it easy to find information? Learn Use Find easy easy easy easy easy difficult easy difficult easy easy difficult difficult difficult easy easy difficult easy difficult difficult difficult easy difficult difficult difficult Internet Technology 3

4 How? Prerequisite to Good IA Understand the Users Goals: What are users trying to accomplish with the info? What problems are users trying to solve? What do the users need from the website? Tasks What will users do to accomplish their goals? Characteristics: What are users familiar and comfortable with (textual & visual)? What do users know about the subjects in the website? Internet Technology 4

5 How? Cater to User Characteristics User Characteristics Study (Bilal, 2002) Children Users Do not search efficiently or effectively Have difficulty forming queries/judging info quality Emphasize browsing Show poor navigation behaviors Engage in frequent looping and backtracking Use clear & guided navigation menus Internet Technology 5

6 How? Cater to User Characteristics User Characteristics Study (Bilal, 2002) Adult Users Relies heavily on hyperlinks Relies on color, font, etc. to distinguish link types Preferred fewer links per display Used different strategies for different searching tasks Internet Technology 6

7 How? Optimize the Main Components of IA Information Organization (IO) Arrange and structure information Navigation Information traversal path Labeling Destination names & road signs User Interface (UI) Concise, familiar, consistent Search System Fulfillment of information needs Accommodation of information seeking behavior Internet Technology 7

8 IA Component: Information Organization Information Organization Navigation Labeling User Interface Search System 1. Divide the content into logical units. e.g., time, location, topic, task, audience, etc. 2. Group information into sections and subsections. 3. Identify relationships among sections & build links. The world can be seen as only connections, nothing else a piece of information is really only defined by what it s related to, and how it s related. There really is little else to meaning. The structure is everything. - Tim Berners-Lee, Weaving the Web (1999) Internet Technology 8

9 IA Component: IO Examples Internet Technology 9

10 IA Component: IO Examples Internet Technology 10

11 IA Component: Navigation Information Organization Navigation Labeling User Interface Search System Navigation A page must indicate its location within the site. Lead users to what they seek Minimize number of clicks & mouse movements. Where am I? Where have I been? What s here? Where can I go from here? Internet Technology 11

12 IA Component: Types of Navigation Information Organization Navigation Labeling User Interface Search System Global Navigation Persistent across a site Access to major parts of the site Local Navigation Move around the current section (e.g., in-page navigation) Contextual Navigation Embedded or Related links (e.g., Wikipedia) Supplemental Navigation Helpers (e.g., Sitemap, A-Z index) Breadcrumbs Keep track of current location (for large websites) Internet Technology 12

13 IA Component: Labeling Information Organization Navigation Labeling User Interface Search System Labels should be clear and intuitive. Easily understood by users Consistent within a site Clearly describe what it points to Metaphors (e.g., About Us, Contact Us) Mapping of familiar to new Explain, Excite, Persuade (e.g., Shopping Cart, Bookshelf) Internet Technology 13

14 IA Component: User Interface Information Organization Navigation Labeling User Interface Search System Concise Do not overload users with too much information Familiar Use the layout that users are familiar with Use the colors, images and icons that users will be comfortable with Consistent Conform to user s expectations Keep consistent look & feel throughout the website Internet Technology 14

15 IA Component: Search System Information Organization Navigation Labeling User Interface Search System Is Search necessary? Search System Design Determine which content to index Destination pages (information bearing ) Select index terms Controlled vocabulary vs. Free text Choose the search mechanism Boolean vs. Pattern-matching Build the query interface Decide how to display results Grouped vs. List Internet Technology 15

16 How? Apply the Principles of of Object IA Identify the content categories e-commerce product info, about, FAQ, customer service Academic syllabus, schedule, resources, roster Recipe ingredients, instructions, category Internet Technology 16

17 How? Principle of Choices Offer meaningful & manageable choices Internet Technology 17

18 How? Principle of Disclosure Guide the user through information for better use and understanding Instead of overloading with info all at once, disclose it in digestible chunks Progressive Disclosure Show information in layers Internet Technology 18

19 How? Principle of Exemplars Describe the category content via example Explain by example instead of description e.g., movie categories Internet Technology 19

20 How? Principle of Front Doors Put basic info about the site on every page For visitors from external sites e.g., search engine Provide information such as global navigation links to related content So the visitors can tell where they are what else they can do Internet Technology 20

21 How? Principle of Multiple Classification Provide multiple classification schemes Users have different ways of looking at information Location north, south, east, west Price high, medium, average Rating good, average, bad Internet Technology 21

22 How? Principle of Focused Navigation Keep each navigational menu focused on its purpose Keep navigation menus simple Each navigation menu has a specific purpose don t mix apples & oranges. Internet Technology 22

23 How? Principle of Growth Make the information architecture scalable Design IO & navigation to accommodate growth assume today s content will grow tenfold consider what may be added in the future Internet Technology 23

24 Sample IA Models Single page For limited content & focused purpose e.g., personal website Daisy Return to a central point after a task completion e.g., web apps, educational sites Flat Small sites (1 level of navigation) e.g., small business Strict hierarchy Pages are only accessible from their parent page For guiding users in a very specific manner e.g., educational site (lesson 1 2 3). Index Sites with specific purpose A central page with a list of all pages e.g., e-commerce Multidimensional hierarchy Multiple ways to access a page Most common model Internet Technology 24

25 IA Example: Organization, Navigation, Consistency, Discovery Home Sitemap Syllabus Schedule Assignments Roster Projects Resources Lectures Labs Homeworks Readings Student Photo/Info Student Projects Web Resources Examples Examples Grades Attendance Internet Technology 25

26 IA Resources Information Architecture for the World Wide Web - Rosenfeld & Morville, 2006 Eight Principles of Information Architecture - Brown, 2009 Web Style Guide - Lynch & Horton, 2009 What is Information Architecture? The Information Architecture Institute Information Architecture Basics usability.gov The Ultimate Guide to Information Architecture WebDesigner Depot Information Architecture Tutorial Webmonkey Best Websites Around the World awwwards.com The Webby Awards ebbyawards.com Internet Technology 26

27 Ease of Use: Usability Internet Technology 27

28 Ease of Use: Usability Internet Technology 28

29 Ease of Learning: Learnability Internet Technology 29

30 Ease of Learning: Learnability Unix VI editor Windows Notepad Internet Technology 30

31 Ease of Information Discovery Internet Technology 31

32 Ease of Information Discovery Internet Technology 32