6 apps to supercharge your prototyping

Being a user centered designer means a significant portion of my responsibility involves prototyping concepts to gain feedback for various designs that solve actual business problems. That means iteratively sketching or wireframing ideas early and often in the design process to generate conversation, and more importantly, to gather feedback from stakeholders.

My goal is to ultimately mesh user goals with business goals for a win-win situation that is mutually beneficial from both perspectives. Therefore, I’m always interested in any tool that enables me to not only be more effficient, but more effective in that process.

If what I’ve said so far begins to resonate, you may be interested in the following prototyping tools that can assist you in walking your stakeholders through your vision on the way to your final product.

iMockups for iPad ($7)

If you have an iPad and prefer working on it, iMockups may be worth a look. Although iMockups is designed exclusively for the iPad, it has a presentation view for sharing your vision with a larger audience by connecting your iPad to a big screen. You can place hotlinks on various elements in the wireframe for actual navigation from one wireframe to the next.

If you’re a Balsamiq Mockups user or work with someone who is, it is convenient that iMockups files can be exported to Balsamiq BMML format. With that said though, collaboration and sharing is limited to emailing either editable project files or PNGs.

Flinto ($20.00/month—30 day free trial)

From PNGs to prototypes in 45 seconds is Flinto‘s pitch. That said, however, you still need to create those PNGs outside of Flinto unlike some other prototyping services. Some people might look at that as a negative, but I actually like having the ability to use my favorite graphic editor instead of being confined to using yet another built-in interface that I have to learn how to use before I can do anything. And I don’t think I’m really stepping out on a limb when I say if you’re in the business of creating apps, you probably already have your preferred graphic editor ready to go at a moment’s notice.

Where Flinto really excels is with its integrated Share & Install feature. It allows you to share your prototype link with others who can install the prototype on their homescreen-both iOS and Android-to use like a live working app. You can make it as realistic as you want it to be with recreated iOS and Android transitions, fixed headers and footers, and screens that scroll vertically.

Briefs ($199—free trial)

Built for visual thinkers, Briefs provides a way for you describe your mobile app to others. You’ve got an app design in your head, and Briefs is here to help you get that idea into the heads of others, which includes more that just sharing a demo. Briefs for Mac allows you to see your design and even test it live on actual devices while you design. It uses native animations and interactions so you can gain a really strong appreciation for how it will feel. Like other competing services, you can apply hotspots to flat files that link between “pages” but Briefs gives you the flexibility to use either your own assets created outside of the app or you can build pages right in the app using their library of interface elements.

Briefs separates itself from the rest when it comes time to share your work. Using what they call briefs, you package all of your mobile design timelines into one brief that can be viewed on the free Briefscase iOS app by clients or teammates on their own devices. But what’s especially nice is Briefs for Mac streamlines the exporting of your assets to your developer(s), where you can provide a detailed blueprint that represents your app design.

POP — Prototyping on Paper (free)

If you prefer the tried and true method of sketching wireframes on actual paper or the proverbial back of a napkin, of which I am personally a fan, then have we got an app for you. You literally sketch out your ideas, take pictures of them with your phone, and then upload them into Prototyping on Paper where you can then begin to stitch together your sketches using hotspots.

Yes it’s basic, but that’s the beauty of it. You don’t need any complicated software, just a pencil and piece of paper. After you’ve created your scenario, you can share and demo your rough prototype on an iPhone, iPad, or even in your web browser.

Marvel (free)

Running completely off DropBox, updating your prototype is as simple as updating your design files: Marvel automatically recognizes whenever you save changes to your assets and updates your prototype in the background without the nuisance of re-uploading your files. And unlike much of the competition, Marvel not only supports mobile (iOS and Android), but web and gaming devices as well.

Another standout feature is while you could convert your Photoshop files to images (PNG, JPG, GIF), you don’t need to unless you want to, because Marvel supports PSD files and also claims it will be supporting Sketch soon.

InVision (free–$22/month)

Built for agile iterations, the power of InVision is in its collaboration platform, making it a great choice for distributed teams. Obviously, like many other prototyping services and apps, you can create a clickable demo by linking up sketches, wireframes, or high fidelity designs. And such prototypes can be shared and viewed through a browser or a mobile device for an instant touchable demo. I don’t mean to gloss over these facts, but I just want to get to what sets it apart from other prototyping services.

Unless you’re a one-person team designing apps only for yourself, then you’ve probably experienced some of the difficulties collaborating with clients and teammates, keeping track of who said what about what, and organizing all of the comments and recommendations in a digestible format.

Any designer who has been buried in feedback and struggled to organize all of it will appreciate InVision’s design collaboration tool, LiveShare, which enables real time in-browser collaboration with no downloading required. LiveShare is much more than a screen sharing application as evidenced by visible name tag pointers for everyone in the meeting, voice chat, private conference line capabilities, text chat, sketch mode, and even whiteboard mode where everyone has a pencil with which to draw on a shared virtual whiteboard.

Of course, there is no one size fits all prototyping tool. Many factors determine what might be right for you or your team.

Jason McGovern

Jason McGovern is a user-centered designer and wannabe golfer. He invites you to connect on Twitter @maccgizzle, follow his experiments on codepen.io, or catch his latest rant on maccg.com.