This website allows you to create or add recipes from the web and then build meal plans from them. The meal plan calculates the total required amount for each ingredient thus allowing for easy grocery shopping.
Wireframing and Low-Fidelity Prototype
I iterated through various ideas for the website layout on paper and selected the most successful options to implement in digital wireframes and a low-fidelity prototype. In addition to the flow of creating and editing recipes and meal plans, the website has registration, login, and home pages.
Mockups and High-Fidelity Prototype
To refine the visual design I developed a set of elements to use across the app: menu elements, forms, buttons, typography, and color. These elements were used to create all final mock-ups and the high-fidelity prototype.