Iris Li
Ground: Dairy-Free Espresso

Ground

Creating an all-in-one digital handbook for homemade vegan/dairy-free espresso.

  Project Type: Interaction Design    Duration: January-March 2019 (3-months)    Tools Used: Figma, Illustrator, Visual Studio Code, Photoshop     The Problem:    Many coffee consumers who are vegan or inhibit dairy sensitivities find themselves with very limited options for specialty espresso. While drink prices range from $4-$8, dairy-free substitutions can cost up to an extra dollar on top of that, which takes a toll on the wallet of the everyday espresso-drinker. I was tasked to create a website that would contain dairy-free recipes to encourage users to save money on their coffee spendings, while being able to enjoy a guilt-free espresso.

Project Type: Interaction Design

Duration: January-March 2019 (3-months)

Tools Used: Figma, Illustrator, Visual Studio Code, Photoshop

The Problem: Many coffee consumers who are vegan or inhibit dairy sensitivities find themselves with very limited options for specialty espresso. While drink prices range from $4-$8, dairy-free substitutions can cost up to an extra dollar on top of that, which takes a toll on the wallet of the everyday espresso-drinker. I was tasked to create a website that would contain dairy-free recipes to encourage users to save money on their coffee spendings, while being able to enjoy a guilt-free espresso.

How can one design a digital recipe book where users can browse, explore and learn about dairy-free espresso all in one platform?

How can one design a digital recipe book where users can browse, explore and learn about dairy-free espresso all in one platform?

Design Solution: Ground is an online web-based community of espresso coffee enthusiasts whose top goal is promoting dairy-free alternatives in coffee. The coffee community is growing everyday and Ground aims to provide the most delicious recipes for your nutritious needs. Whether you’re in the mood for a latte, mocha, or cappuccino, Ground is the ultimate dairy-free specialty coffee handbook for you.

Ideation

Ideation

Creating sketches of layout designs, possible user scenarios, and user flows. This process included low to high-fidelity wireframe mockups that were used in the conversion to HTML.

sitemap-04.jpg
wireframe sketches-03.jpg
Visual Design

Visual Design

Simple, clean, straight-forward.

design details-01.jpg
design details-02.jpg