Plateable Narrative

See the project overview here.

An app that helps you eat better to live a healthy life.

Plateable began as a class project my team and I continued to expand upon.
I worked with James Butler and Sara Ingram. My role as the team lead included doing project management, art direction and UI/UX.

The calorie doesn't love us.
We give the calorie too much credit. We let it boss us around, telling us what to eat, and how long we need to go to the gym.

Unfortunately, the calorie doesn’t really love us. It leaves out the most important part of health: nutrition. We think things should be different. So as a team of three design students, we set out to shake things up. Calories are the hero in most health and diet apps. After interviewing 10 regular users of health apps, we learned that information about nutrition was secondary to calorie counting, and was usually ignored.

Our team wants to emphasize nutrition, and move people away from calorie counting. We understand calorie counting is a powerful tool when losing weight, but we know that proper nutrition will aid in weight loss and do so much more.

We believe that nutrition will help more people live healthier lives. Calories don’t define and support the diverse eating habits of individuals. Vegans, Paleo diehards, raw food gurus, pregnant ladies, teenagers, olympic athletes and everyone in between all have different nutritional needs.

Who are our users?

These are all really different people so we made personas to understand them better. One of our personas was Katie.

Our Goals
In our interviews we found an insight to why existing health and diet applications didn’t always work out. Users found that logging food was tedious, and portion sizes were mostly guesswork.

Our goals for the "logging-your-meal" experience:

  • Pursue a visual way to see one’s nutritional yield (instead of guesstimating grams, cups, cooked and uncooked)
  • Make logging less tedious

  • Allow flexibility in user participation but still keep relative nutrition accuracy

  • Allow users to log their meals later

We went through a couple design revisions before we settled on a solution we felt addressed our goals for logging. Here they are, and how we tested them:

Our First Try
Our first solution was to have the user draw a segment of their plate and define which food group it had within its boundaries.

We tested this solution by taking pictures of food in snapchat and having testers draw how they would divide their food on screen.

Some testers were confused about their task but the misunderstandings gave us insight on how we needed to revise our solution. 

We learned that:

  • It was hard for users with different finger sizes to accurately draw without having to zoom in.

  • People just didn’t want to do it. They said “I don’t need to do this. I will just eat a salad.”

  • We didn’t get rid of the tedious task of typing food into a search and list logging system. This was extra hard on users because they just finished a tedious task of drawing their food boundaries.

  • Users did not like the typing aspect of logging.

  • We couldn’t log things like fried rice or taco salad accurately because we only focused on tagging one food group at a time.

  • The end result of logging looked unrefined, chaotic and messy.

  • Our test subjects reported they were distracted with how drawing was too accurate or not accurate enough for their preference.

  • Users were worried about having to spend time logging in a social situation, or being able to leave and then come back later to finish it. We came up with a scenario to lead us in the direction of a solution using one of our personas.


Our Next Try
So, we iterated. Our next idea was a tap and slide interaction where a section of the plate would fill in like a pie graph superimposed on their food, and then be defined as a food group. From there, more food groups could be added to a section through transparency and layers. We felt that the slide feature of the interaction would discourage worries about being too accurate or inaccurate. We also allowed the user to pause their logging at anytime or choose to log later by implementing a gallery of past meals with either a logged or unlogged indicator.

 We found that:

  • Not everyone’s plate looks like a pie chart.

  • The layers and sections looked intimidating and discouraged willingness to participate in logging.

  • It was just as tedious as our first solution, just in a different way.

  • People liked the gallery solution for logging later.

We decided to iterate again, thinking there must be a better way to include different food groups within a defined section of a plate.

Many Tries Later
Our final solution took inspiration from old recipe cards and desktop browser tabs. We chose a tap, scale and drag interaction to define a section of the plate. While a section is selected a user can tap on tabs representing food groups and use a slider with how much of that food group they think are in the selected portion of their plate.

We learned that:

  • While it took about the same amount of time to log, users didn’t feel hindered or frustrated by anything.

  • Defining sections and the use of tabs allowed users to be as accurate or inaccurate as they wanted to be while still reporting an accurate picture of their plate’s nutritional value.

  • Allowed us to give live feedback of what the user is logging vs. what we suggest they should be eating.

  • The tabs got rid of the typing tediousness and also sped up a necessary repeated interaction

  • With the slider, we found it was much more intuitive. Sliding and showing the percentage was a huge portion of feedback that we didn't consider but stumbled upon.

Calorie Shaming Doesn't Work.

We learned that people would neglect logging their food because if they ate too many calories, their calorie counting app shamed them. We experienced this as a team when we all used My Fitness Pal over the course of a week. One team member reported that they ate four Oreos and couldn’t bring themselves to log anymore that day because they didn’t want to see their numbers turn red. After this experience, it made sense that we add this to our list of goals.


No one wants to be shamed and discouraged for enjoying a treat. At Plateable, we want people to feel safe when they log their food. So we designed features that encourage that.


Meal Overview:  Helpful suggestions on what you might want to do at the next meal, in case you just ate a whole row of Oreos.


Day Overview: Side-by-side comparisons of the food groups you ate in comparison to what we suggest, with no discouragement for enjoying yourself.


Time Overview: We don’t think that one junk meal should discourage you from logging! Time Overview is a projection of your progress based on your past meals.


Suggestion Guide Logging: While logging, a guide bar of suggested nutrition is displayed as a visual goal. We adjust the bar for each logging session based on past meals.

The more you log, the better Plateable works. We think enjoying yourself is a part of a healthy lifestyle, not a sin, and it's important to track and not be discouraged or shamed.

A Wild App Appears

In the middle of this project, a health and diet app appeared during our routine App Store browsing.Their goal was to help people with certain lifestyles, dietary restrictions and health goals live healthy lives through nutrition. We were super discouraged. We ate a ton of pizza to drown our sorrows. What should we do? They were so far ahead of us! We decided to use the app and figure out how we could be different. They built a lot of features that we talked about building, so we decided to use their app and learn from their mistakes.  

After using our competition for a week, we learned:

  • Overall they emphasized nutrition, but still kept calorie counting.

  • DID provide helpful suggestions of how many minutes of yoga I would have to do to burn off the calories from the sadness pizza.

  • The logging of food was just as tedious as My Fitness Pal and didn’t provide as extensive a list of food to choose from.  ie: search for Costco Rotisserie chicken, just comes up with a list of chicken anatomy.

  • Kept conventional, tedious food logging “search and list” interaction

  • No visuals of portion sizes to as a frame of reference

  • DID provide encouraging messages on progress.

  • You had to PAY for specialized dietary services

We didn’t feel confident in giving them our money to try out their specialized nutritional services because the logging functionality was sketchy.

This experience cemented our decision to pursue our visual approach for Plateable and continue developing a solution despite the direct competition. We understood by studying this competing product that what we had was well on its way to solving the problem in a way that would work and make a difference.

Plateable is still in development. If interested in learning more please contact me:

See the project overview here.