7 tips for better harmony between designers and developers

8 April 2024

When it comes to building user interfaces, the collaboration between product design and engineering is paramount. Neither discipline can be done in isolation from the other, instead, they must work together to ensure the best possible outcomes. In this post, I will explore 7 ways in which designers and developers can work together to ensure healthier, more harmonious teams.

Have you ever worked on a project where there has been some level of dysfunction between the designers and engineers? Here are 7 tips to improve the interaction between these two disciplines that will ultimately lead to happier more productive teams.

1. Get the design foundations in place

Establish foundational design principles, including typography, spacing, and grids, early on. Be sure to embrace a flexible, iterative mindset from the outset so that you can revisit and refine as you go. Iteration is a core part of how software is built today, so engineers expect change. As long as your design updates are communicated openly and transparently, this approach will foster a more collaborative environment where continuous improvement is not only expected but welcomed.

2. Mitigate dependencies

Identify and mitigate any dependencies between design and development on a continual basis. What is the minimal amount of design required to unlock the next engineering task? Is engineering blocked because they are waiting for design to complete a much bigger or unrelated task? For example, when building a CMS-backed website, do you need the UI designs in place before the developers set up the CMS? In this instance, by agreeing website structure and content hierarchy early with the customer, the engineers should be able to set up the content management system (CMS) before the UI designs are in place.

3. Create interactive wireframes for design feedback

Designs fixed in Figma will only get you so far. If you want meaningful feedback, give users something tangible to play with, especially if that 'something' feels like working software. Wireframes might end up being thrown away, but the return is worth it.

My advice, invest time in creating wireframes as early as is practical. Clearly, there's a balance - the associated UI design needs to be in a good place before you can create the wireframes but once they are, get building.

On a recent project, our engineering team took the initiative by creating the wireframes before formal client approval of the Figma designs. It was a risk, but given the need for speed on this project, it was absolutely the right call. Acknowledging that elements would change, this proactive approach actually expedited the development process because of faster feedback and better customer engagement.

4. Create live previews for implementation feedback

Continuing on the feedback theme, engineers also need to open up their work for review as soon as possible. There are several ways they can do this. On past projects, we have used screen recordings but this can lead to vague, non-specific feedback on design or implementation issues. Unlike working software, you can't inspect a recording.

Using technologies like Vercel, engineers can share work for immediate, focused feedback upon committing changes to version control. We have found that this has improved the feedback loop to no end, resulting in better, faster, more relevant feedback.

5. Aim for maximum visibility

The days of 'doing' design and then handing things over the wall to engineering are long gone. Today, design and development are entwined activities from project inception to final delivery. Designers and developers must continually work and solve problems together - no us and them, no walled gardens, just one team all pointed in the same direction.

Teams should ensure maximum visibility across all activities. For designers, that means embracing standard agile disciplines such as creating tickets for their design tasks. It might seem strange to call this out, but in times gone past, design was viewed as a separate activity and designers were often excluded from the main agile ceremonies.

Instead, by being part of the process, the entire team will be informed of upcoming work which will foster early collaboration and accountability on new features.

6. Daily huddles

You probably get the point now that successful teams work as one. There is no other way. This maxim covers every facet of a delivery, not least communication.

In fact, healthy teams will be communicating all the time via daily standups, email, and instant messaging. This being software development, some of your team may feel compelled to do all their communication behind the facade of a keyboard, so actively encourage team communication beyond just typing, promoting frequent ‘huddles’ for real-time discussions.

Tools like Slack make this incredibly easy. And whilst virtual huddles might eat up more of everyone's social batteries, they will lead to quicker decision-making and increased trust and camaraderie across the team

7. Embrace collaborative design solutions

Finally, and arguably most impactful of my tips, is the mindset that design is a shared responsibility - it is something that the entire team should feel they can help shape. The feedback loop between engineers and designers is as important as the one between actual users and designers.

This shared mindset goes beyond crafting design experiences. It is about building an esprit de corps and mutual trust across the team. It's about knowing that you have each other's backs whilst ensuring you have plenty of fun along the way. Therefore, invest in building relationships and getting to know each other. The returns will be enormous.

Conclusion

None of the above is new, but by doing these simple things well, everything else will follow. Building teams is hard, but by putting the right culture in place, your teams will do their best work together. Healthy teams foster and encourage a flexible, collaborative environment, they discourage behaviours that create disharmony and encourage ones that draw out the best in people. By creating trust in each other's expertise, you will produce not just good but great work.

Article By
blog author

Melissa Keizer

Principal Designer

Tags