Yumbox is a lunchbox recipe app that provides quick, easy and fun recipes primarily for kids. It is designed with working or stay-at-home parents in mind who packs their kids as well as their own lunches every single day of the week. They can plan, save and share their lunchbox recipes at their fingertips.

Timeline​

November- December 2018

Course

UI Design Program- Career Foundry

My Role

User Research, UX Design, UI Design, Visual Design

Tools

Pen and Paper, Balsamiq, Sketch, Invision 

Understanding The Requirements

​Every morning preparing a lunchbox for your kids involve a lot of decision making. As busy parents, we want to make sure that our kids eat healthy, delicious and nutrient dense lunch every single day. Throw a food allergy in an equation and it gets even more harder. Parents need easy, inspirational and healthy lunchbox ideas and recipes so that they can put together a YUMBOX!

WHY

Many Parents struggle coming up with lunch ideas. Having a busy life makes it even harder to be creative and come up with variations that their kids will enjoy.

Sometimes parents do have a recipe in mind but don't have ingredients they need for that particular recipe

Mornings are usually busy for everyone. Most parents need some quick but homemade lunch ideas to feed their growing kids instead of cafeteria food.

HOW

A collection of a lot of variety of recipes will be at their fingertips so the users don't worry about coming up with ideas.

A shopping list gets automatically generated based on the recipes user chooses. No more time or brainpower wasted with writing out lists.

A user can pick a recipe from different categories to make things easy based on their needs.

Goal

Target Audience

Goal is to create a simple to use platform that busy parents find useful to source recipes that they can recreate on busy weekday mornings.

Frustrations

Working or stay-at-home parents or adults wanting to eat more healthy homemade lunches.

Solutions

Lack of ideas lead to eating outside or grabbing cafeteria food more often

Creating a collection of a lot of easy recipes to choose from

Lengthy recipes or recipes with too many ingredients discourages from cooking at home

Need a handy place to store and access the recipes that have been tried and/or liked

Creating a shopping list from the recipe by typing it out is very time consuming

Need a collection of quick recipes to choose from in the morning rush hour

Including a recipe search feature based on different categories will help users with their needs

A feature where user can upload a recipe or save a link from anywhere on the internet.

A shopping list gets generated automatically when a user selects a particular recipe

A collection of under 10 minute recipes or prepare in advance recipes will come in handy

A platform for parents to share and discuss the recipes and pictures with each other.

Personas

​After learning more about user base and understanding their frustrations, I created user personas. These artifacts made sure that the users needs will always be in the forefront of any design decisions.

Solving The Problem

​From user interviews, I received information about users pain points. Once I gathered all the possible information about the project, I started prioritizing features. I narrowed them down to 4 features to create MVP based on user stories.

Browsing- Search and Filter

​To be able to browse through available lunchbox recipes for inspiration. The search should be based on seasonal ingredients, minimum ingredients, particular ingredients, or particular cuisine.

Recipe Collection

A dedicated space to collect all the recipes that users likes to store for future use. A place to add a link and save as well as manually entering a recipe.

Shopping List

Shopping list gets generated once user picks a recipe that he/she likes and want to try.

Categorization

​Categorization based on time, season, level of cooking, make-ahead recipes etc. will be very helpful when in rush.

Inspiration and Mood Boards

​After I created user flows, I started working on the user interface part of the project. I started researching websites to find inspirations for various ideas and themes for Yumbox. I wanted my app to have a bright, fresh and inviting feel to it. I created 2 different boards which has 2 different moods to pick from and finally went with mood board 1 because of it's bright and fresh look and feel.

Wireframes and User Testing

​With a good understanding of what potential user needs, I started sketching out with pen and paper. With user flows in mind, I did a couple of iterations and formed a basic framework of how my app should feel like.

I tested my low-fidelity designs with other designers by creating a quick prototype in InVision. Depending on the feedback I received, I created mid- fidelity wireframes using Sketch.

Final Design

​The feedback combined with a few more iterations on my own provided me a solid base for my project Yumbox. I then started working on the final UI design of the app. I started polishing UI in Sketch by adding colors, fonts, icons, images, buttons, text and other elements. This was the most fun part of the project, where I saw my research taking it's shape into a beautiful look.  I made sure that the navigation stayed simple and intuitive while making the final UI beautiful.

Retrospective

​​What Went Well?

​

• I initially started this project with the idea of  kids getting involved in planning their own lunches, but after interviewing parents I realized that some of the parents did not want the kids to have additional screen time others didn’t think this idea is sustainable for their family. So by asking appropriate questions to the target audience really helped me shift the focus from what “I wanted” this app to be to what “they want” this app to be.

• I think I really took time experimenting with paper prototyping which really helped me in staying focused on the features that users really want. Later on it also helped digitizing them with ease.

• I am very happy with the simple color palette I picked for this app. The final mockups look clean and inviting just as intended. The logo and the overall branding of this app looks in sync with each other.

What didn't go well?
​

• I was sometimes too distracted in the app strategy and features when I should have been more focused on the solution of my problem first.

What can be improved?
​

• I need to improve on my user flows as they look more like a site map and less like user flows.

• Keep an eye for the solution of the problem first and then get into app strategy and features of the app.

I would love to take this project to the next level, but perhaps I’ll need a complete prototype and some real world tests before the release.