Animated Typography



HTML Display Ads

For this display campaign I did for Southern Indiana Tourism, I was responsible for digital art direction (graphic design & animation design), and ad production (HTML/CSS/JavaScript). Yes, they’re kinda cheesy— the creative direction & copywriting wasn’t me.
Like typical HTML ad inventory, the animation begins when they come into the viewport, and runs for 3 cycles. Reload the page if you’d like to re-play the animations.

Static HTML display ads for a local campaign.

A wide skyscraper display ad, and creative for Facebook ads.

Digital Illustration

Animated SVG

These are animated SVG (scalable vector graphics) illustrations I made just for fun (and to play around with web animation techniques). The dog is interactive— tease him by dragging the biscuit around.

Campaign Branding Designs

The campaign’s outdoor signs featured a photo of the candidate’s face, so this pop art-inspired mural design became easily recognizable iconography and worked well as a brand motif.

Digital promo graphics for campaign events.

We got a local ice cream shop to create a custom flavor called “Yes, we Coan!” I designed the following sign to promote it in the shop and at an event, and the tickets were given to event attendees to redeem for a free scoop.

KY Democrats Branding

When I first started with the Kentucky Democratic Party (or “KDP,” as everyone called it), they had a serious brand problem. The old logo (pictured) was only part of the problem, but yikes, was that logo bad. Redesigning the organization’s graphic identity was the immediate priority, as I couldn’t take any other meaningful action to building an effective digital infrastructure with the existing brand assets.
I wanted to shed the “KDP” initialism identity, and use “the Kentucky Democratic Party” sparingly, in favor of the more inclusive “Kentucky Democrats.” The following is part of the brand package I designed— the new logo marks and brand colors.
This color picker copies the hex or rgba values to the clipboard. This is handy for everyone in the organization to make sure the brand’s visual identity remains consistent across channels. I also designed and coded that custom dynamic eyedropper cursor, because, why not? It’s fun.
Here’s an animation demo of the transition between the two versions of the logo for responsive design or user interactions.
And lastly, an animated landing page background I made for our 2018 “Blue Wave” campaign.