Designing a custom recipe manager application for professional chefs

Spotlight: The Hershey Company

For over a century, Hershey has amassed thousands of recipes through cookbooks, magazines, and various digital platforms. From a keyring of recipe notecards in 1910, preserved through multiple building fires 🔥, to digital databases in the 1980s and 90s, their recipe management system has evolved significantly. Tasked with modernizing this legacy, I designed a fresh, intuitive application to streamline recipe creation and management for Hershey’s chefs. By collaborating closely with stakeholders, including a talented product manager/developer and the Hershey development team, I developed solutions that will enable chefs to efficiently access, create, and manage recipes, enhancing their culinary innovation for years to come.

USER PERSONA & PRIMARY GOALS

Chefs and Recipe Developers at Hershey need a streamlined way to create, manage, and browse recipes. They require a modern application that supports efficient recipe management and integrates seamlessly with their workflow.

THE PROBLEM

Existing recipe management tools at Hershey were outdated and fragmented. Chefs struggled with a complex legacy system, which hindered their ability to efficiently input and manage recipes, leading to potential errors and inefficiencies.

HOW MIGHT WE...

How might we design a modern, intuitive recipe management system for Hershey that efficiently integrates historical data, streamlines the recipe creation process, and minimizes potential user errors?

CLIENT

The Hershey Company

TIMELINE

September - December 2023

MY ROLE

Senior UX Designer, working with a Product Manager / Developer, Scrum Master, Lead Power Apps developer, the Head Chef at Hershey, and Lead UX Designer at Hershey

SERVICES

User Research, Lean Canvas Investigation, Visual Design, Collection, Date Visualization and Storytelling
Sneak peak: navigating through the clickable prototype from the home page to the recipe page
Approach to User Research and Evaluation
How can we build a tool to empower chefs at Hershey as they create new recipes, test old ones, and inspire a new generation of creativity using Hershey products?
Upon joining the Hershey project, I was introduced to a lightweight MVP that had already been developed, with initial requirements gathered before my arrival. My immediate challenge was to integrate my own user research and evaluation into the existing work while respecting the foundation laid by the previous team.

To navigate this, I sought to understand the project from multiple perspectives. I began by reviewing all the documentation provided to ensure I was informed about the existing functionality and stakeholder inputs. I made it a priority to honor the work done so far and integrate it with fresh observations and insights.

I advocated for and was granted the opportunity to conduct my own stakeholder interviews. This allowed me to:
  • Engage directly with Hershey chefs to observe their kitchen operations and gather insights into their current workflows and interactions with the application:
  • Explore existing frustrations and areas for improvement based on firsthand feedback from users.
  • Meet with the SEO team, brand management team, and other relevant groups to discuss their concerns and identify opportunities for enhancement.
Additionally, I requested a tour of other internal applications used at Hershey. This exposure was crucial for understanding how Hershey’s brand is expressed across different platforms and identifying potential synergies with the new project.

Outcome: This approach enabled me to build on the existing MVP effectively, ensuring that my contributions were both informed by and complementary to the preliminary work. By engaging with stakeholders and immersing myself in the broader context, I was able to align my research with the project's goals and address user needs comprehensively.
Information Architecture
Having met the key stakeholders, I examined the information architecture, considering critical missions from the key user groups. From my research, I was able to assemble a priority list of capabilities that needed to be supported.
Sketching & Wireframing
Using this priority list and the context I’d assembled, I began with sketches and then made black and white wireframes for the core of the app — the home page search, and search results. At this point, we tested this design with our key stakeholders, and received feedback that indicated we were on the right track and prioritizing the right elements. 

I continued to use this iterative testing approach, bringing each section to review with our key stakeholder group in biweekly meetings, until we had moved across each major section with stakeholders on the same page and the basic pieces in place.  
Sketching helped map out the top priorities and establish visual hierarchy of importance on the page.
Using wireframes to think through all of the edge cases, flows, and interactions in detail.
I prepared visual design options: in this case, an option based on an existing design system from a different internal application, and a direction that I put together based on brand elements from across their internal and external brand palette.
The final visual designs, used for a clickable prototype to perform usability testing.
One Specific Challenge
One challenge that emerged was how to represent ‘variations’ on each recipe. 

A recipe might have a ‘variation’ such as a different crust, frosting, or other topping. However, for some recipes, an important part is represented as a ‘variation’. This presented a challenge because historically, variations list their ingredients inline, right in the instructions section, and not as part of the overall ingredient list. Imagine buying ingredients for a pie based on the listed ingredients, only to find that the crust ingredients were tucked away in the final step of the instructions, leading to a missing crust.
Imagine buying ingredients for a pie based on the listed ingredients, only to find that the crust ingredients were tucked away in the final step of the instructions, leading to a missing crust.
I discussed the needs with our key stakeholder and master chef, Linda. One quote that helped us understand the situation was, “Chefs know that sometimes a topping will have some ingredients that are listed at the end, so they know to check”. While it is acceptable to expect some level of expertise from this user group of expert chefs, it is also a potential source of error, and it flies counter to the future goal of integrating live products with this internal database. I proposed multiple solutions and also examined other similar and competing websites with a recipe database, and proposed that we look to the ingredient list for our solution and allow each ingredient to be able to be set up as an entire recipe. This way, a frosting or crust could be treated as an ingredient, visible in the list, while revealing its complexity when clicked on, offering a comprehensive breakdown of all included ingredients.
Implementation & Impact
Throughout this process, I collaborated closely with the development team. Part of the strength of the project was due to a highly empowered product manager / developer, who had created the initial prototype and was close with the head chef and primary stakeholder, as well as my primary contact during my time contracting for Hershey. Through his careful documentation and forthcoming attitude, I was able to work swiftly to create designs that could be broken down in the next sprint and started to be built by our development team. 

This application is sure to have a significant impact at Hershey. Previously, only a single person was truly empowered to use the complex legacy app that housed the recipe database. Now chefs will have a much easier time inputting new recipes, administrators can manage and search the rich history of recipes in an efficient and modern way, and new opportunities may yet be surfaced as this application should be intuitive enough for a wider range of stakeholders to explore the trove of recipes at Hershey, better utilizing the impressive and delicious body of work that has been done at Hershey to support the great products they create.
Learnings & Future Path
This project was a big success from all perspectives, actually completed several months ahead of time and far under budget, and with a very positive reaction from the key stakeholders, especially Linda. I gained valuable experience structuring and executing a design process, and it was very rewarding to see it being built immediately, knowing that this system will go on to serve the company during its next chapter.

This project was completed at a fast clip, with little time to stop and smell the roses at each moment through design. Using a more thoughtful component-based approach to help manage some of the complex dashboard flows would have been helpful, and I would have liked to take more time crafting and finessing the visual design despite a satisfactory outcome being reached. While I did use some components for global elements, I will be sure to establish more components for button and text styles in future projects that can be implemented early to ensure consistency and reduce time finessing spacing. Overall I was pleased with the experience of working with this team, as especially the product manager / developer went above and beyond to establish a good working rhythm with open communication and respectful, down-to-earth tone.