From idea to implementation — with the design process to a successful product

David Zerbe
uxactly
Published in
6 min readNov 9, 2021

Whether you work as a UX, visual or interaction designer, the design process forms the foundation for all design projects. On the one hand, it ensures that we as designers have a common thread and, on the other hand, it prevents us from using more resources than necessary in the later process.

I won’t tell you what your design process should look like, but I can help you set up your very own design process — by going through the process with you step by step.

The base

The design process is essential in the context of UX and HCI (Human Computer Interaction) projects, as it helps you to better understand the user and his user behavior. A joint consensus has been in place here for years, which includes the following steps: Research? Design ? Prototype? Iterate.

Our adjusted design process at uxactly

Although there is this consensus, it still leaves enough freedom to adapt it to the needs of your project or your way of working. The often linear representation can quickly give the impression that the design process is a linear process. However, this is not the case! The best thing to do is to take a step back before the start of the project and take stock, so that you can then decide which is the ideal starting point for your project.

In this article, I’ll cover the general consensus for the sake of simplicity. I will go into more detail about the design process from my Design Thinking article.

Research — Understand the user and the business / project requirements

You can have an infinite number of cool ideas or create the most blatant designs in the world … Unfortunately, it won’t do you any good if you ignore your target group or the task at hand. That is why this step is essential for a good product.

“No matter how good the team or how efficient the methodology, if we’re not solving the right problem, the project fails.”

Woody Williams

In this phase it is very important that you sit down and deal with the topic and the possible dependencies. Good pointers could be: What are the business requirements? Who is the target group? What is the benefit for the user? Why is the function / product worth striving for? So that your house can be built on a solid foundation and can withstand subsequent hurricanes such as stakeholder feedback, it is important to sound out the situation in advance.

I personally love to celebrate the design process with a kickoff? mostly in the form of a workshop to get all relevant parties in the mood for the project.

Design — The design is only as good as the research

Here you can take over all the findings from the previous research and use them as a basis for your design approaches. Do not use Photoshop directly, first create a few rough wireframes and concepts with Axure, Balsamiq or the classic way with pen and paper.

“All things are created twice; first mentally; then physically. The key to creativity is to begin with the end in mind, with a vision and a blue print of the desired result.”

Stephen Covey

The research gives you the advantage that you can always justify your artifacts well. Ideally, this phase gives you enough freedom to work on multiple design approaches. That gives you the freedom to get the best out of your project. After you have a solid concept, you can work on the first Photoshop layouts or start programming the prototype directly, in order to then iterate and polish it as the process progresses.

Prototyping — Bring your creation to life

After your design has been validated and you have created a good basis, the next step is to prepare the first user tests. It is important that you find out beforehand what the prototype should do: Which requirements should be met? Depending on the purpose, the prototype should be designed in more or less detail.

For example, if you only want to test one user flow, it is sufficient to only cover this. If you want to give your customer a rough impression, a simple click dummy using InVision, Marvel or Adobe XD may be sufficient. On the other hand, do you have the time and want to test the project under the best possible conditions. Can you also create a HTML / CSS / JavaScript prototype with live data. However, this is rarely asked for and takes up a lot of time that you might miss during testing — but it also has the great advantage that you achieve the best results in qualitative user tests. In addition, thanks to the live data, it enables significantly deeper and more emotional ties with the user.

First of all, it is only important that you have a rough idea of the topic of prototyping. I would like to go into the prototyping and user testing section in more detail in another article. There are almost endless possibilities here, which are more or less ideal for your project depending on the area of application.

Iteration — perfection is different

After your prototype has been validated by means of qualitative testing or you have received initial feedback, it is a matter of incorporating the feedback. If the feedback is manageable — and the prototype or the layouts visually and conceptually almost final — you can consider incorporating the feedback into the prototype and setting up a new qualitative test or approving the prototype in order to do a few more quantitative A / B with your developers Set up tests.

Stakeholders — You can’t do without them

Similar to design thinking, it is also important here that it is extremely important to include your environment. This can be done in the form of stakeholders (users, other designers, project managers or even with the inclusion of the C-Level). It is important that your stakeholders know about the status of the project at all times and that they are not suddenly overwhelmed by an avoidably ‘finished’ project. This could mean, among other things, that your project is punched in or that you can start all over again. There can also be various reasons for this: the stakeholder may have had a different idea of the project or important information that could have influenced the entire project.

Personally, I always think it’s good to pick up the stakeholders right at the beginning of the process with a workshop in order to then create the basis of the project together with them. In the end, at least nobody can say that they had not been heard or did not know — tries to concentrate the circle of those involved on the really important stakeholders.

Closing word

The design process is a powerful tool that supports you in developing innovative products close to the user. It also helps you to maintain control over the project and allows you to compare your ideas with the mindset of your users at any time, so that the risk of wasting resources is reduced to a minimum …

Always remember, the process is flexible. So you can jump back and forth at any time. I can also recommend that you think about where you want to start before starting the project.

In the coming weeks I will go into more detail about each phase of the design process. If you liked the article and would like to read more about the design process, give me a “clapp”. Otherwise, I look forward to your feedback.

--

--

David Zerbe
uxactly
Editor for

Nice tech guy that loves to design and tweet about UI, UX and concept stuff. Working as a Design Manager @uxactly.