Summit 2015: Mobile App Dev and Content Management with Adobe Experience Manager

© 2015 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential.© 2015 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential.
Mobile App Development and Content Management with Adobe Experience
ManagerBruce Lefebvre - #AdobeSummit

Bruce Lefebvre
Computer Scientist Lead at Adobe
@brucelefebvre

Picture this…

There must be a better way

© 2015 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential.
agenda.jsp
6
<%
out.println("<h1> AGENDA </h1>" +
"<ul> " +
" <li> Problem? </li>" +
" <li> Solution: AEM Apps " +
" <ul> " +
" <li> Creation </li>" +
" <li> Validation </li>" +
" <li> Management </li>" +
" <li> Updating </li>" +
" </ul> " +
" </li> " +
"</ul> ");
%>

SOLUTION
S
CORE
SERVICES
Adobe Marketing Cloud
PLATFORM
ANALYTICSEXPERIENCE
MANAGER
CAMPAIGNMEDIA
OPTIMIZER
SOCIAL TARGET
ACTIVATIO
N
ASSET
S
COLLABORATIO
N
EXCHANG
E
MOBIL
E
PROFILES
&
AUDIENC
ES
USER
MANAGEMENT
&
ADMINISTRATI
ON
Data & Content
PRIMETIME AUDIENCE
MANAGER

AEM Apps: Key Takeaways
Leverage tools your
marketers know and
love
1 Simplify your app
management pain
points
2 3Flexible platform to
deliver next
generation of mobile
experiences

Apps Made Easy

Adobe 2014 Mobile Consumer Survey Results
10
0
10
20
30
40
50
60
70
Android iPhone Windows Blackberry
Primary Mobile Device Platform (avg. UK, US, FR,
DE)
Primary mobile…
Pushed to app…
Yet, 71% of companies use third-party
developers for at least some of their mobile
apps

Problem: Mobile Platforms in 2015
11
Objective-
C/Swift
C#, C++
Java
Java

Vendor lock-in

Problem: Content Reuse
14
 Silo’d teams create inconsistent branding across channels
 Reusing content from other mediums is tedious, error prone, and expensive
Marketing team Desktop teamAnalytics team Mobile team

Problem: The Last Millisecond
15
 Your website can
change & adapt in an
instant
 How about your app?

Problem: Stale Content Gets Uninstalled
16
 Apps which don’t continue to offer value
will be removed
 Store driven updates are easy to ignore

1. Multiple devices.
2. Multiple platforms.
4. Rising costs.
3. App updates workflow.
Problem: State of App Development in 2015

THE END

Solution: Vendor lock-in
19
 Web tech
 Write once, run everywhere
 Build apps with technology you know and love
 HTML
 CSS
 Topcoat
 JavaScript
 AngularJS
 jQuery
 etc…
“If a browser doesn’t do something its
not because it can’t; it’s just because
we haven’t gotten around to
implementing that part yet.”
-Brian
LeRoux

Things you can do on Mobile
Nothing ALL the things
Mobile website Native app(2015)
Gap!

Solution: Vendor lock-in
21
PhoneGa
p

Solution: Mobile Platforms
22
 PhoneGap
 A cross-platform app framework
 Initially PhoneGap, created by Nitobi
 Donated to ASF in 2011 as Cordova
 Supported platforms
 iOS
 Android
 BB10
 WP7, WP8, Windows 8
 Amazon Fire OS
 Tizen
 and more…

agenda.jsp
23
<%
"<ul> " +
" <li> ⇛ Solution: AEM Apps " +
" <ul> " +
" </ul> " +
" </li> " +
"</ul> ");
%>

AEM Apps

AEM Apps: Highlights
25
Central Control of Apps
Direct Distribution to
Stakeholders

26
“Drag and drop” Editor
Leverage
existing content
from DAM
Quickly and easily
create new app
screens
App Updates

27
Mobile Analytics
Push Notifications

Solution: Stale content
28
 Update app content over-the-air with Content Sync
 Delta updates only include files that have changed
 Changes can include:
 Page updates/additions/deletions
 CSS styling changes
 JavaScript changes

Solution: Content re-use
29
 Consolidate content in AEM
 Content reuse made easy via existing AEM mechanisms
 Business users need only one set of tools and skills for managing both sites and app

agenda.jsp
30
<%
"<ul> " +
" <ul> " +
" <li> ⇛ Creation </li>" +
" </ul> " +
" </li> " +
"</ul> ");
%>

In the Beginning: AEM Apps Starter Kit
31
 AEM Apps projects live in a SCM system
 Required:
 Ability to use Maven to build and install into AEM
 Ability to initially customize app branding, title, and source paths
 Use the AEM Apps starter kit to bootstrap your apps project:
 https://github.com/Adobe-Marketing-Cloud-Apps/aem-phonegap-starter-kit

AEM Apps Starter Kit: 4 easy steps
32
1. Clone the AEM Apps starter kit from github
$ git@github.com:Adobe-Marketing-Cloud-Apps/aem-
phonegap-starter-kit.git
2. Customize with your brand & app name
$ ./customize-app.sh bruceInc SummitApp
3. Install to your AEM author instance
$ mvn -PautoInstallPackage clean install
4. Author in AEM
http://localhost:4502/aem/apps.html

