The quick & easy way to turn your ideas into tappable prototypes

I recently embarked on a personal venture with a few fellow entrepreneurs to start developing consumer-focused applications

We knew that we wanted to create something fun and engaging that would be used by a lot of people and were looking for a quick approach to develop and test our idea with real customers before sinking too much of our time into an idea.

A similar problem is often faced by organisations where they know what they want to do (more sales) or where they want to go (new products/markets) but don’t have a quick pathway to both create and test potential solutions.

We devised an end-to-end process that quickly and easily goes from high level goal to testing the solution with the end customer.

The process starts with defining your strategy, workshopping potential ideas and finally prototyping and testing the idea. In this article I will focus on the third part of our process, prototyping and testing the idea.


Process for turning your ideas into tappable prototypes

Define your strategy

The first step to greatness is ensuring you have a clearly defined strategy. This is usually driven by your mission statement if you are a startup and/or by the executive and/or strategy team in larger organisations.

The strategy defines a business goal (e.g. reduce costs, increase market share), a market (e.g. Men under 40, University Students) and a driver (e.g. Help people make quick prototypes, improve peoples ability to connect with each other online).

Workshop the problem and create the idea

Once your strategy is clearly defined you are ready to commence your innovation workshop to answer the following questions in order (below is a very short overview of the ideation process)

  • Who are my Customers
  • What are their Problems
  • What are the Solutions/Ideas that solve the Problems
  • Filter and prioritise the Ideas

At this point you should have a list of prioritised ideas and are ready to begin the exercises required to prototype your Chosen One.

Prototyping and testing the idea

Paper prototypes can be developed in a short timeframe using exercises that are easily accessible to you and your stakeholders.


Step One:  Build lean personas

Begin workshopping your idea by bringing the customer into the room using Lean Personas.

Lean Persona


Why use Lean Personas?

Getting the end customer in the room with you is often difficult, getting each variation of the end customer is even more so. Luckily there is a solution, Lean Personas. By defining a Persona you bring the customer into the room with you, Not only do you get the ‘customers’ opinion but you also help to get alignment amongst different stakeholders as the conversation moves from “I think…” to “I believe persona X would think…”

How detailed and how many?

The time and importance that you set aside for this exercise will determine how detailed and how many Personas you will develop. If you believe your offering is suited to one particular customer you may choose to develop only one persona, if the offering could equally solve the problems of multiple personas than you should put in the work to ensure that they are represented throughout the design of your offering.

How to build out your Persona?

Draw up your persona template on a whiteboard or butchers paper and then start with the facts.


Give your Persona a name, age and gender then draw a small headshot to give them some character.

Next move onto some more specific facts that are relevant to the area you are focusing on (e.g. food or music preference, city or state…).

The criteria you place in facts will change based on your service offering – if you are developing a restaurant review service then food likes/dislikes may be relevant, if you are developing an application for managing daily tasks then profession may be a key criteria.

The next three sections can be done in any order. My preference is:

  • Jobs – What they are trying to achieve
  • Pain – What problems they currently face in trying to complete their ‘Job’
  • Behaviour – What they do because of the ‘Pain’ or what do they do to mitigate the ‘Pain’


For Jobs you can simply list out the goals the Persona is trying to achieve – this can be supported by a relevant quote from the Persona  – “I’m looking for a cheap venue for lunch nearby”


Pain points are the things that particularly bother this Persona about the problem that your offering will solve. My preference is to list these out as quotes, imagine what they would be saying to their friends over a cup of coffee when complaining about this issue, “I wish I could…” or “It’s so annoying when…”


This can be listed out as steps followed by the user, or as dot points. These should be supported by a quote from your persona “Because I don’t have an easy way to find restaurants near me I end up wasting time wandering around looking for a place to eat.


Step Two:  Design customer journey maps

The customer journey map tells the story of the customer’s experience through a process. This can be anything from lo-fi sketches to detailed process maps overlaid with customer data. Customer Journeys can be drawn up for the end-to-end process or to represent sub processes. The same process will have a different customer journeys depending on the point of view (Persona) you are using as the basis for your customer journey.

