Creating High-Fidelity Portal Prototypes in Axure

I recently posted about high-fidelity Axure prototypes on our new Spark blog. While the post focuses more on the visual design aspects of Axure, the prototype I created was for a financial services portal and also included a fair amount of interactivity for the purpose of demonstrating the product to potential customers.

Revolutionize Your Business With Generative AI

From product design and software development to virtual agents, content creation, and reporting, GenAI is transforming business. Our AI experts help you unlock GenAI’s full potential and drive growth.

Let’s Get Started

Axure has sophisticated condition-building features based on storing and passing variables between pages, and with some effort can allow you to add all sorts of functions to a prototype so that it acts just like a live web application (minus the back-end integration of course). For the prototype, we used a realistic dummy data set with several points of open input for the user to see how various forms and interactions would behave.

While it’s not always necessary to add this level of interactivity to prototypes – after all, this is not reusable code – once you become an advanced Axure user you’ll find that it’s easier to create the interactive states you want the developers to build than to laboriously document states and behaviors in a lifeless requirements document. Most people have a better time understanding something when it’s shown to them vs. having to read about how it’s supposed to work.

If you’re not already, I highly recommend prototyping in Axure or similar tools during the design phase of a development project. Other tools are available at various price points as well depending on your company’s needs. Prototyping:

• drastically reduces the documentation requirements for the BA role.
• makes it much easier to quickly iterate through designs with a cross-functional team.
• makes designers rigorously think through various application states.
• allows designers who don’t code to more clearly communicate and fine-tune their plans to development.