Sunday, March 25, 2018

HTML5 Video Tracking using Launch by Adobe

Tracking interactive media such as video is often a mandatory requirement for clients as they want to gauge the effectiveness of media on their website or app to influence ad revenue or sales. Companies like Youtube, Hulu, ABC or Comcast put a lot of emphasis on tracking video metrics. More the video views, more their ad revenue so it's usually one of the first platforms they want to measure.

Tracking video players typically requires developers to embed code into the video player and fire off tracking beacons triggered from an analytics platform's plug-in. Plug-ins such as Milestone (legacy) and platforms such as Heartbeat (latest) for Adobe Analytics allow clients to track video on their website. Every video implementation I've been involved with (including HTML5), requires both the developer and the technical consultant to implement custom JavaScript logic within the video player and Tag Manager respectively.

Recently, I was involved in helping a client migrate from their legacy (H) code's Milestone tracking code hosted via on-page Analytics code onto the latest analytics (AppMeasurment) library in the Launch by Adobe tag management platform. Sounds simple right? Nope, as their video player (HTML5) had a ton of JavaScript code embedded within the video player and in the analytics configuration file. After looking into our internal documentation, it was apparent that there was no easy migration path as their Milestone library was implemented along with the legacy analytics H code and isn't compatible with the newest AppMeasurment library. The other thing that was challenging is that Milestone video tracking method is no longer supported by Adobe.

This prompted me to host a HTML5 video player with NO video related JavaScipt code, I repeat NO embedded JavaScript code on my own sandbox environment and implement a basic instance of the Launch Tag management solution with AppMeasurement. After validating the approach, I asked the client to implement the same methodology on their own website and it met their requirement.

Please note that to capture video name, I updated the video ID in HTML to capture a user friendly video name that is the only piece of video related 'code' I added on the page. The other thing to keep in mind is that my approach leverages link tracking events to track video events. Below are the steps I took to track metrics such as video start, video 25%, 50%, 75%, 100% complete and dimensions such as friendly video name and others.

Inject Launch by Adobe async JS library: Adobe recommends injecting the async Launch library in the head of the page as it's faster and non-blocking.

Implement AppMeasurement code in Launch: Implement the latest AppMeasurement code in Launch which is what I did for my client. Here's a general screenshot of the extension.

Track Video Name in Launch: We create a data element to capture the video name using the video ID HTML tag where we embed a friendly name. There are other approaches to grab this from the page by writing custom code but I did this to make the migration process seamless for my client. Below is a screenshot of what the video ID looks in the HTML.

Next, we create a simple data element in Launch where our data element captures a "DOM Attribute" called "video" as shown below that is tied directly to our HTML.

Create a Rule to track Video Start: Once we've setup the data element to capture the video name, we now need to setup individual rules in Launch to capture video events. The first video event we want to create is the video start event where we trigger the video event when 1% of the video has been viewed. This made sense to my client as he agreed that unless a user has viewed 1% of the video, it's not really a 'true' video start. So in the scenario, we'd choose the "Data Element Type" as "Media Time Played" triggered when 1% of the video has played. I've added a caveat at the end of the article to explain why we didn't use the "Media Play" event type.

Next, we scroll down to the "Actions' section to set our analytics variables and send a beacon for the video start event as shown below. Please note that we need to do this for each rule we'll create for tracking video events.

The next two steps show what we need to populate in the "Adobe Analytics - Set Variables" and "Adobe Analytics - Send Beacon" actions. Please note that we've defined unique analytics events for each milestone event and an eVar to capture the video name.

Create Rules to track Video Milestones 25%, 50%, 75% Events: We now setup milestone events to track 25%, 50% and 75% complete video events which is a very common tracking requirement for videos. The screenshots below show how we set it up for 25% video complete event but the same steps need to be followed for 50% and 75% complete events where the 25% trigger needs to be replaced with 50% and 75% accordingly.

Create a Rule to capture Video Complete: The last step is to capture the video complete event that can be captured by choosing the "Media Ended" event type in the rule as shown below.

Validate the Video Events: We now test our setup by loading the video in a browser and filtering for "/b/ss" which is a filter we apply to test the Adobe Analytics image request. In the following screenshots, I've included analytics image request for video start, 25% complete and video complete events.

The very last step of the process is for us to validate the data in the Adobe Analytics UI. The following screenshot shows how the report will look like with all video events successfully setup.

Finally, I want to add a few caveats about my post as video tracking is generally very involved:
  • HTML5 is typically the easiest video player to implement analytics tracking on but other players like Brigtcove, YouTube or JW Player may not work with this approach as they are not directly part of the HTML like HTML5 is and typically require additional JavaScript code embedded in the player and page. For other players, it is recommended to use the Heartbeat or traditional video tracking methods.
  • My method fires the video start event when 1% of the video is completed so if a video is 10 minutes long, it may take 6 seconds to fire the start event. "Video Start" event type in Launch on the other hand, triggers a beacon every time a video is played which causes duplication of the start event. 
  • There are many other attributes that are associated with video that are not tracked here. Some of them are Content type, Player name, Show/Episode name/Season (TV shows) or Ad related attributes tied to a campaign.
