Designer | Software Developer
interface_portfolio_icon.png

Collaboration Coach

 

Collaboration Coach (CoCo)

CoCo is a research project that aims to improve team communication. (Published in IMWUT)

 
 

Role
UI/UX Designer
Data Visualization
Usability Testing

Tools
InVision
Adobe Illustrator
Excel

Year
Fall 2016
1 year

Team
Ru Zhao
Samiha Samrose
Jeff White
Luis Nova

 
Prototype of a conversation between CoCo’s team communication coach and a user. Analytics from a user’s virtual meeting are described in chat and shown as visualizations on the right most panel

Prototype of a conversation between CoCo’s team communication coach and a user. Analytics from a user’s virtual meeting are described in chat and shown as visualizations on the right most panel

 
 

The Team

I worked in a team of 6 under the direction of Dr. Ehsan Hoque at the HCI lab at the University of Rochester. I started working on this project in May 2016 as a UX designer and programmer where I've done: interaction design, visual design, and web development. 

Defining the Why

There’s A LOT going on in virtual team meetings. Multiple facial expressions to read, people jumping in and out of conversation, and various topics to follow. As a result, it’s hard to get a pulse on how the team is communicating and working together. If a team isn’t communicating well how do they know? How can they improve?

MISSION: Help teams (who?) improve collaboration (what?) so they can efficiently meet their outcomes (why?)

 
 

Understanding the Domain

Ok, we have our mission but what does good collaboration look like? What kind of feedback or insights help people improve their communication?

To give feedback on social dynamics we dug into academic literature and found that the following key factors indicate a positive conversational dynamic:

  1. Equal Participation

  2. Frequent Turn-taking

  3. Active Engagement

  4. Positive Mood

Designing Data Visualizations

Before we could create our feedback page, we had to:

  1. Figure out what data to draw from the video conference

  2. Develop meaningful visual representations for this data

 

 
affectiva_praat
graphics_sketch_small.png

Sketching Designs

I began by drawing concept designs on paper, which helped me work rapidly and consider more ideas. I evaluated promising designs with potential users and looked for feedback on ease of comprehension and usefulness of information. This lead to several feedback cycles and redesigned visuals.

 

Understanding the Data

Based on our research and technological limitations, we decided to extract data on participation, turn-taking, overlaps, positive or negative facial expressions, and shared smiles. With this data, we were challenged with determining what should be public to all participants or private to the individual. Should users know the name of the person who talked the most or was the least engaged?

 

Prototypes & Iterating

Giving feedback was the most crucial point of our application so it was important to know HOW to give feedback. By researching academic literature and referencing other coaching applications we found that good feedback was:

  1. Presented in small chunks

  2. Used positive reinforcement

  3. Focused on explaining the why of the feedback

Following these feedback principles, I settled on a design that used a conversational chat bot to distill information and advice.

Iterative Design

I went through 3 major iterations. With each design, I started off with a single static page, received feedback from my team, and then created an interactive prototype.  Each of these interactive prototype were tested with a 5-10 users and evaluated based on:

  1. Usability

  2. Dialogue and learning engagement

  3. Visual Design

Through testing, I discovered the following issues and made changes appropriately

  1. First Iteration - too much information on one page with no interpretation on what to do with the info and difficulty looking at previous messages

  2. Second Iteration - chat bot responded too quickly, users didn’t feel like the information was personal. People also didn’t want to scroll back up to find the visualizations

Final Product

Having gone through and finalized the interface and interaction design, the team and I worked on programming the system. Below is an early implementation of the design. 

 
 

Testing with Users

Method

We tested CoCo with 39 people in 10 different teams where they participated in two group discussions to solve a problem. At the end of each discussion, we had participants take a survey that asked questions related to 1) how they felt the discussion went and 2) how they felt about the interface. We then compared the survey results and the collected data between the two sessions.

Results

  1. Users reported that they were more aware of their own conversational skills as well as the group’s overall dynamic.

  2. Users felt like most of the graphics and directives were easy to understand and accurate, especially the participation and turn-taking. The lowest rated graphs were attitude and shared smiles due to issues with our algorithm’s accuracy

  3. Our data did not show consistent changes between sessions. We attribute this to limitations in our testing and in the future would like to run this with teams at work and collect data over numerous meetings

Percentages represent amount of time individuals (A, B, C, D) spoke in each session

Percentages represent amount of time individuals (A, B, C, D) spoke in each session

A full paper on CoCo was published in the IMWUT Journal in 2017, read the full paper for more details.

Lessons For my Next Project

For my first end-to-end design project, I can confidently say I made mistakes every step of the way — but I also learned a lot. I learned to:

  • Share Designs Frequently - I’d spend too much time fleshing out a design only to present it to the team and learn we had technical limitations that wouldn’t make it feasible.

  • MVP MVP MVP - We kept pushing back our launch because we wanted to fit in more features. Focusing on barebones and then filling it in would have given engineers a clearer direction and a chance for us to test our product earlier.

  • Be My Own Advocate - I shouldn’t be afraid to take a stance. Everyone has an opinion when it comes to design but I know why I made the decisions I did and should advocate for them.