Image by Unsplash

There’s a common misconception that a designer’s work is done when all screens have been designed. When it happens, only half of the work is done. Another half is building an actual solution.

Designer-developer collaboration is an integral part of a work process. Unless designers are responsible for designing and building a product, they will be expected to work with developers. If you’re just recently moved to the UX design field, the success at your first UX job will highly depend on how well you can work with developers.

Here are three tactics that can help you make a smooth design-dev collaboration:

1. Always think about the technical feasibility of your solution

Feasibility is about whether you can effectively implement your solution. Not everything that designers craft can be easily implemented. Technical feasibility can be a show-stopper if it turns out that the brilliant solution cannot be coded because there are no tools that allow the engineering team to do that. And the worst part is when technical feasibility is evaluated during the later stages of the design process when a design team shares the finished design with developers.

User value vs. effort by organization. Image by NNGroup

Ideally, designers should have a solid understanding of what technology is capable of. They should know both advantages and limitations of the technology they use in a product. It is possible to achieve that by diving into code. That’s why coding skills can be a massive advantage for designers.

Another way to solve this problem can be regular syncs with the engineering team. Once designers have an idea of how something can work, they can reach out to developers to evaluate whether it’s possible to build something like that.

2. Create proper context for developers on what they need to build

Developers build the final product based on information they receive from designers. If designers don’t provide enough information, developers must imagine how the final solution is expected to work.

Lack of understanding of the bigger picture of what you’re building is a common problem during development phase.

It is essential to ensure that developers completely understand what they’re building. There are a few ways how to achieve the goal:

• Creating proper documentation for your design. Documentation typically includes information about the business goals of the product (what problems it solves for users), information about the user journey and user flows (how the product fits in user’s life and how they expect to interact with it), as well as specification for individual UI screens/pages.
• Find the right balance between visual and written documentation. Too much text in your documentation can feel overwhelming to developers. Avoid long blocks of text because the development team can easily skip them.

Try to pair visuals with text side by side because it will help other people better understand your idea. Image by Adobe.

• Invest more time documenting interaction details. State transitions and animations are where the majority of mistakes are made during implementation. Always provide information on what will happen when the user clicks on a specific button in UI and how the animated effect supposes to work. It’s much easier to achieve that if you create a clickable prototype and share it with the engineering team.

Design specifcation. Image by Jonathan Bowman

• Conduct handoff meetings with developers. No matter how good your design documentation is, developers still can be gaps in understanding after reading it. That’s why it’s recommended to conduct a meeting with the engineering team after they check the documentation and be ready to answer the team’s questions regarding your desing.

3. Collect feedback from developers on your design regularly

Treat developers as a category of users of your product. The feedback they share can be precious for your design process because it can make you think about use cases you didn’t foresee. Plus, developers can evaluate your solution from an engineering point of view. For example, they can tell you areas in a user flow where you likely have performance issues (i.e., slow loading time).

Try to adjust your design workflow and make interaction with developers an essential part of it. Find a channel that works for your engineering team. For example, if you see that the engineering team prefers to use Slack rather than Zoom meetings for daily communcations, you should stick to Slack.