When we think about building a digital product, most people consider developers as the main creators. It’s true that developers play one of the most important roles in the entire process of creating digital products. However, without good designs, a product that has even the best code in the world can be useless for the user. So, what does it mean for a product to have good design?
The whole design process is built from a few steps and focuses on preparing the most friendly, intuitive, and logical product – – which means that the product designer / UI/UX designer is not a person who created only a nice layout. The process is more complicated and is based on different methodologies and research.
Step 1.
Kick off meeting
Every client has some vision of their product – of course documentation with technical and business requirements is necessary to build the product, but understanding the vision / idea of the product is even more important.
Why? Thanks to that kind of meeting, we can understand the whole idea but also expectations. It is also a great start for the discovery phase, or it can be the start of work on the personas/proto-personas who are going to be the final users of our product.
Step 2
Defining the personas / proto-personas
Every product has different end-users and it’s extremely important to define that group in detail.
Why? We need to know for whom we build the product but Persona, as a representation of our end user, will answer those questions like:
- How will the user use your product?
- In which situation will the user use our product?
- What will they struggle with?
- What could be the pain point of using the product?
And many more.
The answers involve the high level architecture of the product but also very detailed flows, so we should know them before we start defining the main structure of the product.
Step 3
Main structure of the product
Main structure is a holistic view of the product and helps define high-level architecture which includes main features and correlations between them.
In many projects, at this stage, Product designers collaborate with System architects to determine the most useful, scalable, and logical architecture.
The main structure is a core and base for the subsequent stages.
Step 4
User stories, user flow
That step can be represented in a different way – it totally depends on the designer. Sometimes it’s only a descriptive story – how the user is going to interact with the product,
e.g. “As a user, I want to enter my data to log in to the product.”
In other cases, it can be presented as a technical flow chart.
Step 5
Wireframes
Based on data from previous steps, this step focuses on wireframes.
Wireframes can have different levels of detail and can be prepared using different tools.
Low-fidelity wireframes show only what components will be displayed where and in what order. For example, at the top, we’re going to have a navigation bar – in this step, we don’t define what items will be in that bar or in what order.
High-fidelity wireframes are a type of grayscale prototype final product. Why grayscale?
All steps focus on information architecture – from different perspectives. Wireframes also focus on architecture from a high-level to a very detailed level. And thanks to grayscale, we can deliver the most user-friendly product – because if the information is designed in the correct way, the colour of it doesn’t matter.
About if there are understable, friendly and intuitive decides their place in layout, size on typography or using a correct shape etc.
Colours can be destructive – that’s why if a product is prepared in a good way – it could be in greyscale and for the user it would be okay 🙂
Step 6
User Interface
When we finalise the wireframes, we move to another step – UI.
That phase is based on wireframes and is strictly connected with them, so UI, in a lot of cases, is a nicer version of wireframes. Using colours is not an easy task – the wrong colour in the wrong place can put an accent on some elements and make them dominant, which can disturb the whole architecture of information and logic.
As you can see – Design Process is much more than a good-looking interface. It has real involvement in the product’s relations with users. Thanks to good designs, we can build loyal customers.
Summary
The role of Product Designer is equally important in the project team as the developer – thanks to different roles with different specialisations, we can develop the best digital product.
Alicja Migda