Dogfish Head

Verndale · 2024–2025 · Senior Experience Designer

A rebuild balancing brand personality against a scalable Sitecore XM Cloud structure for editorial, product, and seasonal campaigns — now live at dogfish.com, a brand-forward platform the marketing team runs without breaking it.

Dogfish Head 60 Minute IPA homepage on a MacBook

Every screen had to feel like the brand. Not just reference it.

Background

Dogfish Head is a craft beer brand with a singular personality: loud, weird, and devoted. The old site couldn’t carry the brand or the e-commerce ambition behind it.

Every screen had to feel like the brand without referencing it, while meeting the structural needs of Sitecore XM Cloud and a marketing team living in it daily.

My role

I led experience design on the rebuild, balancing brand personality against a scalable platform structure for editorial, product, and seasonal campaigns.

Warm, weird, and specific. The old site was polished but generic.

This isn’t just a beer brand. One site has to carry brewery, distillery, restaurant, brewpub, inn, events, and merch, and serve as a foundation for other Boston Beer Company brands.

Co-founder Sam Calagione set the operating principle: marketing is less about what your product does than what it stands for. That became the IA rule. Stories first. Products second. Transactions third.

The 60 Minute IPA campaign on the new dogfish.com.

Dogfish Head design system overview — Product detail, events, cocktails, and brand expression in one system.

Naming the nav: six frameworks, one decision.

Six naming frameworks were evaluated against two criteria: findability and brand fidelity. The winner is mostly noun-based, with brand voice applied only where it adds meaning. “Blog” became Blogfish.

Step through how the IA was rebuilt below.

Navigation naming, six frameworks evaluated — Six naming frameworks, scored for findability and brand fidelity.

Drinks mega menu, before and after — The Drinks menu went two-panel so beer stays rich without crowding out spirits and cocktails.

One platform, four lines of business.

Restaurant reservations and inn bookings don’t need reinvented UX patterns. The brand does the work, not the patterns. One template family, distinct brand codes per surface.

Regional fans get activation: events, hospitality, drops. National fans get engagement: storytelling and the Fish Finder. Same nav, different jobs.

Visit page, four coastal Delaware locations — Visit: the gateway to four coastal Delaware properties.

Dogfish Head and Grateful Dead collaboration page — The Grateful Dead collaboration: brand partnership as a design moment.

Nineteen templates only hold if the primitives underneath are explicit.

Forms aren’t just forms. They’re base, error, and success as named states. Empty search results are a designed surface, not a leftover.

Contact form, base state — The contact form, base state.

Contact form, error state — Error: field-level and summary, designed together.

Search results with results — Search, with results.

Search results, empty state — And without: designed as a path forward.

A brand system, not just a set of screens.

Behind the nineteen templates sits a component library that carries Dogfish Head’s off-centered voice onto every surface. Navigation, banners, content modules, and a custom icon set, all built to brand codes the team can extend without me.

Dogfish Head component library board — The component library.

Global navigation and footer, one chrome across the platform.

Custom Dogfish Head icon set — A custom icon set, drawn in the brand’s hand.

Lifestyle product hero module — Lifestyle heroes put the product in the world.

Editorial product moment module — Editorial moments give a single beer room to breathe.

Featured product carousel module — A featured-product carousel for merchandising.

Content media row module — Content media rows for storytelling.

Brewing process timeline module — A process timeline: how the beer actually gets made.

Editorial image carousel module — An editorial image carousel for place and story.

Off-Centered Society community module — Off-Centered Society: a community sign-up module.

Accordion component for dense content — Accordions for the dense stuff: FAQs, hours, fine print.

And it all holds on mobile. Every template was designed at both ends, not scaled down after the fact.

Mobile hospitality page — A hospitality page.

Mobile events listing with filtering — Events, with filtering.

Outcome

Live at dogfish.com. A brand-forward platform the marketing team runs without breaking it.

templates, designed across desktop and mobile.

product themes — color systems for line-of-business variation.

lines of business — brewery, distillery, hospitality, and merch on one platform.

Live

in production, shipped on Sitecore XM Cloud at dogfish.com.

The calls that shaped it

Two audiences with one IA.

Regional fans get activation surfaces. National fans get storytelling and the Fish Finder. Same nav, different jobs.

Lines of business as content, not microsites.

Restaurant, inn, brewpub, and events share template structure. The differentiation lives in brand expression.

System primitives, not screens.

Form base, error, success. Search with and without. The 19 templates hold because the primitives are explicit.

Next project Velocity →

Let’s make something work.

Boston & remote · Open to full-time & contract

will.a.bruno@gmail.com