Tips for better collaboration between design & development

Sometimes there are delays or problems in the collaboration between development and design. This often happens when teams build and design new online shops.

But the obstacles can be overcome. It works best when designers and developers pay attention to this from the start and communicate with each other.

PAGE asked André Roitzsch, CEO at SHOPMACHER, four questions about it.

André Roitzsch: One of the central problems in the collaboration between design and development lies in the sequential approach: when the design is first fully worked out, approved and then handed over to technical implementation, difficulties often arise at that point. Because designers are not always aware of the technical constraints of the chosen shop system. The result is design specifications that make sense and look attractive from a design perspective, but whose implementation is unnecessarily complex or costly in technical terms.

On the other hand, developers sometimes lack the understanding of which "small" deviations from the design would be acceptable without undermining the overall design concept. In such cases, additional coordination is needed, right up to renewed sign-off by the design team, which causes delays and friction.

But thought through from the other end, it is often a one-way street too: when technical concepts are developed first and then supposed to be "adapted" to the corporate design, design corrections can cause considerable additional effort in development, especially when they are introduced afterwards and were not originally planned for.

A proven method is regular exchange in hands-on workshops, to develop and implement the UX together with the design partners. In these operational formats, potential points of conflict can be identified early and workable solutions developed together.

Another success factor is a clean, clearly documented data model.

In the commerce environment in particular, it is crucial to understand that design work largely consists of visualizing data. Anyone who knows the structure, origin and processing of this data designs in a more informed and efficient way.

In addition, a basic technical understanding among designers is a great advantage, especially knowledge of HTML, CSS and ideally also a basic understanding of JavaScript. In our onboarding process we therefore make a point of having designers work independently with shop or editorial systems, create templates and build pages. Experiencing technical possibilities and limits in practice not only fosters understanding, but also raises the quality of the later design specifications.

On the developer side, too: understanding the other discipline is essential. It is not enough to write clean code, what matters is how it looks in the frontend. Developers should regularly check their results in the browser and compare them with the originally planned design.

A good eye for design, at least in the basics, is part of a frontend developer's competence. Anyone who spots deviations, takes visual details seriously and proposes constructive alternatives contributes significantly to a strong user experience, without losing sight of technical efficiency.