Better with Bacon is a website that hosts recipes for bacon lovers with everything from breakfasts to desserts. Better with Bacon, with its comprehensive search and filter options, will deliver the best bacon-inspired recipes from the web.
Better with Bacon was created as a personal assignment for my BCIT MDIA 2330 UI / UX / XD class.
Better with Bacon only hosts and catalogs bacon inspired recipes allowing users to find the bacon recipe they need
For at-home cooks and bakers who what to find quality bacon inspired recipes fast that are easy to follow
Nick and his daughter both love bacon and love to bake together and need a recipe website that has easy-to-find recipes and easy-to-follow instructions. What they have found in the past is that most recipe websites are too long with the user having to scroll down many pages to just find the beginning of the recipe which then has a poor layout for the instructions and ingredients. With this website, Nick and his daughter will be able to use a comprehensive search and filter system to easily find the exact recipe they need with simple, easy-to-follow written instructions as well as the option for audio and video instructions.
This user flow shows the progression a user would take to search for a recipe as well as log in and sign up progression
Wireframes were created using Adobe XD, showing page layout and elements for the home page, landing pages, and product pages.
Montserrat was chosen for its readability and for creating a simple and clean-looking website. Color samples of bacon were used to create the color pallet for Icons, backgrounds and some text.
Components were used to help speed up prototyping by making sure major screen elements remain constant throughout the website
Better with Bacon will deliver a user experience catered specifically to bacon lovers with its expansive filter options and bacon-specific content for meals from breakfast to dinners and desserts