Your SlideShare is downloading. ×
  • Like

Thanks for flagging this SlideShare!

Oops! An error has occurred.

×

Now you can save presentations on your phone or tablet

Available for both IPhone and Android

Text the download link to your phone

Standard text messaging rates apply

Information Architecture: Get Your Blue Prints in Order

  • 1,259 views
Published

Information architecture is the most critical component of your site, yet it’s often overlooked. When done correctly, it enables users to navigate logically through a site, confidently find the …

Information architecture is the most critical component of your site, yet it’s often overlooked. When done correctly, it enables users to navigate logically through a site, confidently find the information they seek, and accomplish their goals. Without defining a website's structure, hierarchy, and navigation, you cannot ensure a consistent user-experience, and run the risk of frustrating visitors, and ultimately, losing them for good.

  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
    Be the first to comment
No Downloads

Views

Total Views
1,259
On SlideShare
0
From Embeds
0
Number of Embeds
0

Actions

Shares
Downloads
53
Comments
0
Likes
3

Embeds 0

No embeds

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
    No notes for slide

Transcript

  • 1. INFORMATION ARCHITECTUREGetting Your Blueprints In Order
  • 2. Agenda Defining User Experience Defining Information Architecture (IA) Breaking Down the Concepts of Information Architecture How Does IA Fit into the Project Lifecycle Strategy and Tactics Wireframe to Design Examples Why IA Matters
  • 3. What is User Experience?The term used to describe theoverall experience andsatisfaction a user has whenusing a product or system.It most commonly refers to acombination of software andbusiness topics, such as sellingover the web, but it applies toany result of interaction design.* *Wikipedia – http://en.wikipedia.org/wiki/User_experience
  • 4. Elements of User Experience *Jesse James Garrett http://www.jjg.net/elements/pdf/elements.pdf
  • 5. What is Information Architecture?Information Architecture Culture, Business Goals, Technology,(IA) is the art of Resourcesexpressing a model or Contextconcept of informationused in activities that IA Content Usersrequire explicit details ofcomplex systems. Information being read, Tasks, Behaviors, data, documents, Audience, Looking to knowledge accomplish goals *Wikipedia – http://en.wikipedia.org/wiki/Information_architecture
  • 6. User ExperienceUsability Engineer Graphic Designer Information Architect Interaction Designer
  • 7. Richard Saul Wurman coined the term in“information architecture”in 1997
  • 8. Let’s take a Deeper Dive
  • 9. Breaking Down the Concepts of Information Architecture 1 Information 2 Structuring, Organizing, and Labeling 3 Finding and Managing 4 Art and Science
  • 10. Informationis DataandKnowledge
  • 11. How would you Structure, Organize and Label all of theseproducts from scratch?
  • 12. Your Users Are…. browse. search. ask questions. Can they find your data?
  • 13. Managingthesesolutionsentailsfinding abalancebetween theuser and thebusinessneeds
  • 14. Little Bit of Art Little Bit of Science  Experience  User Needs  Intuition  Patterns of Behavior  Creativity  Scientific Analysis
  • 15. Succinctly…
  • 16. Information Architects could almost be called“Digital Librarians”
  • 17. Where Does IA Fit intothe Project Lifecycle?
  • 18. Typical Project ProcessDiscovery Design Build Test Launch
  • 19. Optimized Project Lifecycle
  • 20. Optimized Project Lifecycle
  • 21. Strategy and Tactics
  • 22.  Audience ResearchStrategy  Audience Personas Users  Content Audit / Analysis  Classification Schemes  Labeling  Card sorting  Affinity Diagrams Business  Data Flow Diagrams  Beta Sitemap  Content Maps  Low-Fi Wireframes  Hi-Fi Wireframes  Navigation Optimization Technical  Wireframe Testing RequirementsTactics
  • 23. Audience Research and Personas Conduct interviews with your users Online user testing Audience surveys Record each session with audio and or video. Watch, list, and interact Formulate personas based off of your research
  • 24. Content Audit and Analysis Is there an existing website? Is there a current sitemap that illustrates the number of pages per domain? Need to understand the existing content and data types in order to optimize the hierarchy Target the content types instead of generalities
  • 25. Content Audit and Analysis Create spreadsheet detailing the breakout of existing pages Document Page Name, URL, Document Type, Topic of Discussion and any additional Notes
  • 26. Classification SchemesHow Will the Content BeOrganized? Alphabetical Audience Color Date Geographic Popularity Tag-Based Task Topic
  • 27. Labeling Need clear and concise words that differentiate grouping from groupingWhere to look for input onjustified labeling conventions Ask individuals during user research Information gathered from card sorting exercises Review internal search words Review referring keywords
  • 28. Card sorting Task users with grouping information in a fashion that makes the most sense to them 2 different types of card sorts: Open and Closed Results are analyzed and used as a guide when creating the website’s hierarchy
  • 29. Affinity Diagrams Describes the system from the users point of view Captures the behavioral requirements by detailing the scenario driven requests by each persona Useful for illustrating the interaction between the audience and the system and/or website
  • 30. Data Flow DiagramsGraphical representation ofthe “flow of data” through aninformation system.Data Flow diagrams can alsobe used for the visualizationof data processing.* *Wikipedia http://en.wikipedia.org/wiki/Data_flow_diagram
  • 31. Beta Sitemap
  • 32. Content Map
  • 33. Low-Fi Wireframes
  • 34. High-Fi Wireframes
  • 35. Navigation Optimization Are your targeted keywords present within the architecture? Are there any words that can be changed which will not change the context of the label? Must strike the balance between optimizing for search engines and changing the meaning for the userExample: Instead of just “Articles”what type of articles are they? Couldthey be labeled “Cooking Articles.”
  • 36. Wireframe Testing Moderated and Unmoderated testing Users are assigned tasks to complete “Blocks of content” are clickable to other wireframes Testing is recorded to capture the subtleties All qualitative data
  • 37. Wireframe to Design Examples
  • 38. Why Does InformationArchitecture Matter?
  • 39. Why Does InformationArchitecture Matter? consider this…
  • 40. Do you know how many potential customers leave your site due to frustration?
  • 41. How much extratime and money isspent on customersupport becauseyour customerscan’t find theinformation theyseek?
  • 42. If customers can’t find what they’relooking for, what does that say aboutyour brand?
  • 43. Jakob Nielson states:“ The cost of poor navigation and lack of design standards is….at least ten million dollars per year in lost employee productivity for a company with 10,000 employees. ”
  • 44. Continuing IA Education Websites / Blogs http://www.iainstitute.org http://www.boxesandarrows.com http://www.userglue.com/blog http://maadmob.net/donna/blog/ http://blog.jjg.net/ http://semanticstudios.com/ http://louisrosenfeld.com/home/ http://businessol.com/usability-blog
  • 45. Thank you.Questions.Wrap Up.