Stubb's BBQ

Overview

FormatPage Grabber

PlatformDesktop + Mobile

EngineGreenSock

AgencyUndertone

Heritage-driven campaign for Stubb's BBQ sauce, the Austin-born brand founded by C.B. Stubblefield. The creative leans into authenticity: rustic wood-grain textures, warm amber palette, and recipe-driven content that shows the sauces in action rather than on a shelf. A bottle-based flavor selector lets users tap a variety and see the hero recipe update.

Stubb's differentiates from mass-market sauces through heritage. The ad had to feel like a pit stop, not a grocery aisle.

Context

The design language was the engineering challenge on this one. Most of my ad builds used clean backgrounds and crisp typography. Stubb's needed the opposite. I layered CSS background textures (wood grain, paper, distressed borders) to build up the rustic aesthetic, which meant managing z-index stacking and opacity compositing across 3-4 texture layers per section. The bottle-based flavor selector was an interesting interaction model. Tapping a bottle triggers a GreenSock rotation tween on the outgoing bottle while the incoming one scales up from behind, and simultaneously the hero recipe card cross-fades to show that flavor's signature dish. The recipe photography was the selling point. Stubb's provided actual pit-master recipe content, so the engineering needed to display it in a way that felt like a recipe card you'd pin to a wall rather than a product listing.

How It Works

~2s

Heritage

Rustic background texture with Stubb's logo. Brand heritage tagline fades in with handwritten-style typography.

Interactive

Recipes

Recipe cards showcase sauces in use: ribs, brisket, pulled pork. Each recipe pairs a sauce variety with a technique and plated result.

Interactive

Flavors

Flavor selector: Original, Smokey Mesquite, Honey Pecan, Spicy. Each flavor renders with its bottle and a tasting note.

End State

Find

Store locator CTA and recipe page deep links. Coupon offer for trial.

Engineering

Rustic Design

Wood-grain textures, distressed borders, and warm amber/brown palette. CSS background textures layer to create the feel of a BBQ pit wall.

Recipe Cards

Food photography cards with sauce-in-action shots. Each card shows the sauce, the technique, and the result, grounding the product in real cooking.

Flavor Selector

Bottle-based selector where tapping a flavor updates the hero recipe and tasting notes. GreenSock animates the bottle swap with rotation.

Heritage Typography

Mix of handwritten-style and slab-serif typefaces. The typography tells you this is craft, not corporate, before reading a single word.

Engineering Decisions

Stubb's competes against Hunt's and Sweet Baby Ray's on shelf space. Heritage is the differentiator, so the ad needs to tell you why Stubb's is worth more.

Nobody gets excited about a bottle of sauce. Ribs glazed with Smokey Mesquite create desire. The recipe is the product demo.

Clean design would make Stubb's look like a health food brand. Rustic textures signal authenticity, craft, and Texas pit-house tradition.

Stubb's bottles have distinctive label designs. Showing the actual bottle reinforces the shelf recognition and makes the digital experience feel tangible.