UX/UI vs. dev - how to collaborate on product design?

UX/UI vs. dev - how to collaborate on product design?

Product design is a complex process in which two different worlds meet: design and development. These are two completely different professions, but often also completely different personality types, work and communication styles. Cooperation between designers and developers could be difficult, but they would never create a product without each other’s help. In this article, I present the problems that often arise in this type of collaboration and provide tips and solutions that will make developers and designers’ lives easier.

Product design process - how does it look like

Product design consists of several stages, and in each of them, a different specialist plays a key role. In this article, we only briefly describe this issue. If you want to know them in detail, read the dedicated article on the product design process. In the initial phase of ideation, the client and Project Manager plays a prominent role. Their conversations aim to discuss the product idea, close the list of functionalities and necessary features, find weaknesses, and propose better solutions.

A thorough analysis of the idea lays the foundations for a product designer’s work who plays the leading role in the second part of the product creation process. Only knowing all the assumptions of a project could he prepare high fidelity mock-ups. To achieve this goal, he will need a set of different skills. To enumerate a few like graphic skills, knowledge of UX and UI design principles, a sense of aesthetics, knowledge of trends in the industry for which he designs, and basic knowledge of creating web and mobile applications.

A refined idea and hi-fi mockups are handed over to the programmer, who starts the development phase. Its task is to reflect the assumptions in the source code, creating a final working product. It would not be possible without the "instructions" in the form of mockups prepared by the designer. Only mutual communication between the developer and the designer and a full understanding of the project assumptions are both the way to complete the third phase of product design.

Still, during development, testers join the process before the official launch of the product. Their task is to verify the product’s correct operation and compatibility between the designer and the developer’s work scope. Then the problems in UX/UI vs. dev cooperation come to light.

The complex and multi-person process described above is only a tool for the main actor. A fair product design process is one that focuses on the customer and his vision. From the very beginning, the customer is supported in decisions made at every stage of work by the entire project team. Familiarize yourself with the list of questions that a designer may ask before starting work on product design.

product design process infographic
A fair product design process is one that focuses on the customer and his vision. From the very beginning, the customer is supported in decisions made at every stage of work by the entire project team.

Problems in cooperation between designers and developers along the product design process

In my experience, designers and developers probably have more in common than they realize, but there are definitely some distinct differences in the way that we think about things. Designers love to think about design systems, and developers think about modular code that is easy to maintain. But the way that we go about it may be slightly different.
Developers have found a way to break down their work into smaller pieces, and designers tend to think of the whole as "whole cake" and "how we eat the whole cake".
This is the point where they start arguing. Engineers want to be able to send code in small steps and create something very quickly with an Agile methodology. Designers want to take a big step forward in a holistic way - they want to provide a consistent experience. This may be a moot point for these two groups.
Aron Walter DesignTalks

As mentioned in the quotation, the differences in designers’ and developers’ work result primarily from the approach and work style. The most common misconceptions in product design work include:

  • Ignorance - both groups have their area of specialization. Still, even if they are the best specialists in their field, they will not achieve much by not cooperating with others, ignorance of design basics among developers, and vice versa. It is ignorance that leads to misunderstanding and disrespect.
  • No key arrangements - lack of discussion before the start of cooperation, determination of what tools you will use, rethinking the design and characteristics of the selected technology. In addition to that, basic things like file naming convention, image libraries, formats, grids, layouts, components, frameworks, fonts, icons. All of the mentioned arrangements would cost you a lot of developers’ work for example when implementing a web application.
  • Time approach and planning - designers need time for conceptual work, developers systemize and work in a project way. Designers define the product and create a roadmap that will allow developers to create a product that would run smoothly, without making corrections in the development phase.
  • Flexibility in working on the project - designers look at the project as a whole, want to refine it before proceeding to the next stage. Developers divide the project into smaller tasks and prefer working on smaller, disconnected tasks.
product designer's work
Designers look at the project as a whole, want to refine it before proceeding to the next stage. Developers divide the project into smaller tasks and prefer working on smaller, disconnected tasks.

Tips for UX/UI vs. dev collaboration during product design

The key to the successful cooperation of designers and devs during product design is knowledge of other fields’ basics. Both professions have the same goals and play for the same team, although they practice different disciplines. The collaboration will be easier if both sides make an effort to learn the basic principles of others’ work. A high level of mutual understanding will result in an atmosphere of mutual respect and trust, and in such conditions, it is much more pleasant to work. Therefore it is easier to obtain satisfactory results.

Another aspect that will help achieve better results is communication not only on the level of knowledge of the same language but also on understanding individual words or phrases. Understanding the other party's vision or thorough understanding of the feedback will save you a lot of time and unnecessary work. For example, designers need to be better at communicating their work’s value, not just qualitatively. Developers should patiently and clearly state the technical limitations, even if they are apparent.

The structure of the team is also essential. If you want to work out the best solutions, the basis will be to create conditions for a real and substantive discussion. There is no room for such a conversation in a project team where there are disparities. Often, designers are in the minority, making it very difficult for them to break through their arguments.

Another facilitation in the cooperation between designers and developers will be frequent meetings and feedback rounds. These should always occur before the next part of the product is submitted for the customer's approval. Internal verification of the source code’s coherence with the mockups prepared by the designer will avoid minor differences and mistakes, increasing the quality of the final product and customer satisfaction. Read the article describing the tools useful in cooperation between UX/UI designers and developers.

Product workshops illustration
Another facilitation in the cooperation between designers and developers will be frequent meetings and feedback rounds. Only time spent working together will help developers learn from designers and vice versa and develop new solutions that neither group would come up with separately.

Summary

The tips described above result from our experience in product design. These are proven solutions that can be a significant help for you or your team. Unfortunately, nothing happens immediately, and you will need time to work out an effective way of working together. Therefore, you must think about developing such a model of cooperation over the long term instead of focusing only on the current project. Only time spent working together will help developers learn from designers and vice versa and develop new solutions that neither group would come up with separately.

Custom software development company that specializes in web and mobile applications development.

Contact

ul. Nadwiślańska 1/10 30-527 Kraków, Poland

[email protected]

+48 795-856-491

See our location on map

Details

VAT-UE: PL6793159393

NIP: 6793159393

REGON: 368770514

KRS: 0000703502

Copyright © 2018-2020 CrustLab Sp. z o.o. All rights reserved.