Skip to Content
Technical Articles

Build your email countdown timer for SAP Marketing Cloud on SAP Cloud Platform

Introduction

Welcome to the blog posts of the SAP CX Services Marketing Practice.

We are happy to share with you our experience around Marketing Business, Technology and Analytics.

You want to see more blogs from us? Click here.

Background

A limited-time status often makes customers think that they need to act ASAP since time is running out. This concept is based on the “Fear of missing out” strategy to indicate that customers are missing out on opportunities.

Marketers have already been using this concept for a good while:

While booking.com mentions that a specific hotel room is in high demand, amazon.com shows the stock levels to indicate that products are about to run out.

 

User story and business question

To increase awareness and instantly communicate a limited time status (e.g. for events, offers or product launches), visual countdown timers can be included in emails. Visual elements are typically successful to grab the attention of the audience and help to understand that one needs to act now.

Email countdown timers are technically animated GIFs which count down to a specific time in the future:

The animated GIF can easily be imported into an email via the content studio of SAP Marketing Cloud.

Implementation

Extensibility on SAP Cloud Platform

The logic to generate the email countdown timer can be easily built using SAP Cloud Platform. SAP Cloud Platform is the place where SAP, partners or customers can build own apps or integrate existing apps.

The beauty of using SAP Cloud Platform and the Cloud Foundry environment (via the SAP Cloud Platform Application Runtime) is that we can bring our own language (BYOL) via system buildpacks or community buildpacks. System buildpacks exist for example for Go, Java, Node.js, PHP, Python, R and Ruby.

For this blog post, a countdown timer prototype has been created. This prototypical service on SAP Cloud Platform has been built in a way that it gets the countdown end time via URL parameters and returns a 60-second looping GIF:

In the moment when the customer opens the email containing the email countdown timer, the GIF will be generated and shown. An example is shown in the previous chapter.

Deployment on SAP Cloud Platform

The logic to generate the animated GIF looks like this pseudo code:

Retrieve_URL_parameter(countdown_end_time)
Set_visual_design(background_image, colors, font, size)
Loop N times
  Calculate_time_difference(countdown_end_time, now())
  Create static_picture
  Append static_picture to GIF
Return GIF

This application (including libraries, e.g. to create images) can be deployed from the Cloud Foundry Command Line Interface using the cf push command. For this prototype, PHP has been used – but in theory any other supported programming language could have been used as well.

In a nutshell, this is what’s happening:

  • The application artifacts are read (e.g. application name, buildpack etc.)
  • The route URL to access the application in SAP Cloud Platform is created
  • The application is bound to the route
  • The source code is uploaded
  • The application is started and the health is monitored
  • The application details like memory, disk consumption, number of instances are summarized

You can then also view your application in the SAP Cloud Platform Cockpit:

You can confirm that the service is running as expected by calling the generated URL under “Application Routes”.

Email design in content studio

As previously mentioned, the last step is now to include a dynamic image in the email and let the URL point to our countdown timer service. After the URL parameters (e.g. the countdown end time) are added, a preview of the GIF is also shown in the content studio directly.

The visual design of the countdown timer can either be adapted in a static way via changing the application logic or controlled in a dynamic way by URL parameters.

Further extensions & use cases

The presented use case can be extended in many ways.

One obvious next step can be the creation of personalized countdown timer (e.g. for your contact’s birthday campaigns). Here, the consumer’s birthday could be passed also via an URL parameter to our service.

Another idea is the creation of a management application in case we want to manage multiple countdown timers. The management application could be also built on SAP Cloud Platform, e.g. leveraging the single sign-on features of the Identity Authentication service or to autoscale the application instances based on policies.

The general concept of having an application which takes parameters via URL parameter and returns an image can also be transferred to other use cases:

  • Create personalized QR codes for event registrations or personal offers
  • Showcase product customization (e.g. personalized fan jerseys using last name and gender)
  • Send personalized greeting cards

Summary

In this blog post, the creation of an email countdown timer to increase awareness and instantly communicate a limited time status has been shown. This example also serves as a tangible use case for extensibility via SAP Cloud Platform. The implementation steps for this prototype have been outlined (overview, deployment, email design).

In addition, ideas on how to extend the use case and further use cases based on the same concept have been shown.

You want to see more articles from SAP Services? Click on the banner below.

Your SAP CX Services – Marketing Practice team.

3 Comments
You must be Logged on to comment or reply to a post.
  • I love the use case however, it would be nice if you could share your code.  I have tried this with other php timer code and even after deployment it returns 404.

    • Hi Chris,

      my prototype was mainly based on a variation of the https://github.com/Omgitsonlyalex/EmailCountdown PHP code.

      Regarding the 404: It can help to check

      a) the Cloud Foundry log for the application using the “cf logs APP_NAME” command

      b) necessary PHP extensions can be added as described in https://docs.cloudfoundry.org/buildpacks/php/gsg-php-config.html#php-extensions

      Hope this helps!

      Best regards,

      Tim