IA & wireframing

Intro to IA

Colton Schweitzer
October 14, 2020

Humans today have the shortest attention span in the history of the world. It’s literally worse than a goldfish, which is insane.

The amount of stimuli that we are confronted with on a daily basis has grown so much that building simple experiences has become more crucial than ever. People don’t have patience for bad UX, which means that we as UX designers have to be able to simplify information down to the essentials.

That’s where information architecture comes in. Information architecture is the organization and structure of content and information. The goal of IA is to help people understand what they see, find what they need, and complete tasks. It’s all about clearly and logically organizing information. 

For example, almost all grocery stores are organized in the same way, regardless of the store brand or where the store is located. 

This is because they use the same information principles and layout. That way, regardless of what store you’re in, you feel comfortable and generally know where to find things.

For example, you know that you can find milk in the dairy section, which is usually located at the back of the store. Just like you also know that ketchup is located in the condiment aisle. Could you imagine a store that organized everything alphabetically? Ketchup would be located near Kellog’s cereal. 

Ham would be next to Hammers. It wouldn’t make sense. 🤦

IA draws its inspiration and roots from 3 common methodologies: library sciences, architecture, and cognitive psychology.

IA owes its beginnings to library and information science. The Oxford dictionary defines library science as the study of “collecting, preserving, cataloging, and making available books and other documents and information in libraries.” Both cataloging and archiving are necessary for IA.

Cataloguing is the process of creating metadata (or the description and identifiers of the content of something) and then attaching that metadata to your content so you can find it later. 

Archival is about building a repository of all of this content in such a way that it can be edited or removed later to maintain the integrity of the archive. Are you familiar with the Dewey decimal system? It’s how libraries organize their sections and books. It makes it easier for librarians to find the books they're looking for. This was developed because they needed to be able to locate and retrieve books quickly for cataloguing and archival. 

For example, if you need to find a fantasy book and you know the author's name, you’ll easily be able to find it. The Dewey decimal system was the standard that was created and recognized by librarians to be able to find what they need and complete tasks.

Sound familiar? This is the goal of IA.

The second methodology is architecture. 

IA having roots in architecture makes perfect sense. It’s in the title for Pete’s sake. Architecture is all about building something off of a solid foundation and eventually creating attractive, intentional structures. 

IA is about the same thing, but the structures aren’t physical. They're information. 

Last, there’s cognitive psychology. 

Merriam Webster defines cognitive psychology as "the branch of psychology concerned with mental processes (such as perception, thinking, learning, and memory) and the overt expression of behavior." IA helps people get the information they need, when they need it.

How do you create something that does that without first understanding how someone thinks about the information and what they do to get that information? 

Here are 3 of the main elements of cognitive psychology that lend themselves to IA: Mental models, cognitive load, Gestalt principles.

Mental models

A mental model is the way a person thinks or believes about the thing they're interacting with. Each person see the world through our own mental models. Information is easier to find when it’s in a place that matches where the user expects it to be. As a basic example, e-commerce websites use the concept of a shopping cart to help people understand what they're doing when they're buying something on a website. This gives users a physical experience that matches one of their existing mental models and makes the online experience feel more familiar and understandable.

Cognitive load

Showing too much information can overload a person’s ability to understand what they're seeing. This is all about simplifying and showing the right amount of information so users can process what's in front of them. 

Gestalt principles

The Gestalt principles are all about the visual perception of things in relation to each other. Basically, our brains try to organize and simplify complex images, designs, and information by arranging the parts into a whole rather than just seeing them as individual elements. Understanding and applying these principles effectively is important because they help you make designs that follow how humans actually perceive and understand shapes.

At the end of the day, for digital products, IA is all about organizing information on-screen in a way that is useful, findable, and helps users complete a task in the simplest and most intuitive way possible.

The field of information architecture is vast and complex, which is why there are people who specialize just in IA or a subspecialty of IA like search schemas or taxonomy.

Back to vault

201

Back to vault

201

What is UX?

2
Getting started

Why is UX important?

3
Getting started

What is the UX process?

4
Getting started

What is design thinking?

5
Getting started

What do UX designers do?

6
Getting started

UX vs UI

7
Getting started

Do UX designers need to know how to code?

8
Getting started

Recommended UX books

9
Getting started

UX university programs: Pros & cons

12
Getting started

UX bootcamps: Pros & cons

13
Getting started

6 brutal truths aspiring UX designers don't want to hear

14
Getting started

Difference Between Graphic Designer vs UX Designer vs UI Designer

15
Getting started

Intro to research & understanding

101
Research & understanding

Finding a problem to solve

102
Research & understanding

SWOT analysis

103
Research & understanding

Competitive analysis

104
Research & understanding

Heuristic evaluation (usability evaluation)

105
Research & understanding

Task analysis

106
Research & understanding

Stakeholder interview

107
Research & understanding

Framing the problem

108
Research & understanding

Research plan

109
Research & understanding

Survey

110
Research & understanding

User interview

111
Research & understanding

Card sorting

112
Research & understanding

Customer journey map

113
Research & understanding

Empathy map

114
Research & understanding

Affinity diagram

115
Research & understanding

Personas

116
Research & understanding

Contextual inquiry

117
Research & understanding

Diary study

120
Research & understanding

Eye tracking

121
Research & understanding

Intro to IA

201
IA & wireframing

Layout + CRAP

203
IA & wireframing

Site map

204
IA & wireframing

Scenarios

205
IA & wireframing

Storyboards

206
IA & wireframing

Low vs high-fidelity

207
IA & wireframing

Sketching

208
IA & wireframing

Wireframes

209
IA & wireframing

User flows

210
IA & wireframing

Intro to usability testing

301
Prototyping & usability testing

Usability testing plan

302
Prototyping & usability testing

Prototypes

304
Prototyping & usability testing

Research report

305
Prototyping & usability testing

Typography basics

401
Visual design & handoff

Color basics

402
Visual design & handoff

Color accessibility

403
Visual design & handoff

Pixels vs points

404
Visual design & handoff

Layout + 8pt grid system

405
Visual design & handoff

Design system

406
Visual design & handoff

UX writing

408
Visual design & handoff

"Final" usability test

409
Visual design & handoff

UX portfolio basics

501
UX portfolio

Your portfolio is just another UX project

502
UX portfolio

Choosing a site builder for your UX portfolio

503
UX portfolio

UX portfolio inspiration

504
UX portfolio

5 tips for junior UXers asking for portfolio feedback

505
UX portfolio