This was a personal project for personal growth and practicing purpose. I just finished an online Web Design course, and I wanted to practice what I learned from it.
I find it really hard to keep track of the recipes I found online organized. I have meal ideas on Pinterest, Instagram, and food blogs I encounter while browsing. With all the sources available, I end up forgetting the recipes I have saved and hoarding links and "pins" without ever going to them again.
I wanted to create a friendly and accessible platform to search for inspirational recipes and keep the information stored in one single place. I thought of the possibility of making the app a social media place where users can add friends to their communities, share recipes, and add recipes from scratch.
The colour palette selection refers to classic paper recipes used by our moms and grandmoms: neutral beige colours for backgrounds. The typography follows the same reference as the palette, vintage fonts used in recipes found in food magazines. The overall colour accent is black to bring a modern design to the app.
For the app, I thought of having four sections: "My Dishes," where users can find saved recipes; "Explore," to search for ideas; "Add New" to have the versatility of adding new recipes; "Profile" for all personal info.
The main screen will always display the five most known dinner times: breakfast, lunch, dessert, dinner and snacks. Users will browse for recipes ideas under each category. A search bar will be displayed at the top of the detailed categories for easy access to specific recipes known by users.
Inside each recipe option, a detailed description of the ingredients needed will be shown. There is a ticking function for the ingredients for easy and visual understanding of the ingredients the user has in their pantries. It will have a "hear instructions" feature to follow without the need to touch the device and the ingredients used. The considered settings are audio speed and audio app volume.
The "Explore" section will access smart filters, toggling filters, and the traditional writing down option. When the search results show up, users will encounter a list of recipes that follow the description in the first "Explore" screen. Detailed information with the recipe name and user tag who added the inspiration into the app; if it is a recipe initially created by the app managers, it will display "by @recipesChef." By clicking "Add to My Dishes" at the end of the recipe description, the selected recipe will be displayed at the "My Dishes" section, gathering easy access to it by the user.
Finally, the "Add New" feature will be shown as a blank space, with fully customizable descriptions and details of the new recipe to be added. The Profile section will display information about the user's community, profile details and general app information.
The project allowed me to practice thoughtful planning for a complex app, considering new inputs, search engines and accessibility aspects for all users. The project was developed with Photoshop for the mockups and Illustrator for the icon work. It also allowed me to further understand Figma's components, constraints within a layout grid, styles, and project libraries' importance.