CQ Mobile Apps


Andrew Savory / @savs
Bruce Lefebvre / @brucelefebvre

Introductions

Andrew

  • Senior Technical Product Marketing Manager, Mobile
  • asavory@adobe.com
  • @savs

Bruce

You are here

You have a big investment in your existing website:

  • Lots of content
  • Lots of processes
  • Lots of training
  • Lots of integrations

You need to address mobile

Mobile challenges

  • Mobile websites
    ...are easy (with CQ)
  • Mobile apps are hard

Mobile apps are hard

How do you:

  • Re-use your content
  • Provide back-end server infrastructure
  • Develop for multiple mobile platforms

Mobile experiences are hard

Unique challenges:

  • New functionality to use (touch, sensors)
  • Constraints (memory, performance, battery, connectivity)
  • Difficult to update
Bad app store reviews

Key challenges

  • Repurposing content and workflows from CQ
  • Leveraging existing infrastructure to feed complex apps
  • Empowering Marketing and giving control back
CQ logo

CQ Architecture

  • OSGi Framework
  • Java, JSP, JS
  • Content store
  • Scalable
PhoneGap logo

PhoneGap

Apps written with web tech

you know and love

"...using HTML, CSS, and Javascript to not get locked into a proprietary vendor platform."
- Brian LeRoux

Supported platforms

  • iOS
  • Android
  • Blackberry
  • Windows Phone
  • more on the way...

Device API

  • Geo location
  • Accelerometer
  • Camera
  • File system
  • Contacts
  • Notifications
  • <your custom plugin>

Open source

Cordova bot logo

In the real world

PhoneGap apps in the iOS app store
http://phonegap.com/app/feature/
PG build logo

PhoneGap Build

  • Compile in the cloud
  • Avoid vendor SDKs
  • Now part of Creative Cloud
Package

Content Sync

  • Standards based
  • Optimized for low bandwidth
  • All content welcome

Scenario: BlueSky

The requirement

  • Custom mobile application
  • Re-use server architecture
  • Deliver a dynamic mobile experience

What we built

  • Third-party client app
    • PhoneGap, Angular.js
  • Server-side JSPs emitting JSON
  • Hypermedia API

Demo

Geometrixx Outdoors desktop site
Geometrixx Outdoors Communities desktop site
Geometrixx Outdoors Community desktop site
Geometrixx Outdoors mobile site
BlueSky app splashscreen
BlueSky login screen
BlueSky Communities screen
BlueSky Community screen
BlueSky community members
BlueSky comment
BlueSky map location
BlueSky add article
BlueSky add article text
BlueSky add article preview
BlueSky add article picture
BlueSky settings screen
BlueSky profile screen
BlueSky invite contact screen

The value

  • For users: mobile experience, not mobile effort
  • Leverages existing CQ investment, common technologies
  • Loosely-coupled API provides flexibility, minimises pain

Scenario: Newsreader

The requirement

  • Repurpose content
  • Build apps across platforms
  • Keep content up-to-date

What we built

  • A PhoneGap app (stored in CQ)
  • PhoneGap Build for cross-platform
  • ContentSync for content updates

Interlude

Do you read the release notes?

Screenshot of CQ 5.6.1 release notes

“Integration with Adobe PhoneGap Build service
to generate mobile apps from within Experience Manager”


“Enable more efficient developer workflow
to maintain and update content-driven mobile apps”

Demo

Geometrixx Media Entertainment screen
PhoneGap Build list of apps
CRXDE Lite Geometrixx Media PhoneGap app
PhoneGap Build configuration screenshot
Geometrixx Media properties PhoneGap config
Geometrixx Media trigger PhoneGap Build workflow
Geometrixx Media subject to workflow
PhoneGap Build new app
QR scanning PhoneGap Build site
Installing PhoneGap Build newsreader
Newsreader iPad screenshot

Summary

  • You can integrate mobile apps with CQ
  • You can re-use your content
  • You can re-use your workflows and integrations

One more thing

CQ Mobile

App running on device

Summary

  • Mobile websites are easy (with CQ)
  • Mobile apps are hard easy (with CQ)

Thank You

questions?

Questions?

Resources

References