Information Architecture - What is it?
Based on the UX team presentation @ Herbalife Nutrition
Goals of this post
- To define what Information Architecture (IA) is.
- To define what tasks the Research Team can do in the context of IA.
- To define the deliverables.
- To create visibility of IA activities within UX team and beyond.
What is IA
Information architecture (IA) focuses on organizing, structuring, and labeling content in an effective and sustainable way. IA helps to understand how the pieces fit together to create the larger picture, how items relate to each other within the system.The purpose of IA is to help users understand where they are, what they’ve found, what’s around, and what to expect. In other words, IA is an architecture of understanding. IA informs the content strategy through identifying word choice. IA informs UI and interaction design through taking parts in wireframing and prototyping.
The information architecture phase of any project is a transitional period that marks the end of the initial research phase.
Main components of IA:
- Organization structures
- Labeling system
- Navigation system (main navigation, tabs, etc.)
- Search system (example - search by name or tag, Smart Groups, and filters in HNConnect)
- Content Strategy
How IA helps to improve user experience:
- organizes content in findable and easily discoverable way,
- allows users to complete tasks and reach goals in more efficient way,
- reduces cognitive load (distractions, and # of options) for more focused and faster experience
Deliverables:
- Pre-wireframe sketches
- User Flows (diagrams of routes the users take to achieve a goal)
- Sitemaps (tree diagrams of pages, screens, and functionality)
- Navigation (logical ways users move through app or site)
- Content Structure and Metadata (taxonomies, categorization, tags, controlled dictionary)
As you can see IA is a container for different practices and deliverables.
Let’s go through IA deliverables
Pre-wireframe sketches
UI sketching comes right after you’ve had that great app or website idea, and before building screen mockups in a wireframing tool. They are quick and dirty. There are no specifics of design or functionality in a UI sketch.Tools: marker, pencil
User Flows (diagrams of routes the users take to achieve a goal)
Tools: Overflow, Sketch
Sitemaps (tree diagrams of pages, screens, and functionality)
Sitemaps are a hierarchical diagram showing the structure of a website or application. They are used by UX Designers and Information Architects to define the taxonomy through grouping of related content. They can be used as a reference point for functional specifications and wireframes.Tools: Card Sorting (UserZoom), Overflow
Navigation (logical ways users move through app or site)
Navigation plays an integral role in how users interact with and use your products. It is how your user can get from point A to point B and even point C in the least frustrating way possible.Good navigation will:
- Enhance a user’s understanding
- Give them confidence using your product
- Provide credibility to a product
Content Structure and Metadata (taxonomies, categorization, tags, controlled dictionary)
Taxonomy is the hierarchical structure of the content (tree-like). It’s a system to classify and organize. Metadata describes set of attributes that can be used to further classify or consume content. For example: content’s status, location, physical attributes.A “controlled vocabulary” is a restricted list of words or terms used for indexing or categorizing (used in input filters).
Tags are assigned to content to help identify that content. They are considered an “uncontrolled” vocabulary in that it doesn’t restrict what can be entered.
The metadata word we use to describe all of it. And the entire array of available metadata fields is considered the system’s metadata schema.
Research experiments and practices
- Brainstorming with sketching
- Card sorting (open and closed) (result: labels and menu groups, contributing into Navigation, Sitemap, and Content Structure)
- Tree testing (result: improved Navigation)
- UX Expert Reviews (result: improved Task Flows and User Flows)
What these experiments mean?
Brainstormin and Sketching
Brainstorming is a method for generating ideas to solve a design problem. As an outcome of brainstorming we want to have a rough design of what we are thinking to build. Sketches visually represent such early design ideas.
They may already include beginning principles of navigation and organization of the future product or feature.
They may already include beginning principles of navigation and organization of the future product or feature.
Card Sorting
Card sorting is a UX research technique in which study participants group individual labels written on notecards according to criteria that make sense to them.In an open card sort, users are free to assign whatever names they want to the groups.
In closed card sorting users are given a predetermined set of category names.
Closed card sorting does not reflect how users naturally browse content, which is to first scan categories and make a selection based on information scent. NNG recommends to do tree testing instead.
Tree Testing
A tree test evaluates a hierarchical category structure, or tree, by having users find the locations in the tree where specific tasks can be completed.Tree testing is incredibly useful as a follow-up to card sorting because it:
- Evaluates a hierarchy according to how it performs in a real-world scenario, using tasks similar to a usability test; and
- Can be conducted well in advance of designing page layouts or navigation menus, allowing inexpensive exploration and refinement of the menu categories and labels.
UX Expert Reviews
Expert review is the analysis of a design by a UX expert with the goal of identifying usability problems and strengths. UX expert review should be repeated for major redesign iteration.In our organization it involves:
- Determine a common task flow, and reconstruct a User Flow diagram
- Identify and rate the pain points along the User Flow
- Provide UX recommendations
- Document all the above in Confluence
- Present to stakeholders, listen to a feedback, and make corrections
- Update documentation and file bugs and issues in TFS.
Sources:
IAhttps://www.usability.gov/what-and-why/information-architecture.html
https://www.youtube.com/watch?v=7cfHLsnRDvc
https://prezi.com/aafmvya6bk7t/understanding-information-architecture/
https://www.bloc.io/checkpoints/2671?section_id=318
Tree Testing
https://www.nngroup.com/articles/tree-testing/
https://www.userzoom.com/blog/what-is-tree-testing-and-why-is-it-important-for-your-sites-ux/
Card Sorting
https://www.nngroup.com/articles/card-sorting-definition/
https://www.userzoom.com/blog/what-is-card-sorting-and-why-is-it-important-to-your-sites-ux/
UX Expert Reviews
https://www.nngroup.com/articles/ux-expert-reviews/
UI sketches
https://www.justinmind.com/blog/from-a-mere-wireframe-to-a-final-website-design/
User Flows
https://www.invisionapp.com/design-defined/user-flow/
https://flowmapp.com/user-flow-in-ux-research/
Sitemaps
https://theuxreview.co.uk/sitemaps-the-beginners-guide/
Navigation
https://www.justinmind.com/blog/navigation-design-almost-everything-you-need-to-know/
Content Structure
https://picturepark.com/content-management-blog/best-practices-for-dam/taxonomy-metadata-tags-and-controlled-vocabularies/
https://www.uxbooth.com/articles/introduction-to-taxonomies/
Comments
Post a Comment