LURE
RIT Fall 2019 UI/UX
After Effect | Adobe Illustrator | Photoshop | InDesign 
The theme of this project is to develop a food editorial website. 
According to my researches, I found out that most of the websites have problems with layout, especially for the homepage. Because the homepage always has lots of information, and which is hard to organize. 
For a food editorial website, the layout would be one of the most important things to solve cause a good layout will give the user a better experience to find and follow a recipe to cook. 
Therefore, for my website, I want it has a very clean layout, so it is easy for the user to follow, and know which part they are on the page. For the recipe, have side navigation to guide the user step by step. Also, have a hover state for images and types, so it is easier for the user to choose which article or recipe they want to click. 
HomePage
The Home Page will include 4 categories: Featured News about Ingredients, Featured Daily Recipes based on users' search, Featured Restaurant Reviews based on users' location, and Featured Travel information about some local restaurant and special food based on users' search of travel. 
There is side navigation on the left side of each category that users can see when they scroll down the homepage, which gives users a better guide. 
All of the categories separate by very light background color and different shapes for the element. All of the clickable parts will have a hover effect, so it is easier for users to follow the interface. 
Looking Through a Recipe 
The recipes can be filter by tags. Tags for recipe can show what kind of food it is (course | diets | cuisine | technique). 
The first part of the recipe has the chef’s information, and users can follow the chef if they like.The recipe will show cooking time, cooking level, and tags for the recipe. 
Recipe page has a side navigation bar on the left which makes it easier for users to follow the recipe when they are cooking. 
The button of ingredients list and nutrition facts will stay on the right side, so users can check them any time they want. 

You may also like

Back to Top