Family Chat Mobile App

A Family Archiving App

Family Chat is a platform for discussing and archiving family stories.

Role

Visual Design Research UX Design UI Design

Tools

Figma, Notion, Photoshop, Screen Studio, Jitter

Timeline

100 Hours

Can we build a tool to help reflect?

On a trip to Oaxaca I immersed in the celebration of the Day of the Dead. To my delight family members gathered to celebrate and remember their loved ones with singing music, eating, and drinking at grave sites.

It was a cultural ritual that, while new to me, resonated with many Asian cultures with which I am familiar, where family members venerate their ancestors through story telling.

In Thai culture, a book of remembrance is created for family members telling the story of their life complete with pictures and narrative (and recipes!).

Background

What if digital tools could also facilitate a culture of remembrance?

What if they could help facilitate a discussion?

What if they could aid in the creation of a family archive in the same spirit?

In discussing this issue with users, it became clear that it was something people wanted a tool for but were often too busy to complete.

Problem

Users need the tools to start difficult conversations; we need frameworks, inspiration, icebreakers, motivation, and nudges. When confronting these issues we are presented with some issues:

What questions do we ask?
How do we make this process easy, fun, and an enjoyable?
How do we overcome unspoken barriers within families?
When this is all done how do we present the information we gathered in a way that is accessible, organized, and future-proof?

Goals

