Using Web Software for Collaborative Work on Virtual UX Teams

By Jonathan Follett

Published: April 27, 2009

“Increasingly, virtual teamwork means UX professionals must get things done in an environment devoid of the physical presence of colleagues and lacking the relative ease of on-site collaboration.”

As a UX professional, whether you work for yourself, a small shop, or a large company, the chances are increasing that you’ll need to collaborate on a regular basis with a colleague or stakeholder at a distance. In addition to the cost-saving benefits of using distributed teams—especially during these difficult economic times—the availability of broadband and wireless Web connections is making virtual teamwork and collaboration both more desirable and more common. Employing virtual workers, be they freelance or full time, can save companies money on office space and the overhead that comes with it—including furniture, equipment, services, and utilities. And for the virtual worker, there is often no commute—or perhaps just a minimal one to a co-working space—resulting in savings from reduced consumption of gas and car maintenance or use of public transportation.

Increasingly, virtual teamwork means UX professionals must get things done in an environment devoid of the physical presence of colleagues and lacking the relative ease of on-site collaboration. Effectively completing UX tasks while at a distance from our clients, stakeholders, and team members can be challenging, from both technical and process perspectives. How can we, as UX professionals, enable the close collaboration with others we need and manage the process of creating engaging digital experiences when we’re so far apart from each other physically?

Detriments of Virtual Work

“For UX design professionals, receiving feedback from colleagues, the back-and-forth of discussions, critiques, and in-person brainstorming sessions are some of the great benefits of working together on a co-located team.”

For UX design professionals, receiving feedback from colleagues, the back-and-forth of discussions, critiques, and in-person brainstorming sessions are some of the great benefits of working together on a co-located team. Additionally, our body language—the physical cues we give one another—are a critical part of the experience of working face to face. Once UX teams become distributed, all of these modes of communication are severely curtailed. We may feel cut loose, adrift in cyberspace, with significantly less engaging means of interaction—email, phone, and instant messaging—tethering us to the team.

If you’re used to working with a team on site, at a central office location, porting your processes to an online environment can have its challenges. While you can complete the work you do on your own in much the same way you always have, team coordination, communication, and especially creative review become entirely different in virtual space.

Cloud-Based Applications for User Experience Professionals

“There are now, fortunately, applications that can make communication and intense collaborative work much easier.”

For the designers, developers, project managers, and others who work on geographically dispersed UX teams, the Web-based tools and methods for accomplishing our work seem like they’re evolving as quickly as the work itself. We have a growing number of software options. The increasing popularity of distributed teams has made the collaboration space a competitive one for new, cloud-based applications. And while we might once have gone through an arduous process of exchanging and tracking our deliverables via email, there are now, fortunately, applications that can make communication and intense collaborative work much easier.

It’s worth noting that there is no one software tool that can provide all of the functionality necessary to address every problem of a complex UX design workflow—either in the cloud or on the desktop. However, in aggregate, a number of cloud-based applications at least make collaborating online with a distributed UX team a viable possibility. For those of us who are involved in creating the user experiences of Web sites and Web-distributed software, the experience of eating our own dog food, by using Web-based applications in our own workflows, can be instructive.

Working from our home offices, hotel business lounges, shared office spaces, co-working co-operatives, client conference rooms, and even coffee shops, we can communicate and collaborate using Web applications and services. Some of the applications commonly in use by virtual teams include the following:

  • Skype—for free, worldwide communications, using voice-over-IP and instant messaging
  • Basecamp—for milestones, threaded messaging, file sharing, and general project coordination
  • Gmail Chat—for private instant messaging
  • Campfire—for a real-time chat with your team

UX Collaboration Tools

“There are a number of cloud-based applications we can incorporate into our workflows.”

Of course, the work of user experience involves a unique set of complex tasks, requiring specialized software that goes beyond the capabilities of the communications tools I’ve just mentioned. Our tasks might range from user interviews and usability testing to information architecture, interaction design, and visual design. For these tasks, there are a number of cloud-based applications we can incorporate into our workflows. Most if them are still in their infancy, but produce some compelling results—in particular, the following tools:

  • MindMeister—for mind mapping
  • Lovely Charts—for screen-flow documents and simple wireframes
  • Glance—for screen sharing

MindMeister

“Mind mapping can be helpful for organizing your thoughts, outlining projects, brainstorming, preliminary site mapping, and other information architecture tasks.”

While perhaps not a typical technique for UX design, mind mapping can be helpful for organizing your thoughts, outlining projects, brainstorming, preliminary site mapping, and other information architecture tasks.

MindMeister, shown in Figure 1, is a surprisingly easy-to-use online tool for collaboratively generating and editing mind maps with a virtual team.

Figure 1—MindMeister, a cloud-based, mind-mapping application

MindMeister

Perhaps the most compelling feature of MindMeister is your ability to see live changes from your collaborators in real time, as they happen. Color-coded indicators help each user to distinguish which colleague is changing what aspects of the diagram. Unlike some other Web applications, which allow multiple editors, but do not show changes instantly, the MindMeister user interface immediately displays the actions of your document’s co-editors. When someone creates a node or moves a branch, the interactions appear on screen for all users. Figure 2 shows an example of a mind map I created using MindMeister.

