Prototyping is not only a service we provide to our clients, it's the key to success for our projects. This year, we created over 45 beautiful, detailed prototypes to bring clients' ideas to life, inform stakeholders about direction, and help teams make decisions about the path forward.
Creating prototypes also helps our team think through problems and communicate ideas to fellow designers and developers. "Being able to swipe or tap through an idea I have is one of the best parts of what I do," says Lead Designer Ronnie Johnson. "Not only does it help me better understand the challenges I'm working on at any given time, but it also helps me springboard to other ideas I might not have realized in a static comp."
We rounded up some favorite prototyping insights and resources that have caught our attention over the past year. Whether you're new to prototyping or you're a seasoned pro, there's something here for everyone.
With so many great prototyping tools available, most suited for particular types of projects, it can be challenging to determine which one best fits your needs. UX Designer Javier Cuello discusses various aspects, from learning curves to levels of fidelity, to take into consideration before deciding.
David Boardman and Sera Koo of IDEO discuss how their teams have used chatbots as prototyping tools for three health-related projects. By using chatbots, they are able to test and adapt ideas quickly based on feedback from users interacting with the chatbots. For more information, take a look at what the teams have to say about the technical implementation of the chatbot prototypes.
Speaking of bots, Product Designer Isil Uzum shares her concept for Facebook Messenger integration of airline booking as an example for how to bots can be more helpful in completing specific tasks.
Valve Software's VR lab is where a lot of the work for the HTC Vive has taken place. Make: magazine has a behind-the-scenes look, photos of early Vive prototypes, and a video featuring some of the highlights.
Product Designer Mohammed Bilal discusses the current status of popular prototyping tools and how they must change to be successful in the future.
Our design sprints help businesses refine their focus and create great products. Black Pixel Design Director Tom Carmony delves into how these engagements work, including the integral role that prototyping plays.
For those who are new to prototyping, Ezequiel Bruni of WebdesignerDepot created a comprehensive guide that covers the basic principles of prototyping, links to other guides with more information, and popular tools for various prototyping needs.
If you follow our Design Huddle, you've probably noticed by now that we are big fans of Framer. There's a learning curve with this design tool, but don't let that dissuade you from using it. The folks at Framer are here to help you get started.
The InVision team put together a list of icons, design kits, apps, and resources they recommend for bringing prototypes to life.
In the sea of prototyping tools, Xcode is often overlooked. WIth his three part series, Black Pixel Staff Designer John Marstall covers the benefits of using Xcode for iOS prototyping and a step-by-step guide to help you get started.
Figuring out how to use storyboards for Mac projects and the Swift language together can be frustrating. John Marstall shares his approach.
There are modules available to extend Framer's core functionality, but what if you can't find a module that you need? This is an excellent guide on building your own Framer modules. It includes a walk-through for creating a demo module with the option to download the code for further exploration.
How to Incorporate Cinema 4D Into Your Framer.js Prototyping Workflow for VR/AR Applications and Experiential Prototypes
Product Designer Adam Mazurick shares his experience with incorporating Cinema 4D content into Framer prototypes for AR and VR apps. While he faces a variety of challenges, his conclusions are encouraging.
Bonus Framer Bits
As was mentioned, Framer is a favorite design and prototyping tool among our team. These particular tools, resources, and modules for Framer have proven helpful this year.
This feature set for Framer makes it easier to create user flows from start to finish (think "onboarding to checkout"). It even includes standard iOS transitions. For more information, take a look at the full documentation.
Framer now better supports large viewport and desktop prototyping, including built-in options for MacBook, iMac, Dell XPS, and Sony TVs.
Framer's iOS app provides real-time, instant previews of your prototypes, the ability to download prototypes for offline views, and more.
Facebook Product Designer Charlie Deets compiled a library of common Framer snippets to help speed up your prototyping workflows.
For those of you who are creating Apple TV apps, our design team released a custom Apple TV remote module for Framer. The RemoteLayer module allows you to instantly generate an interactive Apple TV remote for your tvOS app prototypes.
This module for Framer allows you to create custom SVG shapes and animate each individual point.
Hook is a cool module for Framer that lets you connect one property to another via spring or gravity.
This Framer module helps you to more easily calibrate animations within your prototypes.
Use a MIDI controller to manipulate settings for your Framer prototypes.
Did we leave out your favorite prototyping resources or insights? Share them with us on Twitter.