HOTBOX

Designing a Smart Meal Planner App for Urban Households

UX RESEARCHUSER STUDYPRODUCT DESIGN

OVERVIEW

Challenge

How could we assist households in organising and planning their meals, thus making the act of cooking easier

Outcome

We conducted UX research by conducting contextual interviews, affinity mapping, creating personas and scenarios to design a mobile app to assist with meal planning.

My Role

Headed a team of 5 and conducted on-site user interviews and developed the solutions from the insights. Handled the UI design in the later stages.

PRODUCT

A need for better diet habits

Sensitivity towards food, nutritional requirements of a person is greatly decreasing day by day. Data released by WHO suggests that over the past 33 years, worldwide overweight and obesity rates among adults have increased by 27.5%, while such rates among children have increased by 47.1%. We aimed to explore the possibilities to contribute to the betterment of sensitivity towards food, nutrition and diets in households in India using contextual research and design intervention.

Hotbox Product Preview

Hotbox Product Preview

RESEARCH

Understanding the Problem

Contextual Interviews

To understand the dietary behaviour of households, we started our research with contextual interviews. Our initial target users were anyone who cooks or manages cooking at home. After a few interviews, we redefined our target users as households with multiple members and working adults. To prevent biases and avoiding missing out on details, we created a guideline to conduct interviews.

  • Interviewing users when and where they cook
  • Observing the user while they plan and cook
  • Taking the role of an apprentice with the user, as a master

User interview transcripts

User interview transcripts

User behaviour model

User behaviour model

Affinity Mapping

Interview notes offered us a good insight into each user’s dietary behaviour. But individuals tend to have biases and specific focus points and it is necessary to consolidate every perspective to see if there are patterns that emerge.

Interview points for affinity mapping

Interview points for affinity mapping

Each of the interview points was classified and color coded.

  • User Statements
  • Insights
  • Contextual Inquiry
  • Breakdown
  • Design Intervention
  • Follow-up Questions

The notes were then clubbed together based on similarity and causation. This helped in reducing about 450 notes into a few categories that offered the essence of the collective insight.

Building the affinity map bottom-up

Building the affinity map bottom-up

Any pattern identified is an area to work on. At this stage, we got to see a broader perspective by connecting the dots from each observation and creating inferences. These inferences led to the development of meaningful insights that were invisible earlier.

Condensed affinity structure

Condensed affinity structure

From the affinity maps, we were able to establish causation, intent and other dynamics involved in the act of cooking. We then extracted the top insights from affinity mapping, which helped us create a redefined design brief for our app.

Insights from affinity mapping

Insights from affinity mapping

Revised Design Brief

Helping people with time constraints, plan and follow personalised healthy, tasty and varied meals for the entire family. Problems to be solved:

  • Reduce the cognitive load of planning a diet
  • Time and resource optimisation
  • Ensure a healthy and interesting diet
  • Manage the kitchen inventory
  • Track consumption and nutrition intake

Personas

When we bundled up all the problems faced by our user groups, they were quite varied and were from different sources. We created narratives for multiple personas, detailing out different aspects of their lifestyle and dietary habits.

User Personas

User Personas

The personas created were then classified into

  • Primary persona
  • Secondary persona
  • Supplementary persona
  • Negative persona

The primary persona was chosen and detailed out to help us focus on the exact requirements.

Primary Persona

Primary Persona

Scenarios

The next step was to imagine the scenarios of our primary persona and understand what exactly would our solution offer. This step helped us in coming up with features for the app.

Scenario models

Scenario models

DESIGN

Implementing the solutions

Information Architecture

Information Architecture of the app

Information Architecture of the app

Identity

Braanding and Identity

Braanding and Identity

Style Guide

UI Style guide

UI Style guide

Atomic Elements

Atomic UI elements

Atomic UI elements

Compound Elements

Compound elements

Compound elements

UI Design

UI Design of the App

UI Design of the App