4. Interactive

This stage is about choreographing behaviour, workflows, conditionals. Its about seeing realistic behaviour and responsiveness to user actions. These need to be prototyped as much as layout and visual design.

Axure
Complex Interactive HTML Prototypes

Axure visual layout tool that produces HTML JS prototypes without the need to code. However, understanding Javascript is critical to producing sophisticated prototypes. It is extremely powerful. But it is also extremely obtuse. Its like the Hulk of UX tools. A grey and aging Hulk.

Axure follow a basic WYSIWYG approach to layouts. Every object can be made interactive, and you can attach some fairly complex logic. You can, with enough patience and cleverness, make an Axure prototype do almost anything.

Axure can produce very high fidelity prototypes. However I prefer to use it at the wireframes stage. It is an intensely inefficient tool, whose inefficiencies blossom as your prototype grows. Striving to pixel perfection is just too frustrating.

I mostly dislike Axure. But it remains in my toolbox because I know it well and few other tools can deliver similar results. If Axure 9 doesn’t improve remarkably Framer might replace it.

Let’s give credit where due. Axure prototypes are truly interactive. They are not just clickable slideshows. And because it produces locally running HTML JS is it universally sharable and presentable. Furthermore Axure can auto generate full spec documents. This is perhaps more useful in Enterprise or highly regulated environments, and tools like Zeplin or Avocode are much better than a dense spec doc.

Benefits

• Very powerful
• HTML JS based
• True interactivity and responsiveness
• Good for brochureware or basic e-commerce site prototypes
• Can do mobile or web, plus responsive layouts
• Fast and easy to get something started

Drawbacks

There are too many to list. But most boil down to:

• A jurassic UI that still feels like it an engineering proof of concept.
• Rabbit warrens of popups and mosaics of doodads necessary to accomplish even menial tasks.
• The constant need for obtuse hacks and oblique witchcraft to accomplish seemingly simple things — “workaround” and “no” are the two most common words you will see in forums.
• Source files that rapidly spiral out of control into a spaghetti piles of instructions, counter-instructions, hacks and bandaids.
• Debugging the mess often becomes impractical making it faster and easier to just nuke everything and start from nothing than try to fix what’s there. With instructions assigned to events assigned to screen objects that could be almost anywhere, it can be nearly impossible to trace where an offending behaviour is coming from.
• Browser performance absolutely sucks. The single page app is a common software design paradigm. But the weight of all the code on a single page grinds animation and transition performance to a crawl.
• I could go on for pages, but you get the idea.

PRICE

*$29/month subscription, or $495 outright. I purchased it outright and upgrade with each new version.

Alternatives I have Used

• FramerJS. Code based. That may scare some designers. But debugging an Axure prototype is far far scarier
• Xcode. Yes, more code. But really, the amount of time debugging and reacting takes with Axure, I can produce the same mobile prototype in Xcode — and get native performance.