<img height="1" width="1" style="display:none;" alt="" src="https://dc.ads.linkedin.com/collect/?pid=60438&amp;fmt=gif">

 At Thinslices we design mobile products and develop mobile applications. Our experience in this field has taught us that every new project idea requires complex analysis in order to be validated. Before starting the product development process, we do prototyping. In the broadest sense, you might think of pencil sketches, storyboards, wireframes and mockups. These are strategies for testing design, but, for us, clickable prototypes mean more than that. In a nutshell, they are complex versions of the final product (in terms of design and UX) that lack functionality. The most important thing is that they simulate user experience through a response to human actions (clicks, taps, selection, and navigation).

Clickable Prototype

Why and how do we prototype?

First of all, prototyping is not important only for the product. The client also has to make some decisions, such as approving the design, the layout and the functionality before the implementation. Secondly, there’s the development team that needs to get a clear perspective on what has to be built before they start working on the product functionality.

Advantages

  • Prototyping steers development teams in the right direction
  • Prototyping is a means of exploring ideas before further investing in them ( designers create mock-ups of how users will interact with their designs)
  • You can test the general idea and, later on, the navigation and the content structure
  • By involving users, you can test the user interface and the core functionality
  • The development team can discover possible pitfalls early in the process
  • Feedback can be used to find better solutions
  • The team can avoid difficult functionality that is prone to confuse users
  • It is the only way to quickly implement an incomplete, but functional mobile product
  • It is also a good way to improve usability and user experience through user trials
  • Making changes in the early stages of the product is less expensive than in the later ones

 

mobile-prototyping

How do we prototype?

In order to be effective, a clickable prototype needs clear goals. The measures we must take during the three phases of the prototyping process come from three relevant principles, that are based on the aforementioned requirement and the results we expect:

1. Proof of concept is meant to demonstrate that an idea has value and that it can be implemented. It is a good way for our clients to test the feasibility of the future mobile product before jumping into development. This phase helps clients, designers and developers understand what the mobile app will be offering by doing a market research, finding competitors and adding extra value in order to create a better product. This is also a right time to make sure that the costs required for implementing the product are reasonable and affordable.

Therefore, in the POC phase, we:

  • Do market research
  • Analyze the results
  • Identify the key features needed for providing the concept for the mobile app
  • Create user scenarios
  • Come up with the concept

2. Design happens after all the team sees where the application is going and settle on the idea. There’s no need to define all the functionality in order to start working on the user interface design. Nevertheless, it is important to establish what and how it is going to be implemented after creating the mobile app design. Figuring out what the core functionality is helps designers and developers decide on a single strategy and prevent any kind of disagreements that might appear during the implementation process.
This is followed by wireframing. This stage helps identify the best UX scenarios. After getting feedback from the client and the team on the wireframe prototype, we start designing the user interface (UI).

3. Coding a prototype in static mode helps stakeholders see how users will interact with the product and get feedback in order to offer users a great experience. In this final phase, the clickable prototype resembles the final version of the mobile app, minus the functionality. The front end developer and the designer develop this high fidelity prototype, that is going to be reviewed by the whole team for the final approval.

Quality assurance is a must even for big companies such as Apple, Google, Facebook or Microsoft. They struggle a lot in order to develop great products. The problem gets more complicated when there are small businesses involved. Small startups rarely get second chances. Therefore, prototyping should be mandatory in their process development.
When we started working at Hppy, we went through the whole process: concept, wireframing and design, clickable prototype, proof of concept, development and quality assurance. Hppy is an employee engagement tool that enables companies to track and manage employee happiness, through mood tracking and anonymous feedback.
At that moment, we created the clickable prototype in order to get feedback and to make sure that the product really worked. The app looked and behaved just as the real thing. The difference between it and the final product was the API connection. We basically developed the front-end part of the application. Then we started talking to investors and show them the app. It was easier and cheaper to make changes along the way.

clickable prototypes

Why do other companies choose not to create clickable prototypes?

If you do a search on Google, you will find a bunch of articles about design prototyping tools  like Marvel App, for example. Our designers use it. We even wrote an article on this subject. The big difference is that this type or phase of prototyping doesn’t need code. Therefore, it can’t be tested on real devices. It is a quick step that offers designers the possibility to link some sketches via hotspots and turn them into a sharable click through prototype. This happens before the front end developer starts coding.
Let’s see why a considerable number of companies skip the real testing part and decide to use prototyping tools that offer feedback on the visual elements. Basically, on the look and feel.

Creating prototype implies some costs. But the cost of a prototype is minimal compared to the cost of re-engineering a product once you’re halfway through or done with the coding part. Consequently, the most valid argument as to why we need to prototype is minimizing both cost and risk while, at the same time, achieving maximum efficiency and quality.
This methodology may increase the complexity of the system, as the aim of the system may expand beyond original plans.

Conclusion

  • Prototyping is not the same thing as wireframing. It involves code writing. That’s why the clickable prototype looks and behaves just as the real mobile product. This will help you and your team to get feedback from users and make changes at a lower cost.
  • In order to create a successful product, you must take one step at the time. You must experiment and test the idea, so that the client and the development team get a better understanding of it.
  • Quality assurance is a must for small startups. It’s healthier to prevent some mistakes than to try to fix them at the final stages of your product.
 
YOU MIGHT ALSO BE INTERESTED IN

The Essential Role Of Trust In Product Development

As you get ready to build your product, you'll need a team you can trust to take the best possible decisions.

Download it now

Articles similar to this one