Understanding Information Architecture
- 2. All we want to know about !! 1. What Information Architecture (IA) is? Slide 3 - 17 2. Why we need it? Slide 18 - 22 3. Role of Information Architect. Slide 23 - 24 4. Methods to design Information Architecture. Slide 25 - 76 5. Evaluating information architecture Slide 76 -85 6. How it is helpful in business? Slide 86-87 7. How a good IA can save company time and money during and after development? Slide 88 - 96 8. Return on investment (ROI) of Information Architecture Slide 96 – 97 9. What qualification I need to be Information Architect? Slide 98-99 10. Books which I can follow for IA Slide 100
- 3. What Information Architecture is? Information Architecture is the practice of deciding “How to arrange” “the parts of something” “to be understandable”. Let’s first see.. “A good IA helps people to understand their surroundings and find what they’re looking for”
- 4. Aim of Information Architecture “To organize and structure information to improve findability and discoverability”
- 5. Information Architecture(s) Are All Around Us In the Websites we Use Basic actions grouped in header part All navigations info bounded together for easy navigation Information grouped according to specific section “Organized and structured information to improve findability and discoverability”
- 6. Information Architecture(s) Are All Around Us The Apps and Software we Download “Organized and structured information to improve findability and discoverability”
- 7. Information Architecture(s) Are All Around Us The Printed Materials we Encountered “Organized and structured information to improve findability and discoverability”
- 8. Information Architecture(s) Are All Around Us Even the Physical Places we Spend Time In Different departments organization in office Books organization in library Spices organization in kitchen “Organized and structured information to improve findability and discoverability”
- 9. “If you’ve ever tried to use something and thought, “where am I supposed to go next?” or “this doesn’t make any sense,” you are encountering an issue with an Information Architecture.”
- 10. But! How do we define Information? Lets See..
- 11. first of all, lets understand the terms individually It is a processed form of DATA What is Information? Data Data is raw, unorganized facts that need to be processed. Information In organized, and structured context so as to make it useful, it is called Information. When data is processed
- 12. Similarly In UXD (User Experience Design) All the gathered requirements (in any form) related to your project, is called Data
- 13. But! From Where & How to collect the Data? Lets See..
- 14. From WHERE to get data? Mainly Stakeholders (Business Holder) (What are their requirements to meet their business needs) Target Audience (Real Users) (Real users who will use the product, ask about their pain points, and what relevant information & functionalities they are seeking to solve their purpose) “we will discuss in detail to assemble such information in further slides ”
- 15. Now HOW data can be collected? through various Research Methods Again I repeat.. collect data from Users & Stakeholders, related to “what current approaches they are following to solve their purpose, and what are their pain points”
- 16. “The purpose of Data Gathering is to collect sufficient, accurate, and relevant data so that a set of stable requirements can be produced”
- 17. DATA c a n b e Quantitative Qualitative Collected Related to Quantity (When we gather information in countable form) Related to Quality (When we talk about emotions & feelings) Who are the users? What are the user’s problems? Where are the users currently using their solutions? How do users behave? Why do they behave that way? How do they react on different modules?
- 18. After Data gathering, it is transformed into Information through some methods.. We will discuss that methods in coming slides BUT Why we felt the need of Information Architecture?
- 19. In the 90s, the rise of the Internet produced a World Wide Problem Websites without a Plan! Small sites grew into big messes, which led to..
- 20. Usability & Findability Disasters
- 23. Then! people realized that, websites need planning and Information Architecture was readily embraced, because now people could easily grasp the flow of information
- 24. So, what Architects do for buildings
- 25. Information Architects do for Websites Software’s & Interactive Services
- 26. Ok! But what are the methods to design Information Architecture? How to achieve that goal?
- 27. 1. Structure types: Hierarchy, linear, and web 2. Organization schemes: Topic, task, format, audience, alphabet, time, geographical, attributes, tags 3. Label names: Being specific vs. concise 4. Search: Designing search for content to be found 5. Logic: Taxonomy and metadata, when and why they're needed There are five main components of Information Architecture
- 28. Organization Schemas - How you are going to categorize your content Organization Structures - How you define the relationships between pieces of content. Content Inventory - To gain insight from your inventory, to assess each piece of content Wireframing - Creating flow of information Which we can achieve through following methods
- 29. In order to create these systems of information, you first need to understand the interdependent nature of users, content, and context.
- 30. Users Who are the users? What is their behavior to seek the information? Content What is Content Objectives? What are Document & Data Types? What is existing structure? What is volume of data? Context What are Business Goals? What is Culture? On which technology project is going to be build? What are the Constraints?
- 31. It gives us clear clarification on “3W1H” WHO, WHERE, WHAT, & HOW WHO - Roles – Who are the end users, and what roles & responsibilities they are playing individually. WHERE – Devices – On what devices they are going to use product. Mobile, Desktop, Touch Screens or all!! WHAT – Actions – What results we are getting from every individual task completion. How – Activities – How they are performing particular tasks/activities. “Before starting Information Architect for any project, get clear clarification on above”
- 32. First of all determining structure is essential. It allows you to identify and alleviate pain points, and to create and display content that speaks to your users at an emotional level. SO! Simply put all raw content in Excel Make relevant grouping Organize content Look for duplicacy, or repeated things Again restructure content that speaks users language
- 33. Before proceeding! let’s see where Information Architect should focus..
- 34. At the beginning, we’re not focusing on how beautiful the product looks. We’re prioritizing what goes where in the interest of creating a sturdy foundation.
- 35. IA is: What Goes Where IA is not: Aesthetics and Visual Design Sitemap/Site architecture Colors Page types Images Page structure Brand Navigation patterns Motion Global elements Video Story outline Icons Object placement Multimedia Content organization Style
- 36. IA and Content are both laid out on wireframes. Wireframes serve as the bridge between the two. When we think about wireframing, we’re focusing on the placement and structure of things, without spending time on aesthetics or finalized content. Architecture focuses on hierarchy, priority, and story, which results in the placement of assets Information Architecture Wireframe Content
- 37. If you’re just thinking about where things go in the interest of being organized. You might be missing the point! Tie IA back to the user and what they care about. It’s important to create a structure that fits the user’s mental model, filling it with content that speaks to their needs and emotions. WAIT!
- 38. “There are a variety of questions arise when determining Information Architecture” These questions focus less on organization, and more on developing a navigation scheme that fits the mental model of users. Questions are like..
- 39. Page Architecture Analysis Navigation Architecture Analysis Content Architecture Analysis 1. When viewing site analytics, do the findings reinforce that users are accessing certain pages over others? 1. What needs to be in the navigation? What doesn’t? 1. What types of content do various personas care most about? 2. What about frequency? What gets visited and what does not? 2. What CTAs should be included in the navigation? 2. Are there clear entry paths for different users? 3. Is there a common sequence to pages visited? 3. Are user stories represented well in the navigation? 3. Do users care about the content you’re including? 4. When do users leave the site? 4. Where are navigation elements located? Does this follow convention? 4. Do you know what content users care most about? 5. What pages do they see first? 5. Do users have access to a sitemap – in the footer – to find everything they want? 5. Can you combine multiple pages into a single page that enables scrolling? 5. What pages are not in use very frequently? 6. Do they have access to search for less important items? 6. What content should be more connected? W H I L E D O I N G
- 40. After Architecture Analysis of Page, Navigation, & Content there are 5Methods to Architect Information
- 41. Research Conducting user interviews, user testing, and analytics aids in the creation of a logical structure and understanding of user needs Card Sorting Organize and prioritize information according to the user’s mental model Affinity Diagramming Researchers and designers organize and clarify fuzzy data to make it concrete OOUX Object Oriented UX puts information in objects and prioritizes it for various users User Stories & User Flows User stories help us understand the goals, needs, and tasks users want to complete; and user flows allow us to create a pathway through the story 1 2 3 4 5
- 42. Research 1 Conducting user interviews, user testing, and analytics aids in the creation of a logical structure and understanding of user needs Research is a broad umbrella for several IA methodologies: User and Stakeholder Interviews, User Testing, and UX Analysis. By developing a comprehensive picture of who the users are? what their needs are, and what trends are occurring, you can create a structure that fits the mental model – that is, how they conceptualize the experience. This leads to usability and efficiency.
- 43. User Interviews: Reveal background details and insights to better understand user behavior. Uncover problems, needs, and goals. Key Task: Interview both users and stakeholders to identify a hierarchy of needs/wants User Testing: User testing early on helps unearth problems that need to be fixed, validate what the most important issues are, and evaluate whether hypothesized solutions are truly improvements. Key Focus: Find out what’s working and what’s not; validate or invalidate IA decisions UX Analysis: Understand usage patterns from analytics that further shape the solution. Discover issues and gather data in the process to validate issues and improvements. Key Questions: What gets visited and what does not? What pages are most important? How to Do It Tools of the Trade Video recordings, audio recordings, user observation, user testing software, expert review, web and device analytics How to do Research?
- 44. Card Sorting 2 Organize and prioritize information according to the user’s mental model “Card sorting is a generative method: we don’t yet have a design, and our goal is to find out how people think about certain issues. There is great variability in different people’s mental models and in the vocabulary they use to describe the same concepts. We must collect data from a fair number of users before we can achieve a stable picture of the users preferred structure and determine how to accommodate differences among users.” Jakob Neilsen
- 45. Step 1: Prepare the cards. Provide participants with cards listing the content/information you will have on your site, albeit with no predesignated themes or categories. Step 2: Allow participants to sort cards into groups (representing site content) that make sense to them. Asking participants to think aloud while sorting is helpful. Step 3: Allow participants to label and describe each created group. Step 4: Take notes and photos, and follow up with clarifying questions if necessary to document the session. How to Do It Tools of the Trade Whiteboards, Index Cards, Recorded Live Observation, Online Card Sorting Software How to do it? “This method allows users to manipulate information, giving designers an understanding of their mental model.”
- 46. You can use physical index cards or online card sorting software, but the key is allowing a representative sample of users, without guidance, to manipulate information into categories that are logical to them. Users then help in labeling the categories. The process gives teams an understanding of what navigation hierarchy makes the most sense to the people who will be using the product. For doing Card Sorting
- 47. Affinity Diagramming 3 Researchers and designers organize and clarify fuzzy data to make it concrete Affinity Diagramming takes indistinct information and makes it actionable and concrete. It allows teams to reach consensus – by organizing, categorizing, and labeling qualitative and quantitative data points, you develop a better understanding of user behavior and users’ mental models.
- 48. Step 1: Gather qualitative and quantitative data through interviews, contextual inquiry, user observation, and other relevant methods. Step 2: Commit all data points to sticky notes. Step 3: Post the transcribed data to a large whiteboard, which enables manipulation. Step 4: In a pre-designated “timebox,” organize the data thematically based on the insights it provides about users and their response to the design challenge. Step 5: Organize – and reorganize, as needed – the individual points into meaningful categories that can be used to create accurate personas, logical layouts, and intuitive interactions. Tools of the Trade Post-its, Whiteboard, Markers, Timer, Data Sets How to do it?
- 49. Affinity Diagramming allows teams to sort through and organize robust data sets efficiently. This data can then be used to create other design artifacts.
- 50. Okkk… But I found Card Sorting & Affinity Diagramming similar.. What’s the difference in both …?
- 51. In simple words.. Affinity Diagramming allows a group or individual to organize large amounts of DISORGANIZED data and.. Card Sorting involves SORTING a series of cards by labeling, into groups that make sense to users or participants, and shows relationship between ORGANIZED data.
- 52. Okk! So.. Affinity Diagramming comes FIRST, then SECOND step is Card Sorting.. First ORGANIZE data from UNORANIZED, then SORT organized data based on human mental models Let’s move to other methods of Information Architecture
- 53. User Stories & User Flows 4 User stories help us understand the goals, needs, and tasks users want to complete; and user flows allow us to create a pathway through the story User Stories allow us to fill in the blanks. They are concerned with fostering an understanding of the goals or needs users have and the tasks they need to complete. “As a <type of user>, I want <some goal> so that <some reason>.”
- 54. Step 1: Meet with stakeholders. Ask about their goals and objectives. Step 2: Meet with users. Ask about their needs and their wants. Step 3: Write the user stories. Step 4: Review the stories, looking for accuracy and utility. Step 5: Prioritize user flows that allow the protagonists of the user stories to achieve their goals. Tools of the Trade Diagrams, Spreadsheets, Pen And Paper, Video/Audio Recordings How to do it? Note: User stories are typically written in the format “As a <type of user>, I want <some goal> so that <some reason>.” Follow these links for more details https://www.uxpin.com/studio/user-experience/how-to-write-a-painless-user-story-for-agile-ux-teams/ http://www.uxbooth.com/articles/user-stories-a-foundation-for-ui-design/
- 55. OOUX 5 Object Oriented UX puts information in objects and prioritizes it for various users OOUX revolves around thinking about Information Architecture in terms of objects – “designing objects before designing interactions.” This allows the team to think about the user’s mental model, a key component of determining Information Architecture.
- 56. Step 1: Define objects. Review the creative brief and pull out key nouns, extracting “objects” from goals. Step 2: Define core content. Using each object, determine what elements (core content and metadata) make up an object. Step 3: Nest objects to create cross-linking. Cross-linking reveals the relationship between different objects, leading to contextual navigation. Step 4: Forced ranking. Reorder elements by imagining which will be most important to your users. Step 5: Add CTAs. Define the main calls to action that are necessary for a component to function. Tools of the Trade Diagrams, Spreadsheets, Pen And Paper, Video/Audio Recordings How to do it? “OOUX allows you to get at the deeper organizational layers, establishing the specific hierarchy of objects on an individual page and determining the relationship between pages that link to one another. This helps in deciding what goes where.”
- 57. What will be the End Deliverables from these methods? Let’s see..
- 58. Research Card Sorting Affinity Diagramming OOUXUser Stories & User Flows IA End Deliverables Page Architecture Sitemap Navigation Architecture Wireframes, Process Flows, & Sitemap Content Architecture Wireframes
- 59. We talked about Sitemaps, User Flows, & Wireframes As End Deliverables But How to design that? Let’s see..
- 60. First is SITEMAPS the first point in a design process
- 61. Sitemaps are a hierarchical diagram showing the structure of a website or application something you can put in front of your client and say “this is the plan”
- 62. A site map is like a floor plan for your site. Site maps give you a visual representation of the site's organization and how different sections are linked together.
- 63. Sitemaps are useful in several ways They show how the navigation should be structured They help identify where content will sit and what needs to be produced They help show the relationship between different pages They provide a structure upon which to begin estimates for development They are the first tangible deliverable showing what you will be creating
- 64. Here are a few of the most popular tools for buildingout your final site-map Illustrator Xmind Mindjet Omnigraffle Powermapper GatherContent Illustrator or Photoshop, while online services like Omnigraffle and Mindjet can work better when it comes to sharing and collaborating on site-maps. You also get more full-service tools like Powermapper and GatherContent which can bridge your site-mapping process to the next stage and help you to start collecting and developing the actual content and preparing your CMS.
- 65. Second is USER FLOWS Build It With The Users in Mind
- 66. “Flows are made out of individual screens where interactions take place. A screen offers some possibilities and the user chooses one. Then something happens, and the screen changes. It’s an ongoing conversation.”
- 67. In each moment in a flow, their (computer) screen is showing something and the user is reacting to it. A good and understandable way to map steps in the flow is to use state diagrams what the user sees what the user sees next what the user does what the user does next https://conversionxl.com/how-to-design-user-flow/ explore more at following link
- 68. At starting of designing user flows Define The Problem With Different Personas, and their entry points.. Simple Example https://webdesign.tutsplus.com/articles/defining-and-applying-personas-to-ux-design--webdesign-7561
- 70. Here are a few of the most popular tools for building out your user flow diagrams Illustrator InDesign Offline Online https://www.draw.io/ https://www.gliffy.com
- 71. Finally CREATE A BLUEPRINT FOR SUCCESS WIREFRAMES
- 72. Remember “When we talk about IA, we’re focusing on organization, wireframes, and content strategy.”
- 73. Before creating wireframes on any software, best recommendation is First make plan on PAPER, draw rough sketches, iterate, and finalize skeleton on paper Then.. It will be easy to create it on any software.. http://alessiobresciani.na1452682647.netdna-cdn.com/wp-content/uploads/2013/11/Wireframe-A4-Blank-Sketchbook.jpg
- 75. There are lots of wireframing tools are available for desktop, & online. Some of them are Illustrator InDesign Balsamiq Axure Offline Online www.fluidui.com www.moqups.com www.uxpin.com Tutorials www.smashingmagazine.com www.dtelepathy.com
- 76. After designing your blueprint (wireframe), next step is.. Evaluating Information Architecture also known as Heuristic Evaluation
- 77. but why to evaluate?
- 78. If changes are necessary and to assess what changes are needed. “An evaluation can identify opportunities to improve a web site, maximizing profit and increasing productivity.” To check
- 79. But how to evaluate IA?
- 80. There are types of evaluations that work best at the various phases of the design and development life cycle. Let’s see..
- 81. Phase Types of Evaluation Qualitative Quantitative Identifying requirements • Obtain base-line measurements that can be used for later comparisons • Validate existing IA designs with users • Compare your IA to the IA of a competitor’s site Research • Explore users’ grouping/labeling behavior Early Design • Validate IA designs with users • Compare this IA to a previous IA for the same site Later Design • Refine/validate an IA design Post-launch • Compare this IA to a previous IA for the same site • Compare this IA to the IA of a competitor’s site Evaluation can be both quantitative and qualitative, and both approaches have their merits. Quantitative methodologies work better for testing a single, discrete component, (e.g. a label) or a single, discrete behavior (e.g. looking for additional “pages like this”). Qualitative methodologies are more appropriate for evaluating multiple components at once and working with users.
- 82. So when you evaluate IA, evaluate step by step.. First STRUCTURE, then GROUPING, then LABELING
- 83. EVALUATING STRUCTURE “Site structure refers to the completeness and form of the site as whole.” Here we can measure how well the site structure reflects The sponsor’s needs Users’ needs An appropriate structural design
- 84. EVALUATING GROUPING “How well similar things are grouped together” We can measure by The degree of similarity of objects within a category. The degree of overlap between categories. How well a child content object represents its parent.
- 85. EVALUATING LABELING such as the title of a page, or the title of a category or heading. “Labeling refers to the name or icon of a content object”
- 86. How Information Architecture is helpful in business?
- 87. Here are few handful of ways investing in information architecture pays off • Reduces the cost of finding information • Reduces the chance of finding the wrong information, or finding no information at all • Reduces reliance upon documentation (i.e., the interface is intuitive and doesn’t require a user manual to navigate through it) • Reduces the number of phone calls to the customer service department • Supports business strategy by understanding business goals and user goals • Improves user experience through iterative user testing • Results in increased sales by enabling users to find information more efficiently • Improves brand loyalty • Improves scalability and growth of systems • Reduces maintenance costs • Improves knowledge sharing • Reduces duplication of effort
- 88. How a good IA can save company TIME and MONEY during and after development?
- 89. This is age of customers! where every customer prefer to go where they find best customer experience..
- 90. So let’s say, there are two companies, they both started ecommerce store at same time Company A & Company B Both want to stay competitive by providing superior customer experience Let’s see! What strategies they both follows..
- 91. In first 3 months Company A Company A invested in lots of technologies, Systems, man power, warehouse to build a powerful website. Company B Company B invested in finding in depth requirements, customer needs, and make resourceful information based on data.
- 92. next 2 months Company A Launched website based on large workforce & use of best technologies. Company B Still working on organizing information, and building sitemaps based on user mental models to provide good user experience.
- 93. At 6th month Company A Found less traffic to its ecommerce portal, so Invested in marketing to attract more customers Company B Launches its website with super user experience
- 94. At 7th month Company A After investing so much, still Company A customers were finding difficulties in tasks completions. Company B Customers were very happy to use it, as it was very user friendly, And easy to use navigations.
- 95. At 8th month Company A Its ROI graph was still downfall. Reason? Didn’t invested time in Information Architecture, now As a Result Again have to invest from starting in fixing things. Company B Its ROI graph was rising Reason? First gave priority to Information Architecture, and build Good user experience As a Result Increased sale & satisfied customers traffic.
- 96. So first investing in Information Architecture always give good Return on Investment (ROI)
- 97. Following is formula to calculate ROI – Return On Investment
- 98. So WHAT QUALIFICATION I need to be Information Architect?
- 99. Information architecture is a subset of user experience, much like interaction design and content strategy, yet the role of Information Architect includes most of User Experience. So someone.. With Background from Computer Science, Information Technology, Information Science, Communication Design + Skills of Logical and Critical Thinking can be Information Architect
- 100. There are so many books & stuff is available online & offline for Information Architecture, but when we see so much, we hardly go for any single one. In last, we end up with nothing. So instead of suggesting so many books & links, I would suggest just one link, from where you can good knowledge about IA, and I believe, after studying that you can step in field of “Information Architecture.” Just follow www.howtomakesenseofanymess.com How to Make Sense of Any Mess by Abby Covert by
- 101. In Conclusion Information Architects Are Planners, Organizers, and Bridge Builders BUT! Most importantly, we are..
- 102. Architects of Understanding We help our users to understand, where they are, What they’ve found, what to expect, and what’s around We help our clients to understand what’s possible.