TTC Labs - Build digital prototypes
prototyping icon

Build digital prototypes

Empower participants to consider usability issues by creating digital prototypes from early-stage concepts.

Prototype: Make it Real
Preparation
10 mins
Delivery
50 mins

Build digital prototypes

Empower participants to consider usability issues by creating digital prototypes from early-stage concepts.

Preparation
10 mins
Delivery
50 mins

What is it

A digital prototype is a simple mock-up of a final product or service design. They can be built to any degree of finish – from paper prototypes that can be sketched in five minutes to clickable digital prototypes that have the look and feel of finished apps.

By visualising how users might experience the proposed interactions through digital prototypes, teams will be able to present their work to other teams for knowledge sharing and to receive feedback. This exercise will help refine concepts, guide design choices and reveal potential issues and improvements.

Build digital prototypes image

How to do it

1 Prepare the materials and work space
2 Brief the participants

Tell participants that they can choose between the following types of prototypes:

  • Paper prototypes: These can be created very quickly. In many cases, the original ideation sketches can even be used within the prototype itself. Participants can take pen to paper and draw states, dropdowns and modal windows. Designers can make instant edits as they sketch and can digitise their work at the end.
    • Use POP by Marvel to digitise paper prototypes for mobile devices.
  • Clickable prototypes: These take more time to create as it involves digitising concepts throughout and creating interaction points. However, your designs will appear more realistic, allowing you to test interactions that are more comparable with the final product.
    • Use Sketch to turn wireframes into realistic-looking designs.
    • Use Mirr.io to turn designs from Sketch into working prototypes.
    • Use Proto.io to produce high-fidelity prototypes for mobile devices using libraries of ready-to-use graphic and functional elements.

What you will need

  • Pens

  • Post-it notes

  • Paper

Download the materials used in this tool

This tool and any associated downloadable assets are provided under a

Creative Commons Attribution-Share Alike CC BY-SA 4.0 International License.

Related content

Create a pitch icon
Prototyping Tool
Create a pitch
Shareout

Preparation 30 mins

Delivery 60 mins

Get feedback from experts icon
Prototyping Tool
Get feedback from experts
Shareout

Preparation 10 mins

Delivery 15 mins

Sketch your ideas icon
Ideation Tool
Sketch your ideas
Create Ideas

Preparation 10 mins

Delivery 50 mins