Spark Stellar Collaboration Between Design and Development Continuously

As you should have heard by now, the development hand-off is dead. But why did it never really work? And how can we establish solid collaboration between you, the designer, and the developer? Let's dig in.

The waterfall methodology, which includes the so-called development hand-off, is dead. Although this seemed to be an industry standard, it never really worked according to seasoned creatives. You may have noticed already, that the industry is dropping waterfall widely. Many organizations are transitioning to the agile methodology and the scrum framework.

Why the Waterfall Methodology is Ineffective

Due to changing requirements, constant new insights from the client’s side, insights in user behavior and novel arising pain points, you need to be flexible. The waterfall methodology certainly is not.

A typical waterfall process is based on fixed hours. Each discipline that contributes to the project has an amount of hours reserved for their activities. This inevitably leads to a siloed environment. Everyone is doing a quality job though. But then, they ‘hand’ it over to the next discipline down the waterfall. Never refining their work again, as there are usually no hours left when their work is finished.

When all of these factors are accumulated, they result in the following pitfalls.

Lack of Collaboration

The time pressure’s result is that designers often overlook technical constraints. The technical knowledge lies with the developer, but she can’t be contacted due to the limited time and siloes. In the end, the process lacked collaboration.

Communication Gaps

Due to the siloed environment and fixed hours, there is usually no room to discuss and refine. Because these hours are hard to account for, as they do not provide tangible results, like designs, copy, or working code.

Time Consuming and Therefore Costly

Design requires multiple iterations in order to come up with effective solutions. When the requirements inevitably change during the implementation, the tangible results have to be revised and reviewed again. Which is both time-consuming and costly.

No Flexibility

The hand-off assumes that designers can anticipate all possible scenarios upfront. However, in reality, user needs and requirements often change during the development phase. And since there is a fixed time for one discipline’s tasks, there is no room to refine.

Solid Collaboration Doesn’t Just Happen

The team where I’m active works agile. Through the scrum framework, we work towards the same goal of delivering software every 2 weeks – which customers and businesses value. This is such a different dynamic compared to the waterfall methodology. As both agile and scrum allow for better, continuous collaboration.

When I encountered agile and scrum for the first time, I thought collaborating would be peanuts. But due to the tremendous dynamic environment, I got a little lost.

How to Spark Killer Collaboration

I’ve assembled all my learnings. These are based on my own experiences and strengthened by additional research. The following practices are working quite well to establish great collaboration between design and development.

Include Development From the Start

This one is crucial. Make it a habit. The developer possesses great technical knowledge. When you huddle upfront, technical freedom and constraints become clear. They can guide you towards multiple solutions. Even before you start designing.

This information can also be taken into account during design reviews with the rest of the team, and stakeholders. Setting good expectations and priorities.

Review Work-in-Progress

Don't be afraid to show WIP. Development sees things from a different perspective. This increases the effectiveness of solutions. Plus, when agreed, you stand stronger since the entire team embraces the proposed solution.

Continuous Communication Throughout the Process

Communication is key. Be sure to ask questions and dig deeper upfront, to understand the technical landscape. Keep this up, even during implementation. Sometimes consensus must be made, and these can be established through clear communication.

Me when my code doesn't work versus me when my code (suddenly) works.

Learn Basic Coding and Programming Concepts

Although, this isn’t a favorite line to throw towards designers, it’s crucial in my opinion. I’ve seen designs distort a little, as Figma does not always translate pixelperfect to code.

As your designs need to be translated to – and not limited to – HTML, CSS and Javascript. Concepts I recommend to become familiar with are MediaQueries, which focuses on responsive web design, and Flexbox, organizing information in your design in a flexible manner. Which can also have an optimal responsive appearance when combined with MediaQueries.

Practice through Codecademy or W3Schools for example, as they offer free learning paths, exercises, and courses.

I don’t know about you, but dopamine kicks into my brain when I transform my designs to a web page with a cool URL that actually works!

Think with a Modular Mindset

Developers highly value modularity. Being able to reuse code. This increases the ability to scale the product, and maintain the code with more ease. Plus your designs become more consistent. Want to learn more about this topic? Check my Design System and Design Tokens articles out!

Validate Explanations and Build Relationships

When a programming concept is explained, gain immediate feedback by translating the concept into your own words – preferably stripped from technical jargon. Ask the developer to validate if you understood it correctly. From my experience, this results in 2 scenarios:

  • You don’t understand it yet – But since you showed sincere effort and asked for immediate validation, they are happy to explain it again.
  • You understand it – By asking validation straight away, you spark positive emotions on both sides and build towards good relationships.

But, What if I’m Bound to a Waterfall Process?

If your organization is still in the transition of becoming agile, or if they are bound to waterfall, you can still find value in the practices stated above. Be sure to compress these practices down, to ensure you divide your time effectively.

  • Even if you talk 10 - 15 minutes upfront with development about the technical landscape, you can gain invaluable insights. Ask questions, validate explanations.
  • This counts for reviewing work-in-progress too. Sit down for 15 minutes. Tell what problem you’re solving with the design. They will provide feedback and experience it as pleasant that design reached out before throwing their work over the silo.
  • Learning basic coding and programming concepts can be done during internal study hours. Even if it’s only HTML & CSS. This allows you to quickly grasp if the presentation of information is feasible with the same component across screen sizes.

Conclusions & Takeaways

It’s a heavy learning process. I experience this daily. The learning curve is rather steep. Hence, when solid continuous collaboration is established – and you will see the signs when it becomes solid – it boosts momentum and is extrinsically motivating. As a bonus it results in better relationships.

Dive deep into other stories

Get in touch

Do you need a problem visualised?

Portfolio crafted with a lot of love by Liam / Copyright 2024 / All rights reserved.