The document discusses the challenges of developing mobile applications for multiple platforms and proposes a hybrid app approach using HTML5. It notes the fragmentation across mobile platforms, languages and tools, and the high costs of native development. A hybrid app framework is suggested that would allow developing once and deploying across platforms, with benefits of both native and web apps, including offline capabilities and connectivity to backend systems. The framework is described as using HTML5, CSS3 and JavaScript with a model-view-controller architecture and local storage for offline use.
2. 1.
Challenges
with
Implementing
Mobile
Application
How
do
We
accommodate
all
the
How
do
I
design
and
develop
a
different
mobile
platforms?
high-‐quality
User
Experience?
• Highly
fragmented
set
of
…
• High
quality
user
experience
is
a
• Platforms
and
devices
requirement
• Languages,
APIs,
and
tools
• Quality
inOluenced
as
much
by
• Native
programming
models
design
as
it
is
by
function
not
portable
across
platforms
We
need
to
develop
different
apps
We
need
to
connect
my
apps
to
for
different
Customers
–
quickly.
existing
systems
(DMS,
DMS-‐HO)
• Higher
frequency
of
• Existing
services
typically
need
releases
and
updates
to
be
adapted
for
mobile
• Added
pressure
on
teams
to
• Enterprise
wireless
networks
deliver
on
time
and
with
quality
are
running
out
of
bandwidth
for
employee
devices
Version
0.5
(Draft)
2
3. 1.2.
Evolving
Mobile
Landscape
Development
Challenges
q Mobile
Development
is
more
expensive
than
traditional
Web
App
Development:
v Which
smartphone?
Which
tablet?
Which
form
factor?
àAndroid,
iOS,
Windows
Phone,
then
Blackberry
v Skills?
à
Web
or
native
apps?
Java
or
Objective
C?
Or
other?
v Maintenance?
à
Separate
software
stacks
for
each
major
OS
à
Separate
applications
for
each
major
OS
à
How
do
We
keep
software
current?
v Enterprise
Integration?
à
How
do
I
build
cross-‐channel
app?
How
do
I
use
existing
authentication
frameworks,
customer
proOile
repositories,
Reuse
existing
investments
in
backends?
v Security?
à
Encryption?
Authentication?
Response
to
stolen/lost
devices?
v Management?
à
Can
I
see
my
apps?
Can
I
disable
them
remotely?
q Since
the
Mobile
Oield
is
still
evolving,
so
an
enterprise
would
want
to
pick
a
platform
that
can
adapt
to
the
future.
Version
0.5
(Draft)
3
4. 1.4.
Delivering
for
Multiple-‐Mobile-‐Platforms
Client
Challenge
Using
standards-‐based
technologies
and
tools
and
delivering
an
enterprise-‐grade
services
layer
that
meets
the
needs
of
mobile
employees
and
customers
Key
Capabilities
Mobile
optimized
middleware
§ Open
approach
to
3rd-‐party
integration
§ Strong
authentication
framework
§ Encrypted
ofOline
availability
§ Enterprise
back-‐end
connectivity
§ UniOied
push
notiOications
§ Data
collection
for
analytics
§ Direct
updates
and
remote
disablement
§ Packaged
runtime
skins
Version
0.5
(Draft)
4
5. 1.5.
Native
Apps
VS
Web
Apps
• Existing
Native
Apps:
Android,
iOS,
Win8,
Blackberry.
• Existing
Web
Apps:
DMS,
Portal,
ERP
…
• What
if
we
can
develop
apps
with
beneOits
from
both
Native
and
Web
Apps?
Version
0.5
(Draft)
5
6. 1.6.
Hybrid
Apps
–
Why
not?
• What
if
we
can
develop
with
beneOits
from
both
Native
and
Web
apps?
Hybrid
Apps
• But
Company
regulatory,
audit,
legal
or
time-‐to-‐market
restrictions
?
Version
0.5
(Draft)
6
8. 1.3.
Old
School
Web
Browser
Cloud
Platform
Data
Model
Integration
Back
End
Data
HTML
Sync
Engine
1) Browser
to
Server:
HTTP
Get
2) Server
to
Browser:
Dynamically
generated
HTML
Version
0.5
(Draft)
8
9. 1.3.
AjaxiOied
Web
Browser
Cloud
Platform
Data
Model
Integration
Run
JS
Back
End
Data
HTML
Display
Data
Sync
Engine
1) “Run
JS”
to
Server:
HTTP
Get
2) Server
to
Browser:
Data
only
3) Browser:
Display
Data
Version
0.5
(Draft)
9
10. 1.3.
OfOline-‐able
Data
Browser
Cloud
Platform
Data
Model
Integration
Run
JS
Back
End
Data
HTML
Display
Data
Sync
Engine
1) “Run
JS”
to
Server:
HTTP
Get
2) Server
to
Browser:
Data
only
3) Browser:
Local
Storage
4) Browser:
Display
Data
Version
0.5
(Draft)
10
11. OfOline-‐able
Web
Apps
Browser
Cloud
Platform
Data
Model
Integration
Run
JS
Back
End
Display
Data
Sync
Engine
1) Browser:
using
Cached/Local
HTML
2) OfOline-‐able
Data:
Run
JS
à
Local
Storage
à
Display
Data
3) Sync
via
HTTP
POST
+
GET
when
online
Version
0.5
(Draft)
11
12. 2.
Hybrid-‐App
MVC
q Model
–
View
–
Controller
q Store:
act
as
a
cache,
which
contains
a
collection
of
Models.
q ProOile:
enable
to
easily
customize
UI
for
tablets
&
phones
Version
0.5
(Draft)
12