WDM-"How to make...?" Sketches

CLICK FOR LARGER VIEW. Thank You.







The above are my proposed sketches of how I would like the interface of my "How to make...?" project would look like. ^^~ Comments are welcomed. Thanks!

"How to make...?" Moodboard~

Here's my mood board for my Web Design project. ^^ The idea is to have a step-by-step instruction illustrated guide on a fridge door instead of the normal, text only guide that is shown on most websites.

Web Design 1 - Research (Design Websites)

These are screenshots from websites that I feel are interesting from their simplicity of they layout to the way the viewer interacts with the content.


*CLICK ON IMAGE FOR LARGER VIEW

Colin Freelance:




Snowdin:


TheSeen:


Q1 Samsung:




Zandar The Great:

Web Design 1 - Research (Tutorial Websites)

*Sweeps dust away* There, much cleaner now. HAHA! On with the updates! XD

Project - How to make...?

For Web Design 1(WDM1), our first home assignment was to take screenshots of 4 tutorial websites and 4 beautifully/interesting designed websites. In this entry I will be posting screenshots of tutorial websites only. I chose to study cooking & baking websites because I will be doing cookies or cake slices for my project and would like to see the different ways of others design baking websites. The screenshots below would show the different layouts for Recipe Index, Extra Information (Eg.Nutrition facts), Illustrated Step-by-step guides, and angles of taking photo shots of finished product.

Below are links to the baking/cooking websites: Baking Bites, Smitten Kitchen, 101 Cookbooks, Bake or Break, Cooking.com and The Accidental Scientist:Science Of Cooking.


*CLICK ON IMAGES FOR LARGER VIEW

Baking Bites:









Smitten Kitchen:















101 Cookbooks:

















Bake Or Break:












Cooking.com:












The Accidental Scientist:Science of Cooking: