CCA Email Suite — Newsletter & Auto-Reply | Project by Ryan McGatha

A complete editorial email system designed and built from scratch for Concerned Citizens for Animals (CCA), a Greenville-area no-kill animal shelter. The suite includes three production emails: Paw Prints — Spring 2026 (Issue No. 01 of the rebranded newsletter), Paw Prints — Winter 2025 (the holiday catch-up issue), and a send-only auto-reply for newsletter@ccaweb.org that redirects accidental replies to the right contact channels.

Before & After

From a default Mailchimp template to a brand identity.

CCA's previous newsletter was a stock Mailchimp drag-and-drop: logo, a centered paragraph blob, raw shop URLs pasted into body copy, two bright-blue buttons, and three social icons whose links were left as https:// placeholders. The redesign rebuilds it as a hand-coded editorial email with a real masthead, a hero image, an impact grid, branded sections, and a donate card — all in one consistent design system reused across the auto-reply, Winter 2025, and Spring 2026 issues.

Before — Default Mailchimp templateView live →

What changed

Visual identity
BeforeDefault Mailchimp template — black text on white, generic Helvetica-only typography, centered paragraph blob.
AfterCustom editorial system — cream + ink palette (#f5f2ed / #1a1a1a), serif masthead, structured layout, brand-owned look and feel.
Masthead & hero
BeforeLogo only. No issue number, no tagline, no hero image.
AfterCustom “Paw Prints” serif lockup with issue eyebrow, italic tagline, and a full-width hero photo with caption.
Story structure
BeforeOne centered paragraph blob followed by a list of raw URLs pasted into body copy.
AfterSectioned editorial: From the Desk lead story, an impact grid, the Wish List, a Donate card, a Get-in-Touch directory, and a footer.
Impact reporting
BeforeNone.
AfterThree-column stat grid framed top and bottom — 199 animals placed, 708 community cats via TNR, $248K in medical care.
Calls to action
BeforeTwo stacked bright-blue buttons — “CCA” and a long PDF-link button.
AfterA dark featured-issue CTA card with eyebrow, headline, body, and a cream pill button — plus a separate dark donate card with hybrid two-up PayPal/Shelter Luv buttons and text-to-give.
Social & footer
BeforeThree Mailchimp social icons whose hrefs were left as “https://” placeholders, plus an unrendered Mailchimp merge-tag block in the legal text.
AfterReal text links (Website / Facebook / Instagram / Petfinder), polished copyright + 501(c)(3) line, and clean Update Preferences / Unsubscribe links.
Mobile & rendering reliability
BeforeMailchimp defaults — fine, but no specific accommodations for stacking, iOS rendering, or dark mode.
AfterA custom mobile breakpoint stacks columns and retunes type, the suite forces a light-only color scheme, all rgba/opacity colors are pre-blended to solid hex so Gmail iOS doesn’t flatten them to black, and selectors stay class-only so Gmail iOS doesn’t strip the style block.

Designed in Figma and hand-coded as bulletproof, table-based HTML emails sharing one design system: a serif “Paw Prints” masthead, a dark CTA card pattern, three-column impact stat grids, an essentials wish list, and a dark donate card with hybrid-responsive two-up buttons. Every visual style is duplicated inline against a Gmail-safe style block, with MSO/IE ghost tables for desktop Outlook and a single mobile breakpoint that stacks columns and re-aligns the masthead, donate buttons, and stat grid for narrow viewports.

Reliability work was a big part of this project: forcing a light-only color scheme so dark-mode clients don't recolor the cream palette, replacing all rgba/opacity colors with solid hex blends so Gmail iOS doesn't flatten them to black, avoiding any unsupported selectors that would cause Gmail iOS to strip the entire style block, and writing CSS comments carefully so Mailchimp's processor doesn't mangle them.

End-to-end ownership: art direction, typography, layout, illustration choices, copywriting, hand-coded HTML/CSS, cross-client QA in Gmail (web + iOS + Android), Apple Mail, Outlook, and Mailchimp, and delivery as production-ready templates the CCA team can drop into Mailchimp issue after issue.