Prairie House Coffee Co
Coffeeshop Website

Prairie House Coffee Co

Project
Coffeeshop Website
services
Art Direction, Design System, Web Design, Webflow Development, eCommerce
Prairie House Coffee Co

Prairie House Coffee Co needed a website that communicates their values and offerings.

Intro

Sisters Jade and Alexa of Prairie House Coffee Co. approached me asking for help building a website for their coffeeshop in Oakland, FL, which would soon be celebrating its first anniversary of being open.

Phase 1: Design System

With minimal stylistic guidelines other than a logo and a few dozen Instagram posts, I got to work on building out their digital brand presence.

Color

We landed on a simple black and white color palette with just a touch of green to highlight their dedication to sustainability and locally-sourced organic products.

Typography

Typography was similarly minimal and classic to reflect their expertise in the coffee industry and approachability in attitude.

Line Style

Thin lines were a design motif throughout the website. Not only are they a nod to the workhorse body font, Open Sans, but are also used in iconography, imagery, and section borders to help neatly frame and delineate components.

Imagery

Imagery is focused first on the coffee and food products offered by Prairie House. Other images include the coffee shop (which happens to be the oldest building in Oakland!) and the people that make Prairie House great.

I also provided several options for how multiple photos could be grouped together.

Various image lockups

Phase 2: Development

By incorporating strong product/venue photography and a homepage video showcasing their coffeeshop, the viewer gets a taste of the Prairie House Coffee experience. Features of the site include a custom contact form for renting the coffeeshop space, links to order online for in-store pickup or for delivery through Uber Eats.

Homepage featuring video reel of building, people, and coffee
Venue Rental Page
Contact form with conversational tone

Interested in working together?

Let's chat.

get in touch