Home / Services / Design handovers: How success relies on collaboration

Design handovers: How success relies on collaboration

Here at Pragmatic, we’ve grown rapidly over the last couple of years into a company of 50+ with the majority of our employees being developers (read about our founder’s story here). Our roots are in development but design has always been an integral part of the company. Being a design team within a developer rich environment is a pretty unique situation, it’s allowed us to collaborate with our developers to test, feedback and tailor workflow processes which work for us.

Design handovers can be a tricky business, below you will find some of our learnings. These points are for designers and developers but equally, project leads and other managers should keep them in mind.

1. Speak the same language.

  • Regular check-ins with the developers. Daily standups and project anniversaries are a great way to get everyone in the same room collaborating. Doing this at the start and throughout the project allows you to nail down high-level decisions early on, even before any code is written.
  • Technical scope. It’s essential that designers understand the possibilities and restraints of the technology they’re working with before they can feel confident starting the design.
  • Preparation in handing over the designs. This should begin at the start of the project, commit to a method and stick with it. Our preferred design software is Sketch as this allows us to easily integrate tools such as Zeplin, Invison, Principle into our workflow.

2. Design together.

  • Stop compartmentalising design and development. The days when you send your design files off to a developer and a couple of weeks later you’re sent a link with a finished site are long gone. The relationship between the designer and developer is often overlooked, encourage collaboration to get the best end out of your team and to avoid project pitfalls.
  • Don’t isolate design. Running design and development concurrently can lead to early identification of issues and opens up opportunities to ask question and iterate, strengthening your original solution.
  • Designs don’t need to be pixel perfect. Sharing a rough sketch, design or prototype with your team creates an opportunity to discuss it’s technical feasibility and rationale. These types of conversations will give you a chance to challenge your work and see it from other perspectives.
  • Designing for the edge cases. For example, when designing for a multilingual site you’ll need to take into account the difference in character counts across languages.

3. Supplying assets.

  • Images. Remember the days of creating image assets manually and then handing them over to the developer? I’m pleased to say those days are in the past. Tools like Zeplin can import your designs and give your team access to all the projects assets (colours, font sizes, grid measurements etc). There are a few little nuances of how to set your design files up, but it’ll become part of your standard workflow in no time.
  • Animations. This can be somewhat problematic because of the restrictions in exporting and sharing the files, especially across platforms. Luckily for us, most of the team uses OSX enabling us to use a tool called Principle. We export the animations as .app files which provides the developers with a design that they can interact with and reproduce.

4. Consistency.

  • Design Systems. User experience improves when similar components have a consistent design and function. Creating a style guide as a reference document will help you to manage and improve consistency across your designs and encourage collaboration between the team.

Summary

Designer: Be empathetic to your team and don’t isolate yourself. Involve them in the design process and create opportunities for others to challenge your work. It’s also important to understand the technology powering the project and to be aware of any restrictions or limitations.

Developer: Get involved early on, work with the designer and don’t be afraid to challenge the design or its rationale. Make the team aware of the limitations or restrictions of the technology being used as early as possible, as this could have an impact on other stages of the project.

Project managers: Encourage designer and developer collaboration, this will bring to the forefront any issues early on and avoid project pitfalls.