Could it really be that easy?

agenda.jsp
34
<%
"<ul> " +
" <ul> " +
" <li> ⇛ Validation </li>" +
" </ul> " +
" </li> " +
"</ul> ");
%>

"Always code as if the guy who ends up maintaining your
code will be a violent psychopath who knows where you
live."
- Martin Golding

Testing Your App
36
 Your developers are already testing
 (I hope!)
 Prove code correctness
 Avoid regressions
 Facilitate refactoring
 Encourage better design

Validation Toolkit
37
 Server side
 Unit testing with JUnit
 Client side
 Unit testing with Jasmine
 Invoked by the Karma test runner
 AEM integration testing
 Hobbes
 Acceptance testing
 PGE App

Acceptance: PGE App
38
Developmen
t
Staging Production
Internal Stakeholders Users

Testing Demo

agenda.jsp
40
<%
"<ul> " +
" <ul> " +
" <li> ⇛ Management </li>" +
" <li> ⇛ Updating </li>" +
" </ul> " +
" </li> " +
"</ul> ");
%>

App Management
42
 Marketers, developers, and creatives
are your mobile engagement trifecta
 Yet tools are often built with only the
developers in mind
 Results are in:
 60% of marketers are including
analytics as part of their strategy
 66% are using push notifications
 Why isn’t everyone?

App Updates
43
“Don’t update the app to this version! New version
with fix coming soon. Found severe usability issue.”
 Keep app content relevant to keep users coming
back
 When done wrong: can be costly, time consuming,
and a nuisance for users

AEM Apps Dashboard
44

App Management Demo

AEM Apps: Key Takeaways
Leverage tools your
marketers know and
love
1 Simplify your app
management pain
points
2 3Flexible platform to
deliver next
generation of mobile
experiences

Apps Made Easy

But wait… There’s More!
48
 S813 - What’s new in Adobe Experience Manager Apps: Top 5 hottest features
 Tuesday (TODAY), Mar 10, 4:00 PM - 5:00 PM
 L712 - Building mobile apps: Introduction to Adobe PhoneGap Enterprise for developers
 Tuesday (TODAY), Mar 10, 4:30 PM - 6:30 PM
 L718 - Managing mobile apps: Introduction to Adobe PhoneGap Enterprise for marketers
 Wednesday, Mar 11, 2:00 PM - 4:00 PM
 Thursday, Mar 12, 9:30 AM - 11:30 AM
 S814 - Learn first-hand how Coca-Cola used AEM Apps to build and manage their mobile
app
 Wednesday, Mar 11, 2:00 PM - 3:00 PM

Q&A
Bruce Lefebvre
Twitter: @brucelefebvre

Every Session Tuesday Wednesday Thursday
$100
Gift Card
$10
Gift Card
$100
Gift Card
SKI
Swag
Take the Survey to WIN!(“surveys” section of mobile app)

adobe.com/go/summit2014portal

References
52
 Adobe 2014 Mobile Consumer Survey Results:
https://solutionpartners.adobe.com/content/dam/collateral/APEXAssets_Public/54458_amc_mobile
_survey_report_ue_v3.pdf
 Siegel, Ezra. 2013. Automatic app updates on iOS 7 will hurt app retention. Apptentive blog,
August 1. http://www.apptentive.com/blog/automatic-app-updates-on-ios7-app-retention
 Jína, Vojtěch. 2013. JavaScript Test Runner Master’s Thesis. https://github.com/karma-
runner/karma/raw/master/thesis.pdf

Creative References
53
 Black Friday store image: Kim Bhasin / Business Insider
http://www.businessinsider.com.au/photos-macys-black-friday-midnight-opening-2012-11
 Egg cracking gif: http://www.buzzfeed.com/julianbrand/40-gifs-of-stupid-infomercial-people-6eof
 Devices image: http://www.anchormobile.net/category/mobile-marketing/
 Jail image: ©iStock.com/wsmahar - http://www.istockphoto.com/photo/hands-on-cell-bars-9019693
 Stopwatch image: shutterstock/doomu - http://www.shutterstock.com/pic-111520028/stock-photo-
silver-modern-stopwatch-on-a-white-background.html
 Unixstickers ‘all the things’: http://www.unixstickers.com/stickers/meme-stickers/misc-all-the-
things-meme-shaped-sticker
 Bug image: http://en.wikipedia.org/wiki/Reduviidae
 JUnit logo: http://junit.org/
 Karma logo: http://karma-runner.github.io/0.12/index.html
 Jasmine logo: http://jasmine.github.io/

Summit 2015: Mobile App Dev and Content Management with Adobe Experience Manager

More Related Content

What's hot

Similar to Summit 2015: Mobile App Dev and Content Management with Adobe Experience Manager

Recently uploaded

Summit 2015: Mobile App Dev and Content Management with Adobe Experience Manager

Editor's Notes