StoryboardStoryboard2/15/20122/15/2012

www.patriciamdecker.wordpress.comwww.patriciamdecker.wordpress.com

This website was a combination of a This website was a combination of a professional writer and graphic professional writer and graphic

designer’s portfolio and a designer’s portfolio and a lighthearted, illustrated collection of lighthearted, illustrated collection of

recipes.recipes.

The following is a preliminary The following is a preliminary demonstration of features and demonstration of features and design elements for the new design elements for the new

website.website.

Network Map

ALL RECIPES CONTACT ME INDIVIDUAL RECIPESfeatured + recent linked from main

RECIPE CATEGORIEScategory pages linked in sidebar

MAIN

Main PageThe search function and website header here will ensure that the user has multiple options to reach information they need.

Main PageA header here will help lend a cohesive feeling to the site and define the theme of all of the pages

Main Page

These are the primary navigation menu items, and will be “Home”

“All Recipes” and “Contact”

Main Page

This featured postsSection will allow for a few easy and quick recipes to be displayed in part: this will highlight both the illustrations and the recipes themselves.Clicking on the “read more” button will enable a user to quickly navigate to the recipe page.

Main Page

This side navigation bar will include a list of recipes by category along with an “About the Cook” section. The best portfolio item for a graphic designer is a well-designed website, and in place of a full page dedicated to the author, this “about” section on the homepage will have a small Flickr feed below it that will display portfolio images, along with another search function.

Main Page

This is the most recent post, which will be displayed in its entirety.

Below it, several of the next recentposts will be listed by title (clicking on them will take the user to the

individual recipe pages)

Main Features Section

If the title is incorporatedinto the header, this part

can be eliminated and the search function broughtdown to the RH side of

the navigation bar.

This will be a hand-drawn header that reflects the new name of the website, “Dabbles and Doodles” which represents the dual nature of cooking and illustration

Main Features Section

This is optional text, and dependingupon page length may not be the

best idea for the home page.

Main Features Section

These are small indicators that letthe user know how many featured posts

there are and what post is currentlybeing displayed.

Main Features Section

This displays on eachrecipe, and links to theindividual recipe page.

Main Features Section

This is the navigation andwidget side bar that displays

on the side of the mainpage. This will have, in order,

a list of categories that theuser can click on to view

only posts within thatcategory, an “About the Cook”section that will have a pictureand a short description of the website owner, a Flickr feed ofportfolio items, and a search

function that will enable the userto search the entire website.

Main Feed Section

If the individual post has visible sharebuttons, they will appear here.

Main Feed Section

Clicking on this category will takethe user to other posts in that category

Clicking on any of these categories will take users to other posts

in that category

Clicking on any of these categories will take users to other posts

in that category

Main Feed Section

These are the other more recent postsdisplayed by only the post title.

Main Feed Section

All Recipes PageClicking on the “All Recipes” linkin the main navigation bar is the

only way to reach this page.

This sidebar displays the archived posts by date

All Recipes Page

Posts are listed with featured posts first, andthen in chronological order.

All Recipes Page

As a user scrolls down, more recipes become visible toensure that the reading flow is uninterrupted.

All Recipes Page

Individual Recipe Pages

This is the title of the recipe

Notice that there isno secondary

navigation on the individual recipe pages

Individual Recipe Pages

Below the post will be listed the category, share buttons(if selected) and any comments made, along with aform for users to make their own comments on the

Post.

Individual Recipe Pages

Individual Recipes Comment Area

Users can log in using socialtools to post a comment with ease

If the user chooses not to log in using social tools, they will be

required to fill out a few personaldetails to submit a comment, for

tracking purposes.

Individual Recipes Comment Area

Users can choose to keep track of future comments and posts

via email notifications.

Individual Recipes Comment Area

Contact Page

Clicking on the main navigation baris the only way to reach this page.

This will include a contact formfor users to reach the website

owner.

Contact Page

StoryboardStoryboard2/15/20122/15/2012

www.patriciamdecker.wordpress.comwww.patriciamdecker.wordpress.com

The new site design will do a better job of The new site design will do a better job of showcasing the art and illustrations, and will showcasing the art and illustrations, and will

give the user a better idea of what the give the user a better idea of what the website is about. website is about.

The portfolio elements will be largely The portfolio elements will be largely included in the main page sidebar, which will included in the main page sidebar, which will

avoid confusing a user torn between an avoid confusing a user torn between an online portfolio and a recipe list.online portfolio and a recipe list.