Issue 4 – Apr 2018
The importance of the democratization of design, prototyping a magical marble machine, creating better user flows, and prototyping for emerging technologies

Hi! I hope you are well and ready for the next round of links and resources. Once more, many promising new tools popped up this month, but I also managed to collect a bunch of interesting links which show how flexible and diverse the field of prototyping really is. As always: If you find anything that might fit into the theme of this newsletter, just write me via just write me via Twitter or email:

If you happen to be at the IndieWebCamp or beyond tellerrand Düsseldorf in May, I’d be happy to talk to you about prototyping – and everything else. ;) I’ll be in Düsseldorf for five days, including also the Webworker NRW Meetup, where I'll be giving a short talk (in German) about prototyping in the web workflow. And I’m also looking forward to my Adobe XD Deep Dive workshop at beyond tellerrand on May 9. There are still some seats available! So if you’re in Düsseldorf and can make it, it would be great to see you there. More info and registration: #btconf Adobe XD Deep Dive
– All the best! Matthias


In Defense of Design Thinking, Which Is Terrible

This first article seemingly doesn’t have anything to do with prototyping. I included it anyway. For one, because this piece by Khoi Vinh is just too good to be left out, but also because it directly correlates with the collaborative nature of prototyping. In his talk, Khoi argues that although design now has claimed a seat at the table and is more important than ever, designers still jealously protect the language and tools of design. Yet to become truly powerful, design has to be further democratized – it needs to get out there into the world and in the hands of millions of people.

Prototyping and the Wintergatan Marble Machine

Dave Rupert shares the story of the Wintergatan Marble Machine, an “enormous mechanical device filled with over 2000 marbles raised up by a conveyor belt and dropped on a xylophone, drum contact mics, and bass guitar.” Martin Molin, one of the creators of the magical device, now documents the process of building the next version of the Machine on YouTube with a process that heavily relies on prototyping to experiment and prove ideas.

Death to Process Machines!

Adam Stoddard from Basecamp explains how you can find your ideal design process by sticking to a few simple principles instead of a rigid script. A great example of the different kind of mindset needed when moving away from linear workflows towards more flexible approaches.

8 Tips for Creating Better User Flows

“User flows are visual representations of the path the user can follow to achieve a goal while using an app, website or any other product.” Overflow is a new tool for creating those user flows and the Overflow team now shares 8 practical tips for designers who are new to user flow diagramming.

Quantitative User-Research Methodologies: An Overview

When it comes to testing prototypes with users, quantitative methodologies can offer many insights about your product’s user experience. Kate Meyer covers some of the most popular types of quantitative research like A/B testing, Card Sorting, or Eyetracking and explains their advantages.

Quick Prototyping Tools for Emerging Technologies

Prototyping is invaluable in the creation of innovative solutions for today’s Web and beyond. “Only by building a fleshed out prototype can we get a sense of its challenges and possibilities, revealing insights that give us a glimpse of where emerging technologies like blockchain, AI, IoT, and XR can take us.” And that’s why the people at IDEO CoLab share a roundup of their favorite tools for emerging technologies.

Prototyping maps with Framer and Mapbox

Prototyping often is about combining different possibilities into new constellations. In this case, Sergey Voronov combined Mapbox and Framer to create a prototype of a map experience. In his article, he walks you through the steps needed to build such a prototype by yourself.


Introducing Framer Form

Emil Widlund published a module that lets you integrate 3D-graphics into your Framer Prototype, including concepts like Animations & States.


As the name suggests, Storyboarder by Wonder Unit is a new (free) tool for creating storyboards and animatics. You can export your work to Premiere, Final Cut, Avid, PDF, and as an animated GIF.

Maze – Analytics for InVision prototypes

Maze is a testing tool for InVision prototypes: You can define missions, collect actionable insights and analyze how your design performed, with 0 lines of code.

Lunacy, Sketch for Windows

It’s as simple as that: Lunacy is a native Windows app that works offline and supports .sketch files. Yay!

Adobe XD adds password-protected prototypes and filtered search in the Assets Panel

This month, Adobe XD’s update included a lot of useful changes, for example, the ability to protect your prototypes with a password. You can now also highlight assets in the asset panel (colors, character styles, and symbols) with a right click on the element you want to inspect and search in the assets panel for color values, font families, layer names of symbols and much more. The Sketch and Photoshop integration which was added last month also received further enhancements.

Sympli: Introducing Prototyping Support

Collaboration and workflow platform Sympli now handles prototyping information for both Sketch and Adobe XD in the design specs and preview modes.

Avocode update: Open and inspect Sketch designs on Windows, Linux, and macOS

From now on, Avocode enables anyone to import, open and inspect layered Sketch designs on Windows, Linux (yes Ubuntu too), or on macOS without Sketch app. It even works in the browser.


Stackswell is a Sketch plugin that adds Responsive Typography features and Smart Symbols which automatically adapt to different viewport widths. You can now sign up for early access here.

Sketch macOS UI Library

The Sketch team shares its comprehensive macOS UI Library, with almost 300 Symbols and over 50 designed especially for the MacBook Pro’s Touch Bar.

Sketch UX Kit

Mikolaj Dobrucki has created a Sketch UX Kit full of symbols, presets, and examples. A great start for wireframing and prototyping your next project.