Prototyping: building better applications

Prototyping — source Flickr CC

A few times ago, I discovered the prototyping like new way to document new features in a project. It´s not a new concept for the developers but it´s a new step in the workflow to build applications.

Everyone knows the importance of customers in the process to build our applications. They are once of most important sources to know if we are building a good solution or we are walking on the wrong way.

Other fundamental pillar in our process is the I+D department. Normally, these guys aren’t technical people and we need to found a midpoint to discuss each detail. So far, we have a couple of technics and procedures to find this point: BDD, designs or quick development tools.

And finally, the third factor that influence in the product is the development team. This is my moment. We need to knows the critical points that we will find and it is our responsibility to give an estimation, at least try it :). Therefore, the information around the new feature need to be the most exactly as possible to reduce the error range.


Prototyping is that midpoint. We need to build something pretty close of the validated design and the final result at the same time. And we need to change everything quickly and withe less resources as possible. This solution need to be useful too because we will send it to small group of our customers to explore how they will use it and get valuable feedback from them.

In summary, our prototype need to be:

  • Useful
  • Representative
  • Dynamical

How shall we do it? The answer is: FrontEnd. If you think how is the process to build a car, the first step is the motor, transmission, wheels, … Later the chassis and finally all the stuffs for drive, etc… What if we started backwards? We will create in the first step the chassis and everything that the customer need to simulate a real use of our car. We can validate the user experience with the design and we (developers team) will know many details like space for the motor, floor distance, aerodynamics and more critical and useful details for us. That concept is prototyping.


The keys for create good prototypes are find the exactly midpoint between design and production. For this reason, we need focus only in the user interface using the final technology that we will use in the user side but with fake data.

An example. In my company (KitmanLabs), we are using ReactJS and Highcharts for create amazing graphs. Our backend is Ruby on Rails but that it isn’t important for our prototype. We have an specific project deployed with all our prototypes using fake data to simulate a real scenario. Like a staging server, we can access to the prototypes platform to visit our customer and discuss with them the new features and discover if it will be useful and relevant for them. The prototype follow the approve designs and use ReactJS and Highcharts. We can modify everything quickly because the most complex part is how we process the data before to draw them in an interface. After adjust our prototype with the customer feedback, receive the validation from the product and design teams we only need create the backend process an use the same code in the prototype in the final interface, because we solved any problem that appeared to represent the approved design. That is the midpoint.

I hope this article would be useful for you. If you want chat more about prototyping leave me a comment or email me. I want to know your opinion and experiences.

And remember, we are hiring :).

Versión en español