Review of Axure RP Pro

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 Photoshop.

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.

The good:

• 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

The bad:

• You can't navigate your pages inside Axure by clicking links and buttons
• Somewhat expensive

In the following, we'll take a closer look at what Axure has to offer.

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 picture)

Managing pages

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

Widgets

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 bigger picture)

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 master.

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 loose 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' actions.

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.

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.

In conclusion

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.

Comments

"All it does is prototyping, and it does it quite well."