Foodhacks is a school assignment for which I have made a digital cooking book for tablets. In my experience, cooking books / tutorials are not always as straightforward. In order to solve that, I have added stepped navigation, a checklist, guiding illustrations, tips, and a timer. This was also the first project in which I used jQuery.
Each day, there is a new recipe.
Users can mark ingredients and tools as checked. The amount of ingredients required can be viewed in the user's desired measuring system.
Each step contains just a few lines of text and a big illustration illustrating the action. Users can check their remaining timers from anywhere by clicking the timer button. This button stores the remaining time as an HTML-attribute. When the timer has finished, an alert will appear.
Numerous illustrations have been made in order to visualize the process. Flat colors have been used to make sure the illustrations fit in perfectly with the design of the website.
I have experimented with various logo designs ranging from computer styled logo's to image ones. In the end, I chose a simple circle with the website's name. I found this logo to be very effective and fun.