Love Fonda logo

 

253 Meals | 61 Days

UI/UX | WEB DESIGN & DEVELOPMENT | RESPONSIVE DESIGN

253 Meals | 61 Days is an interactive website displaying every meal I ate from October 16, 2014 to December 16, 2014. Filters allow the user to sort each food item by meal, as well as food type. Results can be seen in chronological order or by food category. All meals have been categorized into food groups and quantities are represented by the length of the rectangle. Alternately, individual meals can be viewed as small multiples.

Chronological Order

All food and beverages listed in chronological order

Food Type

All food and beverages listed in small multiples by meal

Discovery + Ideation

exploratory graphs

The following are exploratory graphs created before determining the scope of final project. Initial concepts included visualization of any and all quantifiable data from just one week of daily activity. A wide range of graphs, charts, layouts and data points were implemented in an attempt to start this project with as many options as possible.

exploratory graphs
exploratory graphs
exploratory graphs

Data on all activities performed through one week

Raw data

I collected data for each food and beverage item consumed over the time period of 61 days. Details include time, date, day of the week, meal (breakfast, lunch, dinner, snack), full meal, food and beverage grouping with serving size.

253 Meals | 61 Days data

DATA DIAGRAMS

The next round of data visualization used the real data collected over the 61 day time period. The graphs and charts below were created using Tableau for a quick round of semi-automated digital options.

253 Meals | 61 Days data
253 Meals | 61 Days data

Visual Design

Each food or beverage tile is sized according to the portion consumed at that time. Users are able to navigate through any and all meals; sorting in chronological order, by food type, or small multiples. Hover effects display serving size, time and date of each meal and any additional food or beverages consumed.

Food Type

All food and beverages listed by food type

Chronological Order

Tooltip displays serving size, time, date and additional foods or beverages included in that meal

Beverage

All beverages listed by food type

Hover state

Tooltip displays serving size, time, date and additional foods or beverages included in that meal