Prototyping is an Essential Tool for Design

Published March 5, 2019 by Jason Ferrell

Prototyping has come a long way in the last 5 years. Tools, such as Framer X, give us the ability to prototype with real data on real devices using device gestures and animation. It's an exciting time to be working in this space!

There are many reasons to prototype, so let's explore why prototyping is a valuable and necessary tool to leverage for designing websites, web apps and native apps.

Explore ideas quickly

Have an idea for an interaction or an app? Prototyping is the quickest way to flesh out whether an idea has potential. By putting ideas into context, we can quickly identify the good, bad and the "maybes". And since we didn't just jump right in to static mockups, we can be more efficient with time management.

Use real data in the design process

I can't tell you the number of times that I've seen static designs—that don't use real data—end up causing layout issues. By using real data in the design process, issues can be addressed while the design team is still engaged and before development has begun.

Get stakeholder buy in

Being able to view and interact with a high-fidelity prototype on your device has a way of communicating value unlike flipping through a PDF of static mockups. When the projects success or failure is on the line, we can better convince key stakeholders of the value when sharing a high-fidelity prototype.

Don't leave room for guessing to the developers

Static mockups can't show interactions or animation, so how are developers supposed to know what the design intention is for an interaction or animation. Nothing against developers, as I am one too, but this is a critical omission that potentially doesn't end well. When design tasks are passed on to a developer, the solution will not match the design intention and could lead to bad UX.

Screen capture video of an iOS app prototype built with Framer X and real data from a JSON API

In the next post, we'll cover features and capabilities of Framer X in depth.