Issue 2 – Feb 2018
Using prototypes to envision great experiences, prototyping UI in Unity, prototyping simple voice interfaces, and lots of tools

Hi! There is a lot going on in the world of prototyping tools right now, so this second issue of prototyping.news is quite tool-heavy. Besides that, this issue also shows prototyping in all its facets. From paper prototyping to navigating a prototype with game controllers to prototyping in a 3D environment or with voice interfaces: One of the major strengths of prototyping is its flexibility. So enjoy this issue and if you like what you read, please spread the word! ;)
– All the best, Matthias

Links

Are you approaching prototyping all wrong?

Paul Boag shares an important aspect of prototyping on his Digital Insights podcast: Instead of prototyping what will be built anyway, a much more powerful way to use a prototype is to create a discussion piece that is a vision of what a great user experience would look like. Make sure to also have a look at Paul’s comprehensive post about the basics and the potential of prototyping: Prototyping: Why Bother and Where to Start? A Definitive Introduction

Learning Framer By Creating A Mobile App Prototype

In this tutorial for Smashing Magazine, Greg Rog introduces you to all the basics of Framer, from building frames in design view to coding animations and interactions – and even fetching real data for use in your prototype.
https://www.smashingmagazine.com/2018/02/introduction-to-framer/

Sketching in the Browser

In this brilliant post, Mark Dalgleish covers how his team works with design systems and how they set up a workflow that seamlessly connects their codebase with Sketch so that changes to the code are continuously flowing through into the Sketch library. A solution that can also prove beneficial when working with HTML prototypes.
https://medium.com/seek-blog/sketching-in-the-browser-33a7b7aa0526

Test your Menu Flow in Minutes with an Xbox or PS4 Controller using Adobe XD

What a nice hack: Ettore Ink shares how to set up a prototyping environment in Adobe XD to test the menu flow of your game with a controller.
https://medium.com/@ettore_ink/test-your-menu-flow-in-minutes-with-an-xbox-or-ps4-controller-using-adobe-xd-91216710acf7

Prototyping UI in Unity

Unity, a popular 3D game engine, isn’t necessarily the first tool you think about when it comes to prototyping user interfaces. But especially if you are interested in AR or VR, 3D environments like unity play to their strengths. So this series of posts by Mike Mariano that walks you through the creation of a photos app prototype is really interesting stuff.
https://medium.com/@marianomike/prototyping-ui-in-unity-introduction-db12458020ae

A simple solution for prototyping voice interfaces

Voice UI is one of the hot topics at the moment and it’s a field where prototyping can be incredibly useful to explore concepts and observe how humans interact with a system. Shankar, an Interaction Designer at Angie’s List, explains how you can use the iOS app Workflow to create simple voice interaction prototypes.
https://uxdesign.cc/a-simple-way-to-prototype-voice-interfaces-5e99d4e3c698

Tools

Sketch Version 49

Fresh from the press: The Sketch team released Sketch Version 49 today, which brings a lot of enhancements and also a new prototyping feature. You can now connect artboards with links and hotspot layers to create basic interactive prototypes of your designs directly in Sketch.
https://www.sketchapp.com/updates/#version-49

An Inside Look at Framer’s 2017

Framer had a successful 2017 that culminated in the launch of a full vector editing toolkit in December. In this post, the Framer team looks back at everything that happened with their product, company, and community.
https://blog.framer.com/an-inside-look-at-framers-2017-88aea3b1a15

Fluid

Fluid is a free iOS 11 UI Kit for Framer for your next mobile prototype. It features native elements like switches, keyboards, and navigation bars that intelligently adapt to any screen size.
https://framer.com/fluid/

Haiku

Haiku is a design tool mainly built for app design with a high focus on animations and collaboration between design and development. It brings a timeline, supports Sketch assets, and the design file format is hackable, hand-editable code.
https://www.haiku.ai/blog/introducing-haiku