UX, Collaborative Design and Prototyping Gold: InVision (For Mobile and Desktop!)

You know what I love? And I mean, love, love in a big way? UX and design tools that make life easier for me and the rest of my amazing team.

If you work on a design team, whether big or small, you really really need to check out InVision. It has changed our entire design process in an extremely positive, time saving, better organized kind of way, and it saves us from using several different tools to do a job, which in turn saves us from having to replicate work and waste time!  Add to that the intuitive, extremely user friendly UI and you have a definite win. So what makes InVision so magical you ask?

It takes the agony out of design collaboration.

I work on a team with an incredible group of folks. Other than myself, our team is made up of 2  incredibly talented UX Engineers, a fabulous UX designer, a UX manager who is an interaction design rock star in addition to being a code ninja, and a VP who is incredibly innovative.

When you have a new design concept, what’s your process?

Maybe you discuss, wireframe, review, make high res mockups, review the hi res, email suggested changes to the mockup maker, when that person makes and uploads or emails the changes they let you know and you re-review them, the process repeats, then they go on to the next level up for review, the same process happens, feedback is sent, mockups are edited and re-uploaded or emailed.

You finally end up with solid hi res mockups, then you have to get out your prototyping tool, upload your high res graphics to it, hot spot them (or code click paths if you’re hardcore), then show them to your stakeholders/user testing community, get feedback from those folks via survey or email or phone call, have the graphic designer edit the hi res mockups again, then make another prototype with the new mockups, send them to your stakeholders for approval, then eventually send your mockups off to your dev team to be coded once everything is finalized.

You know what the flaw is with that process? It’s 982374 layers deep and you have to do the same thing over and over again (which is a sign of insanity by the way).

You have to edit graphics and upload them or email them over and over and over again, then herd feedback from all over creation into a pile and attempt to keep it all lost in one place, and you have to edit mockups and create new prototypes for demoing and testing post feedback rounds over and over.

InVision on the other hand, does ALL of the things! Hence my deep deep love for the tool.

1. Create  your hi res screen mockup, save it to your InVision sync folder and from that point forward any edits you make to a mockup are instantly applied to your shared prototypes!!!

Use InVision’s FREE Mac App to save your hi res mockups to a sync folder, and every time you edit and save changes to a screen graphic, they are magically applied in real time to your prototype! It’s like the Google Docs of UX and graphic design! It’s kind of amazing!

Let me say that again. This happens in REAL TIME. You don’t have to upload or share or prototype over and over again. You edit your mockup screen, click save, and BAM. Your prototype is updated, good to go and ready for instantaneous review.

2. Reviewers can notate requested changes on the screens!

Instead of showing your reviewer a screen and asking them to email you feedback, or giving them a survey trying to gather feedback, or IMing feedback or saying it out loud, folks you share the design with can just leave comments on each mockup screen. This goes for managers, VP’s and any other stakeholder you give access!

You can also put snazzy status updates on the screens, so folks you’re collaborating with can see if something is in progress, approved or if  it is ready for review!

3. The UI is fab!

The UI is super intuitive and simple to use!

4. You can make mobile prototypes, desktop prototypes, tablet prototypes, you name it! 

You’re making chrome free touch UI prototypes here! And they let you integrate the latest in fun, modern gestures!

From a mobile standpoint, when you send a finalized prototype link and a person clicks it, they are prompted to download the prototype and add a shortcut to their phone home screen, which even lets them see the custom app icon you’ve spent time perfecting! It gives that warm fuzzy native app feeling when folks are checking it out!

So how many layers of design process steps did we just kill by using InVision? About 92.

Do you and your design & UX teams a favor, and check out InVision! (Pro Tip: You can test it out for free!)

(Our awesome VP Jason @jcoudriet and our fabulous UX Designer Danelle @danellesheree were the discoverers of this magic! And big thanks Danelle for reviewing this article and sharing even more benefits that I didn’t realize existed prior to writing this article!) 🙂

UX and Design Tools That Will Improve Your Productivity

This is a list of some of my favorite UX, design and accessibility testing tools at the moment! I hope you find them useful!

Tools for Collaboration

Tools for Usability Testing

Usability Testing Services That Provide Testers

Tools for Mobile Usability Testing & Prototyping

Tools for Usability Tester Recruiting

Mac Tools for Demoing Apps

Tools for Stat Tracking

Tools for Accessibility Testing

Miscellaneous Tools I Love

If any of your favorite tools aren’t listed, please feel free to leave them in the comments! I love testing out new tools! 🙂