Year Developed: 2022
Project Type: Website
Languages Used: PHP, HTML, CSS3, Javascript, MySQLi
The Background
Food websites – and recipe websites in particular – are an extremely popular section of the internet. There are thousands of sites covering recipes, set up either as small blogs or larger sites that utilise expensive API’s from companies such as FatSecret or Edamam.
The Brief
One of the major problems with recipe websites is the way that allergy-sufferers are catered for. Usually recipes are hidden from view if it contains an ingredient they are allergic to. The idea behind Mealeez was that all recipes should be made available to view, but ingredients that cause allergies would be swapped out for something safer.
The Design
Design of Mealeez was carried out in-house. A lot of recipe website designs are overwhelming and we felt Mealeez could be done a bit differently by keeping things simple. The background was kept purely white with the focus kept on the recipes themselves and not the surrounding content.
Red was used as the accent colour throughout the website, matching the red of the Mealeez logo that was designed. Red as a food colour has been found to stimulate taste-buds, according to research so we carried that theme onto the site.
Nutrition information was animated over a few seconds to help draw your eye to it, and recipe ingredients were coloured depending on their suitability for consumption to help people see quickly what ingredients could be a problem and what ingredients have alternatives available.
Designs were created for desktop, tablet and mobile devices with the left hand menu appearing at the bottom of the screen to match the mobile app design.
The Development
Development of the website was carried out after the Android app had been completed. This meant that a lot of the API was already completed and the design had been nailed down, allowing coding of the website to be conducted quickly, taking roughly 2 weeks from start to finish.
Recipe API’s already exist – such as Edamam and FatSecret – that provide allergy information as well as recipes to display, but the monthly cost was prohibitive and the API T’s & C’s restricted what could be done, so it was decided early on to switch to a bespoke system.
Recipes are added to the database manually, with over 800 food ingredients (including nutrition information) inputted over a period of 4 months to help with the allergy detection system. This had a massive cost saving each month and meant full control of the database was maintained.
Google Adsense was added to display adverts, along with Paypal billing to monetise the website and create a subscription model that unlocks full nutrition information and a list of alternative ingredients to use in the recipes.
Recipe Schema Markup was also coded to allow Google to index and then place recipes on smart devices.