Information architecture - Introduction


Published on

A basic introduction to information architecture - classification schemes & structures, information architecture design, navigation design, wireframes. From 2005, university lectures

Published in: Business, Technology
1 Comment
  • Great slideshow about the require to innovate business models; tips on how to represent them succinctly; as well as the desire to make development initiatives actionable. Superb use of photographs as well as clear to see illustrative examples.
    Are you sure you want to  Yes  No
    Your message goes here
No Downloads
Total views
On SlideShare
From Embeds
Number of Embeds
Embeds 0
No embeds

No notes for slide
  • Information architecture - Introduction

    1. 1. Information Architecture Donna Maurer
    2. 2. About me <ul><li>Freelance information architect/interaction designer </li></ul><ul><ul><li>I design interfaces for complex informational and interactive systems </li></ul></ul><ul><li>5+ years IA experience </li></ul><ul><ul><li>Designed loads of business applications, websites, intranets </li></ul></ul><ul><ul><li>Practiced, taught and wrote about IA </li></ul></ul><ul><li>Studying Masters of Human Factors </li></ul>
    3. 3. Lecture overview <ul><li>What is information architecture </li></ul><ul><li>Information can be arranged and accessed in many ways </li></ul><ul><li>Design process for information architectures </li></ul><ul><li>Information architecture for interactive systems </li></ul>
    4. 4. What information architecture is about <ul><li>IA Institute definition </li></ul><ul><ul><li>The structural design of shared information environments. </li></ul></ul><ul><ul><li>The art and science of organizing and labeling web sites, intranets, online communities and software to support usability and findability. </li></ul></ul><ul><ul><li>An emerging community of practice focused on bringing principles of design and architecture to the digital landscape . </li></ul></ul>
    5. 5. Information-seeking behaviours <ul><li>Known item – know exactly what you want, how to describe it and may know where to look </li></ul><ul><li>Exploratory – have an idea of what you want, may not know how to describe it, may not know where to look </li></ul><ul><ul><li>May not know what you need to know </li></ul></ul><ul><li>Returning to information – going back to something you have already seen </li></ul>
    6. 6. Information is arranged in many ways <ul><li>Date </li></ul><ul><li>Alphabetical </li></ul><ul><li>Geography </li></ul><ul><li>Topic </li></ul><ul><li>Hierarchy </li></ul><ul><li>Faceted </li></ul><ul><li>Organic </li></ul><ul><li>Combination </li></ul><ul><li>Good IA allows access to information in many ways </li></ul>
    7. 7. By date
    8. 8. Alphabetical
    9. 9. By geography
    10. 10. By audience
    11. 11. By audience
    12. 12. By task
    13. 13. By task
    14. 14. By task
    15. 15. By category
    16. 16. By category
    17. 17. By category
    18. 18. By category
    19. 19. References <ul><li>Date: </li></ul><ul><li>A-Z: </li></ul><ul><li>Geography: </li></ul><ul><li>Audience: </li></ul><ul><li>Audience: </li></ul><ul><li>Task: </li></ul><ul><li>Topic: </li></ul><ul><li>Category: </li></ul><ul><li>Category: </li></ul>
    20. 20. Site structures <ul><li>Two key methods of creating sites: </li></ul><ul><ul><li>Hierarchy </li></ul></ul><ul><ul><li>Database </li></ul></ul><ul><li>Hierarchy: </li></ul><ul><ul><li>Similar to your computer’s file system – folder structure </li></ul></ul><ul><ul><ul><li>Strict hierarchy: each item has only one location </li></ul></ul></ul><ul><ul><ul><li>Polyhierarchy: items can be in more than one location </li></ul></ul></ul><ul><li>Database </li></ul><ul><ul><li>Metadata is used on each item and is used to generate links to content </li></ul></ul>
    21. 21. Metadata <ul><li>‘ Data about data’ </li></ul><ul><ul><li>Title </li></ul></ul><ul><ul><li>Description </li></ul></ul><ul><ul><li>Authored date </li></ul></ul><ul><ul><li>Keywords </li></ul></ul><ul><li>Historically used to improve searching – search can use the metadata fields </li></ul><ul><li>Also can be used to relate information together </li></ul>
    22. 22. About hierarchies UC Home Future students Current students Staff Announcements Entry into UC About UC courses UC College Campus life Announcements OSIS Academic dvisions & schhols Studying at UC OPUS Directories & maps Academic dvisions & schhols
    23. 23. Database – categories and dates
    24. 24. Database - author
    25. 25. Database - Using tags
    26. 26. Database – using tags
    27. 27. Getting around - navigation
    28. 28. Navigation <ul><li>Every page of a site should let you know: </li></ul><ul><ul><li>Where am I </li></ul></ul><ul><ul><li>What’s here </li></ul></ul><ul><ul><li>Where can I go now </li></ul></ul><ul><ul><li>Where have I been </li></ul></ul><ul><li>People don’t always work from the home page – they get to a page from a link or from a search </li></ul>
    29. 29. Baaaad navigation
    30. 30. Good navigation
    31. 31. Types of navigation <ul><li>Global navigation </li></ul><ul><ul><li>Persistent across a site </li></ul></ul><ul><ul><li>Allows access to major parts of the site </li></ul></ul><ul><li>Local navigation </li></ul><ul><ul><li>Lets you move around the current ‘section’ </li></ul></ul><ul><li>Contextual navigation </li></ul><ul><ul><li>Inline links, to anywhere </li></ul></ul><ul><li>Supplemental navigation </li></ul><ul><ul><li>Helpers – site map, A-Z index </li></ul></ul><ul><li>See also </li></ul><ul><ul><li>Related links </li></ul></ul>
    32. 32. Navigation
    33. 33. Social navigation
    34. 34. Labeling <ul><li>Good labels </li></ul><ul><ul><li>Are understandable by the reader </li></ul></ul><ul><ul><li>Are consistent within the site </li></ul></ul><ul><ul><li>Clearly describe where you are going next </li></ul></ul><ul><li>Labeling is not easy – it is as complex as structure and navigation </li></ul><ul><li>Where to get labeling ideas: </li></ul><ul><ul><li>User research </li></ul></ul><ul><ul><li>Search terms </li></ul></ul><ul><ul><li>Referrer terms </li></ul></ul><ul><ul><li>Call centre/people in contact with users </li></ul></ul>
    35. 35. Search <ul><li>What to search </li></ul><ul><li>Query structure - how to search it </li></ul><ul><li>Relevance - which results are the most important </li></ul><ul><li>How to display the results </li></ul>
    36. 36. In an IA project <ul><li>Research </li></ul><ul><ul><li>Business needs </li></ul></ul><ul><ul><li>User requirements </li></ul></ul><ul><ul><li>Content </li></ul></ul><ul><ul><li>Gives me an understanding of the domain </li></ul></ul><ul><li>Understand technical opportunities or limitations </li></ul><ul><li>Design site structure (site map) </li></ul><ul><li>Design navigation and page layouts (wireframes) </li></ul><ul><li>Design metadata, search and relationships </li></ul><ul><li>Usability test throughout the process </li></ul><ul><li>Creates a blueprint for the site – technical work after blueprint created and tested </li></ul>
    37. 37. A simple site map
    38. 38. A more complex site map
    39. 39. A simple wireframe
    40. 40. IA for interactive sites <ul><li>Sites that are primarily about ‘doing things’ use IA differently </li></ul><ul><ul><li>Fewer pages than a large informational site, so site map may show workflow not structure </li></ul></ul><ul><ul><li>Navigation and labeling still important </li></ul></ul><ul><li>More emphasis on scenarios </li></ul><ul><li>Wireframes show a lot more detail and show all screens </li></ul><ul><li>Design process is very similar </li></ul>
    41. 41. The elements of user experience
    42. 42. IA Resources <ul><li>Books </li></ul><ul><ul><li>Information Architecture for the World Wide Web – Louis Rosenfeld & Peter Morville </li></ul></ul><ul><ul><li>Elements of user experience – Jesse James Garrett </li></ul></ul><ul><ul><li>Information Architecture – Blueprints for the Web – Christina Wodtke </li></ul></ul><ul><ul><li>Don’t Make Me Think – Steve Krug </li></ul></ul><ul><li>Online </li></ul><ul><ul><li>Boxes and Arrows – </li></ul></ul><ul><ul><li>IAslash - </li></ul></ul><ul><ul><li>IAwiki – </li></ul></ul><ul><ul><li>Digital Web Magazine – </li></ul></ul><ul><li>Some blatant self-promotion </li></ul><ul><ul><li>My weblog – </li></ul></ul><ul><ul><li>My website – </li></ul></ul>
    43. 43. <ul><ul><li>This work is licensed under a Creative Commons Attribution-NonCommercial-NoDerivs 2.1 Australia License. </li></ul></ul><ul><ul><ul><li>See for more information </li></ul></ul></ul>