Design & UX
By Christina Wodtke

Boxes and Arrows: Defining Information Architecture Deliverables

By Christina Wodtke
Help us help you! You'll get a... FREE 6-Month Subscription to SitePoint Premium Plus you'll go in the draw to WIN a new Macbook SitePoint 2017 Survey Yes, let's Do this It only takes 5 min

One of the hottest topics these days in Information Architecture circles is documentation. This is probably partly because the IA’s role is so ill defined. Our jobs sit perched between engineering and graphic design: go too far in one direction, we’re doing the coding, go to far in the other and we are doing the design. Neither role maximizes the architect’s key skills; defining the organizational structure and behavior of the web site or application. An IA is most effective when they leave implementation and final graphic design out of the mix. The documents they create to express this have to be crafted with equal skill and diplomacy.

There are seven typical deliverables an IA will produce. Occasionally they will not produce all seven, sometimes the deliverables will include others such as a thesaurus or taxonomy. I’ve presented them in rough chronological order, though these are a toolset, not a rigid methodology, and the choice of which to use and when to use them will depend on the needs of the project.

1. Conceptual Model

User experience guru Don Norman defined three types of models that occur when creating a product


  • Implementation models
  • Conceptual models
  • Mental models.

The implementation model is how the product works from a technical point of view. The mental model is how the user thinks the product works. The conceptual model is the message the designer or IA sends to the user about how the product works.IA

A conceptual model is most often a graphic, though it can be a chart, a written paragraph or a flowchart. The key is that it expresses an explanation of the system’s behavior to the user that is easy and intuitive-it does not have to be how the system actually works.

Used by: Everyone who comes in contact with the project. It can be a great jumping-off point for designers, engineers and marketers to get their head around what the project does for its end users.

Diagram courtesy of Noel Franus,

2. Content Inventory and Organization

Most typically used for content rather than application sites. The content inventory may be provided by the IA or the client. It is exactly what you might guess: a complete list of all the content that the site holds and will hold. For sites particularly rich in content, it may be a list of types of content. Once the content is aggregated, the most simple way to deal with organizing it is to perform a card sort. Typically the names of each of the items is written on an index card. These are then sorted by likeness. Card sorts are most effective when performed with the end user of the system, rather than only by the IA. I’ve done card sorts with cut up excel spread sheets, and also with post-it notes on a white board (my personal favorite); the only important thing is to have the card sort done on discreet bits of paper- the sorter needs to be able to play, rearrange, and not get caught up in perfection.

Once the content has been grouped, the cart sorter should be requested to label each collection. The IA can then take the card sort (or card sorts, doing this exercise with at least three users is a good idea) and refine the collection and labeling.

Used by: Content, IA, Marketing, Engineering

3. User Flows/Scenarios

User flows are simple diagrams that follow a user down a path of activity. Occasionally they look like storyboards, other times like flow charts. The important thing is to not outline every single possible behavior, but rather show most likely user experience. It’s a good way to understand what the product does without being confused by every tiny detail. It is particularly useful if one needs to explain the core interactions to someone new or not deeply involved with the project.

Scenarios are a written equivalent of the User Flows, and are often a good jumping off point for them. To create them, the development team gathers together to tell the story of a user working with the system. The most effective way to do this is using a technique called personas. With personas, you start by creating archetypal users: first giving them names, then filling in relevant demographic and psychographic details about them. And finally you can describe their ideal interaction with the system you are designing.

Imagine you are designing a new version of excel. Telling the story of Jane who is 24 and working in accounting would create a different story than one describing Sarah, 45, working at home to do her budget. Both stories are potentially more useful than a story that tells user x accessed chart creation wizard: visualizing an actual person trying to use a system typically inspires much more compassionate designs. To learn more about personas, I recommend Alan Cooper’s book "The Inmates are Running the Asylum."

Used by: Design, marketing, content and product managers. Involving any teams that have contact with users (marketing, customer service), and other stake holders such as business strategists. It is a good way to build better personas and insure buy in.

4. Task Analysis

From the scenario, you can move toward a task analysis. This is a discrete step-by-step analysis of how users accomplish their desired tasks. This allows the IA to carefully analyze each step a user needs to complete any give task.

My favorite example has always been one Peter Merholz put together: Imagine Wily Coyote trying to buy an anvil for one of his nefarious schemes from the web:

(A.)Buy An Anvil
(1.)Find The Anvil
(a.)Search For Anvil
(i.)Type in "anvil" in Search box
(ii.)Read results
(b.)Browse the Store
(2.)View anvil
(B.)Purchase The Anvil

Of course a real task analysis would be quite more detailed and complex, but the essential idea is here.

Used by: IA’s

5. Site Map

This is the IA’s workhorse, the one thing we all do when building a website. Jesse James Garrett has undertaken the Herculean task of creating a standardized language for site maps; unfortunately most IA’s still use the systems they developed early on when IA’s weren’t talking to each other. A site map can be small and simple, or can take up a hundred pages or be printed out on a plotter 6 foot wide. It all depends on the site and the needs of the project. The map documents the various pages or page types throughout the site and the user paths to and from them. It is typically started early in the project, and refined throughout.


from Jesse James Garrett's Visual Vocabulary 

Used by: Engineering, design, project managers, content.

6. Page Architecture

Also called wireframes or schematics, these are probably the most controversial of the IA's deliverables. Too precise wireframes, and visual designers feel dictated to, too loose and the architecture can be misinterpreted.

- Wireframe

One agency has solved this by having the visual designers create the wireframes, other companies make their page architectures look more like flow charts, eliminating design from them entirely. No matter how you decide to represent them they must show:

  • Items on page
  • Importance of each item on page
  • Behavior of each item on page

Another type of page architecture -

Used by: Design primarily, sometimes engineering for early prototyping.

7. Decision tables

The tables allow precise documentation of the design of every interaction possible. It is especially useful when designing error handling. Often errors are ignored by design, and when engineering codes the product, they have to make up error messages. This can result in messages like "error in dll 5034. click okay to continue" Not a happy user experience.

Used By: Engineering, customer service

Again, this is not a complete list of every possible tool an IA may use but these are among the most common. Every project is unique, and the role each IA plays within the company is also unique. However, the IA's job is to define the structure and behavior of the systems as it is perceived by the user, and these seven deliverables are an excellent way to make sure the IA's thinking is clear and clearly communicated.

Login or Create Account to Comment
Login Create Account
Get the most important and interesting stories in tech. Straight to your inbox, daily.Is it good?