June 4, 2021
HCI + UX Research

bridge

An AI-infused app design to meaningfully connect one specific couple in a long-distance relationship. As quarterly research fellows at UCLA's Human-Computer Interaction Lab, we designed AI-focused HCI for just one user, going deeper into their pain points.

June 4, 2021
HCI + UX Research

bridge

An AI-infused app design to meaningfully connect one specific couple in a long-distance relationship. As quarterly research fellows at UCLA's Human-Computer Interaction Lab, we designed AI-focused HCI for just one user, going deeper into their pain points.

Team Size
2 people
Role
ux researcher & designer
Tools

figma

balsamiq

notion

pen & paper

Over the spring of 2021, I joined a quarterly research program at the UCLA Human-Computer Interaction Lab under Dr. Xiang (Anthony) Chen. The program revolved around an experimental approach to designing for HCI, particularly AI-infused systems, called AI41. This approach contrasts traditional HCI research where we intend on designing systems for a cross sectional group of users. As a result, any investigation tends to be centered around trends/patterns and therefore is quite limited in its ability to go in-depth to any one user's context. The AI41 approach is an experimental exercise that challenges the traditional approach—go into depth in one user's context.

At the outset of the quarter, we began by defining certain problems that we could prospectively tackle through this project. I got an email after having publicized my ideas about interest in exploring them, and I found a project partner in the talented, dynamic Emily Chee, another research fellow with a focus on UX research. Thus, we got to work.

 

Background

Picking Our User

Emily and I launched off the idea to conduct a research inquiry on long-distance relationships. We spent our first conversations bonding over discussions about the nature of love separated by distance and time-zones, trading stories of our close friends' struggles with feeling connected during long-distance (as well as my own) and discussing prospective users to focus on around us. Based on this, we chose our user to be Emily's friend Penny.

Penny, a third-year college student, found her significant other in her friend Chenry during her first year at UCLA. However, since COVID-19, Penny moved back to her home country, Thailand, and her boyfriend moved back to North Carolina. Unfortunately, this caused a huge strain on her relationship and she struggled to communicate effectively with her partner due to the time difference. This is not the first time they've been in long distance. In fact, when they just started dating, they went long distance for one summer (~2 months) and one winter break (~2 weeks). They did not plan on closing this gap anytime soon as while Penny was possibly returning to Los Angeles in the coming summer, plans to visit her boyfriend in North Carolina had not been made.

