Design Tool Review: InVision

Prototyping is one of the important stages of an efficient UI/UX design process as it allows trying design solutions and testing them practically before moving to high-fidelity design polishing as well as product development.

In one of our previous articles, we have already mentioned the benefits of prototyping for designing a strong and positive user experience and reviewed one of the popular prototyping tools Pixate. Today we are going to continue this conversation by describing the other efficient software for prototyping called InVision.

General description of the tool

InVision is the comprehensive prototyping software supporting the process of designing user interfaces for mobile applications and other sorts of digital interactive products. Now it is one of the major players on the market, perhaps due to constant improvement and extensions of the functionality that the company adds to the product as well as the strong informative support via its Blog which shares diverse cases and articles on design.

The basic idea behind InVision is fast and easy to create a live prototype from static images of any fidelity level. The tool provides the ability to upload wireframes that can be more or less detailed and with the functional facilities of the software they are automatically transformed into the prototype of the app. It is possible to follow the necessary transitions, test the buttons, analyze the layout in the mock-up of the device interface.

Working over numerous projects on UI/UX design for mobile applications here in Tubik, we are usually keen to try different tools and software to increase productivity and – what is more important – efficiency of design workflow and communication with the customers. These are the reasons why the InVision prototyping tool has become popular here in cases of app design. Being simple and clear in its interface, it doesn’t scare clients who can be easily involved in the process; in addition, it provides numerous functions enabling designers to make the process of testing design faster and easier in terms of productive teamwork.

Why should you try prototyping?

As we have already mentioned plenty of times in our earlier blog posts, prototyping is the essential stage of the design process when the user interface for a mobile application or a website is created. Based on our practical experience, we can definitely say that prototyping is the stage when testing can save time, effort, and money.

Let’s see, how the process is going on here in the studio. After setting clear objectives for the product, conducting user and market research, and defining and analyzing the target audience designer starts working on the initial UX design solutions. This is the time when the living organism of the future product gets into its skeleton and all the elements that have to be included started functioning as a united system. The designer thinks over all the layout, forms the group of screens, decides on their functionality and transitions, and thinks over the most efficient variants of placement for interactive elements and CTAs. The result of this process, based on a great deal of thinking and analysis, is initially given out as a system of UX wireframes. This is usually the set of screens done in a limited color palette and its main goal is to set all the logic and functionality of the future application. And this is the high time when the team involved in the design process could apply a prototype to make a full analysis of design solutions before starting the UI design stage.

A lively and clickable prototype tested in the mock-up of an actual device screen you design for is a great and fast way to reveal any sort of problems influencing the usability of the product. It lets all sides of the design process – designers, managers, QA testers, and clients – have actual experience of interaction with the future product, to ensure that there are no missing parts or unnecessary steps in the process, to test if all the elements are logical and placed right.

The great advantage of the InVision tool is that due to its functionality it’s now rather easy to apply the technology of prototyping, in fact, almost at all the stages of the design process as it is not time-consuming to upload the static images of the screens and form the prototype with them. That means that it’s possible to start effective testing from the very first groups of screens to see how they provide the logic of the layout and transitions.

Moreover, in the case of using the tool, it is also possible to test all the UI decisions in the clickable prototype and see them actively used. The designer can apply animation and simulate gestures using tools’ native functionality to make the prototype feel even more realistic and the experience very close to natural.

The power of collaboration

What we especially appreciate about InVision software here in Tubik Studio is its strong and constant support of efficient collaboration in the design process. Knowing that fast feedback from the client is a vital feature of the effective and productive design workflow, the creators of this tool made it convenient and clear not only for designers and project managers who are usually fast in dealing with different tools and soft but also for those customers who are not really avid software users and it takes some effort for them to deal with the new tool. InVision has good navigation and is user-friendly for different types of users.

The tool enables creators to get a clickable prototype and at the same time to communicate on every smallest part of it. That means clients are able to set their feedback not only to a particular screen but even to a particular element of the screen such as a button or toggle, shade or shape, piece of copy, or graphic icon – anything. It provides the functionality of multiple threads and therefore designers, managers, and clients can discuss particular elements quickly and set a more productive workflow together.

Additional features

Except for the general functionality of the prototyping process, some important additional features of the tool should be also mentioned:

• Easy and fast integration with other design tools for efficient work, such as Sketch or Photoshop, for example, from which the wireframes can be directly uploaded to InVision.
• Supporting cross-platform experience: the tool provides the ability to set sizes and resolutions of different devices you design for. This feature is highly applicable in the process of responsive design and mobile adaptations.
• Easy control and marking of project statuses for efficient project management.
• Functionality for creating and presenting mood boards, brand boards, galleries, and style guides.
• Tools for direct live communication right from the project account. Especially appreciated by the teams working remotely.
• Saving versions history to easily compare several versions of design solutions.
• Diverse functions and features for creating high-fidelity prototypes that can be used for user testing before the stage of development.

So, the software has shown itself as an important tool for improving teamwork and the process of testing design solutions as well as tight collaboration with the customers. Those positions are among the key points of an efficient design process providing thought-out, high-quality, and user-friendly designs.

Originally written for Tubik Blog