Figure 2—The mind map for this UXmatters column

Mind map
“MindMeister can be an effective tool for brainstorming sessions with stakeholders, visually depicting issues user interviews have revealed, or envisioning high-level Web site information architectures.”

In combination with a teleconference on your phone or Skype, MindMeister can be an effective tool for brainstorming sessions with stakeholders, visually depicting issues user interviews have revealed, or envisioning high-level Web site information architectures.

MindMeister also lets you revert to previous document states, as shown in Figure 3. So, if you don’t like a change you or a colleague has made to the mind map, you can always go back to the version you prefer.

Figure 3—Reverting to a previous state

Reverting

The powerful export feature in MindMeister lets you create PDF, PNG, or RTF documents for use in proposals, reports, presentations, and design documentation, as Figure 4 shows. The free version of MindMeister generously lets you create up to six mind maps. There are several different pricing models for the full version of MindMeister: Premium ($4/month), Business ($6/month), and Academic ($15/year). And, if you don’t always have online access, MindMeister also offers an offline version of the software.

Figure 4—Exporting a mind map to PDF document

Exporting

Lovely Charts

“Lovely Charts…lets information architects and visual designers create several types of visual documents….”

Lovely Charts, shown in Figure 5, lets information architects and visual designers create several types of visual documents, including site maps, screen flowcharts, and wireframes.

Figure 5—Lovely Charts

Lovely Charts

Among Lovely Charts notable features is its library of simple customizable symbols. These include basic wireframe stencils—page and user interface elements—as well as various icons—representing people, servers, databases, and other computers—for creating network and organizational charts. Figure 6 shows a wireframe in Lovely Charts.

Figure 6—Drawing a wireframe in Lovely Charts

Drawing in Lovely Charts

The application’s basic drawing toolset lets you change symbol fill and stroke colors, create type and lines, align objects vertically and horizontally, resize, pan, and zoom. Its grid background is helpful for positioning symbols on a page.

The free version of Lovely Charts lets you create and save one chart and export to JPG and PNG. The premium version also exports to PDF. Figure 7 shows an example site map from Lovely Charts.

Figure 7—A site map created with Lovely Charts

Site map in Lovely Charts

If you’re an information architect who is used to the flexibility of software packages like Visio or OmniGraffle Professional, Lovely Charts might feel somewhat constricting. Its feature set is nowhere near as robust as those of its desktop rivals. As might be expected, there are fewer drawing tools, no master pages, and a limited number of pre-built stencils for creating your graphics. However, what Lovely Charts lacks in depth of features, it makes up for in anytime, anywhere online availability that lets you share your documents with colleagues. If you need to collaborate on an information architecture deliverable with a long-distance team member, Lovely Charts is worth a look.

Glance

“Screen-sharing software provides some of the most versatile tools for online collaboration and plays an especially important role for UX teams.”

Screen-sharing software provides some of the most versatile tools for online collaboration and plays an especially important role for UX teams. The software lets multiple viewers see what you’re seeing on your computer, in real time, and helps immensely in synchronizing discussions around topics that have a heavy visual component—for instance, when conducting creative reviews of user interface screen drawings. Screen sharing can also be helpful for walkthroughs of prototypes, visual design presentations, and usability testing.

Glance is screen-sharing client software that competes with more well-known offerings like WebEx and GotoMeeting.

Figure 8—The easy-to-use Glance user interface

Glance
“Glance lets you share mouse and keyboard control with participants, and view and control their screens remotely, which can be extremely valuable for long-distance user interviews or usability tests.”

Glance is simple to use, starts up quickly—the company claims Glance starts up nearly 3 times faster than its competitors—and allows screen sharing with up to 100 people simultaneously. Once you install the Glance client software, it’s just a matter of initiating a session and directing participants to an online meeting address, where participants can see your screen using a standard browser. Glance provides participants with a 4-digit session code, protecting your screencasts from public view. Glance lets you share mouse and keyboard control with participants, and view and control their screens remotely, which can be extremely valuable for long-distance user interviews or usability tests.

In combination with phone or Skype conferencing, screencasting—and Glance in particular—can be a powerful communications tool.

Refining Virtual Teamwork Processes

“We’re still discovering ways of working virtually, but as more cloud-based collaboration software becomes available, we will be able to refine and improve upon our virtual UX team processes.”

One element of running a successful virtual UX team—and working effectively on the Web in general—is realizing that such work requires different processes and communication techniques from those we rely upon when we’re working on site. As yet, there is no secret sauce for optimizing virtual UX team workflows. About the only thing you can be sure of is that you’ll have to learn something new every day—whether it be a new Web application, technique, process, or method of communication. We’re still discovering ways of working virtually, but as more cloud-based collaboration software becomes available, we will be able to refine and improve upon our virtual UX team processes.

Join the Discussion

Asterisks (*) indicate required information.