How to conceptualize your idea?

Victor Balta

In order to build a project, you need to conceptualize it first. How do you do that? Three words: WIREFRAMING, MOCKUP, AND PROTOTYPING.

Wireframes represent the raw structure for your website or app. This is the first step that you will give you a better understanding of how to materialize your idea and where to place your content. It offers low accuracy, and as you are getting feedback, you improve it gradually by adding more and more details to it.

In big teams, as a product manager, there is a low chance that you will be working on wireframes by yourself, but it is good that you are familiar with it, so you could have your inputs too.

It is a totally different thing on the smaller teams/ startups, where you probably will have to get your hands on it and have it done, but don’t know worry,as it is easy to learn skill and there are lots of cool tools out there that you will help you to get most out of it.

Just remember that this is one the best and easier way to communicate your ideas to developers and designers.

So, what comes after that?

After you drew your general structure, it is time to add more details and colours to it. This is part of MOCKUP process and it’s done by designers. Basically, there are taking your sketches and make it look as close as possible to the original product.

If you are a web developer, think of it as CSS applied to your HTML.

If you are not a developer, well, here is an example below to help you out.

wireframe and mockup

Can you spot which one is the mockup?

After your design is tidy and pretty, it is time to add some basic interactions, which will transform your mockup into a PROTOTYPE. This will show the usability of your idea where you can potentially spot some problems in the user flow.

wireframe vs mockup vs prototype

That means that when you click on something, you expect something to happen. Usually, it is pretty basics stuff like to go from one screen to another. It offers a good way for the product managers to present their products and to offer more credibility to the stakeholders.

Once you go through all these three steps, you can be confident to present your idea to the audience.

Some of the best tools to conceptualize your idea are:

  • Adobe XD
  • InVision
  • Sketch
  • Marvel App
  • Axure
  • Balsamiq

Feel free to explore some of them and let me know your thoughts down below.

© 2019 — Victor Balta