The benefits of these maps are to identify:                                       

  • Pain points (e.g. waiting to be seated at a restaurant)
  • Points of failure (e.g. waiter records your order incorrectly)
  • Gaps between channels/departments (e.g. your order is misinterpreted by the chef)

The number of Customer Journey scenarios you map out and the level of detail should be based on these factors:

  • complexity of your problem and solution
  • number of different ‘important’ Personas
  • amount of time you have available to work on Customer Journeys

A great start for a customer journey that is accessible to all stakeholders is the comic strip sketch, each frame of the comic represents a step in the customer journey. This a quick and easy artefact to put together for each scenario and is a great icebreaker to get people familiar with the process.

Example Customer Journey sketch:

Customer journey sketch


Example Customer Journey supported by data points:

Customer journey and data points

At this point in time we know what the problem is, our solution to the problem, Lean Personas to represent our customers and a customer journey map that represents the current state. It is now time to start fleshing out the solution interface and features – we did this using the Design Studio exercise.


Step Three:  Use a design studio approach to build your prototype

Design Studio is a useful, collaborative approach to interface design that is accessible to all stakeholders, it assists with communicating ideas and developing consensus for a draft UI.

How it works

There are multiple approaches to running a design studio, my preference is to use the Sketch, Present, Steal approach.

This works best with small groups (4-7) people.

Participants are each given a blank piece of paper and a large marker, this is important to ensure that participants focus on broad features (there is a button here) and not minute details (this button has a semi transparent magenta drop shadow)

Each participant begins by sketching out their interpretation of the user interface (this can be one screen or multiple screens) – for complex applications you may choose to advise participants to sketch an interface for a subset of the features (e.g. sketch the home screen only)

Sketch time is short (approx. 2-5 minutes) this is at facilitators discretion and should depend on the complexity of the features.

Participants then take turns presenting their sketches (about 1 minute each)  – when viewing a presentation other participants should note down the ideas/features they wish to ‘Steal’

Once all participants have presented their idea everyone has another go at sketching out the interface with their new (stolen) ideas. This is followed by another round of ‘Present’ and ‘Steal.’

Each consecutive round will improve alignment across all participants and will lead to a superior user interface and experience for the end customer.

After a set number of rounds – determined by the facilitator, the group either chooses one interface to run with or works together to make a final sketch.

Note: Some facilitators of Design Studio replace ‘Steal’ with ‘Critique.’ Critiquing someone elses work is difficult and the fear of being criticised can reduce participant confidence and the overall success of the exercise. I

n my opinion stealing is better and more fun. On completing your Design Studio you will now have multiple sketched out user interfaces. These can now be turned into tappable prototypes using software such as POP (Prototyping on Paper, popapp.in)

Setting up your tappable prototype can be done in just a few minutes

High level steps to setting up your tappable prototype in POP:

  1. Open POP and create a new project
  2. Take photos of each of your sketches
  3. Create ‘touch points’  on each sketch that link to other sketches

TIP: To make your tappable prototype easy to understand for end users highlight the touch points on your sketches before taking the photos with POP


Step Four: Presenting your prototype

One of the challenges I faced when prototyping mobile applications was how to present them to a large stakeholder group. After some searching I came across Team Viewer (teamviewer.com), this application was originally built to assist with user support by enabling the support person to view and take over the users computer.

A side effect of this is that it can be used to  broadcast your mobile device over a wireless network to a computer which can then be connected to a projector. This works great with big stakeholder groups as everyone can see what is happening on the mobile device.


Step Five: Testing your prototype

The best test is always to go to the end customer, asking the end customer to look at sketches can make it difficult to get useful feedback.

Asking the customer to use a tappable prototype is a lot easier, you can easily head down to the local coffee shop and test your application with prospective customers while they wait for their morning coffee.

Myself and my team have fine-tuned this approach over time to finally come to the above process. I use it every chance I get both at large organisations and for my own personal projects, it has always worked for me, but don’t take my word for it, give it a shot yourself!


Leave a Reply

Your email address will not be published. Required fields are marked *