Designers and developers are often separated, both physically and functionally, in today’s work culture. Designers sit in their part of the building, conceptualizing and sketching and doing things with pixels, while developers sit on the other side of the building (or the world in some remote companies), solving problems and writing code.
Communicate early and often in the right ways
The most common problem (as possibly the easiest to fix) is a lack of communication between designers and developers. When there’s failure to communicate, the door is left opened for misunderstandings and differing interpretations to creep into the design process. This leads to problems like unnecessary redundant feedback loops between developers and designers and an inability to take advantage of overlapping knowledge and skills.
The best way to minimize the issue here is to bring developers into the design process early and often. Encourage regular discussions, invite developers to client calls, and incorporate their ideas in brainstorm and prototyping sessions. Developers know best what’s possible (and what’s going to take dozens of lines of code instead of hundreds), so make it a point to get feedback from them as often as possible.
It’s also important to have shared common methods for communication. Try using a dedicated channel in Slack or Basecamp so that files and screenshots can be shared with comments. Set guidelines for progress updates (i.e. at the beginning or end of every work day) so that folks know where to look and what to look for.
Related: 4 ways remote designers and developers can collaborate better
Reduce knowledge gaps between parties
There may be instances within a project (or even as an ongoing hurdle) where designers and developers have a lack of understanding regarding what’s involved on the “other side” of the product creation process. Designers may have great ideas that translate into complex coding, and the solution posited by a developer might not adapt into the most user-friendly design.
Make this a non-issue by encouraging both sides to share knowledge with one another. Increased mutual expertise can minimize misunderstandings and encourage more communication among team players. Try implementing a “lunch and learn” series where designers and developers eat lunch together and share short 5-10 minute presentations on basic skills or current trends in their respective fields.
Streamline and systematize BOTH handoff processes
You’ve included developers in the process from the beginning, and you’ve made sure there’s a fair amount of shared knowledge (and respect) between the groups in order to eliminate redundant conversations and troubleshooting. Time for the (first) moment of truth: the designer-to-developer handoff.
First things first: make this process as orderly, organized, and comprehensive as possible. There should be a set way of naming files, labeling elements and layers, and transferring creative files that your teams use every time without fail. This reduces questions and makes at least part of the process much more predictable.
“The most common problem is a lack of communication between designers and developers.”
After the design files are transferred, make it a point to go over the designs with the developers. This allows designers to explain the finer points of those microinteractions while the developer can ask questions straight away, reducing the lag time before coding begins.
But wait! There’s another handoff that your design team need to prepare for: the handoff from developer to your quality assurance team. This is when other issues may arise, like image misalignment or (hopefully) minor discrepancies between the new creation and existing products.
To avoid issues with this stage of the process, use full screen capture and annotation tools to identify variances with specific visual references and accompanying notes. This will help your QA team (or even earlier in the process, your developers) find problems quickly. The quicker problems are found, the quicker they’re fixed, the quicker you ship.
Related: Designing with developers in mind
Working in a comprehensive tool like InVision Studio that incorporates prototyping, animation, and sharing is a great way to prevent confusion when it comes to handoff. Studio is is early access now, so give it a try!
by Will Fanguy
Digital content wrangler | UX enthusiast | Recovering educator | Shameless nerd & GIF connoisseur | Hockey fan (Go Preds!) | Oxford comma or death | It’s pronounced FANG-ee