a glimpse into my design world
CHALLENGE
Redesign entire “GOLO recipes” blog due to the following pain points:
-
Users have difficulty finding where to search for recipes, ingredients etc
-
Too much scrolling; everything is large
-
Category dropdown list is too long and not user friendly
-
On the individual recipe post, users have trouble finding where to print the recipe
-
Printed recipes are too light and difficult to read
-
Print recipe screen gives no selection options to change font size or to include or not include images
HOW MIGHT WE?
Redesign recipes blog
HOW MIGHT WE?
Create better recipe search experience
HOW MIGHT WE?
Lower hero area: showcase additional categories as round image links
HOW MIGHT WE?
Design a recipes site map “Category”page
HOW MIGHT WE?
Design full content managed blog built with components so changes can be made faster
HOW MIGHT WE?
Develop advanced search
HOW MIGHT WE?
Reduce user scrolling
HOW MIGHT WE?
Make “print recipe” button/label easier to find
HOW MIGHT WE?
CMS components should be built so that they can be used universally on GOLO’s regular main blog as well
HOW MIGHT WE?
Upper hero area: showcase four featured recipe categories (example: new recipes, top rated, featured)
HOW MIGHT WE?
Design user friendly recipe post layout
HOW MIGHT WE?
Print recipe screen: provide text size and image print options
DEFINE AND IDEATION
Capture challenges to turn into opportunities
01
Define
Define GOLO's needs to redesign recipes blog
02
Research
User test to find paint points and research other recipe blogs
03
Discover
Discover ways to develop a user friendly recipe blog
04
Create
Design and develop a fully content managed blog
RECIPE BLOG RESEARCH
NEW GOLO RECIPES FLOW CHART
NEW GOLO RECIPES BLOG HOMEPAGE
Create user friendly engagement with new recipe blog design
-
Recipe blog has been fully designed with editable CMS components
-
All four main featured recipe categories and additional categories are above hero fold
-
Advanced search displayed above hero fold
-
“View all recipes” button is easily accessible both on hero and below most recent blog post feed
-
Recipe subcategory “most recent” blog post feed exists on homepage with entry post date, title, short description and link to continue to read the post
-
Additional content managed clickable categories presented on right column beside subcategory “most recent” blog post feed
-
During phase two of development, cross-sells and additional messaging will be included on right column along with content managed categories
NEW RECIPES PAGE
Recipes page includes sitemap posts and categories
-
Breadcrumb secondary navigation improves user experience
-
Advanced search displayed above hero fold
-
Most recent recipes are featured with option to view all
-
Recipe can be added to favorites list
-
Recipe can be removed from favorites list
-
Recipe clickable category directory exists eliminating the long dropdown that was an issue in the old design
-
Recipe clickable category directory allows recipes to be listed by meal type, course, diet, season, method, ingredient, and by series
NEW CATEGORY PAGE
Category page includes subcategories and all recipes under that category
-
Breadcrumb secondary navigation improves user experience
-
Hero category title and description
-
Hero clickable featured recipe
-
Slider subcategory recipe groupings with option to view all
-
All recipes under this category presented with option to load more and view all
-
Recipe can be added to favorites list
-
Recipe can be removed from favorites list
NEW SEARCH RESULTS PAGE
Search results page includes all recipes under specific search entry
-
Breadcrumb secondary navigation improves user experience
-
Content managed hero title will read “Search”or any other title needed
-
Advanced search displayed above hero fold
-
Search results presented
-
Search results with option to load more and view all
-
Recipe can be added to favorites list
-
Recipe can be removed from favorites list
NEW BLOG POST FEED PAGE
“Most Recent” subcategory recipe blog post feed
-
Breadcrumb secondary navigation improves user experience
-
Recipe subcategory “most recent” blog post feed list with entry post date, title, short description and link to continue to read the post
-
Load more button to view more posts
-
Content managed categories presented on right column
-
During phase two of development, cross-sells and additional messaging will be included on right column along with content managed clickable categories
NEW RECIPE POST PAGE
Recipe post presented with recipe image, title, diet category, total cook time, serving information / suggestions, ingredients, directions and much more
-
Breadcrumb secondary navigation improves user experience
-
Recipe can be added to favorites list
-
Recipe can be removed from favorites list
-
Print recipe button is easily accessible and directs to a printing options page
-
Recipe can be emailed
-
Recipe can be pinned on Pinterest
-
Recipe can be shared on Facebook
-
Ingredient list with clickable check mark ingredient labels
-
Step by step preparing and cooking directions
-
Photo credit for recipe image
-
“Recommended for you” slider recipes exhibited under recipe post
-
“Recommended for you” slider recipes can be added to or removed from favorite list
-
Content managed categories presented on right column
-
During phase two of development, cross-sells and additional messaging will be included on right column along with content managed clickable categories
NEW PRINT RECIPE PAGE
Full recipe post is displayed with user friendly printing options
-
All recipes automatically print in black and white
-
Recipe can be printed fully as it is presented
-
Print recipe and print option buttons are easily accessible on top of page
After print options button is selected, user can select print choices
-
Images can be included or removed
-
Description can be included or removed
-
Text size selections are small or large type
-
As stated before, recipes automatically print in black and white making them very legible
RESULTS
Designed a user friendly recipe blog that will help GOLO customers in their weight loss journey
Entire blog is built with editable CMS components that will allow for changes to go live faster.
CMS components can be used universally on GOLO’s regular main blog.
Created an improved recipe search experience.
Develped advanced search.
Featured recipes categories are easy to find.
Significantly reduced scrolling.
Added breadcrumb navigation.
Designed a clickable category directory eliminating the long dropdown that was an issue in the old design. Directory allows recipes to be listed by meal type, course, diet, season, method, ingredient, and by series.
Introduced “Most Recent” subcategory recipe blog post feed.
Recipes can now be added to or removed from favorite’s list.
Recipe post offers many options.
Print recipe button is easy to find.
Print recipe page provides image, description and text size options. All recipes automatically print in black and white so that they are legible for people of all ages.