Product Design Process: A Complete Guide to Create a Successful Product

Kateryna Mayka

According to QuickSprout in case users find the website not visually appealing they stop interacting with it and search for a better variant. This fact proves the importance of beautiful design.

Still, the appealing UI is not enough to keep your customer engaged. You need to design a great experience for your users to see happy customers and achieve company goals.

To create a simple and usable product you need to develop a proper plan.

Eleken is a design agency. While working on our projects we never start sketching at once. To develop an easy-to-use and coherent product experience we invest time to get a deep understanding of what we are about to design.

For example, when working on Gridle, a client experience platform, we had to not just redesign the software, but also improve the way users interact with their clients (read more about this case study).

To make the right decisions we performed deep data research, conducted user interviews, and analyzed the insights we received before designing. Building our product design process in this way helped us to develop a product that received positive user feedback.

In this article, we will analyze five stages in the design of products and services that will outline the way to creating a successful product.

And first of all, let's answer the following question "What do you mean by product design?"

Product design definition

Product design is the process of developing a usable product that meets customer's needs by defining the users' problems and finding creative solutions for these problems.

Steps of product design

The first thing you need to understand about the design process is that even though it consists of several steps it is not linear. During the work process, the design team will have to return, make changes, and probably repeat one and the same task more than once.

With this in mind, let's figure out what stages of creating a product are there.

Research

The first step in the new product planning is research. Of course, before start working on the project, it's essential to know why the product exists and who will use it.

In order to answer these questions, you have to carefully examine the market and potential users.

The brief

The first thing the design team does is study the brief (link to the article). This document helps to learn the client's requirements and understand the client's vision of the project.  

The brief provides important information from the customer's viewpoint. It includes the company background, the company's goals, target audience description, design requirements, deadlines, budget, etc.

Studying the brief will mark a good beginning for the whole process.

User interviews

A user interview is a quick and easy way to understand how users feel, what they think, and what they believe to create a design that satisfies their needs. It allows to find out the customers' problems and pains as well as come up with effective solutions to these problems.

We've already mentioned Gridle at the beginning of the article. When we began our work on Gridle, it has been on the market for several years already, that's why it had its loyal customers. We conducted six user interviews to understand what they expect from this product. It helped us to discover what the customers wanted to see in the new version of Gridle.

Visual research

The goal of visual research is to gather ideas for the user interface and learn the market trends to be able to create not only appealing but also usable and competitive design.

Competitor analysis

When analyzing competitors, you can find the strengths and weaknesses of their products. This will help to determine the direction of the whole product design concept and understand how to develop a better design solution.

You can divide the competitor analysis into the following steps:

  • Create a list of the main competitors
  • Research the market taking into account the design, usability, content, and functionality of competitors' products.

During rival analysis, the task is to find out why competitors made certain design decisions, what they wanted to achieve, what goals they pursued.

Moodboard
moodboard example for dating app
Example of moodboard created by our team for LittleDate mobile app

Moodboards are a kind of preview of the future design. It helps to present and coordinate the visual components of the project:

  • Photos or illustrations
  • Color schemes
  • Fonts
  • Slogans or headlines
  • Logos
  • Icons, buttons, patterns.

In general, mood boards include all the graphic materials that will communicate the concept and mood of the project.

After you've gathered the information at the research phase, it's time to identify key user's problems and develop a strategy to solve them.

Strategy

At this stage, the product team has to generate a lot of ideas and form them into a consistent strategy.

Brainstorm

brainstorming as a art of product design process
Image credit: gohighbrow.com

The most effective way to start generating ideas is to brainstorm. The essence of the brainstorming method is that a group of qualified experts gather in the meeting to think about various solutions for one problem. The team is divided into two groups: the first generate ideas, and the second analyzes them.

Customer journey map

One way to visualize the ideas the team developed while brainstorming is to create a customer journey map.

The customer journey map displays the points between the customer and the product that needs to be designed. The map also helps to understand what emotions customers experience, and what difficulties may arise during the customer journey.

A customer journey map helps to develop a design strategy targeted at your customer.

It may look simple or complex. customer journey maps outline customers' steps and describe their thoughts and feelings.

example of a simple and linear customer journey map
Customer journey map designed by Eleken
customer journey map example
Image credit: dapperapps.com.au

It's better to create a simple, linear customer journey that clearly shows the way of the user to their goal.

User flow

While the customer journey map aims at the user experience design of the whole process,  user flow focuses on the process of using the product.

For example, a prospect searches for a file hosting service. He/she needs to research different variants, choose one of them, purchase a service, and then use it. It means there are four stages the customer goes through before they reach the goal. You can create a user flow for the stage of purchase (until the customer buys a service) or the stage of using the software.

