ALLRECIPES

VIDEO COOKBOOK

An instructional cooking video app for the Windows 8 and 10 tablet experience.

CONTEXT

 

There are endless cooking how-to videos on the web. But when it comes down to actually cooking from a video there are practical complications that come with using a device in the kitchen. The Allrecipes Video Cookbook for Windows allows users to pause, skip and go back to any step with a single tap. Ingredients are displayed prominently alongside the video for easy reference. 

OBJECTIVES

 

• Combine Windows UI conventions with the Allrecipes brand aesthetic

• Maintain the identity of a recipe as seen on Allrecipes

• Showcase recipes through video

• Create a user experience that integrates the process of cooking seamlessly with the step by step video model

PROCESS

• Problem definition

• Examined user data from

• Whiteboard wireframes  

• Hi-fi mocks and visual design

• Redlines and assets

RIGHT: Detailed redlines delivered to the outside agency developing the Windows app for Allrecipes.

MY ROLE AT ALLRECIPES 

At Allrecipes I worked closely with product managers and engineers of multiple scrum teams plus other members of the design and marketing team. My role as a UI/UX designer was very collaborative especially with other designers. I worked iteratively on a variety of products including the main website, an Android app, iOS Apps as well as a Windows app.

See another case study

2/5 Video Player

Since the app is video focused, the recipe video has the most visual weight. Basic recipe stats are seen below. The ingredients section of the recipe sticks to the top of the screen while the directions scroll beneath. Directions can be highlighted.