UI/UX Design Information Architecture & Interaction Design Syllabus

Information Architecture & Interaction Design syllabus — full chapter and topic list

Expand any chapter to see its topics and sub-topics. This is the whole examinable outline for Information Architecture & Interaction Design in UI/UX Design, not a summary of it.

1. 1

   Information Architecture

   4 topics

   • Organizing Content and Taxonomies
   • Navigation Systems
   • Labeling and Nomenclature
   • Sitemaps
2. 2

   User Flows & Task Flows

   4 topics

   • Mapping User Flows
   • Task Analysis
   • Happy Paths and Error Paths
   • Decision Points and Branching
3. 3

   Interaction Design Fundamentals

   4 topics

   • States and Feedback
   • Microinteractions
   • Gestures and Input Methods
   • Progressive Disclosure
4. 4

   Wireframing

   4 topics

   • Low-Fidelity Wireframes
   • Mid and High-Fidelity Wireframes
   • Sketching and Paper Prototyping
   • Annotating Wireframes
5. 5

   Motion & Animation

   4 topics

   • Principles of UI Animation
   • Easing and Timing
   • Transitions and State Changes
   • Animation for Feedback and Wayfinding

Information Architecture & Interaction Design flashcards for UI/UX Design

19 of 50 cards from the Information Architecture & Interaction Design deck — real questions with worked answers.

1. What is information architecture (IA) in UX design?

   The practice of organizing, structuring, and labeling content so users can find information and complete tasks efficiently. Its classic components (per Rosenfeld & Morville) are organization systems, navigation systems, labeling systems, and search systems.

2. What is a taxonomy in the context of information architecture?

   A hierarchical classification scheme that groups content into parent–child categories using controlled vocabulary, defining how items relate (broader/narrower terms) so content can be organized, browsed, and retrieved consistently.

3. What does the LATCH framework state about organizing information?

   Richard Saul Wurman's LATCH says there are only five ways to organize information: Location, Alphabet, Time, Category, and Hierarchy (magnitude/continuum, e.g., smallest to largest).

4. What is the difference between exact and ambiguous (subjective) organization schemes?

   Exact schemes divide content into mutually exclusive, objective sections (alphabetical, chronological, geographical) and suit known-item lookup. Ambiguous schemes group by subjective similarity (topic, task, audience, metaphor) and better support browsing and associative learning, but require judgment calls about where items belong.

5. Compare open and closed card sorting as IA research methods.

   Open card sort: participants group content cards into categories they create and name themselves — used to discover users' mental models and generate a taxonomy. Closed card sort: participants sort cards into predefined categories — used to validate or refine an existing structure.

6. Broad-and-shallow vs. narrow-and-deep hierarchy: what is the trade-off?

   Broad-and-shallow offers many options per level but few levels, so users reach content in fewer clicks with less chance of wrong turns, at the cost of denser menus. Narrow-and-deep shows few options per level but many levels, keeping each choice simple but multiplying navigation steps and the risk of misclassification. Usability research generally favors broader, shallower structures.

7. What is faceted classification, and when is it preferable to a single hierarchy?

   A scheme that describes each item with multiple independent attributes (facets) such as color, price, brand, and size, letting users filter and combine facets in any order. It is preferable for large, heterogeneous content sets (e.g., e-commerce catalogs) where no single hierarchy fits all users' mental models.

8. Name and define the four main types of navigation systems in IA.

   Global navigation: persistent site-wide menu on every page. Local navigation: options within the current section or subsite. Contextual navigation: inline links embedded in content (e.g., 'related items'). Supplemental navigation: aids outside the page hierarchy such as sitemaps, indexes, and guides.

9. What are the three types of breadcrumbs?

   Location (hierarchy) breadcrumbs show the page's fixed position in the site hierarchy; path breadcrumbs show the actual route the user took (rarely recommended); attribute breadcrumbs show metadata/filters applied to reach the current view (common in e-commerce).

10. What is utility navigation and how does it differ from global navigation?

    Utility navigation contains secondary, tool-like links not part of the content hierarchy — sign in, account, cart, help, language, settings — usually placed in the top corner or footer. Global navigation, by contrast, provides access to the site's primary content categories.

11. Describe the hub-and-spoke navigation pattern and where it is commonly used.

    A pattern with a central hub screen (e.g., a home dashboard) from which users go out to individual features (spokes) and must return to the hub to switch tasks; spokes rarely link to each other. Common in mobile apps and task-focused tools where workflows are independent.

12. What qualities make a good label in an information architecture?

    It uses the users' own language (not internal jargon), is consistent in style, grammar, and granularity with sibling labels, is specific enough to predict the content behind it, and matches user expectations set by convention (e.g., 'Contact', 'Search').

13. Why is internal or branded jargon dangerous in navigation labels, and what is the remedy?

    Users do not share the organization's vocabulary, so clever or internal terms fail the 'information scent' test and cause misnavigation. The remedy is plain, conventional wording derived from user research — search-log analysis, card sorting, and user interviews reveal the words users actually use.

14. What are the main types of labels in a labeling system, and why should keywords be front-loaded?

    Contextual link labels, headings, navigation system labels, and index terms (metadata/tags). Keywords should be placed at the start of the label because users scan the first one or two words of each item, so front-loaded labels are recognized faster.

15. What is a sitemap deliverable and what is its purpose?

    A hierarchical diagram showing all pages/screens of a product and their parent–child relationships. It communicates the information architecture to stakeholders, reveals structure depth and breadth, and guides navigation design and content planning. (Distinct from the XML sitemap used for search engines.)

16. What numbering convention is typically used on sitemap diagrams?

    Decimal outline numbering: the home page is 0.0 or 1.0, top-level pages are 1.0, 2.0, 3.0, their children are 1.1, 1.2, and deeper levels are 1.1.1, 1.1.2, and so on — giving every page a unique ID for referencing in wireframes and annotations.

17. How does a sitemap differ from a user flow diagram?

    A sitemap is a static, structural view of what pages exist and how they nest hierarchically. A user flow is a behavioral, sequential view of the path a user takes through screens and decisions to accomplish a specific goal; it includes actions, decision points, and branching that a sitemap omits.

18. What is a user flow?

    A diagram mapping the complete path a user takes through a product to accomplish a goal — from entry point through screens, actions, and decision points to the end state — used to identify friction, dead ends, and missing states before detailed design.

19. In flow diagrams, what do the standard flowchart shapes represent?

    Oval (terminator): start or end point; rectangle: a screen, page, or process step; diamond: a decision point with branching outcomes; parallelogram: input/output or data; arrows: direction of movement between steps.

See more Information Architecture & Interaction Design flashcards →

Planning Information Architecture & Interaction Design for UI/UX Design

Information Architecture & Interaction Design (UI/UX Design) FAQ