De Mello: Branding a Coffee Roaster Beyond Its First Impression

The Brief

De Mello Palheta is a specialty coffee roaster in Toronto known for origin-based sourcing across a wide range of regions. A design agency had initiated a rebrand. My job was to translate that new identity into a functioning website and systems the internal team could actually maintain. No formal design department on-site..

De Mello's previous WordPress website — basic template, no landing page — Before: a basic WordPress template that didn't reflect the brand or the product quality

Website Redesign

The proposed landing page gave customers an immediate sense of the rebrand: cleaner typography, better product hierarchy, and direct access to new and featured offerings.

Redesigned De Mello website with new branding applied — Website redesign: applying the new brand identity to a proper landing page

Seasonal promotional variations for De Mello website — Seasonal variations: so the team could adapt each campaign without starting over

The Part That Mattered More: A Label System

De Mello releases new coffee blends frequently, including seasonal ones. Before I arrived, staff manually rebuilt labels for each release using a Word document. Fragile, slow, and error-prone.

I built a Figma component system for label creation. Staff could swap in a new blend name, origin details, and roast level in minutes instead of hours. The system used components and instances so edits propagated correctly without requiring deep Figma knowledge.

De Mello label Figma component system — blend names, origins, and roast levels as swappable variables — Label component system: new blend releases in minutes, not hours

Label system in use with multiple blend variations — The system producing multiple label variants from shared components

This was the thing that mattered most on the project. A design system for a 12-person coffee shop is still a design system. The approach holds at any size.

I produced a consistent visual system across digital touchpoints and designed physical merchandise keeping production constraints in mind throughout.

Social media system: coherent brand presence as a body of content

De Mello merchandise — apparel, tote bags, enamel pins, and postcards — Merchandise: apparel, tote bags, enamel pins, and postcards

A Small Experiment

The founder wanted a webpage dedicated to design for future collaborations and hiring. I built a sample page in Webflow to prototype the concept, something the team could extend when they were ready.

Webflow design collaboration page prototype — Webflow prototype: a design-first page for future hiring and collaborations

What I Took Away

The deliverable and the infrastructure around the deliverable are equally important. A great label design is useless if the team can't reproduce it. Designing the system for ongoing use was the thing that made the work stick. That's the thing I wish more brand projects spent time on.