The Power of Collaborative Design

The tools, process, and principles for quality UX in an agile team

Zack Labadie
Catch
5 min readOct 18, 2018

--

Let’s set the stage by stating the obvious: creating a truly remarkable user experience requires thorough planning, well-crafted solutions, and precise execution. We all know this to be true, and we all know that it’s easier said than done.

Sure, a rare breed of interdisciplinarian with acute attention to detail and an unlimited amount of time might be capable of delivering a quality end-to-end experience on their own. Unicorns, however, are fictional; deadlines, deliverables, and an active user base are all very real.

The truth is that creating stellar UX on a tight timeline is only made possible through intense cross-team collaboration, especially between designers and engineers. All too often, Design and Engineering operate in disciplinary silos, pushing features into production on a rigid conveyor belt that doesn’t allow for fluid iteration or collaboration. This doesn’t have to be the case.

Pair programming has been proven effective across multiple vectors. Design critiques are as old as the trade itself. Why not embrace this spirit of collaboration across team lines? By prioritizing interdisciplinary collaboration, I’ve been able to not only work faster, but deliver better end results. The power of collaboration comes down to three things: Tools, Process, and Principles.

Tools

Collaborative tools are nothing new — GitHub, Slack, and Google’s G Suite have been office mainstays for years. These services have maintained their juggernaut status for good reason, though: when all members of a team are able to easily communicate and collaborate in unison, something wonderful happens. Communication gaps dissolve. Ideas evolve faster. Design imperfections are uncovered earlier. New perspectives are brought into the fold. Decision-making becomes more democratic. In short, these tools allow teams to tear down barriers and tap into their full potential.

At Catch, we use a broad arsenal of collaborative tools. Slack allows us to easily plan pub trivia nights and share memes, but it also allows for fully-productive remote work sessions and an automated user feedback channel. Google Docs was used to draft the post you’re reading right now, complete with copy edit suggestions and a full revision history. We’re fully bought into Notion as a source of truth for all internal documentation, requirements, and project specs. Most importantly, we’ve migrated from Sketch to Figma so that design collaboration can happen in real time with visibility and feedback from the team at large.

Process

Most projects at Catch begin with a kickoff that brings developers, designers, and any other stakeholders to the table. At this stage, we all review top-level objectives, define a timeline, and raise any preliminary questions. The end result of this conversation is a detailed Notion document that both designers and developers are able to reference and edit in real time as the project evolves over time.

Once a general plan has been agreed upon, the design team starts whiteboarding. Ideation leads to research and soon thereafter physical sketches become digital wireframes. Using Figma, the design team iterates early and often until an MVP emerges. Around this point, I’ll share preliminary designs with front-end engineers and other stakeholders to gather feedback and review technical constraints. Iteration continues from here not tucked away in a local file but connected to live components and visible by the entire team, creating an open forum for critique.

After designs are fully polished, I’ll share my updated Figma file with developers, initiating an ongoing dialogue. Whether it’s an overlooked edge case or the exact timing of an animated transition, I’m able to collaborate with developers and the rest of the design team in real time through Slack or direct Figma comments. This may sound like a small detail, but it’s the key to shared ownership and true collaboration. Developers are able to immediately flag any design inconsistencies. Designers are able to eliminate any guesswork around implementation. In the end, both teams are able to focus on what they do best while leveraging the other’s skillset.

When initial development is complete, new features are pushed to a QA environment where engineers, designers, and other team members are able to divide and conquer. I’m able to ensure that even the most minor details are properly implemented in an initial release. Gone are the days of creating a JIRA ticket to increase padding by 8 pixels! Bugs that might take weeks to uncover via a traditional workflow can now be identified and solved for in a single day.

Principles

Process is nothing but a set of hollow checkboxes without underlying principles. These overarching principles make for an adaptive, collaborative process ensuring the entire team sprints towards a common goal without becoming mired in bureaucracy.

Flexibility is paramount. As a small team working on a constantly evolving product, priorities shift on an almost daily basis. Whether it’s a Slack message or a quick face-to-face exchange, all team members make themselves readily available for questions or assistance to minimize blockers and maintain forward progress.

Making that flexibility manageable on a daily basis requires cross-team visibility. I attend both Product and Engineering team standups every morning, making sure priorities and expectations are aligned across teams. This ensures that ongoing progress is clearly communicated and unexpected curveballs don’t derail projects entirely. When done correctly, this allows for near-simultaneous design and engineering efforts.

In the end, both teams are able to focus on what they do best while leveraging the other’s skillset.

Last but not least, it’s crucial to leave your ego at the door. A fully collaborative process means offering feedback with generosity, accepting criticism with humility, and embracing shared responsibility for deliverables. Users don’t marvel at elegant code. They don’t interact with pixel-perfect static mockups. What matters to users is their real world experience with a product and how impacts them.

I’m a staunch believer than in a world without unicorns, it takes committed collaboration to craft a life-changing product. That process is constantly evolving here at Catch, but I’m proud to help shape it and confident we’re on the right track.

--

--

Zack Labadie
Catch
Editor for

Product designer, bike rider, coffee drinker, human, etc.