Tools to visualise prototypes.

Whenever possible before building out a spec, I would recommend you sketch or model an application idea or prototype visually. For me design is quite visual and only once its on paper or on-screen does it come alive.

UX/UI designers specialise in these types of activities, employing a contractor or agency to prototype your experience is a worth while exercise as they will bring insight and outsight to your ideas which may differentiate your product from someone else’s or simply give a more optimal flow.

Design tools, such as sketch provide a rapid environment for building prototypes along side the more traditional illustrator/photoshop route.

Reworking these designs is essential, rarely is the first design likely to be 100% correct.

Warning: before you start you should be aware of any constraints such as specific inputs and outputs if your project relies on XML/API feeds, but its not a bad thing to challenge the norm and question why. Caching and workarounds can be possible!

Once you have a series of prototypes/sketches, thats great, but often these will not interact with each other. They look and feel great but initial sketches can often be incomplete omitting sections or sub-journeys. These omission can often be the cause of delays in time and budget deviation.

So how can we overcome this?

You can extend your static designs with Motion Tools. These introduce animation, and interaction between prototypes/sketches (pages). Once complete this will allow you to then review the whole experience, identifying any UX and/or behavioural issues with either your own team or a sample group.

Applications such as Invision, Principle, and Flinto, provide “Flow” (or Motion to your Design)