On a recent post/podcast at Boagworld Marcus Lillington did a nice piece on his process for planning the architecture of a site. We thought we might make some comments about how we think Jumpchart could fit in the process.

“Map out the existing site
The first thing I do is map out the existing site’s IA…”

We’ve done our fair share of this same thing in our tests. We find that Jumpchart helps us map out the site quicker than any other method we’ve tried. Copying and pasting between browser tabs can yield amazingly quick results. Looking at the hierarchical navigation is like looking at an outline.

“Be logical, captain
Usually, the goal of this type of exercise is to streamline content into groups and name those groups so that users will understand what’s inside them…”

“I tend to print out the existing site IA (that I usually create in Excel unless it’s a particularly small site, then I might use Visio)”

“Some people like to use cloud/cluster diagrams (either on paper or using software) or there is always the age old method of creating ‘cards’ where each page name is written onto a scrap of paper. This is a bit like doing card sorting on your own where you group the cards into piles and give names to each pile.”

One of our favorite ways to get started in a situation like this is just start with a totally flat navigation in Jumpchart. Starting with every single page at the top-level forces you to rethink all of the navigation. Since Jumpchart makes it easy to drag pages through the hierarchy of a website, it’s easy to be creative. If sites are terribly large, it might be easier to make individual Jumpcharts for sections.

“Naming
...Labels should be as descriptive as possible…”

Not much to say here, but we do find that being able to click while you create forces you to be descriptive, and brief, -so you can find the page again…

“Section ordering
...This should follow some sort of desired path through the site.”

Jumpchart’s drop-and-drag navigation can’t organize your site for you, but it sure does help you to get started. Being able to drag either individual pages, or entire sections of navigation makes it really easy to clean house.

“Conventions
...Users looking for this type of information don’t want to have guess that this information might be under, for example, ‘Company Background’ which is located at the far right of a horizontal navigation.”

We use the Jumpchart preview feature early, and we use it often. Since you’re empowered to throw a convincing wireframe together so quickly, it’s easier to get feedback early in the process. At this stage in the process you may not want collaborators, -sharing an un-editable preview helps you get feedback on your ideas before you have to back-track.

“Collaborate – to a point
When you have created your first draft it then needs to be reviewed by the client, discussed and iterated until everyone is happy. Take on board any changes that are based on your lack of understanding of what the client does but be prepared to stand your ground on issues relating to web conventions and usability – after all, they’re paying for your expertise.”

Marcus says it spot-on here. Most clients aren’t great at getting outside of their corporate veil enough to visualize the way a customer wants to navigate. Still, we tend to believe that the power of Jumpchart lies in its collaborative abilities. With old methods, we agree, -put off collaboration until you can’t avoid it any longer. With Jumpchart, working with others builds stronger projects quicker. It saves you time, and your client money.