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.

Information Architecture & Why you care about it as a designer

2,276 views

Published on

The Art Institute of Dallas recently added IA courses to their design and multimedia degree plans. I worked with the instructors to revise the curriculum to make it more relevant to actual practice. I also give the introduction lecture.

This presentation is not intended to make converts but rather to expose designers to the role of IA, help them understand the value and be able to identify them in the wild.

Published in: Business, Technology
  • Be the first to comment

Information Architecture & Why you care about it as a designer

  1. 1. Information Architecture & Why You Care About It As a Designer
  2. 2. The structural design of an information space to facilitate task completion and intuitive access to content. Definition Information Architecture for the World-Wide Web Louis Rosenfeld & Peter Morville Organizing info so people can find stuff >
  3. 3. Metaphor – Painterliness vs. Draftsmanship Detail from Water Lilies Claude Monet 1906
  4. 4. Metaphor – Painterliness vs. Draftsmanship Detail from The Entombment Raphael 1507
  5. 5. Metaphor – Painterliness vs. Draftsmanship Detail from The Entombment Raphael 1507
  6. 6. The Key is Balance A beautifully designed interface might satisfy the business vision but imply things about the function of a site that can’t be realized An elegantly coded back-end system might meet basic business requirements and still be wholly un-usable
  7. 7. The Role In Context <ul><li>IA is about Applied Usability </li></ul><ul><li>Content Organization : structure & labeling </li></ul><ul><li>Interaction Design : page-level elements </li></ul>
  8. 8. The Role In Context <ul><li>IA is about Applied Usability </li></ul><ul><li>Content Organization : structure & labeling </li></ul><ul><li>Interaction Design : page-level elements </li></ul>
  9. 9. The Context of Development It doesn’t matter what development processes your client or your company subscribe to. They all have the same thing in common Plan Build IA IA Idea
  10. 10. The Context of Development We’re going to focus on the first gap between an Idea and a Plan Idea Plan Build IA IA
  11. 11. Steps <ul><li>Requirements come from multiple sources. </li></ul><ul><ul><li>Some are formal </li></ul></ul><ul><ul><li>Some are random </li></ul></ul><ul><ul><li>Some are completely off the wall ! </li></ul></ul>Gather | Qualify | Organize | Validate | Interaction
  12. 12. Steps: Feature List Gather | Qualify | Organize | Validate | Interaction Granular breakdown and description of all potential features and functions
  13. 13. Gather | Qualify | Organize | Validate | Interaction Steps <ul><li>Scrutinize the requirements against three facets: </li></ul><ul><ul><li>User Value </li></ul></ul><ul><ul><li>Business Value </li></ul></ul><ul><ul><li>Technical Risk </li></ul></ul><ul><li>Use the outcome to determine your scope </li></ul>
  14. 14. Steps: Feature Analysis Gather | Qualify | Organize | Validate | Interaction <ul><li>Evaluation of each element: </li></ul><ul><ul><li>Removes Bias </li></ul></ul><ul><ul><li>Considers Constraints </li></ul></ul>
  15. 15. Steps <ul><li>Organize the features and functions into some kind of framework </li></ul><ul><ul><li>Process Flows for Linear Applications </li></ul></ul><ul><ul><ul><li>EX: E-Commerce Check-Out </li></ul></ul></ul><ul><ul><li>Site Maps for Information Sites </li></ul></ul><ul><ul><ul><li>EX: Corporate Information Site </li></ul></ul></ul><ul><ul><li>Page Flows to translate processes into pages </li></ul></ul><ul><ul><ul><li>EX: Catalog Index </li></ul></ul></ul>Gather | Qualify | Organize | Validate | Interaction
  16. 16. Steps: Process & Page Flow Gather | Qualify | Organize | Validate | Interaction Page Agnostic Page Specific Better for Linear Applications
  17. 17. Steps: Site Map Gather | Qualify | Organize | Validate | Interaction Better for Broad Content Sites
  18. 18. Steps Review your framework with the technical team to validate the way the system will support it Are there any constraints that might influence the way the user will be able to encounter the information? Gather | Qualify | Organize | Validate | Interaction
  19. 19. Steps Create a low-risk model of a page to account for the features and functions that have been scoped. This is the first time that the team will be able to see and think of the site in terms of pages. Gather | Qualify | Organize | Validate | Interaction
  20. 20. Steps: Wireframe Gather | Qualify | Organize | Validate | Interaction Functional Model, Few if any Design Elements
  21. 21. Why Do You Care? IAs promote the expertise of design by couching its impact in terms of usability Form Follows Function – IAs establish the function of a page independent of design elements. This keeps the client from designing for you IAs provide the framework to inform a solid design scheme Your grade depends on it
  22. 22. Q & A

×