Prototyping just got easier!

Rob Hamblen
4 min readNov 5, 2020

The Design Sprint workshop has finished, the Storyboard is defined, and you have the responsibility now to make the prototype in hours, not days!

If only you had a head start.

Prototypes and click dummies have to be created quickly, prototypes from Design Sprints have even more urgency associated with them! Mocking up apps or websites can be time-consuming even for experienced designers, exacerbated by the pace of a Sprint week, you’d actually think there would be life and death based on the completion of the click dummy. In essence, it’s not quite ‘life and death’, but there is an abnormal amount of pressure to create something for users to click through.

Leap is proud to introduce the Figma Sprint Toolkit.

We at Leap, (Bálint and I) wanted to help you with the basics, whatever your experience level so you can focus on your prototype requirements. Think of it as the head start you always wanted as we know how stressful the responsibility of being a prototyper can be.

Our Figma Toolkit forms the basis of what you need to get started, which includes a cool set of essential components and global styles that you can use for everyday products. Included are guides for Text Styles for mobile products, Colour Styles to differentiate your product and also some sweet Effect Styles to make your prototype appear like a polished app store ready product.

One of those simple headstarts could be a WhatsApp style template primer where your customers might send an introductory message to their colleagues to download the app directly. Duh Daah!, it’s here for you fully customisable so you can write your personal message.

At Leap, we take enormous pride in designing high fidelity products and prototypes for our clients, which need to convey a realistic user experience. You too can gain a head start with your prototype so you can focus on the content to validate the business assumptions.

So who is this Toolkit designed for?

Whether you’re an accomplished designer or a complete beginner, this Toolkit will enable you to get started much more rapidly. For our more advanced designers, our Figma Toolkit uses Components, Instances, Auto Layout and Variants plus much more. For those of you new to Figma, what does all this mean, we hear you ask?! All you need to know is that the hard stuff is already taken care of which means, you can focus on the content instead of the font sizes on the buttons!

Typically, your prototype’s only remit (typically on a Sprint)is to validate business assumptions made from all the decisions from the workshop. It’s highly likely not going to be a product tested for usability! But, that doesn’t mean your prototype can’t give the illusion of performing like a real product.

With the Toolkit, you can utilise industry best practices by using standard UI components, which your customers will already be familiar with, which will reduce the friction and cognitive load for users wanting to use your product.

This means you test only the critical business assumptions of the product, not the UI itself!

I’ve always stated that a prototype or click dummy should not trip up the user on fonts that are too small or illegible information that you just can’t read, it’s purely about using something to help you answer the hypothesis of whether the product is likely to be successful, not about feedback on the aesthetics or design.

Which is why this Toolkit serves not as a design system. We can’t stress this enough. Yes, it looks beautiful, but it’s not about solving for the aesthetics just yet! As you know, this takes some time and many iterations.

This is NOT a design kit.

Think of it instead as a head start, with a system in mind, which means that you will be able to create beautiful prototypes with the intention that they will perform like the real thing. Think of it as ‘smoke and mirrors’.

We still believe that there’s a need to evolve the design and iterate on both the UX and UI, it’s typically not happening this early on!

Validate business assumptions, then design.

To download the kit for yourself, visit us www.betheleap.com and go to our resources page.

Or click on this link to get started!

Get in touch and let us know what you think of it, how you’re getting on with it and if there is anything else that you need, we are happy to help.

Please share with friends and colleagues and give us a mention on social media!

And remember happy prototyping.

--

--

Rob Hamblen

Founder of LEAP. ‘be the leap’ — ex Creative Director of UX for IBM Studios. ex Senior Design Manager Qualcomm Inc. ex Product Design Director for AJ&Smart.