Exploring Kinetic Email: Part Two

In our first post, we introduced the basic principles of kinetic email design.  We covered why kinetic is not another term for interactive or dynamic, and outlined how kinetic design differs from the inclusion of interactive email elements. 

It’s important for email marketers to understand the differences between contextual, dynamic, and kinetic email approaches. Knowing the difference between these terms is akin to knowing the difference between SEO and SEM. Both terms are search engine-centric, but each represents a different approach to lead generation.

Defining Email Interaction

Contextual Email Marketing

Contextual email marketing (real-time email marketing) is a personalization strategy that can blend both known and unknown subscriber data for maximizing message relevance. Contextual content differs from dynamic content because the term ‘contextual’ implies forward-facing segmentation at the moment the email opens. In contrast, generic dynamic content refers to a personalization strategy that relies on data known about the recipient at send-time.  

Contextual email attributes:

  • Provides template-level email content personalization
  • Utilizes forward-facing opener attributes and, in some cases, previously known subscriber data
  • Requires server-based logic alongside real-time opener attributes to render email content


Contextual Email - Golfsmith

Golfsmith drives sales by promoting special outdoor equipment discounts for Memorial Day weekend with live weather forecasting that adjusts based on the opener’s location.

Dynamic Content

As mentioned, the term dynamic content typically refers to the personalization of a message using previously known subscriber data.  The central difference between dynamic content and contextual content is the use of open-time data.

Dynamic email attributes:

  • Provides subject line and template-level content personalization
  • Utilizes previously known subscriber attributes
  • Requires server-based logic during deployment to render email content


Campaign Monitor - Dynamic Email Example with Adidas

This Campaign Monitor-cited email a great example showcasing how Adidas used dynamic content to change images and offerings in its email. Previously known data was used to render different content for males and females.

Kinetic Email Design

Last, kinetic email design is a way to create interactivity within an email template. Content is personalized by exploiting the capabilities of certain mail clients by using native HTML5 and CSS3 to create animations, enable responsive email elements, and add motion to traditionally static email content. Justin Khoo, Founder of FreshInbox.com, believes that a kinetic approach can remove external requirements like server side logic to display content.  Another big differentiator between kinetic design and the other approaches is segmentation. The kinetic email approach does not apply to personalizing content, it primarily focuses on the visual interaction of the content inside the email template.  

Kinetic email design attributes:

  • Provides template-level animations and motion
  • Uses only native HTML5 and CSS3 to employ interaction
  • Leverages CSS selectors and pseudo-selectors to create interactivity


kinetic email

On FreshInbox.com, Justin Khoo reviews a kinetic email campaign by Pret’s. The image on the right would fill the cup up with the flavor selected beneath using a kinetic design technique. Non-kinetic email clients displayed a stack of filled drinks as a fallback image to prevent display issues.

The Overlap of Dynamic Content, Contextual Email, and Kinetic Design

Liveclicker believes that the possibilities enabled by kinetic email design represent an important step forward within the industry, especially as it applies to device detection.  We also agree that, in some cases, kinetic design enables interactivity that eliminates the need for server-side content serving logic, the cornerstone of contextual email marketing.  For example, enabling modal overlays or hamburger menus within email can be accomplished using kinetic approaches alone.  Dynamic content can be used with both contextual email marketing, and with kinetic email design.

Liveclicker believes there is confusion in the industry around identifying when contextual email marketing technology (server-side technology) is needed in the area of device detection, in the context of kinetic design (and, in some cases, dynamic content), so we’ve set out a few examples for readers:

Embedded Video:

  • Kinetic design enables multiple experiences to display within email (e.g. video or .GIF); contextual technology is required to maintain compatibility across iOS 10, 9, and 8.  Contextual technology is also required to enable custom HTML5 poster images within Outlook (non preview edition) or to vary quality/frame rate within different mail clients, both for embedded video and .GIFs.  Contextual technology is also required to display an image other than the first frame of an animated .GIF video for mail clients that are unable to properly render HTML5 video, and to display size-optimized .GIFs for Gmail.  Finally, contextual technology is required to collect analytics on user interactions with the different experiences.


  • Kinetic design enables sliding images within iOS using CSS alone, but rendering those slides at open-time with, say, unique offers, personalized messages, or time-sensitive offers requires the use of contextual technology.  Likewise, for mail clients that do not support scrolling images controlled through CSS, choosing to render specific animations or images based on mail client detection requires contextual technology.  Finally, changing the destination URLs for any of the images in the slideshow post-send requires the use of server-side technology.

Hamburger Menus, Modal Overlays, Forms:

  • These options can be rendered completely through the use of custom CSS.  There is no need for server-side logic to enable these experiences.

Scratch to Reveal:

  • A ‘tap to reveal’ function can be enabled in iOS using CSS.  Displaying personalized revealed images requires the use of contextual technology; further, if there is any logic required to display this image at open time, then server-side contextual technology is needed.  Determining what, if any, ‘cover image’ to display in the scratch to reveal experience also relies on contextual technology.  To determine if a cover image has been clicked in iOS, and matching that click to the open, server side help is needed.


  • It is possible to display a poll in email that, when clicked, displays an image in the iOS mail client.  Enabling the image that displays to update with the current poll results or a custom image requires the use of contextual technology. Displaying updated poll status on subsequent opens requires the use of contextual technology.  Determining whether to display the poll question or poll results on subsequent opens also requires the use of contextual technology.



It is possible to blend dynamic content, contextual email technology, and kinetic design to create interactive email messages, but it is important for marketers to understand the differences between each.

If you are looking to boost performance in a static or dynamic email campaign; consider enhancing dynamic content with the use of contextual email marketing techniques. If you are considering adding kinetic design practices to your program, consider optimizing the approach through contextual technology.

Ultimately, the marketers who are most successful will combine all three approaches to:

  • Take advantage of known user data (dynamic content)
  • Enhance the personalization of messages at open time (contextual email marketing)
  • Exploit emerging mail client capabilities using CSS3 and HTML5 to create message interactivity (kinetic design)

Stay tuned for more kinetic email information! We have three more posts coming, filled with examples, expert interviews, and industry forecasts!

Happy sending!