LineCook is a mobile-ready web app that was created to solve a simple problem: home cooks not knowing who to tap for trusted, realtime advice in the kitchen.
The answer? On-call advice — 24 hours a day, 7 days a week — from experts within the food and beverage industry. Namely the seasoned chefs who need a reliable source of supplementary income during unexpected downtimes like the COVID-19 crisis.
I didn’t want to dive straight into sketches without doing my research, though. After conducting a competitive analysis on two popular cooking apps (Food Network Kitchen, Yummly), I concluded there’s no better time than now — a peak era for experimental, global palates — to develop a web app home cooks could truly rely on no matter what.
The Phone-a-Friend of the food industry, essentially; only in this case, the “friends” are from your favorite local restaurants.
An initial round of user interviews helped support this hypothesis, including
conversations with the culinary director at Serious Eats (Daniel Gritzer, 42); a high level engineer at Henkel (Andrew Feyen, 40); and a managing editor in the marketing department at Cafe Imports (Ever Meister, 39).
Each one said they were eager to experiment in the kitchen every day of the week. Their individual needs and goals varied however, from learning time management tricks to mastering cutting-edge culinary techniques.
The following personas combined the key findings of a research analysis with further insights about home cooking habits, as well as exactly why each user finds the very act of preparing meals frustrating, satisfying, and/or rewarding.
After further rounds of testing and feedback, I decided to streamline LineCook's features and focus on (1) a live chat that answers culinary questions in real time and (2) exclusive content that sharpens a user’s skills and expands their repertoire.
My wireframes emphasized these value propositions, a 30-day trial that doesn’t require a credit card, and several core functions that will be crucial for meeting growth and conversion goals. Here is how a handful of designs evolved from rough freehand drawings to a refined prototype in Adobe XD.
With a high fidelity prototype in place for the mobile version of LineCook, I began scheduling tests with potential users who reflect its primary personas. The main goals of these interviews were to gauge the app's learnability and measure errors according to Jakob Nielsen's usability scale.
Each call was limited to 20 minutes, conducted over Zoom, and centered on common user flows (e.g., signing up for a new account, searching for recipes, or contacting a chef through the app's chat portal).
After breaking seven different sessions down into high, medium, and low priority issues, I concluded that various points within the web app could be edited for clarity and likely points of friction. For instance, the user profile icon (a chef in an earlier iteration) within the bottom tab bar was misleading and not as universal as it should be. The call-to-action cues within the search page also confused several people.
Other iterations were made with an affinity map and A/B preference test in mind, only to be refined even further after a round of peer reviews and a closer look at key design principles. A perfect example is LineCook's sign-up page and simple onboarding process, which now looks like this:
The other factor keeping the app's current iteration clean and consistent is its design language: a calming color palette of blues, purples, and greens, bolstered by a strategic blend of Dos and Don'ts, including....
Do use flat SVG images
Do follow a color scheme that plays off the images’ overall palate
Do embrace pastels, but don’t make the app look like an Easter egg hunt
Do keep elements balanced, with enough room for everything to “breathe”
Do use proven open source icons from Noun Project and Material Design
Do avoid clutter at all costs
Don’t apply an inaccessible “dark mode” approach to any screen designs
Don’t use photography outside of recipe art; stick to illustrations instead
Don’t get too cutesy or cloying; go for a more contemporary, laid-back look
Accessibility issues were also addressed, including font sizes, the contrast levels between active and passive states, and color scheme issues.
As for how the web app's live chat works, users can expect an experience that resembles this user flow:
Which brings us to one final problem: Now that COVID-19 restrictions are being lifted, there’s a lot of concern in the food business about the past year’s unprecedented interest in home cooking falling right by the wayside. After all, why bake sourdough bread at home when you can support a new brunch spot down the street?
A fully refined version of LineCook has the potential to keep everyone interested in making dinner more than a chore or a hobby. Maybe it can even be — dare I say it — fun?
To find out how LineCook works firsthand, please check out the app's current XD prototype here.