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
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.
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.
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.
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.
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.
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.
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.
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.
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.
Interplay lets you design and prototype using your own real code components, then share those in-browser prototypes instantly with customers and stakeholders. You can now sign up for the private beta.
Mirr.io is a Sketch plugin and a preview tool in the form of a desktop app. You can use it to add events and transitions to your Sketch artboards and preview your prototype in any browser on any device.
Protowire Sketch Plugin
With Protowire you can create scrollable areas, transitions between screens, and animate layers to create responsive prototypes that adapt to different screen sizes. The prototype can be shared on the cloud and viewed on a desktop or mobile browser.