Cookflow

An interactive recipe interface that connects ingredients to the steps of cooking.

Interface Design / UX / Custom Data Viz

Visit live site viz.recipes
Interface demonstration · Cookflow

The project

Cookflow presents a recipe as a visual flow. Ingredients, utensils and cooking steps connect through a diagram, with individual ingredients responding as you click through them.

The recording follows the introduction, recipe selection and ingredient interactions. The interface uses illustration, typography and connected paths to organize the recipe and show progress through its ingredients.

My role

Independent design and development

  • Designed and built the recipe interface.
  • Developed the interactive ingredient states and visual cooking flow.
  • Created the animated introduction and visual treatment.

Independent work · Original Cookflow