“This is not my design” VS “This is hard to build”..
Transition from a concept to realization is tough. That Tuesday morning design hand-off meeting can be a dreaded occasion for both developers and designers. The airy concept of the designer comes crashing down to reality of limitations developement wise. Bad news are often broken in this meeting, sometimes resulting in disagreements and putting the build on the wrong foot.
How can a creative department, that includes both design and dev teams, manage to mitigate these risks and foster a more inclusive workflow that ensures the final designs are not only beautiful, but also functional and developmentally sound?
As a design team member, i will be covering 5 tips that help us have successful hand-offs to our development team.
THE BIG RULE
“Consider others as more important than yourself”
Spend the little bit of extra time valuing a developper’s time, their workflow, their processes, and them as a person. This mindset leads you to be effective and efficient and thinking your best to make the collaboration process smooth and successful.
5 Tips to working with dev team
1. Involve developers in the process from start to finish
One of the worst things that we can do as designers working among a team is to have the “TA-DAA!” moments.
Presenting a work that nobody from the dev team has ever seen is telling them “ I have no consideration for the things that you have to do, I just figured this would look cool”. And that’s not a good way to work in a collaborative design-dev team. So including developers from start to finish is very important. Asking them what constraints the project might have and what solutions can be established from the very first meeting is very important. Everybody has creative problem solving tools, and we have to include every member to bring those tools out.
This way, by the time designers hand the design off to the developers, they are fully aware of what they are about to build.
2. Document the design deeply
It’s not enough anymore to handle just a flat design and be like “There you go, this is how the final project looks like, you just go ahead and develop that”. There are so many more questions laying behind a design.
It is important to document the fonts used, the spacings, the design systems created, the modular systems that exist within the design, the interactions…etc. So that the developers can understand the design.
This can be done in a lot of different ways. Some people use Zeplin, some others use different plug-ins for Sketch..whatever it is! Just have something that says more to the developer than just the design.
3. Create prototypes
When possible, creating prototypes for animations and interactions instead of a static design is very helpful. It is understandable that it isn’t always possible to do that because of time restraints and other factors, but describing how the animation or the interaction should look like is different than actually showing it via a prototype.
Many prototyping tools are now available to help with this task, like Adobe XD, Invision and even more advanced ones like Webflow. They are actually the new jam for designers!
4. Be very organized
Not much needed to be said here : when delivering work to a developer, making sure that all assets are named and organized in a consistent and structured way is imperative for a smooth project flow!
5. Adapt to the dev process a little bit
This is where compromising is needed. Maybe a developer likes the files named or delivered a certain way, maybe they find a certain tool harder to deal with.. As a designer, adapting to their processes just a little bit and making them feel more comfortable with what is about to be handed to them is a positive step and it allows to create a bridge between both teams, which leads to a smoother collaboration.
There is no magical solution to a totally flawless and error-free design-to-development hand-off. Errors and miscommunications will still happen. However the above tips can help break down barriers to collaborating in a better way. A winning teamwork starts with the ability for all of us to take a step back from our strongly held work rituals, include members, be flexible with other workflows and learn to compromise. We can then reach a great job and succeed our projects.
Article by A.O. designer @ Legal Doctrine