Especially if you are looking for even more good reasons to start prototyping, this interview by Chris Nyffeler with Coe Leta Stafford, designer at IDEO, is well worth your time. But also if you’ve already embraced prototyping as part of your process this podcast episode holds some very practical and useful advice. For example, instead of seeing prototyping only as an additional step in your workflow, you should use prototyping throughout the whole design process as a means to grasp and think through ideas better. This also includes involving non-designers in the process because you will gain even more valuable insights by having a conversation and getting feedback from them.
Caitlin Kalinowski has worked for companies like Facebook, Apple, and Oculus and is a “master of the prototyping process, with a deep understanding of where, when and how changes should be slotted in, from the first iteration to the last.” In this brilliant interview, she shares, among other great advice, her six-step approach to building strong prototypes, how and why you must define your non-negotiables before starting to build prototypes, how to design a process that fits in as many iteration cycles as possible, and why you should make seriously ugly prototypes, too.
User journey maps are a common tool used by UX designers to visualize how people interact with your product in different situations, contexts, and touch points and can help define KPIs as well as inform strategic decisions of product teams. Journey maps can be a prototype in itself but also help decide where to use prototyping to generate more insight and gain more experience. In this article, Nick Babich shares eight steps to create user journey maps, from choosing a scope to validation and refinement.
Building prototypes should be as fast and effortless as possible. Figma is one of the tools that combine design and prototyping capabilities and allow for efficiency and flexibility when building your prototypes. In this post, Thomas Lowry shares five tips to speed up and improve your prototyping workflow in Figma, like using components for scrolling content or timed delays and overlays to simulate interactions.
Skeleton screens have become a popular design pattern to convey to users that content is being loaded asynchronously. And, in contrast to loading spinners or progress bars, they come with the huge benefit of increasing the perceived performance of an interface. Marina Aisa explains the benefits of skeleton screens and how to design and build them. An maybe it’s a good idea to use them in one of your next prototypes.
This talk by Ethan Marcotte from New Adventures is one of the best I’ve ever seen and certainly one of the most important you will see and hear this year. Ethan, who coined the term Responsive Web Design nine years ago, looks at the current state of the Web and the many challenges facing our industry and draws parallels to the technological breakthroughs during the industrial revolution: Just like with other technologies that came before, the invention and growth of the Web was accompanied with high hopes for a better future. But instead, we are now continuously facing ethical, moral, and political crises while automation and machine learning are reshaping our world and the way we work. It is time for us to start asking ourselves what kind of work we want to do in this world and also to realize that we’re all in this together. And only together we can bring about lasting change.
Everyone working in our field (and beyond) should watch this talk.
Voice interfaces are here to stay and voice will certainly develop into a totally natural way to interact with digital devices in the years to come. Yet, designing and especially prototyping for voice is not the same as for visual designs. In this talk at Google I/O 2019, Kai Haley and Wally Brill provide many examples of practical design patterns for voice user interfaces. They also go into detail about why the format of a Design Sprint must be adjusted if you are designing a conversational experience and highlight how to plan, structure, and run a Conversation Design Sprint.
I can’t recommend Kathryn McElroy’s book “Prototyping for Designers” (O'Reilly Media, 2017) highly enough. Not only because she explains the goals and methodologies behind prototyping and shows how to prototype for both physical and digital products and test your prototypes with users, but – maybe even more important – because Kathryn gets you to recognize that prototyping is not only a tool or a specific process but instead a way of thinking, a mindset.
Adobe XD: Introducing Design Systems in Adobe XD: Easily Create, Share, and Manage Reusable Colors, Styles, and Components with Your Team
The May update of Adobe XD is a game changer. It brings useful and long-requested features like artboard guides, keyboard and gamepad triggers for your prototypes, a polygon tool, and additional text formatting options. But on top of that, you can now also build pattern libraries and style guides with linked colors, characters styles, and components. Components work with responsive resize and, in the coming months, the team wants to add support for defining multiple component states and animating between states, to create robust reusable components with interactions.
Torch is a tool to create and share spatial experiences for augmented reality. With Torch 3, the team now took Torch from a prototyping and design tool to a full augmented reality app development and publishing platform. Torch Publish Pro lets you share your creations with anyone with an AR-capable device via Facebook, Instagram, WhatsApp, and soon WebAR and more social networks.
The latest release of Framer X is completely focused on working with code right from within the tool. The update brings a new “Playground” which consists of a new built-in code editor, a complete prototyping library, and proper documentation to get you started quickly.
Overflow, a tool to create interactive user flows, has reached version 1.0. The update features support for organizations, people, and roles, an all-new dashboard, and improved sharing capabilities.
Sketch.systems is a tool for sketching states of a software product. It is “like Markdown for describing your product behavior”. You can sketch out the different states of your application and then link them together to a prototype with transitions, triggered by events.
Polypane is a browser to create and test websites and apps that lets you see the full range of viewports for your site in a single overview, take screenshots, and much more.
Alex is a neat command line tool that helps you find gender favoring, polarising, race-related, religion inconsiderate, or other unequal phrasing. And it even offers linting integrations for many popular code editors like Atom, Sublime Text, and Visual Studio Code.
The Design Sprint Kit is an open-source resource by Google that will help you learn, plan, and contribute to the “Design Sprint”, a methodology for solving problems through designing, prototyping, and testing ideas with users.