I hope you like this post but I'd like to know if you have alternative ways by which you track video players. As always, comments and feedback is welcome.

Sunday, March 11, 2018

Upload Offline Customer Data into Adobe Audience Manager (Part 2)

This post is a continuation to Part 1 of the series where I’m covering how to upload offline customer data to AAM. This post goes even deeper into the weeds and covers how we can add, modify and remove (we cannot really delete data from the backend but can exclude users) customer data from AAM. There are different ways to configure the batch upload file for AAM, but this post only shows how to leverage key-value pairs to bring in data. The official Adobe documentation goes into some more detail on those other methods.

Let’s first take a look at a few steps we need to take as a prerequisite before uploading batch files:
  1. File Extensions: There are two types of file extensions that are supported in the file name. The first one is “.sync” that is used to add records to Audience Manager and the other one is “.overwrite” that is used to overwrite or modify records. These two were covered in a lot of detail in the previous section.
  2. File Name: The file name starts with 'ftp_dpm' (fixed) followed by a random number typically less than 10 digits along with the file extension. So, an example file name can be: ftp_dpm_Data-Source-ID_201831012.sync|.overwrite where the data source ID is the same as '#1' in the screenshot below, number used is in the “Year/Month/Date” format (can be anything) and .sync or .overwrite are the file extensions.
  3. File Size: Each file should ideally not exceed more than 5GB and can be zipped using .gz so if you need to upload greater than 5GB then you can upload multiple files. The nomenclature of these files will be named like ftp_dpm_Data-Source-ID_123456789.sync.1.gz or ftp_dpm_Data-Source-ID_123456789.sync.2.gz.
  4. Attribute Limit: According to Adobe’s documentation referred earlier, there is a limit of 200 lines Adobe can process for each user ID sent in the inbound data file.
  5. Column Structure of the File: As covered in the previous section, the user ID is in the first column. The second column (separated by a tab) contains all key value pairs separated by a comma. Some points to consider:
    • It’s easy to mix up the  double quote with the " quotes being used in the second column. The double quote that will work is the " quote so it’s better to use a separate text editor to configure the file as excel might switch up the quotes being used.
    • Numeric data can be sent as a string in the file but in the AAM UI, they will be evaluated as numbers so logical operators such as "<" OR ">" can be used while creating traits.
    • Make sure that the tab between column one and column two is actually a tab and not a space as that will break the file format.
  6. Data Source Setup: As discussed in the previous post, one of the first things we need to capture to initiate a batch upload process is to capture the authenticated user ID on the website. We tie this ID to Audience Manager via an integration code (#2 below) by initiating an ID sync. The user ID needs to be mapped to a data source by tying the user ID to the Customer ID inbound field (#3). The data source ID (#1) is hard coded into the batch file name which we’ll cover in the third step.
Source: Audience Manager UI

We're now going to cover how to add, modify and remove records from Audience Manager while leveraging key-value pairs:
  • Add New Records to Audience Manager (".sync" format): This is the most common type of upload where we simply add new user IDs along to the first column and user attributes to the second column as shown below. The file format used here is “.sync”.
  • Modify Already Uploaded Records (".overwrite" format): In this type of upload using the “.overwrite” format, we add all existing attributes of the user along with the modified records. In the example below, we’ve uploaded all existing records and only modified the ‘age’ and ‘purchases_last_month’ fields. If we don’t add certain attributes added previously, those attributes will not be part of user qualification moving forward.
  • Add New Attributes to Existing Records: If you want to add a new attribute to an existing record (user ID), there are two ways to do this:
    • (".overwrite" format): In this format, we include all existing records for a user along with the new attribute (company_size) as shown below:
    • (".sync" format): In this format, we include just the new attributes (company_size) we need to add  for a user as shown below:
  • Remove Attributes from Existing Records (".overwrite" format)If you want to remove a certain attribute from exiting records, upload an ".overwrite" file with just the attributes you wish to keep and exclude the one you wish to remove. In the example below, we've removed the 'company_size' attribute that we added earlier. Also, note that we included the updated 'age' and 'purchases_last_month' fields:
  • Delete Records from Audience Manager: There is no way to really "delete" a record from Audience Manager. The recommended approach is to include an attribute/flag (E.g. existing_customer=N) in the batch file and add it as a condition in AAM. Users with this flag can be part of an exclusion list that can be uploaded to a DSP so that they're not targeted moving forward.
The research went into these two posts took months but I'm hopeful that this post will act as a guide on how upload customer data into Audience Manager. I'll appreciate your feedback and comments.