As my mentoring or classes end I always get questions around design to development handoff. It has become such a part of my process that I don't really think about it until I’m asked.
We, as designers, are more concerned about UX, UI, graphics, images, typography, and so on but developers have a completely different set of concerns. They turn our design work into reality. Making functional that we have dreamed up. Obviously, both roles are extremely important to the creation of a product or feature update, so it is paramount that there is a good process behind the handoff. I've seen a number of failures because of little to no process.
So what is this handoff thing???
First off, I am not sure handoff is the right word anymore. We aren’t throwing our design work over a brick wall to never be seen again. For lack of a better term I’ll stick with handoff. Traditionally, the handoff is a stage where developers begin implementing the finished design work. Years ago, there might have been an actual break point where this occurred. More recently, especially with collaboration tools, development might (but not always) begin before design is fully completed. Designers and Developers need to work together to make sure a handoff is successful but…
Bad Things Can Happen
There are a number of things that can cause a handoff to fail.
People are Unique
Designers and Developers are unique and this is something to be celebrated. In fact, it is a huge asset because we come at solutions differently. We can use those differences to our advantage in problem solving. To do this successfully both groups need to have some interest in the other's field. Without that interest issues can arise with jargon and knowledge gaps.
Bad Communication
This one is a real problem. I MEAN REAL PROBLEM. Poor communication between designers and developers can end up with not only incorrect implementations and a bad user experience, they can also lead to a breakdown in working relationships.
No Design System
With a weak design system or none at all, designers don’t have straight straightforward path to create amazing yet consistent designs that match a company or organization's expectations. This can lead to unneeded design iterations but also unneeded development cycles.
You should really have a design system. https://drawbackwards.com/blog/why-you-need-a-strong-design-system-and-how-to-build-one
But Really Good Things Can Happen
Enough with the negative, some really really good things can happen at handoff. To get there keep in mind.
Communicate early and a lot.
In my experience communication has been the biggest cause of failed handoffs. So bring in developers from the beginning. Yep, at the brainstorming phase, have them be on calls with clients or other stakeholders, ask the developers how various interface elements would translate to the application. Also, run your initial ideas past developers to catch any issues with implementation before you start designing.
Designers and developers should have regular discussions. These should be through the right channels. In your chat software, have a specific channel for the team. Create some guidelines and processes for communication. Have a shared repository of information. Have regular team meetings.
One of the best experiences I have had were team outings. It allowed everyone from managers, designers, and developers to understand each other better and this helped improve overall communication.
Handing off assets
When handing off any sort of asset, you should make them easily available. This is a great time to use your shared repository of information, it could be as simple as a dropbox. Some items you might share.
- User Stories
- User Flows (especially for projects with complicated logic)
- Input Maps
- Prototypes
- Videos
- Imagery
- Icons
- Animated Gifs
- Notes from previous meetings
- Additional information that is hard to show in a prototype
Take advantage of your design softwares collaboration features. Figma, Sketch, Adobe XD, and Invision all have great features that allow you to communicate with developers on a design. Just make sure you choose one source of communication so there are no lost messages/comments.
Design System Again
Make sure developers have access to your design system. This goes without saying. They will need to know typefaces, color, etc to implement into the product.
Followup Meeting (QA)
Do a follow up meeting right as the implementation has started. Make sure you answer any of the developers questions and provide any information they need.
As designers we really need to make sure we are setting up developers for success.
Design your Process
I have found that there is no one size fits all for every situation, so be open to changing your handoff process based on the needs of your teams, projects, and workplaces.
Good luck on your handoff!
