What are the Benefits of Prototyping?

What are the Benefits of Prototyping?

4 minutes read

Habil Emmanuail Oct 13 2019

One of the most basic skill set for a designer is how to create prototypes for a product. This includes drawing sketches with pen/ pencil and paper and creating visuals on digital devices. If you have a general sense of design, you can add a bit of knowledge about UI/ UX to create prototypes for websites and apps.

It is becoming popular by the day for companies to prototype their websites and apps to save up on valuable time, money and resources.

Saving up on Resources

Understanding the basic procedure of prototyping is self explanatory in how we save up on valuable time and money in product creation. Designers make sketches of their ideas and turn them into digital interactive experiences without detailed coding. If any flaws are found and adjustments are to be made, it is much easier and cost effective to do it at this stage rather than to redo or alter the entire code of the final product.

It saves time and money fixing mistakes in the prototype stage.

There are lots of excellent apps in the market to help create your desired prototypes. Some of them like Adobe XD are completely free to use.

The Process

It is sometimes considered a confusing subject and companies don't know when to start the prototyping process. Some skip it all together and get to the final design. Some designers who are involved in the process find it hard to define how they actually go about it- it just happens.

We will take you into the exact details to clear any misconceptions.

Prototyping should start after the UX design phase and before UI design. Once all your concepts are laid out and text is partially prepared, companies should start prototyping their product.

Prototyping is in between the UX and UI design phase.

Clients get to see the design process at every stage so they can give their feedback and they know the direction in which their product is headed.

They need to give designers exact details of their product and their vision and goals so that designers can create a website or app that accurately defines the product.

The designers start materializing the concepts in the form of rough sketches. This is the most basic form of the design in black, white and gray mostly done on paper with pen or pencil.

Next is the lo-fi part of the design process where the design is made into basic black, white and gray wire frames with basic shapes and text. This is done on a digital device. This is neater than a sketch and designers prefer to show progress to clients at this stage. The fonts, colors or shapes of objects aren't defined at this stage but we get a general feel of where everything will be and all the interactions.

Later on in the lo-fi stage, more detailed illustrations are made on digital devices. Everything from the color scheme to the exact fonts are set. This gives a solid idea of what the final product will be and flaws are easy to detect. Basic drawing softwares and apps can achieve these design.

A hi-fi design follows where the illustrations have some (or all) interactions and functionalities as the final app without the coding. These designs are the most precise and closer to the final product. These designs are created with software and apps specifically created for the task of prototyping.

A prototype design process starts from lo-fi and goes onto hi-fi.

Testing Prototypes

The design can be tested out in the lo-fi or hi-fi stage, but it is highly recommended to do testing on design where all elements and layouts have been finalized. It may be with functionality or without functionality. Either way, the user gets a clear idea of the product before it is already launched.

It is advisable that you clarify to the user about how much functionality there might be in the design since it's a prototype. This way they know what to expect and will give their feedback accordingly.

User feedback is essential at this stage and helps perfect the design before it is turned into the final product.

Differences in Design Strategies

Everyone has a different understanding and design process when it comes to prototyping. We mentioned all the stages that can be involved in the process.

However, clients and designers can choose to skip some steps to quicken the process. At times designers might find that the stage of sketching and/ or creating wireframes is unnecessary. They might be more comfortable jumping to the hi-fi designs. Other times they might sketch and just move on to the final designs.

Sketching seems like it may not go redundant any time soon because it is the most accessible form of creating a quick design and materializing your ideas. It is the most basic skill that artists and designers have had for centuries. Hence, it's only natural that it will remain a key part of prototyping.

Prototyping will also remain an integral part of creating any product.

Habil Emmanuail

Habil Emmanuail

Habil is an IBM certified Design Thinking practitioner and a member of the Interaction Design Foundation. He has been working as a UX consultant and User Centered designer across web and mobile applications for almost four years. His area of expertise include UI/UX Design, UX Research, Visual UI Design, Prototyping, Information Architecture, Agile Scrum, Branding as well as HTML/CSS, UX Writing, Research and Analytics and Strategy and Planning.