The goal is to facilitate conversations and create an archive of family history given the opportunities that technology can now afford us we have the common tools (an audio recorder, a video camera, a camera, networked devices, a transcriber.

Based on user research and testing the goal of Family Chat is was to build for a broad and diverse audience. This happens by:

utilizing design patterns from chatrooms to ensure that older & younger users are able to adapt quickly

providing a way to progressively archive in a chatroom to have an 'ongoing' discussion

providing nudges, scheduling, and deadlines to maintain progress

overcoming cultural barriers by curating different types of prompts

building on prompts that are shown to be starting points for conversations such as pictures, audio, video, and locations

creating "quick record" tools for spontaneous archiving

utilizing design patterns from chatrooms to ensure that older & younger users are able to adapt quickly

providing a way to progressively archive in a chatroom to have an 'ongoing' discussion

providing nudges, scheduling, and deadlines to maintain progress

overcoming cultural barriers by curating different types of prompts

building on prompts that are shown to be starting points for conversations such as pictures, audio, video, and locations

creating "quick record" tools for spontaneous archiving

utilizing design patterns from chatrooms to ensure that older & younger users are able to adapt quickly

providing a way to progressively archive in a chatroom to have an 'ongoing' discussion

providing nudges, scheduling, and deadlines to maintain progress

overcoming cultural barriers by curating different types of prompts

building on prompts that are shown to be starting points for conversations such as pictures, audio, video, and locations

creating "quick record" tools for spontaneous archiving

Discover

The goal of this phase is to gather insights from potential users to inform the development. To do this we conducted user interviews, a survey, and competitive assessment.

User Interviews

We conducted in-depth interviews with a subset of 5 participants to gather qualitative insights and to explore their desires for family archiving, challenges faced, and expectations from a family archiving platform.

Surveys

We gathered qualitative insights. Explore their desires for family archiving, challenges faced, and expectations from a family archiving platform. Understand what aspirations users may have regarding a family archiving app.

Competitive Assessment

Examine strengths and weaknesses of competitors with the intention of improving or better meeting the user needs.

Discover

The goal of this phase is to gather insights from potential users to inform the development. To do this we conducted user interviews, a survey, and competitive assessment.

User Interviews

Surveys

Competitive Assessment

Examine strengths and weaknesses of competitors with the intention of improving or better meeting the user needs.

Read Further

We sent out surveys that got approximately 40 responses. In doing so, we hoped to determine how people use technology to archive family memories and communicate between generations. What are barriers and motivations? Could we design a tool that was easily understood for all generations that facilitated discussions. The results were as follows:

The older generation is less capable with technology generally but the gap is not wide. In general, they are most proficient in communication apps (texting, messaging, & social apps).
Prompts such as photographs, special occasions, and rituals help to become starting points for discussing important things.

Who is out there doing what we want to do already?

Read Further

Define

Now, armed with answers to our questions we synthesized the information. We understand common issues and identify the problemn to be explored. What aspects of this do we explore?

Define

Now, armed with answers to our questions we synthesized the information. We understand common issues and identify the problemn to be explored. What aspects of this do we explore?

Following interviews we used affinity mapping to find commonalities and organize information trends. What were common issues that multiple interviewees experienced?

What were you like?

Borrow Design Patterns

Swimming in Media

Prompts Help

Spontaneity Happens

Make it Easy

A Facilitator Would Help

Hard Conversations

Privacy is Important

Following interviews we used affinity mapping to find commonalities and organize information trends. What were common issues that multiple interviewees experienced?

What were you like?

A Facilitator Would Help

Spontaneity Happens

Swimming in Media

Privacy is Important

Prompts Help

Borrow Design Patterns

Hard Conversations

Make it Easy

Following interviews we used affinity mapping to find commonalities and organize information trends. What were common issues that multiple interviewees experienced?

What were you like?

Prompts Help

A Facilitator Would Help

Borrow Design Patterns

Spontaneity Happens

Hard Conversations

Swimming in Media

Make it Easy

Privacy is Important

After finding the trends, themes, and commonalities how do we use this information? We need to generate problems to answer through design:

POV

X observed the only time they discuss the past is during cultural rituals such as tea time or gathered around photo albums.

HMW

How might we initiate, encourage, & facilitate family storytelling to break the silence, encourage participation, and archive our story.

POV

X’s parents love their tablets and smartphones but are only really comfortable with messaging apps and photos apps.

HMW

How might we help X and their parents quickly understand and adapt to a new app?

POV

X is wary of putting important archival personal information into the cloud.

HMW

How might we help X feel like their information and stories are secure and private yet accessible to the right group of people?

POV

X is always in situations where her mother retells family stories when she is caught offguard.

HMW

How might we help X be ready to seamlessly capture these stories during times she is not situated and in a an archival mindset?

POV

X has feels overwhelmed by endless photos they have collected over the years and is daunted by the idea of editing.

HMW

How might we help X to select source material to find the most important poignant stories to the remember her parents?

After finding the trends, themes, and commonalities how do we use this information? We need to generate problems to answer through design:

POV

X observed the only time they discuss the past is during cultural rituals such as tea time or gathered around photo albums.

HMW

How might we initiate, encourage, & facilitate family storytelling to break the silence, encourage participation, and archive our story.

POV

X is always in situations where her mother retells family stories when she is caught offguard.

HMW

How might we help X be ready to seamlessly capture these stories during times she is not situated and in a an archival mindset?

POV

X’s parents love their tablets and smartphones but are only really comfortable with messaging apps and photos apps.

HMW

How might we help X and their parents quickly understand and adapt to a new app?

POV

X has feels overwhelmed by endless photos they have collected over the years and is daunted by the idea of editing.

HMW

How might we help X to select source material to find the most important poignant stories to the remember her parents?

POV

X is wary of putting important archival personal information into the cloud.

HMW

How might we help X feel like their information and stories are secure and private yet accessible to the right group of people?

Read Further

Armed with a number user issues we created archetypal user personas to embody our discoveries.

Develop

With the user personas in mind along with the problemitized questions in hand how might we decide to address these issues?

The initial idea is to capitalize on the familiar design patterns of chat and social apps to ease the use of older users. This chatroom could be a launching point for a family to discuss a prompt that they've created or one that they have chosen from a pre-existing prompts. It allows this generation of content and memories to happen as an ongoing activity and gives the 'feel' of chatroom, a familiar place where family discussions already happen in the digital space.
Some prompts could be inputed but also curated. Curated prompts would include other talking points experts may have generated, for example. Others could be more culturally specific to speak to different cultures or familiy personalities. For some being too forward is hard and this is a way to create a space for them.
Following the discussions a chat can be edited and AI-processed into an archival document for posterity to be shared between family members.

Develop

With the user personas in mind along with the problemitized questions in hand how might we decide to address these issues?

The initial idea is to capitalize on the familiar design patterns of chat and social apps to ease the use of older users. This chatroom could be a launching point for a family to discuss a prompt that they've created or one that they have chosen from a pre-existing prompts. It allows this generation of content and memories to happen as an ongoing activity and gives the 'feel' of chatroom, a familiar place where family discussions already happen in the digital space.
Some prompts could be inputed but also curated. Curated prompts would include other talking points experts may have generated, for example. Others could be more culturally specific to speak to different cultures or familiy personalities. For some being too forward is hard and this is a way to create a space for them.
Following the discussions a chat can be edited and AI-processed into an archival document for posterity to be shared between family members.

Following the initial wireframing we can refine the initial screens to include UI elements. Introducing more complexity opens up other questions that need to be addressed in the design and, in turn, those need to be designed.

How do we add and delete prompts?
How do we start to introduce visual elements that encourage progress?
How do we actually add family members to the group chat?
Can we chat in real time over video?

How do we add and delete prompts?
How do we start to introduce visual elements that encourage progress?
How do we actually add family members to the group chat?
Can we chat in real time over video?

Further refinement meant incorporating UI kit of parts into wireframes.

How do the brand colors incorporate into the UI?
Do buttons and pop ups overlap?
Does the user feel like something is happening when the chat is being processed?
If the goal is to capitalize on familiar design patterns do elements look like and appear where they are expected?

This phase served as a moment to remember what elements were omitted from the concept. Could we address the need to quickly record and jot prompts in the moment by a quick-record button on the screen?

Further refinement meant incorporating UI kit of parts into wireframes.

How do the brand colors incorporate into the UI?
Do buttons and pop ups overlap?
Does the user feel like something is happening when the chat is being processed?
If the goal is to capitalize on familiar design patterns do elements look like and appear where they are expected?

The goals of creating the brand was focused on the tone. This needs to be like a restaurant you'd all feel comfortable going to with older and younger family members.

Deliver

This phase of the design process involved deploying a prototype and challenging my design assumptions. Where were we wrong? Also, what did I fail to anticipate when this was deployed?

Deliver

This phase of the design process involved deploying a prototype and challenging my design assumptions. Where were we wrong? Also, what did I fail to anticipate when this was deployed?

With a prototype in hand participants were asked to complete 4 taskflows while being observed. Participants were asked to think outloud in realtime while performing the tasks and reflect on their expectations. The amount of time and points of failure were denoted.

Participants generally were able to find what they needed with notable exceptions: The video chat feature had a menu with buttons that were not discovered by anyone. Visual language was one of the issues that needed to be addressed; buttons and subheadings needed to be differentiated. Buttons that were missing for necessary actions such as setting a reminder were needed. Also, organization issues would be revised for prompts.

Other issues such as confusion over UX copy were implemented. Buttons that had just icons had copy added to eliminate confusion over navigation elements and functional buttons.

It was important in this phase to conceptualize the final document as well with the input of different users. The final chapters could incorporate AI-edited text and images that could be a hyperlinked life story. Distinguishing this visually was important. It needed to stand out in tone and prominence.

Other issues such as confusion over UX copy were implemented. Buttons that had just icons had copy added to eliminate confusion over navigation elements and functional buttons.

The culmination of this process is a product refined through posing the right questions to answer and testing the ideas even further.

To embed a Youtube video, add the URL to the properties panel.
To embed a Youtube video, add the URL to the properties panel.

While the goals are clear there is room for refinement. I would love to make the design even simpler with fewer steps; currently there is a "wide and shallow" feel to the app but we would prefer it to be narrow and deep (simple at outset with a deep set of features and abilities).

With time, we would also love to know how people use this app (also misuse it too!) to help us understand what the applied product actually is doing out in the wild.