As a designer, you take on a project carefully thinking about every detail, to be every so often disappointed because the final product isn’t exactly what you expected. There are just too many factors that can lead a project astray. For instance, sometimes there are things designers take for granted, or limits to the tools at hand. Why is this outcome met so frequently?
In this article, we share our ideas on how to improve and solve miscommunication, which we consider in Loopstudio.dev the core issue between designers and developers.
When We Collaborate
There are many different projects where designers and developers may be teamed up. Most of the time, these are websites, web applications, mobile applications, and product interfaces. In these instances, it seems inevitable that the team encounters some communication issues that affect the project’s outcome.
Thomas Peham, in How to improve communication between developers and designers on web projects, states that:
“Just because you have a great development team, there’s no reason to think that you can put your design ideas live in a shorter amount of time. The same goes for a team of talented designers. Developers shouldn’t always expect an immediate answer to their questions if it means a design change.”
Main Reasons for Miscommunication
Design time estimates vary a lot.
Creative processes and applying them to an actual design sometimes take longer than expected. It takes many back and forth with the clients, and sometimes the developing team gets frustrated with all the design changes. More so if they already began coding.
Designers leave things unspecified.
For instance, element interactive behaviors and how they should adapt responsively.Developers and designers have different mindsets.
Each team has different priorities, backgrounds, and approaches to work. Designers focus on delivering a good user experience and an attractive interface. On the other hand, developers prioritize building a product that works –it does what the product is intended to do, there are no bugs, and the performance is top-notch. This makes us have different perspectives on the project. It is easy for developers to neglect design details that don’t seem necessary to the product’s functionality or for designers to have to redesign because we miss the requirements for developer toolsets.We are teamed up but isolated in the tasks we each have.
For example, the entire design process is given to the designers only, which is perceived as the correct way to approach projects.
How to Improve Communication
Having these issues in mind, we came up with a few ideas on improving communication and achieving better results.
Andrew Chalkley in Mindset: Developer vs Designer states that:
“Design should lead the development, and development should inform design. Separating these two roles or facets of your application can cause bad experiences for users.”
Besides having the usual kick-off meeting, whenever we approach a new project, we recommend socializing with the development team and give them access to design source files. The sooner they are involved in the design process, the better. Include both teams in meetings with the client to figure out what the product should accomplish. This way, designers and developers are on the same page on how they will approach the project. You can also create Slack channels to share ideas, ask questions and keep the teams updated.
Invite the developers into your design process and allow them to pitch in on the user stories and flows. You can make sure everything is considered the most efficiently and effectively possible and find the best road to design the user interface with no compromises.
It is crucial to highlight that design sprints are essential to every project. Apart from the kick-off gathering, it comes in handy to hold a meeting the day the sprint starts. Together, the whole team can review the features to be tackled and the corresponding designs to evaluate if everything’s in its place. Each element/component receives a closer look in these meetings, contemplating the future logic, so more tangible things come out. Allowing both teams to align themselves will enable the design team to address these improvements, changes, etc., during the first days of the sprint and improve the general workflow.
Developers need to understand the whole design system, atomic units of measurements, and grids. We can help them by giving them access to the design files right from the beginning, as we mentioned earlier, and by using collaborative tools like Figma and Zeplin. These tools can turn designs into code and allow developers to inspect the designs properly. By clicking the Inspect tab on the right bar menu, developers can easily access the design’s CSS code. Figma accommodates all the tools that a designer could dream of. It includes collaborative designing and prototyping, all in one, in addition to being an online tool that won’t clutter your computer’s drive with heavy files and images.
Another useful tool is Bugherd. By installing Bugherd in your websites undergoing development, designers can point out implementation details that don’t match their designs. Then, developers can adjust their code to better represent the designs. Comments in Figma work in the same way for developers. For example, they can indicate their doubts or concerns in the design files. Connecting these tools to Slack can be convenient so everyone can keep up to date in real-time.
Making a detailed document explaining the default status of each element and how they will change in different instances of your design system can be crucial. Getting the developer’s feedback early on is critical to detect oversights of this kind. Moreover, developers can let you know if a feature, interaction, or animation is complex or simple to implement so that you can adjust the design accordingly. Providing developers with detailed documentation explaining things that aren’t apparent or obvious whenever handing off a design can save time in the future.
A great way to ease the flow of conversation is to create a safe space for discussion within the team; a place where developers can suggest design changes without feeling like stepping in on the designers’ work. If we don’t have these instances, the whole team structure could fall apart. You can build a regular back-and-forth (daily meeting, virtual or face-to-face) to keep up with each other’s processes and any doubts that arise.
This approach wouldn’t work if we were working with someone you’ve never had a conversation with before. The pandemic has reduced our communication and sharing points. However, people are slowly coming back to the office. By having community tables where developers and designers can casually discuss, they become more comfortable around each other. Communication can flow much more easily when working on a project, and building more positive relationships with your coworkers will make it effortless.
It is worth clarifying that feeling insecure about developers pointing out something that you, as a designer, hadn’t thought about is normal. But let that be a lesson, embrace it, and take it as an opportunity for you to grow as a professional. There are lots of things that designers will oversee and vice versa. Thus, the collaboration of both teams working together is what leads to a better outcome.
Closing thought
Our ability to communicate and work within a team is essential and can make us better designers or developers. Respecting each other’s work and giving a hand whenever a teammate needs it is key to understanding that collaboration is the best way to achieve a great product effectively.
Acknowledgements
I would like to thank Eugenia Godoy and the entire LoopStudio team for their help writing this post.
References
Peham, T. How to improve communication between developers and designers on web projects. Retrieved from: https://usersnap.com/blog/developer-designer-communication
Chalkley, A. (2015). Mindset: Developer vs. Designer. Retrieved from:https://blog.teamtreehouse.com/mindset-developer-vs-designer
Oldest comments (1)
Agreed it's essential that the developers and designers are on the same page. I have experience with both ecosystems so I know whats its like.