ACS Fall Meeting 2021 Social Media Graphics

Work for hire for the American Chemical Society (ACS) Meetings & Events by Lara Lee while employed at CSG Creative with permission for Lara Lee to display for self-promotion.

Case Study: ACS 2021 Fall Meeting Social Media Graphics

Background

The American Chemical Society (ACS) launched its bi-annual National Meeting & Exposition to feature thousands of presentations on new discoveries in science—once more a hybrid event both online and in-person. The ACS Fall 2021 National Meeting & Expo is ACS’s second hybrid event, after its premier hybrid event last spring.

CSG Creative Art Director Courtney Lopes created the event visual identity and brand for the Fall 2021 Meeting.

Using Lopes’s work as a foundation, I developed the web accessibility color guidelines for my colleagues and the client’s in-house designers. I also produced 130 of 134 web graphics including onsite digital signage, web ads, website banners and slides, and social media graphics.

The client uses social media extensively to market its virtual and hybrid events. This Fall’s social media marketing required 3 profile page graphics and 46 feed graphics plus 2 ecards and 13 digital signs, which further double-served as social media graphics—and all 64 of these must pass web accessibility color contrast testing to maintain user readability.

My Role

Digital Designer,
Web Accessibility Lead

Art Direction

Courtney Lopes

Agency

CSG Creative

By the Numbers

0 nd
Hybrid Virtual & In-Person National Meeting
0
Social Media Graphics across 15 Campaigns

Branded Social Media Profiles

including Facebook, LinkedIn, and Twitter

Live Facebook page cover from the Fall 2021 branded social media graphics.

Each National Meeting introduces itself with branded social media profiles. Facebook, Twitter, and LinkedIn all receive profile and/or cover page graphics promoting the latest name and theme, just like Spring 2021’s social media graphics.

I record the “last known good configuration” using CSS shorthand to indicate safe areas of the latest social media web sizes:

  1. Facebook_Business Page Cover_1702x630 w/margin: 50px 310px
  2. LinkedIn_Company Cover_1920x350 w/margin: 13px 58px 26px
  3. Twitter_Universal Cover_1500x500
Safe areas are marked off in magenta.
Safe areas and margins are marked off in magenta.
Live Twitter screenshot of a branded page cover.
Twitter profile cover on mobile.

The Green Light on Web Accessibility

Every ACS social media graphic must pass the web accessibility color contrast test. These web standards, established by WCAG, ensures user readability. The standards include a minimum color contrast level between text and its background; font-size appropriate to the color contrast level; and descriptive alt tag text.

While ACS is not my only client that adheres to WCAG’s web accessibility standards, they do request the highest number of web-accessible graphics. They prefer testing using WebAIM’s tool here.

Screenshot of WebAIM's color contrast checker tool.
WebAIM Contrast Checker

Posts, Posts, & More Posts

A final total of 64x social media profile and post graphics promoted the Fall Meeting. Here’s a sampling:

Social Media Motion Graphics

I made these animated ecards with Adobe After Effects. While I knew how to transform layer positions, I taught myself how to animate walking via layer tracking to finish the job. The animation starts in media res, with the opening slide displaying the whole message and CTA for email clients that don’t support GIFs.

Dual-purpose social media graphics: ACS also used this square animated ecard in their social posts.
Dual-purpose social media graphics: ACS also used this vertical animated ecard to call viewers to register for the event.