The document discusses how to build mobile apps using CQ Mobile and leverage existing CQ investments. It presents PhoneGap as a way to create apps using HTML, CSS and JavaScript across multiple platforms. It also demonstrates how to reuse content from CQ using Content Sync and build custom mobile experiences while reusing the CQ backend infrastructure and content.
1. 28/08/2013 14:49Evolve 2013: CQ Mobile Apps
Page 1 of 79http://localhost:8000/?print-pdf#/
CQ Mobile AppsCQ Mobile Apps
/
/
Andrew Savory @savs
Bruce Lefebvre @brucelefebvre
2. 28/08/2013 14:49Evolve 2013: CQ Mobile Apps
Page 2 of 79http://localhost:8000/?print-pdf#/
IntroductionsIntroductions
3. 28/08/2013 14:49Evolve 2013: CQ Mobile Apps
Page 3 of 79http://localhost:8000/?print-pdf#/
AndrewAndrew
Senior Technical Product Marketing Manager, Mobile
asavory@adobe.com
@savs
4. 28/08/2013 14:49Evolve 2013: CQ Mobile Apps
Page 4 of 79http://localhost:8000/?print-pdf#/
BruceBruce
Computer Scientist, CQ
@brucelefebvre
7. 28/08/2013 14:49Evolve 2013: CQ Mobile Apps
Page 7 of 79http://localhost:8000/?print-pdf#/
You are hereYou are here
You have a big investment in your existing website:
Lots of content
Lots of processes
Lots of training
Lots of integrations
8. 28/08/2013 14:49Evolve 2013: CQ Mobile Apps
Page 8 of 79http://localhost:8000/?print-pdf#/
You need to address mobileYou need to address mobile
9. 28/08/2013 14:49Evolve 2013: CQ Mobile Apps
Page 9 of 79http://localhost:8000/?print-pdf#/
Mobile challengesMobile challenges
Mobile websites
...are easy (with CQ)
Mobile apps are hard
10. 28/08/2013 14:49Evolve 2013: CQ Mobile Apps
Page 10 of 79http://localhost:8000/?print-pdf#/
Mobile apps are hardMobile apps are hard
How do you:
Re-use your content
Provide back-end server infrastructure
Develop for multiple mobile platforms
11. 28/08/2013 14:49Evolve 2013: CQ Mobile Apps
Page 11 of 79http://localhost:8000/?print-pdf#/
Mobile experiences are hardMobile experiences are hard
Unique challenges:
New functionality to use (touch, sensors)
Constraints (memory, performance, battery, connectivity)
Difficult to update
13. 28/08/2013 14:49Evolve 2013: CQ Mobile Apps
Page 13 of 79http://localhost:8000/?print-pdf#/
Key challengesKey challenges
Repurposing content and workflows from CQ
Leveraging existing infrastructure to feed complex apps
Empowering Marketing and giving control back
14. 28/08/2013 14:49Evolve 2013: CQ Mobile Apps
Page 14 of 79http://localhost:8000/?print-pdf#/
CQ ArchitectureCQ Architecture
OSGi Framework
Java, JSP, JS
Content store
Scalable
16. 28/08/2013 14:49Evolve 2013: CQ Mobile Apps
Page 16 of 79http://localhost:8000/?print-pdf#/
Apps written with web techApps written with web tech
you know and loveyou know and love
17. 28/08/2013 14:49Evolve 2013: CQ Mobile Apps
Page 17 of 79http://localhost:8000/?print-pdf#/
"...using HTML, CSS, and Javascript to not get
locked into a proprietary vendor platform."
- Brian LeRoux
18. 28/08/2013 14:49Evolve 2013: CQ Mobile Apps
Page 18 of 79http://localhost:8000/?print-pdf#/
Supported platformsSupported platforms
iOS
Android
Blackberry
Windows Phone
more on the way...
19. 28/08/2013 14:49Evolve 2013: CQ Mobile Apps
Page 19 of 79http://localhost:8000/?print-pdf#/
Device APIDevice API
Geo location
Accelerometer
Camera
File system
Contacts
Notifications
<your custom plugin>
20. 28/08/2013 14:49Evolve 2013: CQ Mobile Apps
Page 20 of 79http://localhost:8000/?print-pdf#/
Open sourceOpen source
21. 28/08/2013 14:49Evolve 2013: CQ Mobile Apps
Page 21 of 79http://localhost:8000/?print-pdf#/
In the real worldIn the real world
22. 28/08/2013 14:49Evolve 2013: CQ Mobile Apps
Page 22 of 79http://localhost:8000/?print-pdf#/
http://phonegap.com/app/feature/
23. 28/08/2013 14:49Evolve 2013: CQ Mobile Apps
Page 23 of 79http://localhost:8000/?print-pdf#/
PhoneGap BuildPhoneGap Build
Compile in the cloud
Avoid vendor SDKs
Now part of Creative Cloud
24. 28/08/2013 14:49Evolve 2013: CQ Mobile Apps
Page 24 of 79http://localhost:8000/?print-pdf#/
Content SyncContent Sync
25. 28/08/2013 14:49Evolve 2013: CQ Mobile Apps
Page 25 of 79http://localhost:8000/?print-pdf#/
Standards based
Optimized for low bandwidth
All content welcome
26. 28/08/2013 14:49Evolve 2013: CQ Mobile Apps
Page 26 of 79http://localhost:8000/?print-pdf#/
Scenario: BlueSkyScenario: BlueSky
27. 28/08/2013 14:49Evolve 2013: CQ Mobile Apps
Page 27 of 79http://localhost:8000/?print-pdf#/
The requirementThe requirement
Custom mobile application
Re-use server architecture
Deliver a dynamic mobile experience
28. 28/08/2013 14:49Evolve 2013: CQ Mobile Apps
Page 28 of 79http://localhost:8000/?print-pdf#/
What we builtWhat we built
Third-party client app
PhoneGap, Angular.js
Server-side JSPs emitting JSON
Hypermedia API
48. 28/08/2013 14:49Evolve 2013: CQ Mobile Apps
Page 48 of 79http://localhost:8000/?print-pdf#/
The valueThe value
For users: mobile experience, not mobile effort
Leverages existing CQ investment, common technologies
Loosely-coupled API provides flexibility, minimises pain
49. 28/08/2013 14:49Evolve 2013: CQ Mobile Apps
Page 49 of 79http://localhost:8000/?print-pdf#/
Scenario: NewsreaderScenario: Newsreader
50. 28/08/2013 14:49Evolve 2013: CQ Mobile Apps
Page 50 of 79http://localhost:8000/?print-pdf#/
The requirementThe requirement
Repurpose content
Build apps across platforms
Keep content up-to-date
51. 28/08/2013 14:49Evolve 2013: CQ Mobile Apps
Page 51 of 79http://localhost:8000/?print-pdf#/
What we builtWhat we built
A PhoneGap app (stored in CQ)
PhoneGap Build for cross-platform
ContentSync for content updates
52. 28/08/2013 14:49Evolve 2013: CQ Mobile Apps
Page 52 of 79http://localhost:8000/?print-pdf#/
InterludeInterlude
Do you read the release notes?
54. 28/08/2013 14:49Evolve 2013: CQ Mobile Apps
Page 54 of 79http://localhost:8000/?print-pdf#/
“Integration with Adobe service
to generate mobile apps from within Experience Manager”
PhoneGap Build
“Enable more efficient developer workflow
to maintain and update content-driven mobile apps”
67. 28/08/2013 14:49Evolve 2013: CQ Mobile Apps
Page 67 of 79http://localhost:8000/?print-pdf#/
SummarySummary
You can integrate mobile apps with CQ
You can re-use your content
You can re-use your workflows and integrations
68. 28/08/2013 14:49Evolve 2013: CQ Mobile Apps
Page 68 of 79http://localhost:8000/?print-pdf#/
One more thingOne more thing
CQ MobileCQ Mobile
77. 28/08/2013 14:49Evolve 2013: CQ Mobile Apps
Page 77 of 79http://localhost:8000/?print-pdf#/
SummarySummary
Mobile websites are easy (with CQ)
Mobile apps are hard easy (with CQ)
78. 28/08/2013 14:49Evolve 2013: CQ Mobile Apps
Page 78 of 79http://localhost:8000/?print-pdf#/
Thank YouThank You
Questions?Questions?
79. 28/08/2013 14:49Evolve 2013: CQ Mobile Apps
Page 79 of 79http://localhost:8000/?print-pdf#/
ResourcesResources
- Brian LeRouxPhoneGap Beliefs, Goals, and Philosophy
Mobile with Content Sync
ReferencesReferences
designed by from The Noun
Project
designed by from The Noun Project
designed by from The Noun Project
Question Anas Ramadan
Package Hakan Yalcin
Question Henry Ryder