In this edition of Ask UXmatters, our experts discuss their favorite tools for remote, collaborative UX design and how to use them in a variety of situations. Collectively, these tools support verbal and written communication, file sharing, screen sharing, collaborative drawing, and prototyping. Some tools try to replicate the way designers work in person, while others transcend these norms and create new paradigms for remote, collaborative UX design.
Our expert panel also explains how to use to these tools to ensure that the result is a good design and every team member’s voice is heard. As you’ll see, UX designers are comfortable with various processes for creating designs, so some tools are a better fit for certain processes than others.
In my monthly column Ask UXmatters, our expert panel answers readers’ questions about a variety of user experience matters. To receive their answers to your question in an upcoming edition of Ask UXmatters, please send your question to: [email protected].
The following experts have contributed answers to this edition of Ask UXmatters:
Stephen Anderson—Head of Design, Innovation Garage at Capital One
Mark Baldino—Co-Founder at Fuzzy Math
Lisa deBettencourt—VP, Design, at Confer Health; Adjunct Lecturer at Northeastern University; Founding Director of Interaction Design Association (IxDA)
Sarah Doody—User Experience Designer; Product Consultant; Creator of The UX Notebook
Pabini Gabriel-Petit—Principal Consultant at Strategic UX; Publisher and Editor in Chief of UXmatters; Founding Director of Interaction Design Association (IxDA); UXmatters columnist
Csaba Házi—Co-Founder and UX Expert at Webabstract; author of Seven Step UX: The Cookbook for Creating Great Products
Steven Hoober—Mobile Interaction Designer and Owner at 4ourth Mobile; coauthor of Designing Mobile Interfaces; UXmatters columnist
Ben Ihnchak—Co-Founder at Fuzzy Math
Jordan Julien—Founder of Hostile Sheep Research & Design
Whitney Quesenbery—Director of the Center for Civic Design; Consultant at Whitney Interactive Design; author and expert at Rosenfeld Media; UXmatters columnist
Janet Six—Principal at Lone Star Interaction Design; UXmatters Managing Editor and columnist
Q: What are your favorite tools for remote, collaborative UX design work?—from a UXmatters reader
“First, a few words of general advice about remote collaboration: Collaborative teams should be as small as possible and, ideally, comprise only three to six people—even when you’re working face to face,” answers Pabini. “Each member of a collaborative team should provide unique and essential value to the team. When working remotely, limiting the number of participants in a collaborative work session becomes imperative. Having a larger number of participants makes using a facilitator necessary, which detracts from a team’s ability to truly collaborate. Plus, it usually requires that you use some kind of formal workshop approach.
“Ideally, collaborative teams should be multidisciplinary. For example, on a software project, it’s impossible to make optimal design decisions without the input of at least a product manager and one or more engineers. Depending on the type of project, there may be additional essential personnel who should be part of a collaborative team.
“When meeting with remote teammates, always ensure a level playing field for all participants by requiring everyone to sit at their own desk. When some team members are sitting together in a conference room while others are dialing in, this disenfranchises remote teammates. It’s very difficult for them to get the attention of the group during discussions.
“I’ve led the design of collaboration software products for several companies, am passionate about collaboration tools, and would really like to work in the collaboration space again.”
“My favorite ways to collaborate are using workshop and studio design methods,” answers Steven. “I make sure everyone on the team has a voice. I assign work across the team as much as possible—so the whole team does the design work instead of any one person leading it. My tools to support this process are not specific and can be replaced. I change them up for different clients’ processes or as tools improve.
“Whether developing requirements or sharing and annotating drawings, I find that almost every collaboration tool forces me too much into the way they work instead of empowering the way I want to work.”
“UX designers need time to think on their own as much as they need close collaboration,” asserts Jordan. “When close collaboration is necessary, I jump on a call or video chat with my teammates and collaborate using Google Docs. Even when I need to think on my own, I’m still available by phone or email.”
“Slack, Sketch, InVision, Dropbox, and a regular old telephone all have wonderful collaborative capabilities, and all enhance each other when used together,” suggests Ben.
I like a mix of Slack and Google Docs,” says Mark. “These tools are not specific to user research—just good collaboration tools. It’s better to have a multipurpose tool that you can adapt based on the activity. As a small business, we limit our tool options because having too many makes it difficult to delegate projects to other people. But Google Docs is collaborative enough that it helps us work together.
“Remote collaborative design is a bit trickier,” acknowledges Csaba. “I love holding face-to-face design-studio sessions—something I think every UX designer should practice. During a design-studio session, designers solve a problem together, sketching many possible solutions and screens. The goal is to generate ideas that the designers can then refine and use. However, doing a remote design studio is a challenge because you cannot just pin your sketches on the wall so everyone can see them. Still, use your creativity to try to replicate this approach online because it’s worth it. The simplest solution is to ask team members to sketch on their own, then take photos of their sketches and share them on Google Drive or InVision, so everyone can see them while discussing the problem via Skype or Zoom.”
Next, we’ll learn about what specific tools our expert panelists have used and recommend.
Pabini: Atlassian has created some of the best collaboration tools for software-development teams. They’re continually adding to their product suite. I haven’t yet had the opportunity to use some of their newest products. Confluence is the best knowledge-management software I’ve used. Jira is a great tool for planning and tracking agile development projects. If you design in code like I do, Bitbucket lets you manage Git code repositories so teammates can collaborate on code. By designing in code, I mean doing detailed visual design and creating responsive-design breakpoints in code. Atlassian recently acquired Trello.
Pabini: I often use Balsamiq for sketching or creating affinity diagrams during remote collaboration sessions. It’s very easy to use and lets you work quickly. One benefit of Balsamiq is that many product managers and engineers know how to use it. Plus, it integrates with Confluence.
Cloud File Storage
Steven: I use Dropbox. This is about procedure, method, and permanency. You have to organize your files and notes so everyone can find them when they need them, now and in the future.
Pabini: I’ve used Google Drive and Dropbox. They’re both good tools.
Jordan: I don’t use Slack. I’ve tried to get on board, but I just can’t get out of the email mindset. The whole chat or discussion-board concept is too passive for me. If I’m working, I want to be asked questions and alerted about things. So my biggest collaboration tools are email, screen sharing, and a conference-line phone.
Janet: I use email in my design work so I can easily save my conversations and refer back to them at a later time. I appreciate that each thread can be as long as necessary and instantly gives me an archive for a particular part of a design. Not only can I see the current state of a design, I can easily see the history of the design. I also like that I can collaborate in a way that doesn’t interrupt people’s work.
Steven: I like email better than instant messaging (IM) or related systems such as Slack because the messages are not transient. You can take notes, file them, and search for them later to find the information.
Pabini: I hate using email for team discussions. It’s like the information goes into a black hole. I prefer keeping all project information in one place, where all of my teammates have access to it and it’s separate from all unrelated information. But I agree with Steven that using chat or instant messaging systems is worse because of the transitory nature of the information. I prefer a well-structured knowledge-base in Confluence, which lets me maintain the full history of a design’s evolution through archived discussions and sketches. Plus, I can easily connect that information to user stories in Jira.
Pabini: As Aarron Walter described in his UX STRAT 2013 keynote, which you can read about in my review, MailChimp is using Evernote’s powerful capabilities to analyze and discover new connections between massive amounts of data from disparate sources to inform UX strategy and design. I’ve used Evernote mainly for notetaking and sharing information.
The Google Suite
Pabini: In addition to using Google Drive, I use Google Docs, Sheets, and Calendar. I’ve also used Sites. I love the ability of Google Apps to let people edit the same document simultaneously. I use Google Docs a lot when doing collaborative writing.
Csaba: As a UX designer, I have to create a lot of different documents, spreadsheets, and flowcharts. For documents and spreadsheets, I use Google Drive, Docs, and Sheets. They work well, let you work collaboratively, and they’re easy to use. I have all the templates I’ve created for user personas, a business canvas, and a design brief in Google Drive.
Jordan: I’m also a Google Apps user. I like their collaborative suite that allows a team to work on the same document at the same time.
Lisa: We use Google Drive for storing and sharing files and Google Docs for all the things that Docs does, including real-time, collaborative editing of documents. Currently, we are piloting their Wiki tool, Sites.
Stephen: Google Docs and Sheets are perfect for simple, collaborative editing. Something many of us do a lot.
Steven: The stuff that works well in spreadsheets is the most important to develop collaboratively—goals, objectives, content, taxonomies, information architecture, and more. I use Google Sheets or Excel in the cloud for this purpose.
InVision, Sketch, and UserTesting
Csaba: Even though it’s 2017, and it seems that there’s a cloud-based solution for everything, doing remote, collaborative UX design is still a challenge. In my experience, design tools—for wireframing, creating flows, or fleshing out visual concepts—are improving rapidly. You have to keep an eye on the upcoming tools. For example, InVision just launched InVision Studio in public beta, which will go live starting in January. It’s a screen design tool like Sketch, but fully integrated with InVision's prototyping features.
InVision plays a key role in my work. You can upload designs, easily create a prototype in seconds, show it to clients or your team, and do a usability test. It’s worth noting that InVision offers integration with the usability testing platforms UserTesting and lookback, which I very much appreciate. The easier it is to run a test, the more people will do usability testing of their products.
Another challenge for remote teams is finding a great way to provide feedback on designs. I use InVision to share my designs because it lets all team members and clients leave comments. Also, check out Freehand by InVision. With Freehand, you can draw and comment directly on designs. Since I hate endless email threads, it’s always easier to just sketch your ideas to show to the team.
Janet: I enjoy the ease with which I can turn my Sketch designs into InVision prototypes, then share them with others.
Sarah: I can recommend only tools that I use, so I have to say that InVision is the most useful tool for remote, collaborative UX design. I’m able to walk through the UX design process from start to finish. For example, I can use Freehand to brainstorm initial concepts and create flow diagrams to make sure we’re aligned. Once I’ve created higher-fidelity screens, I can bring them into InVision so we can see them in the context of a device and do prototyping, if necessary.
The commenting feature in InVision is crucial. Although it can get challenging when you have a lot of people—or people who like to leave every thought in their brain as comments—for example, 13 comments that just say, ‘love it.’ So, with commenting, you have to educate your client or customer about how to provide helpful feedback. I suggest reading my article “User Experience: Feedback & the Case for Context” for further discussion of this topic. You can also do usability testing within InVision because they recently partnered with the company UserTesting.
Preview for macOS
Csaba: I regularly have to provide feedback on wireframes and visual designs because I always work with a team and do a lot of training and mentoring. If I have to comment on a design, I use the built-in markup tool in Preview. I can add text and arrows and draw lines and basic shapes when providing feedback. It’s just super fast and completely free. Just open an image, click Markup, and there you go.
Csaba: I’m a fan of using Post-it notes, which is a bit difficult when working remotely. To replace Post-its, I use RealtimeBoard, which is a great online whiteboard that is designed for better team collaboration. You can map out a user journey using Post-its and get everybody on the same page.
Lisa:RealtimeBoard allows us to post mockups, copy, workflows, and ideas for team members to review and provide commentary and feedback. It integrates with Slack so whenever someone comments on any board, we get notified in Slack. I believe there are other similar tools out there, but I have not tried them.
Stephen: For something more visual, Mural, Cardsmit, and RealtimeBoard are all fantastic virtual whiteboards, each offering something slightly different.
Lisa: We use Slack for obvious reasons, but also because of how well it integrates with other tools.
Stephen: Slack is brilliant for facilitating water-cooler conversations, quickly sharing files, and so much more!
Csaba: Another tool I find useful for UX design is Trello. You can use it in many different ways. For example, I love using it to track the progress of a project or design when working with a team remotely. It’s an easy way to see what needs to be done, upload pictures, delegate tasks, and use labels to prioritize. I also use Trello to document the feedback from usability-test sessions. You can see all the feedback from participants, prioritize items, add comments, and involve the necessary people—including designers, stakeholders, and developers. Creating a backlog of development issues is also easy in Trello. If you have to provide feedback on an actual, working product, you’ll need a way to communicate with developers as well.
Stephen: Trello is so simple, yet expandable for so many purposes.
Web Conferencing Tools
Pabini: Screen sharing is the most important capability of an online collaboration tool. The best thing about using Web conferencing tools is that you can use them with whatever other tools you’re using on a project. This lets your team work the way you prefer to work—whether you’re working remotely or face to face. I’ve used a variety of Web conferencing tools, including WebEx, GoToMeeting, and Zoom. They all work well most of the time. Using a combination of phone and Web conferencing increases reliability.
Lisa: We’ve tried a number of video conferencing tools and haven’t found one that isn’t so glitchy that it grinds the productivity of a meeting to a halt and doesn’t cost more than a Tesla.
Janet: Skype is my go-to audio-communication and screen-sharing tool.
Steven: Sure, we also talk, but screen sharing is to me more effective than any shared drawing tool. You can use whatever tools you like for analysis or drawing and can just do all the sketching live in it, following the process you prefer.
Jordan: I’ve also been using an app called Wunderlist. It’s a simple to-do list that you can share between people on the same team. I really like the structure a to-do list brings to collaborative projects. It lets each team member know when other team members complete a task.
Stephen: In the project or resource space, there are plenty of tools, but few that stand out to me. That said, I’m keeping my eyes on ZenKit because it lets you pivot between several views of the same data—a rarity among most project-management tools.
Pabini recommends the following UXmatters articles on collaboration:
As you can see from the previous discussion, just as UX designers come from a variety of backgrounds, they like a variety of different tools that they use when designing user experiences. These tools represent a combination of tried-and-true methods and new paradigms that innovative tools present. In addition to addressing issues that are unique to remote collaboration, we’ve gotten a glimpse into the wide variety of tasks UX designers complete in the course of creating a UX design.
As Principal of Lone Star Interaction Design in Dallas, Texas, Dr. Janet M. Six helps companies design easier-to-use products within their financial, time, and technical constraints. For her research in information visualization, Janet was awarded the University of Texas at Dallas Jonsson School of Engineering Computer Science Dissertation of the Year Award. She was also awarded the prestigious IEEE Dallas Section 2003 Outstanding Young Engineer Award. Her work has appeared in the Journal of Graph Algorithms and Applications and the Kluwer International Series in Engineering and Computer Science. The proceedings of conferences on Graph Drawing, Information Visualization, and Algorithm Engineering and Experiments have also included the results of her research. Janet is the Managing Editor of UXmatters. Read More