I’ve been playing with aerial photography lately. Here are a few shots from the Traverse Mountain area in Lehi Utah.
If you read my last post, you probably recognized the benefits of including Adobe DTM or Launch in your web-based mobile apps built with Cordova or PhoneGap. At the very least, it’s a nice fail-safe when you realize later that you didn’t include something in your app that is time-sensitive.
Below I’m going to show you the quickest way to setup a Cordova app with Adobe DTM or Launch. But I’m going to assume that you have a basic working knowledge of publishing in DTM or Launch and that you have Node and NPM installed.
Working Sample Code at this cordova-adobe-launch repository.
Set up DTM or Launch
If you don’t already have a web property setup for your Cordova app, set one up. Then make sure you have a “Production” environment setup and take note of its embed code. The embed code will probably start with something like
Create a New Cordova App
Obviously you can skip this step if you already have an app where you’d like to use DTM or Launch. If not, do the following in your terminal…
npm install -g cordova cordova create hello com.example.hello HelloWorld cd hello cordova platform add ios cordova platform add android cordova plugin add cordova-plugin-whitelist
Configure App and Include DTM / Launch
In the root of your project folder you will see a “config.xml” file. Open it and validate the the
<access origin="*"> tag contains an origin which includes the domain where your embed is hosted. By default the value of
* should include it.
Open the “www/index.html” file and update the Content Security Policy tag to include scripts with unsafe-eval for the “assets.adobedtm.com” domain. The tag should look something like this…
<meta http-equiv="Content-Security-Policy" content=" default-src 'self' data: gap: https://ssl.gstatic.com 'unsafe-eval'; script-src https://assets.adobedtm.com 'unsafe-inline'; style-src 'self' 'unsafe-inline'; media-src *; img-src 'self' data: content:; ">
While you have this file open, add your embed code to the
<head> tag and the DTM / Launch footer code right before the
Test the App
That’s it! Pretty simple right? Now you can test the app…
cordova run ios
cordova run android
Some mobile apps will need to capture data while offline. In these cases, the Adobe Mobile Services SDK may be a better fit. You might be asking if you can use the SDK in the same app as a traditional embed. The answer is yes! You’d want to ensure that you are not making double tracking calls but there’s no technical limitation to using the both together.
If you haven’t yet heard, Launch is the next evolution of Adobe DTM – part of the Marketing Cloud Activation core service and it is truly an evolution in the online marketing space!
What is Launch?
Launch has 2 primary functions…
- Launch is essentially a very powerful if/then engine for your web-content. It allows you to capture data and take actions based on conditions that you specify. You can build rules for your website based on events such as hover, click, etc. When those actions occur, you can trigger analytics tracking, special offer popups, or just about anything else you can imagine via custom code.
What’s revolutionary about Launch, is that it allows Adobe internal solutions AND 3rd party developers to extend its functionality! It is truly an open platform. If, you wish to trigger an action for an event that Adobe has not provided, you can create your own extension that makes that event available. You might want to reread that last sentence!
Launch Use Cases
Launch is primarily designed for the world of marketing but there are so many interesting use cases for it! Let’s take a look at just a few creative cases that might be a bit off the beaten path…
Use Case 1 – E-Learning Courseware
Working in the e-learning space, you want to know why some people are skipping question 3 of your Captivate course. You could deploy Adobe Analytics (or Google Analytics) to your courseware via Launch, then you could build a rule in Launch that goes something like this…
- If a user hits assessment question 3 but doesn’t ever hit question 4 and then leaves the course…
- …and the user is on a desktop machine…
- Capture their department, time in course, time on question 3, last action taken, visitor id, etc to Adobe Analytics or Google Analytics.
You could then build an analytics report that starts to help you understand why people are leaving prematurely. Perhaps question 3 is worded in a way that doesn’t make sense to a specific audience, or maybe the course navigation is not easy to use. With Launch, it would be simple to iterate on this rule, improving it until you hone in on the actual cause of student’s lack of completion. You could do with this without ever having to republishing the course.
Use Case 2 – Cordova/PhoneGap Mobile Apps
Web-based mobile apps (such as Cordova/PhoneGap) can include a Launch embed. For example, you may own a small mobile game app which uses IAP (in app purchases) to unlock new features. You know that Christmas is coming up and you’d like to take that seasonal opportunity to make a few extra in-app sales but you don’t have time to update and publish a new version of the app. If you have included Launch in your app, you could add a new page load rule that pops up a special offer when the app loads. You could even change the content of this offer based on data about the user or their location.
Of course there are a million-and-one other use cases that are not specific to online marketing.
The Launch Team
The DTM / Launch team is full of absolutely brilliant leaders, designers and engineers and it’s been a privilege to work as a front-end engineer with them! I think this is just the beginning of great things to come from this team!
Don’t Go Away!
Keep an eye out for my next post where I’ll share a working Cordova + Adobe DTM/Launch project.