The challenge
A home cook has no recipe ideas.
With only one or a handful of ingredients available, how can he or she plan a meal?
The idea
Create a website for home cooks to conduct detailed searches for recipes,
primarily based on specific ingredients.
User Persona
The target user is Janet. She enjoys cooking and planning out weekly meals but she is not strict about it. For reasons such as financial, emotional, and environmental impact, she is hoping to reduce the amount of food she is forced to throw out when grocery items spoil.
One Saturday afternoon, Janet takes inventory of her pantry and fridge to find only items that seemingly can't be combined to make a meal — at least not a meal in her own repertoire of recipes. She takes out her ipad and searches the web for ideas. This search leads her to the Cook's Catalog where she will be able to input the variety of ingredients she is looking to use and browse recipe options. 
Janet finds several options and wants the family to be able to weigh in. She registers for an account to save her favorites and adds a bookmark for easy access next time she's on the hunt for recipe inspiration. 
Wireframes
User Interface - Home Page
The user's main task on the home page is put front and center. Autocomplete helps the user get to what they are searching for quickly and easily. The user may also choose to browse by category through the main navigation at the top then filter from there. A site-wide search is placed in the top right corner as the design pattern is very familiar to users. This allows another way for a user to begin a search immediately. The FAQ is easily accessible as well as a call-to-action for submitting a recipe. 
User Interface - Search to Browse
User Interface - Recipe Details
Recipe details pages include the most important information needed for cooking it without filler content. The ingredients and instructions are aggregated from all over the web. 
The Cook's Catalog is meant to be a companion in the kitchen. For added functionality, the ingredients list functions double duty as a checklist so the user can collect the necessary items and keep track as they are preparing. The instructions can be viewed one step at a time and large as well as all steps at a time, as an overview. 
Back to Top