Frame-it

How might horizontal teams better communicate amidst conflict during cross-functional collaboration?

ROLE: UX Designer & Researcher

SKILLS: User Research, UX/UI Design, User Flows, Prototyping, Video Editing.

DURATION: 1 Year

OVERVIEW

I was given two semester to design anything. I decided to research problems within team dynamics.


AUDIENCE

Cross-functional/Horizontal Teams

When horizontal teams become misaligned during cross-functional collaboration, it makes it harder to navigate conflict and detect root issues.

PROBLEM

A plugin called 'Frame-it,' designed to provide structure and clarity during conversations that arise from conflicts or misalignments between horizontal teams. This plugin helps facilitate more effective communication and resolution strategies within collaborative environments.

Frame-it structures a discussion into 3 stages - what, why, and how - for horizontal teams to express their thoughts, locate root issues, and become more aligned with one another.

There is a need to expand team communication strategies when establishing middle ground.

NEED

CREATIVE SOLUTION

RESEARCH

By asking participants - UX Researchers, Designers, Product Managers - to rank the frequency in which they collaborate with common design team positions (Product manager, developers, etc.) I openly learned about their challenges and successes when developing working relationships.


Positive team relationships often entail alignment and shared expectations through consistent collaboration.

Design

Research

Less positive team relationships involve more hierarchy and division, making it challenging to compromise and freely express.

Sales

Developer

[The Design team holds hold bi-monthly ideation workshops with other departments to inspire new ideas and spread important data; this improves alignments between various teams.]

Product Manager

Design Team

The product manager perceives design as ‘just making things look good’, misaligning with the design team’s goals and efforts.

To reduce this gap, the design team held weekly retrospective meetings with the PM to share important milestones and achievements, improving overall team dynamics.

How can teams better communicate amidst conflict during collaboration?

I quickly learned Concept 1 was most meaningful to participants because it focused on direct communication rather than cueing/signaling. It was unique from existing project management features.

CONCEPT IDEATION

Concept 1: Conflict Resolution Template:

An editable template that helps team members hold a structured conversation amidst a conflict or obstacle.

Concept 2: Input Marker

A timeline based feature that allows team members to input cues into their project timeline that signals an issue or need to discuss matters.

Concept 3: Color Coding

A visual cue that enables team members to visually signal progress and blockers via color.

Defining the architecture of a conflict scenario—exploring both the 'what' and 'why'—provides structure and stimulates questions that dive into the dimensions of the conflict.

For example, “What is the goal for this conversation?” or “What is most important for you to discuss today about [topic]?” - prompts the user to step back and think… what is MOST important for them to address.

The user could then be prompted with questions asking them to dig deeper and consider ‘why’ this is important to address?

[to yield specific responses]

[Probing questions]

[Probing questions]

[to yield specific responses]

DESIGN AND FLOW

Using Notion as an example of how this plugin works, my main guidance was to consider 1. flexibility (how can users go back and forth between responses?), 2. guidance (a facilitator should be present to monitor the flow of the conversation), and 3. privacy (user should be able to type everything they need before allowing the whole team to view).

I prioritized 5 touch points in my mockups:

  • Launching the plug in

  • Instructions - setting up users’ expectations

  • Adding collaborators

  • Writing out thoughts

  • Discuss and align

There are three stages that constitute Frame-it from beginning to end:

Setting up stage - the user invites relevant collaborators for a synchronous online meeting. A meeting facilitator is chosen to manage the flow of the conversation.

Framing stage - collaborators individually frame their thoughts by responding to three guiding questions.

Discussion stage - responses are published to the teams’ work doc to discuss responses, clarify misunderstandings, and establish new agreements.

REFLECTION

This was such a rewarding, year-long project that trained me to keep iterating and evolve my solution as I gained more user insights. This project also taught me so much about the great need for concept testing and I believe the direction of this project could turn out different had I collaborated with another designer.

I learned that even if teams understand the what, why, and how of a problem, the issue can still be about deciding on a solution. Hence, this design may not be a viable answer for teams. More iteration and testing is necessary.

If I could go back in time, I would have interviewed developers since they are a common role in design teams and I limited my conversations with only design practitioners. I would also have explored ways to usability test my idea and get a sense of how an actual team would work with this tool.