Why you should use clickable prototypes for UX design

Daniel Harrison

December 11, 2019


A best practice in agile software development — and an important way that we help one another continuously hone our crafts as engineers, product managers, and designers at Giant Machines — is the after-action review (also referred to as a “retro”). In these periodic workshops, we identify tools or practices that we want to maintain, update, or drop. Time and again, in UX-heavy projects or UX-heavy phases of larger projects, the clickable prototype emerges as a critical tool for capturing and refining the user experience. I, and the rest of the team, wholeheartedly recommend using them when developing new software.

To bottom-line it, clickable prototypes, which are basically designs you can wire up to act like very dumb websites, are cheap to create (relative to coding), help you quickly understand whether your solution works or not, and even provide peripheral insight into missing requirements.

So what’s a clickable prototype?

For clarity, what we call a “clickable prototype” is basically a set of designs with “hot spots” that, when clicked, take you to another page of the design. If you’re using the right design tools, you may get animations out of the box too.

Here’s a GIF of me using a clickable prototype created in Figma. Note the cool modal background and animations.

Me, using a clickable prototype made in Figma.


What you’ll notice is that it acts a great deal more like an actual website than a static design file would. That’s significant for a few reasons.

First, in the context of client service industry, it helps our clients understand what we’re suggesting. Most of our clients aren’t designers or user experience experts, so asking them to fill in motion and transitions with their imagination is a stretch. Honestly, I suspect even experienced designers will miss things.

To our clients and potential clients, this first point also applies when seeking buy-in from colleagues in other departments of your own organization — up to and including senior leadership. Clickable, dynamic prototypes bring the same level of understanding to key stakeholders (whether support staff or CEO) who may only have a high-level understanding of what you are doing. This brings the work to life in the way reading a Business Requirements Document does not.

Second, using the designs like a website forces you to consider the usability of your solution as distinct from its attractiveness.

Craigslist has been successful from the get-go, despite/because of design focused more on usability than looks.

You get to see whether the user experience is intuitive and pleasing, and whether it is easily learned, in a way static images don’t encourage. As an extreme example, consider that the non-interactive designs for a swipe-heavy app like iPad’s photo gallery would be just a stack of photos. Putting the reviewer in the driver seat makes them consider how the solution nudges them in the right direction, maintains consistency across interfaces, and highlights relevant options that aren’t smack-dab on the “happy path.”

Third, and this is an extension of the previous benefit, if you’re using the designs like an app or website, you start to consider all the other things you’d like to be able to do. Using the designs while they’re masquerading as a tool helps you inhabit the end user’s perspective and identify features and functionality you might have missed in your first round of requirements.

Finally, you get all of the above quickly and cheap. Giant Machines does a fair amount of work on Lean projects, where the goal is to learn as quickly and inexpensively as you can, and clickable prototypes support those goals perfectly. Way back in the day, you would need to write at least some code to discover how well your designs solve your UX challenges. Using clickable prototypes allows you to move quickly, throw away bad ideas with little regret, and only start the relatively expensive job of coding once you’re fairly certain of your solutions.

It’s easy to forget this step of the process, and go right from wireframes to high-definition designs and/or code, especially if you’re more experienced and believe you can fill in the gaps with your imagination and memory. However, speaking even as an experienced product manager, who works with experienced designers, I strongly recommend always taking the nominal extra time to wire up your clickable prototypes and test your designs.

We certainly will.

About the author

Daniel Harrison

Daniel works for Giant Machines as a Product Principal.


Stay in the loop

Keep up to date with our newest products and all the latest
in technology and design.
Keep up to date with our newest products
and all the latest
in technology and design.

Other blog posts

Building With ChatGPT & LLMs: Two Common Pitfalls & One Way To Win

What does it mean for your organization? Should AI materially change your headcount projections? Could AI help your team work more effectively and efficiently? Most importantly, is the AI good enough? Should you trust it?

That’s what Giant Machines aimed to figure out when we launched our own AI/ML project in early 2023.

The Opportunity Gap and its $160 Billion Impact

At Giant Machines, we believe making tech that matters includes creating opportunities, cultivating talent, and making spaces for everyone.

Improve Your Debugging Approach for Better Software Applications (& Sounder Sleep 😴)

In the process of developing applications, bugs will inevitably be introduced (“I code, therefore I create bugs” ~ Descartes, probably). Bugs can be introduced for a variety of reasons, such as logical errors, misunderstanding of requirements, lack of tests, tight deadlines, or something as simple as having an off day as a fallible human. However, knowing that bugs are inevitable, we can arm ourselves with tools to quickly identify and address software bugs before they are released in the wild.


Learn more about us here at Giant Machines and how you can work with us.

What we do

We leverage best-in-class talent to create leading edge digital solutions.


Know your next move


Develop beautiful products


Enrich your tech knowledge

Our work

Learn more about our partnerships and collaborations.

Our perspective

Stay up to date with the latest in technology and design.