Skip to content
All work

Case study 04 · Concept

Ember Coffee Co.

Small batches. Big flavor.

A small-batch roaster with a café. The site needed to sell beans online, grow subscriptions and still feel like the roastery smells.

Style
Warm & crafted
Industry
Coffee roaster · Shop & subscriptions
Built with
Astro · Tailwind · Netlify
Client
Fictional business, studio concept
Open the Ember Coffee Co. concept website in a new tab

The brief

What it had to do.

Ember roasts every Tuesday and ships within 24 hours. Their beans were sold through a generic marketplace page that hid what makes them special. The new site tells the freshness story, makes each coffee easy to choose, and pushes subscriptions as the default.

  • Goal 01

    Online bean sales

  • Goal 02

    Subscriptions as the default

  • Goal 03

    Foot traffic to the café

Design decisions

Every choice has a reason.

  1. 01

    Packaging as hero

    The bags are the brand. Designed in SVG with crimped tops, valves and printed labels, they carry the whole first screen.

  2. 02

    A warm, chunky serif

    Young Serif feels like a hand-painted shop sign. Paired with Inter for clean prices and tasting notes.

  3. 03

    Choosing made simple

    Three coffees, three tasting notes each, a roast meter. No 40-item catalog to scroll through.

  4. 04

    Subscription first

    A clear “how often?” picker with the saving shown up front. Skipping and pausing are promised before you sign up.

Palette

The colors.

Click a swatch to copy its hex code.

Typography

The voice.

Young SerifDisplay

Big flavor.

ABCDEFGHIJKLMNOPQRSTUVWXYZ abcdefghijklmnopqrstuvwxyz 0123456789

InterBody

Milk chocolate · Caramel

ABCDEFGHIJKLMNOPQRSTUVWXYZ abcdefghijklmnopqrstuvwxyz 0123456789

Mobile

Built for the phone first.

Most visitors arrive on a phone, so that is where we design first. These are the live mobile layouts.

Page structure

Top to bottom.

  1. 01Packaging hero with steaming cup
  2. 02This week’s roasts
  3. 03Subscription picker
  4. 04Café hours & menu

Next case study

Forge

Dark & bold · Gym · Strength & conditioning

Want a site that feels this considered?

Start your project