Creating wireframes or Sketches is a critical step before developing new software. But what happens when you have multiple wireframes that outline several pages in a piece of software, or several user states that the app can have? It can be a bit overwhelming to review, and you quickly lose the context of what you’re viewing. This is when creating a clickable prototype of your wireframes comes in handy.
Using a 3rd party prototyping software, like InVision, allows you to create clickable, interactive prototypes in just a matter of minutes. There are a lot of prototyping software tools available in the market. We’ve had success with InVision for multiple projects, but you might have to try a few to see which one fits your needs the best. You simply upload your existing wireframe images and use their tool to highlight the clickable areas, add gestures, etc. It’s a very intuitive process and really doesn’t take that long to create.
Upload your wireframe or Sketch into InVision:
Draw the clickable areas on the page:
Select the appropriate link for each clickable area:
The final product is a shareable URL that houses your clickable prototype.
There are two key benefits from taking this extra step before any development is started:
- It forces you to think through all the scenarios of the software. Once you start interacting with the prototype, you’ll be able to see if you thought of all the user states. Did you account for what happens when X button is pressed? What about when you take Y action on the page?
- It allows you to show the prototype to stakeholders and users of the software to see how they interact with the software. Do they find it as intuitive as you hoped it would be? Were they able to find the new feature? Then you take this feedback and iterate on the wireframes before you start building. Priceless.