Allrecipes
Allrecipes is a food focused online social networking service founded in 1997. In 2015 Allrecipes launched a redesign that was met with criticism due to a decrease in usabiity.
UX/UI Redesign
View Prototype
Redesigned home page
Design Exercise
Allrecipes unveiled a new design in 2015 Targeting Millennials (approximately 25-35 year olds). A side effect of this was the alienation of existing users, who felt that much of the utilitarian aspects of the site were lost. The goal of this redesign exercise was to combine the needs of the two user groups (Allrecipes target group of Millennials and the original user base) to create one cohesive design that addresses the requirements of both groups.
Wireframes, browse results and quicklook (left), home page (middle), search results and quicklook (right
Wireframes, tutorial listing and tutorial page
Wireframes, recipe page(left), images quicklook (top), comments full view (bottom)
User Groups
Two user groups were define for this project: the New Audience and the Original Audience.
The New Audience consisted of Millennials, approximately 20-35 year old men and women. They are social-networking oriented, sharing both the process
of their cooking as well as staged photos of their results. The New Audience likes to learn new skills as they cook, preferably through video. They find
their recipes by browsing, using a rationale of "I'll know it when I see it". Often recipe choices are made based on the number of pictures associated with
the recipe and the popularity rating. They are cooking more for the experience than the finished product. This was the target group for Allrecipes redesign efforts.
The Original Audience of Allrecipes was predominently women between the ages of 30 and 65. These users were targeted searchers, meaning they search for
specific recipes based on ingredients or type of food they have in mind. They are active readers of the ratings and reviews to see if the recipe can be improved
and what people thought about it. Time is a large factor in the choice they make - they are cooking for necessity over the experience.
-
Expert Review
Reviewed the site with design heuristics in mind. The main focus was on the process to find a recipe based on search criteria and based on general category or idea. The main pages reviewed were the home page, search or browse results page, and an actual recipe page.
View Report -
User Personas
Researched Allrecipes redesign process and rationale to devlope two user groups, the New Audience and the Original Audience. Conducted a deep dive research into both groups to fully understand what they value, how they interact with technology, and how they use Allrecipes as a recipe source. Created user profiles for both groups.
View User Personas -
Storyboard
Storyboards were drawn to better empathize with the customer's use cases, mindsets, and behaviors.
View Storyboard -
Wireframes
Created wireframes to sketch out the main pages for redesign: home, search results and browse results, quick look, recipe page (photos and reviews), and tutorial page.
-
Design & Interactivity
Defined interactive elements and executed in Axure. Because this is a social media type site, many of the pages had numerous interactions that needed to be clearly understood by users and well-integrated into the page. Visuals were defined by Allrecipe styleguides.
-
Planned User Testing
Had this been a continuing design project, the next step would be user testing. The designs would be tested with eight current Allrecipes users, four from each user group, looking for thoughts and feedback on the redesigned browse flow, search flow, and recipe page. The main task for the New Audience would involve finding a recipe that interested them in the browse flow to understand behaviors, how they use the browse capabilities, and timing how long it takes them to choose. The main task for the Original Audience would involve a search based on specific ingredients to understand if the search capabilites meet their needs for finding recipes.
Persona, Original User
Persona, New User
Storyboard
Solution
The goal of this redesign was to facilitate two different user groups in their search for recipes and social experience. The home page redesign psrovide
better access to both main behaviors – Search and Browse – to accommodate both types of users. There are invitations to explore and interact if user does
not have a behavior in mind. Video tutorials and access to the Allrecipes magazine subscription were also added to include an additional layer of
social networking and learning.
View Prototype
Original Allrecipes home page (left) and 2015 redesign (right)
Allrecipes home page redesign
Browse: original (left) and redesign (right)
Browse
The browse flow allows users to filter through recipes by selecting categories and subcategories, displaying recipes in an algorithmic order based on user interactions and popularity. The main images are larger to accommodate New Users recipe browsing based on photos. Users can look through recipe pictures before clicking through to the recipe to quickly see if is a recipe they are interested in making. Hovering over the star ratings allows users to see the distribution of ratings without clicking through to the recipe. Exploration and discovery are the guiding principles for the browse flow, which targets New Users.
Search: original (left) and redesign (right)
Search
In the search flow, the utilitarian aspects of the recipes were highlighted (time to prep and cook) to accommodate Original Users who are task-oriented. The page retains the auto loading, social media-like scroll, but it is arranged in a clearer, easier to read grid. Users can look through recipe pictures before clicking through to the recipe to quickly see if is a recipe they are interested in making. Hovering over the star ratings allows users to see the distribution of ratings without clicking through to the recipe. The search flow is designed to be accomodate efficiency, the goal of task-oriented cooks.
Recipe: oiginal (left) and redesign (right)
Recipe
The recipe main page is a mix of New User and Original User needs. For the Original Users, the utilitarian aspects of the recipes, main actions, and nutritition information are prominent to allow recipe selection based on time availble, skill level, and nutritional content (all aspects important to a majority of the original Allrecipes users). For the New Users, related recipes are de-emphasized but still available on the page. Recipe images are promiently featured, as well as the review interaction. Finally, tutorial videos are highlighted, which are a favored feature of New Users.
Tutorials: search results (left) and main page (right)
Tutorials
Another aspect of Allrecipes that was important to New Users was video and text based tutorials. New Users report an interest in learning new skills while they cook, and learn the most from watching a video featuring someone showing that skill. While these videos are available on Allrecipes, they are not given much prominence on pages. In the redesign, links to featured tutorials are featured on the home page, and related skill videos are added to recipes. The redesign also features tutorials as their own searchable content.
Have a project in mind or want to know more? Contact me