Therefore, User flows are diagrams that project the possible paths the user goes through when using the product until they achieve a certain goal.

Here is an example of a user flow designed by our team.

example of User Flow design

This User Flow was created for Handprinter, a unique startup with the mission to make positive impacts on the environment. To make Handprinter easy to use, we simplified the user flow to only three steps (read the case study).

minimalist user flow design exaple

Here is one more example of a simple User Flow designed by Eleken. Due to its simplicity, it ensures a consistent experience for users.

Wireframes

A wireframe is a low-detail representation of a design. It must clearly show:

  • main elements of each page
  • their structure
  • user interaction with the interface and its approximate visualization.

Consider a wireframe as the skeleton of your design and remember that it must represent all the important elements of the final product.

Wireframes should be quick to build and the best variant is to build it in a team while discussing each step from idea to product.

The wireframes should be aesthetic, but simple. Black-gray-white is a typical wireframe color scheme (you can add blue to indicate links).

Here are some examples of wireframes that our team designed:

wireframe design example
Wireframe for TopVet, a cloud platform to manage the veterinary practice.
examples of product design process: wireframes
Wireframe for CongressBookers
examples of mobile wireframes design example
Example of a wireframe for Pomocup (a device for ski tourers)

In the process of creating a product design, it is worth building a Customer Journey Map, User Flows, and Wireframes. All these tools complement each other and help you strengthen the UX.

Design

A strategy helps to create a clear vision of what the team is going to build. So the next stage, the design, covers the visualization of all the ideas and strategic decisions.  

Prototype

The prototype is the basic layout of the product that visualizes all elements and functions. It allows you to visually illustrate all ideas, as well as make edits with minimal effort and cost.

Prototypes may have different forms.  It can be a drawing on a piece of paper or a complicated multi-page structure created in Adobe XD, Sketch, Figma, etc. Still, all prototypes do the same job - they synchronize the client's and the implementor's ideas about how the design should look.

Here is an example of how Eleken developed a product prototype for LittleDate.

prototype design example as a part of product design process

Here is a list of problems and tasks that the prototype helps to solve:

  • Visualization of the idea and understanding of how the product will look like at the early stages
  • The ability to make changes and refine the vision at a minimum cost
  • The ability to more accurately estimate the timing and budget of the whole development process
  • Understanding the direction for the future development of the product.

When creating a prototype, it's very important to validate and refine it.

As we were working on Textmagic, a customer experience platform, we needed to create a user-centric design. We were building the prototypes in Figma and Textmagic's team showed those prototypes to users. They collected clients' feedback and analyzed them to learn how we can improve the design and develop new ideas for a better problem-solution (check the case study).

When the prototypes are ready, it's time to pass them to the development team and start the testing of the product design.

Test

This stage is important as it allows the team to understand if the concept they've developed works well.

Dogfooding

The phrase "eat your own dog food" defines the practice in which the team uses its own product to check its performance, usability, ease of use, etc.

Imagining yourself as a client allows you to find obvious bugs that are revealed during the operation phase and are not visible during development. Dogfooding allows you to see and evaluate your own product or service from the client's point of view.

Usability testing

Usability testing is a method of evaluating an interface in terms of usability and efficiency of its use. To perform this kind of testing, you need to engage representatives of the target audience of the product.

Often, usability testing is carried out in two stages:

  • The user passes a certain number of tasks (quantitative or qualitative tests)
  • The user takes part in the interview or fills out a survey (qualitative research).

As a rule, you should carry out usability testing when the software interface is ready and you want to understand what problems arise during the interaction. As well, it helps to check if the product meets user expectations.

Measure and refine

As we've mentioned earlier, the process of product design is not stable and linear. When the product is launched it doesn't mean you can breathe out and relax. The team needs to constantly track product performance and make in-time improvements to keep up with market requirements and meet the customer's needs.

Monitoring the right metrics (link to Key SaaS Metrics) will help to understand how people interact with your product.  

Of course, you can't measure success only with analytics. That's why never forget about user's feedbacks. Conduct surveys, user interviews, analyze customer support requests, etc. It will give you enough insights into customers' behavior to be able to provide reasonable improvements to the product.

To sum up

You should never forget that the product you create exists for people and you should always place the customer in the center of the design process.

When designing a product remember:

  • It's okay to go back and forth to certain stages, rethink and update your knowledge of the problem
  • Effective product design is a never-ending process that requires constant improvement: gather and analyze users' feedback to refine the product and make customers happy with it.

To find more inspiration before start designing a new product, check out the following article: Design Thinking Examples: Five Real Stories.

Read more about SaaS design