Sign Up to Subscribe

To get the latest and most quality design resources!

Sign Up to Subscribe

Thank you for your support!


Best Prototyping Tool for Mobile, Web and Desktop Apps.

Get Started for Free


Handoff Designs with Accurate Specs, Assets, Code Snippets Automatically.

Get Started for Free

Overcoming The Three Phases of Prototyping Flow

Mockplus Team 17893 Views

Everyone has his/her own way of working, but not all of ways are scientific and effective. Having worked as a UX designer, and learnt knowledge from some books, I come forward with a useful work flow. I hope this could help the rookies and juniors who still have no idea about how to work as a UX designer.

1. Thinking and drafting

This is the first step of making a prototype. What we need to do here is springing out our inspirations like a fountain. Hence, all the tools we are going to use are whiteboard and mark pen, even just paper and pencil. Anything else could be a rock on your way to inspiration. We need to focus on brainstorming, write down every relevant idea on the whiteboard.

2. Selecting and combining

The second step is to select and combine the ideas on whiteboard according to usability. Now, what we need is...a group of cute and picky colleagues. In fact, many UX designers like to design something impractical, that is very annoying. So, after we write down our ideas, get your colleagues, and let them judge which ones of your ideas are acceptable, which ones are annoying and which even make them want to punch you on the face. The final work of this step is to combine all the selected ideas, and to come out a preliminary plan.

3. Prototyping and optimizing

This step is the key of whether you can make your great ideas come true. Here, we are going to need prototyping tools, such as Axure RP and Balsamiq. In terms of choosing a tool, my advice is to find a tool which is simple to use. Because, in this step, we are going to modify and optimize the prototype over and over again. If you choose a tool which is complicated, you might be led by the nose, lose more than gain. What’s more, 21st century is the century of information, in which everything goes off swiftly. Once you choose a wrong tool to set yourself up in a passive situation, what you’re wasting is not just your time, but also the efficency of the whole project. Therefore, I prefer to choose the lighter tools, such as Mockplus,, and UXPin. Meanwhile, I also would like to suggest that it’s better to choose the desktop-based tools, like Mockplus, as they will be more stable than those on web. With that being said, you could avoid the problem of browsers crashing or poor Internet connection. Hence, you could save a lot of time. There is also another reason for choosing this tool: Mockplus has more comprehensive ways to test a prototype. It could meet your needs well, and also save the time of adjusting your device.

After finishing the prototype for the first time, demonstrate it to your colleagues who are the next in your work flow, and make a quick discussion with them, modify and optimize your prototype, then demonstrate again. You need to start a circle like this, and try your best to make a design that everyone could accept in minimum rounds.



The circle of Step 3:

Well, in terms of working flow, every company, every group and every designer shall be different from each other. There’s no universal standard. What we need is to suit one's measures to your own conditions. I hope this article could be helpful for the rookies.

You may also like:

Top 20 UX Design Blogs and Resource Websites of 2016

The Best UI/UX Design Books & Resources for Designers

Which is the Best Prototyping Tool with the Lowest Learning Curve?



Mockplus is a desktop-based tool for prototyping mobile, web and desktop apps easily and quickly. Create interactions by simple drag-and-drop and your teamwork will be time-efficient with the collaboration features.

Free Trial

Need help?

Join Mockplus on Slack Click here