tastebuds
a branding, interactive, and UX/UI case study
tastebuds is an interactive website for picky eaters that inspires users to try new foods and branch out! The site is meant to be a helpful companion or tastebud (wink wink) that learns your preferences and finds recipes to help you try foods you struggled to enjoy in the past. Through an onboarding quiz, the website will discover what foods you love and which foods are a bust and will sort you into a group based on your selections. Are you a Texture Avoider and hate mushrooms and raw tomatoes? Or maybe you are a Strong Believer and you fight for justice through your food choices as a vegan or a vegetarian? tastebuds is also great for parents with picky children! Parents can fill out the quiz with their child’s preferences in mind and use the suggestions to help their children try new things.
The Problem
While picky eating may seem like a problem that only children face, picky eating is prevalent in adults too. Many adults can be picky, whether from traumatic food experiences from childhood, heightened food sensitivity, developmental disorders like Autism, or from eating disorders like ARFID. ARFID, or avoidant restrictive food disorder, is an illness where sufferers lack necessary nutrients from extreme picky eating that has not gone away over time. Similarly, some adults follow strict dietary or lifestyle restrictions based on personal philosophies they may hold. Many adults are now vegan, vegetarian, or “flexitarian” and struggle to find foods they might like to fit their new diet.
As a picky eater myself and an occasional vegan, I know how hard it is to find food I like and can cook! Some weeks I eat nothing but takeout or frozen dinners because creating an exciting, plant-based, healthy, and easy meal on a weeknight is too tough.
Of course, picky eating is prevalent in children too, and many parents struggle to find foods that their kid will enjoy and are healthy! Luckily picky eating is a common part of childhood for most kids, but exposing children to a variety of new foods and diverse produce is necessary for their development and tastebuds can help!
Research
In order to understand the consumer and decide on a concept, I began researching picky eating. I knew I wanted to help picky eaters try new foods, but I wasn’t sure if I should focus on children, adults, or both. I began referencing an Instagram account I casually read in my free time, @kids.eat.in.color, an account run by mom and nutritionist, Jennifer Anderson, MSPH, RDN for information on children picky eating. Her focus on food exposure and low pressure was helpful even for me, a picky adult. She found in her practice (and her experience as a mom!) that children may reject a food once, but after frequent exposure, they may suddenly like a certain food.
In an article recommending solutions for parents of picky eaters, I found that parents share responsibilities with the children during mealtime. They control what food is available and when and where meals and snacks are eaten; kids determine how much they eat and whether to eat.
During mealtime, there is a lot of pressure because parents want to offer healthy options, but kids sense this pressure and act out. If parents respond to their children’s picky eating habits' negativity, kids will remember the experience and may not try again. Additionally, I found that parents should set time out for mealtime. Family dinners help, as does avoiding distractions like TV.
In a New York Times article about picky adults, I discovered that many adults are ashamed of their natural picky eating habits or ARFID diagnosis, and struggle to overcome picky eating on their own. Many picky eaters avoid foods based on taste or texture; sour or bitter foods like olives and pickles may not go over well for the sour/bitter avoidant, and foods like cooked mushrooms or raw tomatoes may be rejected by the textural adverse crowd. Most picky eaters love foods simple foods with smooth textures, sweet/salty flavors, and less alarming colors like white, tan, and brown.
I began writing a list of foods that picky eaters dislike and enjoy deciding which profile the users would be placed in later in the design phase.
User Personas
Next, I created user personas (below) on the research I had compiled. One user, Mia, was a vegan student, a Texture Avoider and Strong Believer, who struggled to cook for her family when they visited back home. They also had issues finding meals that matched her food preferences. I also created user personas for a mother of a picky eater and a Veggie Skeptic who avoided produce at all costs.
Narrowing in on a concept
With my research in mind, tastebuds would recommend foods to the user based on their preferences from the onboarding quiz. The user would then try various recommended recipes with foods they were wary of. Similar to apps like Duolingo, the user would achieve badges after trying new foods. The app would congratulate the user frequently to reassure them and motivate them to keep going.
Branding
Next, I began brainstorming name ideas for the brand. I finally decided on tastebuds, as it referenced the companion and food aspects of the website. I decided to keep the brand mark in lowercase to keep the brand fun! After sketching various logo marks, I decided to use a simple wordmark as the primary logo that would work well on the website.
Final Logo
I designed an alternative mark with a smiling star, which would reference the “buddy” in tastebuds.
Brand Attributes
tastebuds is modern, fun, playful, motivational, inspiring, bold, and reassuring.
Style
I created a moodboard to help me finalize tastebuds’ style. I was inspired by bold, large, typography, bright colors, and personified star illustrations. The neon quality of hot pink against royal blue and golden yellow was perfect to implement into my design to boost the comforting and easy-going quality of the brand identity.
The final style is filled with bright colors, simple and clean illustrations, fun and friendly star buddies, and smooth yet imperfect brand elements. I chose MADE Waffle Soft for the typography, as it is bold and approachable.
Animations
I worked on many micro animations for tastebuds. I sketched out thumbnail storyboard sketches to aid in my design process. Transforming one food into another by size and color changes and hiding one food into another — almost like a magic trick! — seemed promising with the limited animation tools on Adobe XD.
UX/UI
Next, I started designing the user experience and user interface. I began reiterating my concept and what the website would do.
Website Function
The website serves as a companion, or “buddy” to picky eaters and their parents to help motivate picky eaters to try new foods and expand their palette. Users take an onboarding quiz and the site would log these preferences to filter out certain foods and push them to try new foods with exciting recipes. The user will be placed into one of six groups, Strong Believer, Flavor Fanatic, Texture Avoider, Flavor Cynic, Adventurous Eater, and Veggie Skeptic. Users can retake the app if they find their results unsatisfactory.
After being sorted, users are shown a variety of foods they can try, some difficult and some that are more approachable. Once they try a recipe, they will receive a badge! They can add themselves to groups based on their food choices and communicate with other picky eaters for support and friendship.
User Flow
In order to have a successful product, UX/UI designers must plan the user experience out before designing so they can create an enjoyable experience without stressing over the visuals and the style.
I first sketched the sitemap of the website to determine where information of the site would go, making sure that the information was located in intuitive, easy-to-find locations for the user. Colleagues then card-sorted this information to improve the experience.
Next, I began arranging user flows based on the parent and picky eater users. Each user would follow a different journey and path on the website. After some feedback on the strengths and weaknesses of the user flows and some adjustments, I started sketching out a paper prototype of the picky eater user flow to help aid in visualizing the interface of my design.
Finally, after some critique, I began implementing the paper prototype into a low-fidelity wireframe. I rearranged the sign-in aspect of the site towards the front of the onboarding quiz, so the user could save their preferences before starting the main section of the quiz. I also added a badges and profile page to the site, inspired by apps like Duolingo and other motivational sites. I began filling out the low-fidelity wire-frame and updating it after critiques until I had the finished, high-fidelity prototype!
Final Website Design
The final site design and prototype is massive, with over 100 screens! Check out a few of the final screens and user flow video below! Enjoy!
Credits
Design: Heather Marshall
Art Direction: Matthew McGlynn
Categories: Design, Interactive, Research, Branding, UX/UI
Creative Timeframe: January to April 2020
School: Tyler School of Art and Architecture; Graphic and Interactive Design
