What is prototyping and how do you prototype a product?

What is prototyping and how do you prototype a product?

Launching a product is a complicated task and, above all, quite expensive. Developing a prototype helps us gain a competitive advantage by focusing on the aspects that the consumer perceives as relevant. I still do not know what is prototyping and how to prototype a product? Read on and don’t miss it!

You may be interested in: Graduated in UX Product Design

What is prototyping?

Let’s see what prototyping is. Prototyping is a first version of the idea of ​​a product or a service. Prototyping allows us to test, evaluate, and validate whether the idea we have in mind actually meets business and user goals. Thanks to this prototype, we will be able to validate those ideas that we have of products or services but that we do not know how to reflect them or how to bring them to tangible ground.

The prototype helps us have a physical tool to validate that this idea makes sense, if there is a market and if it is demanded by users.

On the other hand, it also helps us estimate costs and hours. In other words, you have a prototype and you will go with a development team. The development team will tell you what the scope of the product will be, as they see it in a more realistic way.

In fact, another of the key points is be able to test with users. That is, many times, before passing the project to the development team to insert code (which is one of the most expensive parts of producing a digital product), it is better to do a test with users. For example, in a discussion group, where we can give you a try on this prototype and see what users think about it. See where they get stuck, the emotions at the push of a button or another, etc.

Testing is essential in order to be able to improve a product as much as possible before its release. Once the product is on the market, it is difficult to rectify it without spending a lot of money. In this sense, testing gives us very valuable information on how to improve the design, usability or user experience to deliver a product that meets consumer expectations.

In short, a prototype will help us to know how a user relates to the product and how the user-interface relationship works.

Prototyping phases

Although it is likely that when you are already in a professional environment, it is not necessary to carry out all phases of prototyping, since you will be working on concepts that you have already made, it is true that there are certain phases that we cannot skip. These are the following:

Graduated in UX Product Design

Learn from the best experts in the industry

I want to know!

Phase 1: Sketch the bit

The first phase of prototyping is the sketch pussy. These are the first ideas that we put on paper. It is very useful in the ideation and research phase, such as note taking, idea taking, etc. This gives us an agile first impression of the arrangement of the elements. These ideas which are given, for example, during the meeting, and which must somehow be materialized. We are talking about using the sketch to our advantage.

Step 2: Wireframe

The second phase concerns polish the design a little. It is essential to know the logic of use of the screens and facilitate the creation of the prototyping. The purpose of the wireframe is to connect with each other, see what happens when a button is pressed, etc. We can be guided by a design map of UX


With a Wireframe what we try is to have it explained as best as possible, that anyone who receives it without an explanation can read it perfectly. This is very important because it is the definitive guide to be able to create interactive prototypes in an agile way. You have to be very clear about the interactions between screens, the logics of use, the stories and the user cases before adding the interactivity.

What is prototyping and how do you prototype a product?  - image 5 1024x576

Phase 3: non-functional prototype

The non-functional prototype is the third and final phase. This is the phase in which we add interactions and get a product that has not yet been developed, but will show you a very similar look to what the final product might be. It can be a website, app, etc. In short, we add interactions and this can be “ displayed ” as app or the real web.

VideoUX / UI: Design interfaces with Sketch