Prototyping is a speedy creation of a full-scale model that helps evaluate a product without investing in actual development

  • It promotes effective communication
  • Decreases development time
  • Decrease chances of costly mistakes at later stages

But, the temptation to build something out-of-the-ordinary, being exceptionally creative and unique prototypes, often steals our time & focus from other important tasks and we end up making it a task big enough as developing a system without code

Here are a few simple guidelines that could help in creating prototypes effectively

#1 Prototypes should be “good enough”

Prototyping tools provide enough capabilities to build up an entire product without writing a single line of code

Unfortunately, at times when we are halfway through the project, confident enough, reality hits. Changes creep in and to keep pace with the time and requirements we break the flow. When such things happen, there are chances that a bunch of prototyping efforts is lost leaving the original plan all messed up!

Your prototype doesn’t have to be pixel perfect and development-ready, right from the start

Remember, the main purpose of prototypes is to always help stakeholders visualize the requirements & gain quick feedback to eventually move forward with actual designs

Restricting the scope of each prototype frees you to focus on what is most required at the point of time

Get things looking good enough and move forward

#2 Prototypes should have a clearly defined goal

While rapid prototyping, it is good to have a purpose or a goal in mind These can be:

  • Gain customer feedback
  • Present and convey organizational plans
  • Share project ideas with potential clients and prospects
  • Help UI designers know the project better

Knowing the purpose of the prototype helps identify the fidelity of the prototypes

Rough sketches help you move faster. A lot of tools such as Balsamiq, Sketch (macOS only), Moqups provide this ability to quickly sketch a prototype with lo-fi (low fidelity). This brings up to our next point

#3 Always try to determine prototype fidelity at earlier stages

It is always helpful to determine the fidelity of the prototypes in advance. It saves time at later stages when the focus should be on team communications and understanding development efforts. A clear picture of what is to be done determines the prototyping cost and efforts as well

The fidelity could be identified as:

  • Low fidelity (lo-fi)
    Use: Give insight into all the features and content for the project
    Traits: Sketches, black and white representation
  • Mid fidelity
    Use: Considering a transitional phase that allows more flexibility, creativity, and interaction
    Traits: Sketch, black and white /color representation, interactions to make the navigational flow clearer
  • High fidelity (hi-fi)
    Use: Almost a replica of the exact design. A pixel-perfect version of what would actually look like when complete
    Traits: Pixel-perfect in terms of color, margins, layout, dimensions, content, navigation, animations, etc

The fidelity could be measured in following dimensions

  • From project scope — what screens are required to be created?
  • Do we need quick sketchy mockups with lo-fi or mid-fidelity or we need hi-fi?
  • The content on the screens should be “real” or dummy content of ‘lorem ipsum” would go?
  • Do the navigation needs actual transition effects or animations or basic click-based flow would work?

Agreeing early at the fidelity of prototypes could save lengthy last-minute discussions & a happy client

#4 Test as you go

While creating prototypes, it is common that we put extra efforts to showcase creativity and innovations. But while doing so often in the midway, we lose our rhythm, consistency, and sync between screens

At the end of the task, it can be really hard to figure what exactly went wrong, where the interaction is missed, where the consistency is lacking and it all ends up spending an entire day or even more time to correct the flow!

It is very important to “test the flow” continuously as you build the screens

#5 Reusable building blocks

Prototyping has become a lot easier with modern tools that provide several techniques to improve productivity. For instance, you can create your own styles and symbols that can be reused across prototypes

For e.g. in the Balsamiq tool, it is very easy to create a symbol.
Just select the elements -> Convert into symbols -> Name the symbol and done. Use it as a widget

This 10 minutes initial time-consuming task will definitely help in subsequent cycles by saving hours of rework. An update in symbols file will update all the occurrences at just one go! Saving a good amount of time, isn’t it?

There is no alternative to hard work. But, being smart can boost the work hard which can empower you to be innovative rather than being repetitive!

#6 Share the prototypes — early and often

Share your wireframes early and often with the involved stakeholders. Continuous collaboration always helps in building a better product

Collecting feedback frequently helps in identifying missing details and even feasibility of the components in terms of development

There are many tools that help collaborate easily like Trello, Slack, etc. For example, a popular tool InVision provides real-time collaboration to be ahead of time always

Create a solid base with effective prototypes to collect customer feedback, improve the processes, and always be in the right direction. Hope these guidelines might help you in saving a good deal of time, cost and efforts

Happy Prototyping!

Surbhi Mahnot

Surbhi Mahnot

Surbhi Mahnot is the owner of this blog. She works as a Management Consultant with businesses to set up processes, and coordinate as Project Manager to help develop IT solutions. Travelling, reading, and shopping are her core interest besides work. Surbhi is available for consultant projects full-time, part-time, or remote work

Leave a Reply

Your email address will not be published. Required fields are marked *