FamDin: Solving your million dollar question.

9 min readMay 24, 2021

A UX Case Study on creating solutions for families like yours and mine.

“Mom, I’m hungry!!! What’s for dinner??!!”

A question asked a million times and usually the answer is met with frustration or a shrug or indifference. It happens. Such is life! We have all faced it.

Overview

Over the years, technology has revolutionized our lives and created tools and resources to improve our lives. But when it comes to collaboration, one group that seemingly lacks the utilization of these tools are families. Families face daily challenges, and one that we can all relate to on a daily basis can be summed up in one simple question — “What’s for dinner?” With a question so simple it is often met with a shrug, left unanswered, or even, becomes a point of contention within families?

Problem

Busy families face challenges when it comes to arriving at collective decisions, like assigning tasks, coordinating meals and communicating with each other in a way that every member gets heard.

Goal

Bridge the gap of communication and bring all members of the family on the same page.
Families should be able to share meal ideas and common goals on one platform.
Families should be able to make collective decisions.
Create a responsive website that solves the
problems of real users

Timeline

2 weeks

Summary

We set out to explore this problem space by defining our target audience as families who have busy work schedules that make communication and collaborative decision-making a challenge.
We conducted user interviews with our target audience to understand their current methods of communication and decision making within their families and their frustrations and pain points.
We then synthesized these findings and built our Persona and created their Journey Map to empathize and visualize their current ways of handling the problem.
We started ideating what features we wanted to build and prioritize in our MoSCoW Map.
We then went into our Design phase and generated ideas based on our persona and ways that we could help create solutions.
We designed Mid-Fidelity Wireframes for our Mobile web design to create and represent some of the key features and functionalities in our product that our users would find helpful in simplifying their problem.
With these wireframes, we conducted Usability Testing to assess if our proposed design was usable and if it created a happy path for our users.
We assimilated our feedback into task details and scorecards to better understand how our product could be improved.
We ideated and created our Hi-Fidelity prototype with the feedback received from our first round of usability testing.
We created a responsive desktop web design based on our mobile web design.
We conducted a second round of testing with the mobile prototype and we compared our results from both these testing to get a good understanding of how our product can be utilized and all the areas that could be improved.

“How might we provide families a space to share meal ideas and encourage family bonding and harmony through collective decision making?”

Process

Research

To ensure we had a broad range of interview participants, as well as qualify that our participants are part of our target audience, we performed Screener Surveys. These surveys filtered out 6 interviewees who would provide pertinent responses to our user interview questions to follow. From our user interviews we found a few key insights:

“Our family won’t come to a decision until we are all together in one place, usually in a group text.”

“Our schedules are very complex and we don’t always plan for our meals.”

“We’re all so busy that all we’ve done is text about our ideas without actually planning anything yet.”

We created our persona Sarah based on our research and synthesis.

Sarah would love to have more participation from her family in the matters of meal planning and sharing chores.
She would like to stay organized with weekly meal schedules.
And she wants her family to communicate with each other and that decisions should be fair and harmonious.

We created a Journey Map for Sarah to build empathy and to understand how Sarah is currently dealing with her problem area.

Revised Problem Statement

“How might we provide families a private space for sharing dinner and potluck ideas, while encouraging family bonding, and ultimately reaching harmony through collective decision-making?”

Planning

After arriving at our revised problem statement, we started ideating potential features we would want to include in our product to help Sarah and her family make meal planning and decision making all on one single platform. We created and conceptualized features that we thought Sarah would find useful into our MoSCoW map. We took our prioritized features and plotted them on a Feature Prioritization Matrix, with “essential” and “nice to have” on the Y Axis and “high effort” and “low effort” on the X Axis, focusing mainly on all of our “Must” features from our MoSCoW, and deciding which features were the most useful to Sarah as well as feasible given our time constraints.

Design

We took our top feature ideas in a Design Studio Session, where our team participated in rounds of low-fidelity sketches of our features and our Home Screen, and then we critiqued each team member’s sketch.

Running a design studio helped us better visualize the primary issues that users like Sarah would want resolved. By designing directly for a task that belonged to Sarah, we were able to generate ideas that were directly taken from our insights drawn from our research.

So how do we solve the million dollar question…

Our solution…

INTRODUCING

We started designing our product keeping Sarah in mind. We first created mid-fidelity wireframes based on the tasks that Sarah and users like her would normally complete.

Design Solutions

What is important: Users prefer simple note taking and sharing tools, without the hassle of sharing email and taking unnecessary steps.
Design Solution: View / Add family members to a family page by linking their profile (with email) to your board.

What is Important: Families currently use tools that create a barrier in collaboration efforts due to limitations and delays.
Design Solution: Notifications and reminders within website that can be viewed under the “Notifications” tab in primary navigation.

What is important: Families need more opportunities to connect with each other when coming to a collective decision on what’s for dinner.
Design Solution: Shared meal pages in grid-view with most recently edited lists, recipes, meal plans, voting.

Usability Testing

With the usability testing, we could better understand whether our proposed design is usable, and if the proposed design provides a successful happy path for its users. Created 3 tasks and scenarios based on our persona, Sarah. One round of testing with 6 participants.
Our goal was to record observations of our users as they navigated through our proposed layout. We wanted to assess if our layout was easy to navigate and if not, what changes would be required in our next round of ideation and iteration.

What we learnt from the testing was:

• We were able to gain insight into what our users found intuitive and what roadblocks they faced when navigating our site.

Conducting the test gave us an understanding where users naturally gravitate towards while completing a certain task.
Our users’ mental models were not completely aligned with what we had intended with our design decisions.

Task one: Check updates from family member and check to see if groceries have been bought.

Task two: Select four recipes from the saved recipe board and send them to your family for voting.

Task three: Select recipe of the day from the Weekly plan and browse through it and add groceries to the grocery list if needed.

With feedback from the usability testing in round one, we iterated our mobile web design layout, creating solutions to problems our users faced. We designed the product incorporating visual elements like color, typography, images, etc. and brought the prototype to a Hi-Fidelity Prototype.
Creating the prototype also helps our company’s investments, saving them money that they would invest into a product that may not be of service at all.
It addresses any issues the product has and how we can refine them.
Mobile-first ensures that you deliver the right User Experience (UX) to the right screen

Changes we made:

DESKTOP WEB DESIGN

We created a desktop view of our mobile web design, at the same fidelity.

Usability Testing Round Two

With our new design that we brought into a Hi-Fidelity prototype, we tested this with five users to get an understanding if the changes we made had impacted the way our users would use these features.

Conducting our second round of Usability Testing was helpful because it helped us compare the results.
It gave us an idea if our design features are working to solve the problem
We collected more data to analyze what is working and what is not.

Key Takeaways comparing our two rounds of Usability Testing Scores:

From our second round of usability testing, we learnt a few key details.
The time on task improved for Task One. As did the Success rate.
Although only 2 out of 5 participants had direct success.
There were no fails in Task One.
Task Two did not perform as well in Round two. The success rate dropped from 80% to 60%.
Time on task increased from 1:00 min to 1 min 67 sec.
Task Three did better than the previous round of Usability Testing.
It showed a success rate of 100% and all users who tested, were able to complete the task in an average time of 13.4 sec
So, while tasks fared better, some did not. We would have to rethink our design features and how to improve them.