Full Guide to Design Collaboration Tools
You cannot design as a lone wolf. Eventually, you’ll need to collaborate with developers, researchers, other designers, and an array of stakeholders. In this article, we’re going to outline some useful collaboration tools you can use when working on design with each of these types of stakeholders.
Managers, Clients, and External Stakeholders
Generally, the people you will work with most are managers and clients. They can come in a variety of personalities and technical knowledge so the tools and processes you use with these people should be easy to use and generally be OS agnostic.
Start of Process
This stage can include a lot of workshops, meetings, research, and quick iterations. You may be doing everything from giving feedback on briefs you have received to running remote workshops to uncover requirements. It will be useful to have a range of in-browser tools to use for different scenarios.
Miro is the ultimate collaboration tool for running workshops remotely and/or asynchronously. It is essentially one large whiteboard that allows participants to add ‘sticky notes’. This means you can facilitate any number of workshops like feature prioritisation, user journey mapping, user story creation or ever creating a product roadmap.
Google Docs and Slides
This can be handy when working together to create a project outline document, contracts, and providing summaries of research at the initial stage. It’s OS agnostic as it’s used in browser and can be shared publicly or privately with key stakeholders when working on more sensitive documents.
Video conferencing software like Zoom, Google Meet, Skype or Discord
The ability to run workshops remotely relies a lot on using video conferencing software. There are quite a few different tools available for this and you may need to have a selection to choose from for people with different operating systems, browsers, and even security requirements.
In the midst of a project, you want to be able to accurately track what work has been done, what is still to be done, and potentially what items require additional research or clarification.
Design software such as Figma, Sketch, or Adobe XD
Depending on what tool you use for the design, you will need to set the project stakeholders’ access to those files, with the correct permissions. So they can leave inline feedback without disturbing your designs. You may also want to utilise your video conferencing software to walk them through the tool for the first time, to make sure they know how to use it.
Asynchronous chatting tools like Slack, Discord, or Microsoft Teams Chat
You will likely have a lot of back and forth working with stakeholders when in the middle of a project. Having a place to message all these stakeholders will save you from having to constantly jump on calls. Slack is the general go to but you may enjoy Discord if you prefer voice chat or the integrated MS Teams chat if you are already using that platform.
Task management software such as Asana, Trello or Notion
Task tracking software will be useful, not just for yourself but for those stakeholders and managers that work with you. It allows them to have visibility over what work has been done and what is yet to be done. You can also use it to assign design review tasks to those people or keep track of feature suggestions.
End of Process
The end of any project is usually marked by presentations, collecting final feedback calls and getting sign off on everything ahead of handing it over to developers. Some useful tools here will be:
Presentation software e.g. PowerPoint, Google Slides or Figma
At the end of most projects, you will have to do a number of presentations. From presenting the final designs to outlining a retrospective on the project to pitching for additional work. Presentation tools will be vital in this step. Depending on how and where you need to present may influence what software you use.
One thing to keep in mind when sharing presentations is that not everyone will have Microsoft Office tools and you might consider sharing a presentation through an easy accessible web-link. Sometimes, when presenting designs to clients, design teams are creating beautiful presentations in tools like ReadyMag. This depends on how much collaboration you want to have on the slides before the presentation.
Task tracking software
This will be important at the end of the project to ensure each flow and screen is properly signed off and documented. You may have outstanding tasks at the end of the project, and use these as a guide for future updates and releases to the platform. If you are working on a contract these could help you secure a second project with that client.
Working on the same project with other designers requires agreeing on which tools and processes to use.
The obvious and main thing you will need to work with other designers is shared design software. Once you have decided on what tool to use you will need to decide on your process and file structure. You may want to run a workshop to gather insight into people’s opinions on the matter.
Design Version Control Tools
Most tools have introduced some form of collaborative working but if they haven’t or if your team cannot use cloud services for security reasons you may have to look into using version control tools for designers. Tools like Sympli Versions and Abstract do just that but you will have to try them out for yourself to see which works best for your process.
Collaboration Tools like Miro and Google Suite
Working remotely and asynchronously with other designers can be hard. Design is a very social and collaborative industry, and it can be difficult to recreate that online. Miro is a great tool to help with recreating some of that, by facilitating online workshops where you can see everyone in real-time move around the screen.
Other tools like Google Docs or Slides allow you to work together on presentations at the same time, leaving notes and suggestions as you go along.
There are a few additional tools you may need for design to development handoff to ensure your designs are implemented properly. A good process and the tools to support that process can also help make your development team’s lives easier and ensure a good working relationship.
Design Tools - Figma, Sketch, Adobe XD
Depending on which design software you use you will likely need to give the developers access to your files. They may require additional permissions to allow them to inspect your designs for spacing, colours and any other elements or states they might need to see.
Handoff tools will be extra useful when working with developers. Sympli Handoff and Zeplin are just two options in this category. They can generate assets and specs, allow for inline collaboration and commenting, and integrate with project management tools.
Prototyping and Animation Tools
If you’re lucky you will have the time within a project to create proper animations and interactions for your design. Creating these will help bridge the gap between interactive prototypes and fully implemented designs. It will take the guesswork out for your developers who may have to use their imagination on what animations to use otherwise.
There are a number of options including Principle, Protopie, and Adobe After Effects. Each tool has a different learning curve and different integrations.
The final piece of the puzzle for a good handover experience for your devs will be accurate and full documentation. This is often overlooked as part of the role of a designer, but potentially one of the most important aspects to ensure alignment and understanding. Not only do each of your flows and screens require context and documentation but there could be additional things such as data visualisations, roles, and permissions, or IA and hierarchy.
Tools like Notion or Confluence are great for this, but if you’re thinking about starting a design system and connecting the documentation to your design elements, check out ZeroHeight.
Depending on where you work you may have researchers on your team full time or work with them as contractors.
Analytics Tools like Google Analytics and Plausible
Analytics are the bread and butter of site metrics. Google Analytics is the behemoth of tracking, it’s estimated that between 30 and 50 million websites use Google Analytics and there’s a clear reason why... It’s easy to set up, it’s a familiar brand and it’s free. However, you may want something a little more thoughtful towards users’ privacy. Plausible is a simple and privacy-friendly alternative to Google Analytics.
Whichever you choose, analytics can provide a lot of basic insight out of the box including bounce rate, time on site, user retention and more advanced features like user segmentation. This data can be used to analyse how well a page or feature is performing once launched and can be used to feedback where there could be improvements made to the design.
Alongside the basic analytics tools, there are additional tools that can provide an extra layer of analysis to your implemented design. Though some people are moving away from these tools due to privacy concerns.
Allows you to set up and analyse pages and flows via the use of heat maps, click maps and session recording. You can set up tracking on individual pages and Hotjar will generate maps of where and how often users clicked on that page along with how far they scrolled. This can be especially useful when analysing landing pages or about pages and can show you where users are dropping off.
Usability Testing Tools like Maze or Usability Hub
There are some additional tools you can use to share work with researchers. Maze is a great tool for conducting user experience tests on your prototype. This can be used throughout the design process in collaboration with a researcher to collect and analyse feedback and interactions with your design. You can read more about UX Research techniques and Maze in our blog post ‘UX Research: A Beginners Guide’.
Usability Hub or UserTesting.com are also great platforms for user testing, however, each of them is aimed at very different budgets so you will have to do your own research into the one you think will work best for you.
Tooling is an important aspect for teamwork: developers, designers, stakeholders, remote collaborators from different time zones, freelancers, corporate employees and basically any cross-functional and now-working-from-home team. Choosing these tools can help or hinder the process but one thing to remember is that if something isn’t working for you, you can always change and try another tool.