See all Insights

An Offline Information Architecture Exercise

Card sorting has been a pretty common technique for early-stage organizing of website pages and/or information and is helpful on a pretty general level—though I honestly imagine that few web development professionals still do it. (But I am really over-simplifying it. Here’s a definitive guide to card sorting from BoxesAndArrows that goes into much more detail.) I was talking about this exercise with a friend a few months ago and thought it might be interesting to try at our next enrichment session, with a few minor tweaks to ensure it included some additional steps that ensure that the organization of a website is also influenced by client intent and user engagement.

So, we did.

I prepped the session by labeling index cards with the common page and content types that our typical agency clients’ websites need—the kinds of information that you’d expect to find on a content-driven, pull-marketing website. These would be the cards that the team would need to arrange into a website-like structure. Then, I added two more steps. I cut a bunch of orange post-it notes into strips that the team could use to identify calls-to-action—literally by writing the directive on the note and adhering it to the appropriate page or content type. I also cut a bunch of blue strips of paper that the team could use to diagram logic connections betweeen pages and content (e.g. a link between clients and case-studies). With the cards, post-its, blue strips, tape and a sharpie, we had an offline prototyping kit ready to go.

We spread out in our conference room for an hour. I took a few minutes to explain how it would work and then stepped back to observe. The process the team followed:

Step 1. Arrange the existing cards into a logical structure/sitemap.

Step 2. Add or Remove Cards as needed.

Step 3. Identify CTAs and write them on orange post-it strips.

Step 4. Assign CTAs to pages/content types as appropriate.

Step 5. Indicate logic connections between pages/content types using blue strips.

So, what did the team think? Here are some pros/cons straight from Katie, Chris, Steve, Lauren and Lindsey:

Pros:

1. Ability to see how everything relates at once.

2. Easy to make changes, so more room for risk-taking.

3. Format was ideal for a group exercise, allowing for many opinions/ideas.

4. No clients with pre-determined ideas.

Cons:

1. No realistic indication of interaction.

2. Little indication of how page content impacts overall site.

3. Difficult to break away from bad pages/content when cards are pre-determined.

4. No client influence—they provide the entire purpose of prototyping (not to mention a lot of knowledge we need)!

Here are a few more pictures of the process:

Katie, Steve, Lauren, Lindsey, and Chris discuss how the cards representing pages and content should be arranged. Some are weeded out, others are added.

Steve creates a call-to-action.

Katie creates another CTA while Chris suggests a connection between pages.

Voila, it’s done! Something about this reminds me of The Science of Sleep, or at least how Stéphane might dream about prototyping…

Related Posts