2020-2021
UI/UX Design, Brand Identity
UX/UI Designer
Eastina Zhang, Jenny Li, Rai Medeiros, David Hernandez
Keepsake is a mobile application that allows users to thoughtful collect and curate family stories and keep the memories of their family members alive. We created Keepsake for family historians, those who are actively seeking out and gathering stories about their family members.
Historian types are consistently gathering information and artifacts but have no way to easily gather them in one place and display them in a thoughtful manner. They often feel overwhelmed with the amount of content to curate and can't find digital scrapbooking tools that feel easy to use and are family story centered.
Keepsake creates a centralized place for users to put their content and provides them with different ways to curate that content. Product features including adding family profiles that can be attached to stories, a timeline story view, digital story-building, and question inspiration cards.
UX research, UI design, Brand Identity
Individual contributions: wireframing and prototyping the onboarding, profile creation, and story creation sections of the application.
Initial research focused on better understanding user’s needs related to family story collection and their existing process or workarounds for different situations.
How do people currently gather and record stories?
What existing products exist to help users collect stories?
What are users current pain points with existing products?
Which functions/features are essential to the story collection process?
A series of in-depth interviews were conducted on 14 users to further identify pain points, frustrations, needs, and desires with existing products to determine how Keepsake could improve the family story gathering experience.
Users often feel overwhelmed with the amount of content they have to curate
Tools products in the market lack desirable features and feel impersonal
Users don't know how to organize the information that they have
Users have no centralized location to put all the information they are gathering
Users value the ability to have creative freedom in their story curation process
Users sometimes struggled with how to bring up certain topics and questions
After conducting user interviews, all the participants responses were synthesized to identity themes, opportunities, and features that Keepsake could focus and improve upon.
We conducted affinity mapping to identify high level themes and group similar insights gained from the user interviews.
Something unexpected we found during this stage was an hesitancy to approach and bring up certain topics with family members. While our users were all eager to connect with their family members and collect family stories, family relationships could be complicated and this could cause hesitancy to ask certain questions.
To kick-off the design process, we started with building out a user flow and then sketched out initial screen designs. A low fidelity prototype was then created for initial user testing.
The primary user flow is the process of signing up, adding family profiles, creating a story, and viewing stories on a timeline.
Rough sketches were done to get my initial thoughts on paper and brainstorm new ideas for specific UI elements.
Using the feedback and insights gained from research, analysis and sketching, a low-fidelity prototype was created to begin user testing.
User testing was conducted to determine where improvements could be made and identify new ideas to satisfy user expectations, needs, and desires.
During the family member profile creation stage, users felt that often they might know the age that their family member was when a story happened, but they wouldn't be sure of the specific year.
But we heard the onboarding process was too long and caused a high barrier of entry, especially if users didn't have content or family member info on hand.
On the timeline page, all family posts were featured on one timeline. Users felt it was an overwhelming amount of content and worried about not being able to find certain stories that they would want to look back on.
I designed a UI that allows users, after they attach a profile to a story, to either input dates or family member ages to then calculate and show the other.
We drastically cut down our onboarding flow including removing intro explanation screens, and only asking users for personal details before putting them into the timeline page. Because the timeline is empty before users enter any content, I also included small guidance notes on areas of the app they can explore.
We decided to create different timeline views including a zoom out mode to show a minimized overview of all stories. We also allowed filtering by family member in case users want to see all the stories that a particular person is in.
In discussing what Keepsake's branding should be our team aligned on the following characteristics for the app: Meaningful, Personal, Warm, and Treasured.
We decided to go with a primary color dark green to evoke a sense of both growth and security. For our highlight colors we went with warmer tones of red and yellow which aligned with some of the feelings we wanted people to have when using Keepsake.
We used this branding throughout our social pages as well as our pre-launch site.
Keepsake makes the process of collecting family stories and curating them straightforward and engaging. It provides users with a place to put all of their artifacts into and the option to add in various pieces and types of information to capture their family memories in a meaningful way.
Introduction screens contain messages that are simple and direct.
Easily input family member information and connect them with the stories you build.
Record story dates and details, and add photos, audio, or text content. Drag and drop cards to better customize and curate your family story.
Choose how you want to view your family history. On the story timeline, view all of your family's stories or filter by individual family members. See a minimized overview of your family's history or view stories close up with dates and names instead.
Get inspiration on topics to ask your family about. Visit the question bank for different topics and questions to help you get the conversation started
Integrates all needs into one streamlined experience
Gives users way to customize their story curation experience
Supports family bonding and connection