Review of Axure RP Pro
A dedicated tool for web prototyping
Axure RP Pro is a dedicated tool for prototyping web sites
and web applications. It's based on concepts known from Visio and
web design tools, and elegantly combines the best of the two worlds.
Interaction designers have suffered from the fact that there have been
no decent software tools on the market dedicated to prototyping. Those
of us who didn't stick with the pen, paper, scissor and glue stick method
of paper prototyping, have had no other option but to use and adapt tools
designed for other purposes, such as Visio, Dreamweaver, PowerPoint, and
Axure have set out to change this.
Their Axure RP Pro is a dedicated web prototyping tool. All it does is
prototyping, and it does it quite well.
- Drag and drop widgets onto a grid (as you might know it from Visio)
- Generate prototypes in a format that behaves like real web pages (i.e.
you can interact with forms and pages can scroll)
- Save time on repetitive changes by using custom widgets and templates
- Simulate rich interactivity by showing and hiding layers
- Automatically generate user interface specifications
- You can't navigate your pages inside Axure by clicking links
- Somewhat expensive
In the following, we'll take a closer look at what Axure has to
The basic concept
If you are acquainted with Visio and maybe even the GUUUI
Prototyping Tool for Viso, Axure RP Pro will look and fell very familiar
to you. It has adopted the basic concept from Visio, where you drag and
drop widgets onto a grid.
Axure RP Pro's basic interface (click for bigger
In Axure's Sitemap pane you manage your pages in a three view as
you might know it from web design tools. This gives you a good overview
and allows you to have you pages nicely organized. The pages can be rearranged
using drag and drop.
The Sitemap in Axure, where you create and manage the pages in your design
Axure comes with a number of built-in widgets, such as link, text, image,
table and form elements that you can drag onto the grid.
Axure's Widgets pane
You might find that the range of widgets is limited, but my experience
with the GUUUI Prototyping Tool is that this is
pretty much what I ever needed. I couldn't find any tab widgets in
Axure, but figured out that the Button Shape widget can be modified to
all kinds of shapes, including a tab shape. I also missed a "Lorum
ipsum" dummy text widget, but luckily it's possible to add
custom widgets to Axure.
Building the prototype
Pages are designed by dragging and dropping widgets onto the page grids.
The primary way of making the prototype interactive is by linking links
and buttons to other pages.
Linking pages in Axure
Unfortunately, you can't navigate pages by clicking the links and buttons
within Axure. The only way to evaluate the interaction design is to generate
the prototype and navigate the HTML output.
Generating the prototype
When you want to see the result of you prototyping effort, you click
the Generate Prototype button. The prototype is exported in HTML format,
which means that the pages behave like real web pages. Links and buttons
are clickable, you can interact with form elements, and pages will scroll
if there's content below the fold.
Example of an generated prototype (click for
You can decide whether you want the export to include notes, annotations,
and descriptions of interactions.
Unfortunately, you can't exclude the sitemap if you want a clean prototype
without any fluff. To get rid of the sitemap, you have to click the Close
Frames link in the generated prototype.
Templates and custom widgets
Axure's masters allow you to create reusable objects that you can
drag from the masters pane onto the grid just like the built-in widgets.
The masters can save you a lot of time doing repetitive work.
Axure's Masters pane
Masters come in three flavours, which can be set by right-clicking the
By right-clicking a master, you can set it to Normal, Place in Background
or Custom Widget
When set to Normal, the object dragged to the grid preserves
its relation to its master. If the master is changed, the change is reflected
wherever the widget is used in the prototype. This is useful for things
such as global headers and footers.
Masters can be set to Place in Background. This will
send the widget to the background, locked in the position defined in the
master. Any changes made to the master will be reflected wherever the object
is used. This is useful for page templates.
When set to Custom Widget, the object dragged to the
grid will lose its relation to its master. Changes to the master will
have no effect on the objects placed in the pages. Instead, the object
itself is editable like the built-in widgets.
It's also possible to place masters onto other masters. This can
come in handy, if you are going to prototype a site with a global menu
and local sub menus in each of its sections. For each of the sections,
you can create a master with the sub menus and then add the global menu
to these masters. If you have to change the global menu later, the changes
will be reflected in all the sections of the site.
Prototyping rich interactions
Now that extensive use of client side scripting has risen from the dead
in the shape of AJAX, there's a demand for prototyping tools that
can simulate more advanced interactivity than links and forms can provide.
Axure has realized this. Their prototyping tool comes with Dynamic Panels,
which are layers that can be hidden and revealed in response to users'
With a bit of creativity, the dynamic panels can be used for various
things, such as drop-down menus and tab controls. But there is a limit
to what you can simulate by showing and hiding layers. AJAX enthusiasts
will be disappointed if they expect Axure to be able to simulate all kinds
of advanced client side interactions.
blog has an example of an inline
editor for changing photo titles. The prototype is inspired by Bill
Scott's article Storyboarding
Rich Internet Applications with Visio. The difference between the
Visio and Axure approach is that the Visio version is a storyboard, while
the Axure solution is an actual prototype that you can interact with and
use in a usability test.
Axure does your paper work
If you are used to write detailed interface specifications, Axure will
come to your rescue. During the prototyping process, you can add notes
and annotations to almost everything - pages, widgets, masters etc. - and
generate a Word document with all the screenshots and specifications included.
In this way, Axure keeps your prototype and paper work in sync. The reports
are of course highly configurable.
I have been pleasantly surprised by the capabilities of Axure RP Pro.
As said, it combines the best from Visio and web design tools. From Visio,
it has adopted the drag and drop onto grid concept and from web design
tools the hieratical management of pages and output of regular HTML.
At Axure's site, you can find an online
demo, sample prototypes,
and a 30-day trial of
Axure RP Pro.
Text: Henrik Olsen