Whole Foods Mobile Prototype HCI course project · mobile-first grocery flow

A simple mobile grocery demo

This prototype explores what a cleaner, easier Whole Foods shopping flow could look like on a phone. You can walk through onboarding, browse categories, open product details, and step through a basic cart and checkout experience.

Browse: category chips and a simple product grid.

Details: pricing, tags, and basic product info pulled from a JSON dataset.

Flow: onboarding → home → shop → cart / profile / payment screens.

Built with HTML, Tailwind CSS, and a small JSON-backed DataAPI for course work and portfolio use.

Project Team

DW
Devin Washington
Full Stack Dev & Architecture Lead
CS
Carson Sproles
Design & Flow Lead
CH
Carson Hill
Project Lead
BB
Brady Bittner
Front End Dev
JV
Jhania Vitalis
UI/UX & Front End Dev
MH
Micai Harrison
Prototyper/Tester
WHOLE
FOODS

Demo screens

These links load the same prototype at different points in the flow.

Start at onboarding Go to home screen Open shop view