01 / CRM Design / Email / Motion

Hulu

Title-specific creative, built for recurring CRM production.

Hulu project overview
Client
Hulu (via VML)
Tools
Photoshop, Figma, After Effects, HTML/CSS
Type
CRM / Email Design & Motion
Duration
March 2022–July 2026
Role
CRM Designer & Developer

Brand work

  • Hulu
  • Disney+
  • ESPN+
  • FX
  • FOX

The task

Recurring sends needed distinctive show creative within reliable one-, two- and three-column email layouts. Each campaign had to preserve partner-brand identity and a clear action across inboxes.

My contribution

My marketing design scope on the Hulu account covered campaign layouts, title-specific creative, responsive templates, After Effects GIF heroes and HTML/CSS production QA.

The approach

A responsive template foundation with campaign-specific art, typography and animated heroes, carried through HTML/CSS production and rendering QA.

What shipped

400+ production-ready Hulu CRM campaigns through VML across 10+ partner brands, including custom creative and After Effects GIF heroes.

Explore the design decisions ↗

Visual System

Color

#1CE783
#040405
#183949
#FFFFFF

Typeface

Graphik

Hulu's brand typeface

RegularMediumSemiboldBold

Actions & patterns

A clear campaign action beneath the hero. Title campaigns adapt the treatment to their own visual world.

Explore the actual work

Motion designed for the inbox.

Title artwork, typography and pacing carry the promotion inside the inbox. These original campaign animations loop together so the creative is visible immediately.

Stream on Hulu

Stream on Hulu campaign hero.

What’s on Hulu

What’s on Hulu campaign hero.

What to watch next

What to watch next campaign hero.

Disney Bundle Aurora

Disney Bundle Aurora campaign hero.

Find Your Next Series

Find Your Next Series campaign hero.

STARZ add-on offer

STARZ add-on offer campaign hero.

01

The task & my contribution

My ownership

My marketing design scope on the Hulu account through VML covered campaign layouts and title-specific creative. I connected Photoshop source art, responsive Figma layouts and HTML/CSS production QA, and introduced lightweight After Effects GIF heroes as a reusable creative option.

Creative inputs

Show artwork and partner-brand requirements provided the starting point. I translated them into campaign hierarchy, layout and animation for Hulu, Disney+, ESPN+, FX, FOX and the wider partner portfolio.

02

Visual craft & interaction decisions

Keep the structure stable; let the title lead

One-, two- and three-column patterns provide a repeatable production foundation. Campaign-specific color, typography and imagery carry the identity of each show without rebuilding the underlying email structure.

Use motion to carry the promotion

Animated heroes connect title, message and action in a short visual sequence. The promotion stays readable inside the animation, while the supporting email content remains still.

Design for the inbox, not just the artboard

The final creative has to survive narrow screens, email-client rendering and dark mode. Responsive layout and implementation QA are part of the design task, alongside the visual finish.

03

Production QA

Production QA

I reviewed responsive rendering, brand consistency and dark-mode behavior across email clients and devices. The goal was to carry the hierarchy and motion from the design file into a reliable inbox experience.

04

Reusable systems

A production system with room for expression

The recurring layouts share spacing, column structure and repeated promotional modules. New titles change the art direction and message within that foundation.

Follow the hierarchy through the finished emails

The examples below show how hero creative, supporting content and repeated actions fit together. The compact previews preserve the complete email; expand one to inspect the layout from header to footer.

Pattern roles & assembly rules

The repeatable structure supports production; campaign art carries the title. These rules describe the layout patterns in the finished emails.

Purpose
Organize the amount and priority of campaign content.
Pattern & variation
One-, two- and three-column formats.
Usage rule
Choose the layout for the content hierarchy, then review the responsive result in the inbox.

05

Design through implementation

From layered creative to motion

I prepared Photoshop layers, designed the animation frames in Figma, animated keyframes in After Effects and exported email-ready GIFs. HTML/CSS development and rendering QA connected the creative to the finished campaign.

  1. 01

    Prepare source layers

  2. 02

    Design Figma frames

  3. 03

    Animate keyframes

  4. 04

    Export the email GIF

  5. 05

    Review the email

06

Accessibility

Readable promotional hierarchy

Mobile legibility, clear actions, image fallback and dark-mode behavior informed production QA. Typography and pacing keep the main promotion understandable alongside the creative.

07

The finished work

Production scope

400+ CRM campaigns across Hulu and 10+ partner brands, with responsive production layouts and animated heroes as a recurring creative option.

What the work demonstrates

Campaign-specific visual judgment, reusable email patterns, motion craft and hands-on production. The examples connect creative decisions to the finished inbox experience.

Delivered work

400+ production-ready CRM campaigns