Team Diana Wi
My Role Product Designer
Platform Mobile Application, Android
Software / Tools Illustrator, XD, After Effects, Paper Prototyping
Year 2018
Duration 4 weeks
down-arrow

Background

What is Hearth?

Hearth is a mobile app that brings simplicity and convenience to party planning and cooking for party host. It offers unique features that allows party hosts to set course meal, meet their guests' picky diet, and easily manage recipe ingredients for large party size. In addition, guests can participate and vote on their favorite food from the menu. This adds extra fun to party planning and party hosts will less worry on figuring out what to cook.

The night that sparked an idea.

It was on a saturday evening. I was invited to my friend's place for homemade dinner. During the dinner, I was eating with barely talking and when I was done, I kindly asked for seconds. She saw that I was enjoying eating the food she cooked and it made her happy. She told me that she loves having people over and seeing them enjoying her cooking. Also, she commented that she missed having people over at her place. I asked her why she stopped having people over and she said she was busy and too tired to plan a party after a hardworking day. This interaction triggered the idea of an app that will bridge the gaps between party planning and cooking.

Setting the project goal.

To design a mobile application in 4 weeks using the human-centered design thinking process in three phases: Discovery, Design, and Delivery.


Discovery

First, researching to understand the market.

I began my research by interviewing with 5 people in their mid 20s to understand their lifestyle and their psychographics. Based on the interview results, I learned that people are:

  • Too tired after work to think about planning a party.
  • Picky with their food and only eat what they like.
  • Forget to respond to party invites or even tell others about their food allergies.
  • Use Facebook app or messaging services to invite people to the party.

Studying the competitors at the app stores.

To futher understand the market, I selected the competitors of Hearth and analyzing their message boards from Apple App Store and Google Play Store where I learnd that people want:

  • A good organization of recipes from used and unused.
  • A different login instead of relying on social media account.
  • A reliable service because apps keep crash and are not stable.

Analyzing the research data.

From my research, I discovered that people are selective with what they want and do, especially with their time. This results in low prioritization on time spent with friends and indecisiveness which bring the issues of lack of social interaction and timely responsiveness, respectively. In addition, people want simplicity, convenience, flexibility while maintaining an organized structure.

Defining the problems.

The app is designed based on the needs of people:

  • Easily plan and manage a party and party details.
  • Provide food that friends will like to eat.
  • Receive timely responses from friends.

Design

Narrating user personas for design alignment.

Based on the research data collected during the discovery, I created user personas which helped in aligning the design to user needs.

hearth-persona-1 hearth-persona-2

Understanding the user's thought-process.

Due to the complexity of the project, I drew a mind mapping to illustrate how users will interact with the product within and outside of the app.

hearth-mindmap

Minimum Viable Product (MVP) features

Social Connection Easily find out what your friends like and don't like to eat, and their food allergies.
Party Planner Party hosts can create a party event, invite friends and create a menu that will be served at the party.
Recipes To cook a great meal calls for a great recipe and anyone can find quality recipes that they can use to confidently cook.
Grocery List Creating a grocery list helps with remembering which ingredients to buy at a grocery store.
Notification If party guests forgets to respond to the party, the app will send a reminder asking to update their attendance.

Information Architecture

Sketching ideas on paper.

hearth-initial-sketches

High fidelity wireframes.

After the initial concept sketching, I moved on to creating high fidelity wireframes based on the 2 personas user flow.


Delivery

User testing and design iterations.

Assuming that the first design will work is asking for failure, so I conducted user testing using the user flows to check the app usability. After the user testing, I received several feedback which I used to update and improve the design.

Visual Identity.

Moodboard
hearth-moodboard
Color
hearth-color-palette
Typography
hearth-typography
Typography Scale
hearth-typography-scale

Final Design

hearth-final-design

Prototype Video

(0:00-1:06) Create a new party and invite friends.

Thank you for taking your time to view my project~ ;)