Kindred | A Family App
PROBLEM
Finding a space for families to stay connected where every member feels respected, equal, and heard.
SOLUTION
Create a family focused app to connect with loved ones no matter where they are
Duration: 10 weeks, Winter 2021
Role: Software Engineer & Lead UI Designer
Client: Senior Project
Team Members: Ozi Anyanwu, Olivia Brown, Robert Heckerman, William Park, Autumn Warren
Tools: Figma, Swift, Xcode
FINAL DESIGN
Overview
Kindred was created as a fully functional mobile app for iOS. Kindred was designed using Figma, coded in Swift using Xcode, and our backend was supported by Firebase. I was the designer, used storyboards in Xcode for the final designs, and coded the backend for a few features. The app successfully created profiles and posts, then stored them using Firebase.
What makes our app unique is instead of focusing on generic posts, we categorize the posts into five categories. When creating a post the user can choose which category they want to classify the post as so other family members can easily sort through the posts.
Colors
We chose five core colors for our app. As described below, Kindred revolves around categories of conversation, so each color represents a specific category.
Red: General
Orange: Advice
Yellow: Celebration
Green: Funding
Blue: Event
Primary Screens
create an account
Before joining a family or creating one, the user can first create a new account with basic information such as name, email, a password, and a profile photo.
Click to take a closer look
Click to take a closer look
Create a family
When joining Kindred you can either join an existing family or create a new one! Creating a new one allows you to invite other family members to join your family and share posts.
join a family
If you receive an invite from a family member, you can join a family instead of create a new one! Create an account or login, then enter the family ID to join the family. The request must be accepted my the family group admin before the user can join.
Click to take a closer look
post an update
Post an update to everyone in your family!. There are five categories: celebration, advice, event, funding, and general. Choose whichever one fits best and share with the family!
Click to take a closer look
Click to take a closer look
browse posts
Look at other members' posts by either choosing a category or looking through all of them! All posts are sorted by the top navigation bar and and specified by the outline color.
Funding Posts
Posts in the funding category have the extra capability of allowing family members to requests pledges from other members. This is a promise of contribution to the cause the family member needs funding for. A user can post about a need then view the pledges from their family members or pledge to another member and then view all of their active pledges.
Click to take a closer look
Process
NEEDFINDING
For the first three weeks, we narrowed down our project scope to family by brainstorming and interviewing different families.
We created a set of questions to ask the families in order to answer questions we had about our idea before we created the prototype. We compiled the responses and created a prototype of the design to test on a new set of users.
Other Apps
We took into account what families said their needs were and sought to see if other apps existed that already satisfied these needs. We found one main app named Cocoon. What differentiated this app from a Facebook group or iMessage is the fact that this app allowed threads and replies and the ability to share additional details with the user's cocoon (location, fitness, activities, etc). Using this information we wanted to make sure that Kindred was not a replica of Cocoon, but instead allowed families to interact in a completely different way.
Evaluations
We had several different opportunities for feedback. Since this was during COVID-19, we were unable to do in person user testing. Instead we conducted testing among our own families and received online feedback from our peers and professors.
Every week we received evaluations on our work from our teaching assistant and professor. This was extremely valuable because gave our team the opportunity to reevaluate the work we had done before the app was finalized.
In addition to this, we were able to receive feedback on our app design from our peers near the end of the 10 weeks. We used screenshots to convey our most recent designs and asked:
• What actions would they take on a certain screen?
• Would they want to do more? If so, what would they want to do?
• Would they use this feature? Why or why not?
We also asked various questions about colors, font, and overall aesthetic of the app. We used this feedback to improve the design and usability of our app. With user testing we were able to add a settings screen, the ability to skip adding a profile photo, and error feedback (entering the wrong password, pressing the wrong button, etc).
Finalized Screens
Click to enlarge and scroll through
REFLECTION
We presented our final prototype at an exhibition for all of the senior projects. Since this was a fully functional app, each student was able to download our app on TestFlight, create an account, and join a family. This was my first full coding project where I created a mobile app from design through implementation. I had no knowledge of Swift and very little knowledge of Firebase so it was rewarding to see how my skills from other languages aided me in being able to code in a new one.