Our aim was to design an app that will help with this problem by helping her stay connected in a more meaningful, unified way with her S.O. (e.g. using AI to determine coinciding stages in daily patterns so one can feel more connected if they're doing something similar (e.g. one person eats breakfast while the other eats dinner)).

Research

Formative Study

The first step of the AI41 approach called firstly for a formative study to understand Penny's needs better. How could AI serve her in the context of her relationship? How would we articulate the specific pain points in her interactions with her boyfriend over a distance?

At this point, we felt that a thorough semi-structured interview would give our inquiry a balance of richness/depth and focus. It provided us with some structure to fall back on so that we could be economical with Penny's time and attention, but simultaneously still allowed for us to create a comfortable and free interview environment, where tangential ideas could spring up for us to explore together.

We brainstormed certain lines of questioning to explore with Penny, and at the same time established risks to be aware of (such as dredging up dirty laundry!).

Our general strategy was to start with general questions to establish comfort and set the stage (introductions, understanding the story of the relationship) before asking more granular questions about her experiences and the issues she struggled with alongside Chenry (like their separation over COVID). We got an audio recording as well for us to be able to assemble notes from.

To supplement this, Penny graciously gave us access to her 24-hour schedule, which helped us put what we uncovered in the interview into the context of a daily pattern.

User Journey

Uncovering Pain Points

We consolidated all of the resources and context we'd accrued into a user journey map, which let us take specific stages of Penny's day and analyze them a bit more granularly to expose certain patterns.

We noticed that her current approaches to maintaining the health of their relationship revolved around a combination of:

  1. synchronous communication in the morning or night (their only times of overlap where they're both awake), and
  2. asynchronous signals that they're thinking about each other (e.g. memes sent when their partner is asleep).

This was far from a perfect process, though. We extrapolated the journey into a set of core pain points:

  • Time zone differences resulting in both Penny and Chenry feeling tired when they talked & appearing unenthusiastic at times,
  • Difficulty in communication, especially with receiving words of affirmation,
  • Spending quality time together is harder in the limited time they have, since they don't have a lot of couple activities

 

Prototyping

Ideation & User Flows 

Our goal here was to synthesize some new feature ideas to address the pain points we had identified. We especially wanted to focus on how to integrate AI into our interface to help Penny – our ideas revolved about using subtle usage feedback (such as sleep and wake cycles, optimizing for particular love languages & preferred activities of each user) to provide personalized nudges to Penny and her boyfriend. As always, this documentation happened on Notion.

A conception that held us was the metaphor of meeting on a bridge—this idea of connecting two distant lands, and the romance of this intermediary space that they could share with each other before being pulled back into their own lives. The bridge even inspired the project name, and it became the home-base for all of our interface. All of its features are centered around and can be accessed from this bridge representation.

We fleshed these ideas out by outlining 3 usage flows for different usage contexts: one for opening the app for the first time (onboarding), one for one person being awake (with one person on the bridge) and one for both people being awake (with both people on the bridge). The artificially-intelligent aspect of the app plays a large role during onboarding, particularly with how it would handle user data. We were conscious of AI's contentious history with data privacy, so at every point that this interface needed user data we make sure the user can actively opt in or out – an opportunity to give them more ownership in the AI-user relationship.

Prototyping

Lo-fi passes

We started with paper and pencil sketches for an immediate visualization of our ideas.

Next came lo-fi prototyping with Balsamiq to convert the ideas to a more readable and testable format, including an onboarding & personalization flow, schedule sending messages/nudges to each other, and exploring suggested activities and conversation prompts.

Our lo-fi build of the onboarding flow...

... and of the main interface, with both solo use and couple use scenarios!

At this juncture, we took the opportunity to solicit feedback directly from Penny in a testing/review session, giving her an opportunity to "co-design" with us. She gave us plenty of affirmative signals indicating that we were on the right track, but she supplemented that with highlighting points of clarification and improvement—one example was in indicating her confusion about how timezones operated when schedule sending texts.

Prototyping

High-fidelity

We then spent the last weeks of this project designing the interface in high fidelity and linking it together as a holistic MVP prototype. This process took multiple iterations over the last few weeks of the project - our goal was to get it to a testable state so that the overall concept could be represented effectively.

For our visual language in this design, we chose to go with a retro game-inspired bit-crushed aesthetic. In a check-in session with Penny, we had gotten feedback that an overly clean, sanitized design may feel inappropriate as it risks feeling cold and impersonal, like a utilitarian tool - we wanted to promote Bridge as a space of warmth for their romantic relationship, so the aesthetic choice would leverage a sense of nostalgia to help establish that personable feeling. After all, the point of AI41 is to tailor it to one user.

Outcomes

Testing, Feedback & Takeaways

We tested our final design in order to validate the success of our design with Penny, our central user through unstructured exploration of Figma prototype as she thought aloud in tandem. The feedback from her was positive, with notes like "I would feel really comfortable using this" and "I love the gamey aesthetic". We also demo-ed it in a final presentation meeting to our cohort and our faculty research supervisor.

Working on this project taught me a lot about design collaboration, thanks to my partner Emily. Many of my projects up to this point had relied on me being the only design voice in the team, which affords me autonomy but can feel isolating. But here, I was able to engage in conversations with a design partner – someone to share in the process with as a peer and equal, so we could openly communicate about ideas as friends. Emily showed me a new perspective with strengths different to mine, so it gave me someone I could really learn from, particularly around user research and documentation. Balancing this work with school and pacing ourselves on a timeline gave me more skills with time management, and Emily taught me to be more organized and deliberate with how I worked.

This research program was overall so valuable because it gave me an interesting new paradigm to consider, where I could focus on only one user and really delve deep into their life and needs. The reason I love design in the first place is how it centers the skill of empathy in every stage of the process. AI41, by orienting me to think about one person, taught me what a more meaningful effort to empathize can look like.

more projects

language ai for uber

View Project

yourspace

View Project

data storytelling

View Project

half-asleep

View Project