Queron Jephcott Team : User Experience and Information Architecture Tags : Technology Information Architecture

Updating an Axure wireframe from scratch

Queron Jephcott Team : User Experience and Information Architecture Tags : Technology Information Architecture

As an interaction designer, a large proportion of my time at work is spent using Axure. Axure is a strong tool, helping us maintain consistency across our prototypes by utilising masters and dynamic panels.

However, during the course of prototyping a web site, your Axure prototype can easily resemble a mash up of colours, panels and masters.

So if you’re ever lucky enough to have a second go at an existing Axure prototype, here’s a couple of easy steps to minimise the size of the prototype and the functional specification:

  • Masters – these are the key to a small functional specification. If you’ve used something more than once, master it!
  • Masters in dynamic panels – Looking back over an existing prototype, no doubt you’ll see an instance where you’ve though “Hmm... I need this to look exactly like this master, but without this button” or something similar. This usually results in a master dropped on the page and a white square placed over the differences. Get these variations of a master into dynamic panels within the master. You can use the OnPageLoad interaction to set the correct panel for each page. This saves heaps of time when it comes to functional specifications.
  • Combine pages – often when the prototype is finished, you’ll have a page or two that’s almost exactly the same. Using the techniques above, get these pages combined and use dynamic panels to display the difference. Think templates, not pages.
  • Move things, don’t duplicate – when working with dynamic panels to display two different states of a page, it’s often easy to just copy all the consistent content into both panels. If you’re prototyping your pages again, make use of the OnShow, OnHide, OnPanelStateChange coupled with the Move Panel(s) interaction. Using the first three you can trigger other panels to move around to display the various dynamic panel states.  This ensures that consistent content is displayed more than once on a page.

Four easy points to help you clean your prototypes up when/if you get that opportunity to do so!