Fixing the Information Architecture of my site

Last month, in What’s wrong with my site, I picked three small improvements and assigned them each to a different “Future Shane”.

fix the Information Architecture (IA) of this site. If someone comes to ShaneG.ca and reads an interesting article, it’s difficult for them to explore. That’s a problem because there’s over fifty great articles that they might like.

June Shane, June 2019

So I (July Shane) got out the sticky notes and tried to make sense of the content of this site.

Step 1: Write all titles on sticky notes

Room with sticky notes on the wall
One sticky note per post, arranged by date

As I was writing the title of each post onto a sticky note, I put them up on the wall in chronological order. It was very pleasing to see that I have had no months without a post in over 2.5 years.

Room with some sticky notes on the wall and others scattered on the floor
One sticky note per post, arranged by gravity

What wasn’t pleasing was when half my sticky notes fell onto the floor.

I think many years ago they came out with Super Sticky notes which seems like a complete contradiction of the value proposition but I think it’s just an acknowledgement that the original formulation fell off more than we’d like. I don’t think of them as Super Sticky, just the proper amount of sticky for most uses.

Steve Portigal, Dollars to Donuts podcast

Next time, I’ll get the Super Sticky notes.

Step 2: Arrange by topic

I then moved all of my sticky notes to the floor so that gravity could work for me instead of against me. I grouped the blog posts by topic and tried to give meaningful names to each group.

Sticky notes arranged on a hardwood floor
Grouped and labeled sticky notes; this time on the floor

Step 3: Implement

After a couple more iterations, here’s what I came up with.

Screenshot of navigation menu with 6 items: About me, UX strategy, UX tactics, Data visualization, Programming, and Other ramblings
My new menu

For comparison, here’s the old one.

Screenshot of the main navigation of the site. 

Menu
    About Me & Contact
    Programming
        C++
        boost
    Consulting
        Google Apps Script
        Google Forms
        Google Sheets
        UX
    Oddly Specific: Various Notes and Collections of Links
    Getting Started in UX
    Portfolio
Search bar
My old menu

I still don’t love it but it way better represents what I write about most. It also is simple enough to fit into a top-level menu instead of a hamburger menu, which I’m sure August Shane will appreciate.

Advertisements

Organizing Documentation with Card Sorting

We use Confluence at work for internal documentation. It’s kind of like Wikipedia, but only us developers can see and edit it, and the articles are things like How to set up Server x, or How to Test y.

I love it because we previously used long email chains with the answer buried deep within, mixed with dusty old word documents locked into source control. Confluence feels so much more lightweight, nimble, and searchable.

The Problem

Unfortunately over time it’s become a bit of a mess. We have over a hundred pages but there’s not much rhyme or reason as to how to find them. Confluence does have a search function but, believe it or not, people still browse. Also, if you’re adding an article it’s hard to know where to put it.

The Solution

So I decided to run a card sort exercise with my coworkers. My goal was to understand how they thought about these topics then organize the articles in a way that matched that as close as possible.

I scheduled a lunch and learn, invited the whole development team, and…

(Almost) No One Showed Up

1024px-tumbleweed_rolling

A photo taken at my first attempt at a card sort workshop

Just one of my coworkers and my manager came. I should know by now that now all developers are as into UX as I am 🙂

Luckily, my manager agreed that this was important enough to schedule in and make mandatory, so a couple weeks later, the workshop was on!

The Actual Workshop

I hadn’t run card sorts recently, so I brushed up on my basics. The two main rules that stuck out for me:

  1. Run with one person at a time
  2. Never make people sort more than 30-50 cards at a time

I broke both those rules. Because I only had a one-hour workshop, I had everyone do the sorting in three small teams instead of individually. Also, because we had 100 articles, I did the sort with all 100 of them.

F5ABFE81-7E70-4DC5-A4C8-26C55D6FCF67-cropped

Team Pink sorts away. See guys? UX can be fun!

After that workshop, each team ended up with several named groups with several cards each.

Analyzing and Testing the Results

I then used a template from Donna Spencer to analyze the results. I’d definitely recommend this template. It’s free and it did the trick.

Each team came up with remarkably similar groups. Based on those groups, I then came up with proposed categories and tested with a quick tree test using TreeJack from OptimalWorkshop.

Photo 2017-03-31, 2 57 27 PM-edited

My attempt at making sense of the card sort results. Paper still beats Excel sometimes.

Based on the tree test, one of the cards was clearly in the wrong category so I moved it. A couple of the others weren’t decisive so I added cross-links, effectively giving those articles two homes instead of just one.

Reflections

I’m very happy I did this. It was nowhere near perfect but it definitely vastly improved the structure of our documentation, showed everyone which articles were available, and introduced card sorting to the team.

Next Time

If I had more time I probably would have done the sorts one-on-one with my teammates instead of doing everyone at once in teams.

I should have used a smaller representative sample of the articles instead of trying to sort them all.

In other words, I should have followed the basic rules of card sorts!

Oh well! You can’t learn the limits if you don’t go past them every now and then, right?!