header thumbnail image

Just 5 Reasons why we use InVision for Prototyping

January 16, 2018 - Adam Jenkins

One of the biggest challenges when presenting a new website design can be showcasing your designs. You want to do it in a way that the client can imagine how it will be shown on a working website. This is where InVision comes into the equation. After working with InVision for a few years now, it is difficult to imagine working without it ever again. Unless something better comes along of course!

So what is InVision?

• InVision is a prototyping tool that allows you to take your design mockups and turn them into interactive prototypes.
• Can then be shared and viewed by the client or fellow team members.
• It gives a better experience when sharing designs.
• A more realistic portrayal of how it will be viewed on the required device you are designing for.

Below are 5 reasons why I love it, there could have been many more!

1. Simple collaboration with the team and clients

One of the problems you can be faced with when you share a design is gathering any feedback in one place and keeping on top of it. You may get feedback via many emails, phone calls or Slack conversations. By sharing a link of the design created through InVision, using the “Comment Mode”, the client can leave comments on any part of the design. This helps you to navigate to which section needs changes.

It also allows communication to be kept through the InVision app and not numerous emails back and forth. This allows a smoother process when communicating with the client or team members. Essentially reducing any risk of feedback getting lost.

2. Fast prototyping

For a new website design, it is important to showcase the user flow and what would happen when you interact with certain elements of the page. For example, if I click on the “Buy Now” button in the design what will happen next? Using the “Build Mode” I can link all my designs and display the designs as a working prototype. This allows both the team and client to get a better understanding of how the website will interact. Allowing any key changes to be made in the early stages of the project. Leading to a better and more efficient result when it comes to production.

You can even show what kind of hover states will be used. This is something that can often be overlooked. It can become time-consuming to be considered later on after the first design phase of the project.

3. Save time with instant updates to your designs.

A useful plugin is Craft, a plugin created by InVision. You can sync your designs created in Sketch or Photoshop straight into InVision. No need for standalone files that are then uploaded into inVision. This saves you a lot of time when you come to making any required changes to the first designs. Allowing you more time on doing the important things, such as the real designs!

4. You can create responsive mockups

For every website, it is critical that you get the same experience on a desktop as you do on mobile. This is why InVision allows you to choose the device that you are prototyping the design with. You can choose between, desktop, tablet, mobile, and now even watch devices. This means there are no shocks to how the design scales from desktop to mobile.

5. Smooth handover with the development team

One of the key distinctions within the design processes for websites is a smooth handover to the developers when the designs are signed off. Sometimes it can be problematic if files are not supplied correctly or if there is confusion to which assets are related to the design. Using the Craft plugin you can now attach the assets and store them all in one place using the “Inspect Mode”. This mode also allows you to view the CSS values of particular parts in the designs. This helps when the developer is looking to see how a particular part needs to be displayed.

These are a few reasons why InVision is my go-to tool for prototyping. Although I am sure I will be writing about more great features in the coming months!

Back to Blog

Let's start something special

Get in touch with Fifteen today to start your project.

Get In Touch
Footer Call to Action
Sending