Step by step guide for a good prototyping process

November 7, 2022

Whether you are designing website portal application or software, prototyping is a must of the design and planning phase that put you and your clients on the page on how the system flow and workings. During prototyping, it is an opportunity to test things out and fine-tuning the details of the system usability. Here, we have summarised the several main points and step of prototyping process and methodology:

Planning

Step 1: Plan your goal

A goal is very important in order to guide us to the right path. Hence, in every plan there is always an end goal you want to achieve. Hence, the goal you set should be achievable or at least doable because an impossible goal will demotivate you to build the prototype. Here are some goals for you to refer:

  • Develop the faceted navigation idea for the products page and test it with five users.
  • Present the initial site structure proposal to the project team and the client’s stakeholders
     

Step 2: Test plan for your prototype

After setting your goals, is time to write out some test plans to determine the type of tasks to run on your prototype. After listing down the intended task you wish the user to do, it is easier to develop your prototype as you can look back on the task when you are developing your prototype to determine if your prototype is able to achieve this task in mind.
 

Step 3: Boundary of your prototype

You have to keep in mind that a prototype is a just a prototype, it cant show all the functionality you plan to put into your design but it should serve good enough for the user to experience your design. Thus, boundaries is needed to prevent you to add in too many features which would waste time if there are many changes needed.
 

Step 4: Deploying the prototype

By determine on how you want to share your prototype, you can save time by differentiating what kind of tools and techniques to use.

Small Group or Yourself

Is best to keep your prototype simple and quicker such as paper prototyping, Powerpoint or using tools such as Marvle or Invision as they enable us to do rapid user research rather than spending a lot of time building a high fidelity prototype which consumes a lot of time just to do some simple research.

Large Group or Client

Higher fidelity are more appropriate because they are presented to the end users and with a high fidelity prototype, it will provide a more engaging and powerful experience to them.
 

Step 5: People involved in your prototype

The type of people you are working with also plays a big role. It might sound familiar to the previous step but this is more about who are we building the prototype with. If your prototype ideas will be coming from major users or stakeholders, it’s best to use something easy such as paper prototype or tools such as Marvel link your sketches together so that everyone can be involve in it much more easier and faster. Next, if your team consist of experienced developers and designers, it’s would be wiser to go for HTML prototype as everyone is familiar with those tools. Hence, it would speed up the process and clear any misunderstanding.
 

Step 6: Time, budget, resource

This step depends on the time, money and resources available, you can afford. If you have sufficient or abundant amount of it, you can afford to invest more in getting up to speed with a new way of working but if you do not have the luxury, is best to go simple and more affordable approach such as Powerpoint.
 

Step 7: Kick start point

There are two kind of starting point, one is that you have already develop some designs that is usable and another a design that has many changes all the time. If a template is already available, consider using tools and techniques that allows you to create an interactive prototype such as Marvel. Otherwise, use HTML prototyping if you design always has a lot of changes after a discussion because HTML prototyping allows you to make changes on the spot.
 

Gather Resources

The next step is to get your resources in the form of data input or references. You have to find out what are you designing for and what is the purpose for. Example of resources:

  • Background information
  • Interviews / Survey of the organization
  • Terminology and language
  • Visual design style guides

Get On With It

This step is very crucial because after spending days or weeks to create a simple prototype, there will be many changes or rejections from the users feedback. Hence, after too many changes or rejections. We tend to give up but this is the part of a learning curve and we have to try as many tool or technique, to know which approach is more suitable for us. So do not worry about failing and get creating.

Working Collaboratively

To be honest, a prototype is most suited to be work with different kind of people that has various kind of skill set. The sharing of ideas, methods and solutions during discussion will ultimately be combine into one and the product will be the team’s combined design effort.

Iterate and Demo, Testing Early and Often

One great thing about prototyping is the promoting of team work between developers and stakeholders. Thus, it is wise to encourage your team and stakeholders to review your work as it progresses, giving feedback quickly because if you do not test early and often or give some reviews, you will potentially miss out on the benefit of receiving feedback early and often which can help with your development progress.

This is all the tips for you to know about the process of prototyping.

Source:  Designing UX: Prototyping by Ben Coleman & Dan Goodwin

Thumbnail: Designed by Freepik

Are you looking someone to plan and design your system prototying? We, Entertop has the right that suite you. Please drop us some words at here and we will have consultant to help you out.

Posted in Articles, web design