Cook Academy - Plan for later

*CHECK OUT ATTACHMENT FOR FULL PREVIEW*

This project has been super fun to work on, but also challenging at the same time. Some of the UI is placed within small containers that its really important to get the UX just right.

This is the 'Recipes' page. Its where a user can go to and select a recipe they want to cook. There is a few user interactions within these small images. Firstly, the user can go ahead and click the title and that would take them into that individual recipe to begin the cooking experience.

Secondly, the user can visibly see the skills that they've already acquired in previous cooking lessons that will be required to use in *this specific recipe. Below that they can then see the new skills that they'll learn in this recipe. These skills are also clickable, so clicking one of the skills will take you to that individual skill to maybe refresh your memory with a video demonstration.

Lastly, is the "Plan for later" feature. I wish I could have showed you guys an animation of what I envision here but i'll go ahead and explain how i see it working. So a user would click the 'Plan for later' button and all the content would move downwards (in some nifty, smooth transition). Staying put would be the recipe name, cooking time & the type of recipe. Appearing from the top of the container would be a drop down to select a day of your choice to make this recipe. This is like a notification feature as it would email the user to remind them that they set out a date to make this recipe.

This is all still in the works and things can definitely be tweaked, but i'd welcome as much feedback as possible! Right now, I feel it is still a little busy with the skills being there (there could be up to 15 skills on show at one given time), so we could only show them on hover of the container or something. Ideas and suggestions welcome!

Thanks,
J

CookAcademy
Welcome to our design portfolio on Dribbble

More by CookAcademy

View profile