Presented at Geeky Base on Oct 22nd, 2013

1. Building
Mobile
Masterpiece
with
Distributed
Agile
Weerasak
(Wee)
Witthawaskul
October
22,
2013

2. First,
thanks
to…
!
@weera
for
making
the
meetup
possible
!
Agile66
Facebook
page
!
Geeky
Base
for
location
and
facility
!
And
all
of
you,
curious
smart
minds

3. Who
am
I?

4. Who
am
I?

5. Why
should
you
listen
to
me?
!
You
already
know
agile
and
want
to
know
how
I
adopted
distributed
agile
!
You
want
to
know
why
mobile
development
has
more
challenges
than
web
development
!
How
you
can
apply
agility
to
your
projects

6. Case
Study

7. Morningstar
for
iPad
!
Portfolio
management
and
financial
research
app
!
Shipped
in
September
2013
!
Top
10
in
Finance
free
app
in
US
store
as
of
October
2013

8. Demo
time

9. Project
History
!
Initiated
in
2011
as
an
incubator
project
to
experiment
and
complement
morningstar.com's
user
experience
using
tablets
!
The
company
already
had
smartphone
apps
on
iPhone,
Android,
Blackberry
from
a
China
team
!
I
joined
the
company
in
April
2011
as
the
first
Chicago
developer
!
Zero
professional
experience
with
mobile,
how
to
start?

10. Initial
Observations
• Management
buy-­‐in
to
use
Agile
methods
• Young,
energetic
team
• Lack
of
process
&
automation
• UI
Design
work
was
not
in
the
same
sprints
• Ambitious
cross
platform
architecture
• Lack
of
OO
Design
&
Clean
Code
discipline

11. Action
Items
• Communication,
communication,
communication
• Architectural
and
Process
Analysis
• Continuous
Integration
Setup
• Product,
Design
and
Development
Sprint
Alignment
• Agile
Practice
Training
&
TDD

12. Tools
• JIRAs
for
distributed
team
whiteboards
• Jenkins
for
automated
build
&
deployment
• TestFlight
for
iOS
app
internal
distribution

13. Build
Pipeline
–
iOS
Client
Unit
Test
Build
Main
Build
Client
code
checkins
UI
Automati
on
Build
Automated
User
Acceptance
Tests
TestFlight

14. Build
Pipeline
–
Server
Unit
Test
Build
Server
code
checkins
Manual
deploy
Sanity
Test
Builds
with
Main
Build
SoapUI
Auto
deploy
Internal
Dev
Server
Stable
Dev
Server

15. Continuous
Integration
• Morningstar
app
for
iPad
– 7,300+
(client)
and
2,600+
(server)
commits
– 4,000+
automated
iPad
builds
&
deployments
– 1,000+
automated
server
builds
&
deployments
– Code
checkins
à
Test
builds
à
Deploy
builds
10/22/13
Mobile Solutions Development
Team
15

16. Past
Internal
Environments
Build
&
Auto
Deploy
Build
&
Auto
Deploy
Build
&
Auto
Deploy
Dev
Server
Manual
1-­‐click
Deploy
Stable
Dev
Server
OK
iOS
Devices
10/22/13
OK
OK
Mobile
Solutions
Development
Team
16

17. Current
Environments
Build
&
Auto
Deploy
Build
&
Auto
Deploy
Build
&
Auto
Deploy
Dev
Server
Stable
Dev
Server
QA
Server
Staging
Server
Live
Server
iOS
Devices
Manual
1-­‐click
Deploy
with
approval

18. Test
Driven
Development
• Client
– 400+
Classes,
72,000+
LOC,
160+
XIBs
– 600+
Unit
Tests
– GHUnit
for
testing,
OCMock
for
mocking
– User
Acceptance
Testing
• Behavior
Driven
Test
with
Frank
(retired)
• Apple
UIAutomation
(under
development)
10/22/13
Mobile Solutions Development
Team
18

19. Test
Driven
Development
• Server
– 230+
classes,
20K+
LOC
– 180+
test
classes,
20K+
LOC
– 86%
line
coverage
– 65%
conditionals
coverage
– JUnit
for
testing
– JMockIt
for
mocking
10/22/13
Mobile Solutions Development
Team
19

20. Full
Stack
Mobile
Development
• Concurrent
client
(iPad)
and
server
(Java)
development
• Multi-­‐version
support
• Client
or
server
logic
• Skillsets

21. Evolving
Architectures
Request/
Response
Client-­‐side
Publish/
Subscribe
Async
Server-­‐
side
Publish/
Subscribe
Past
Present
Future

22. Gateway
Architecture
Apple
iTunes
In
App
Purchase
Login
Morningstar
iPad
app
REST/JSON
over
HTTPS
Morningstar
Mobile
Server
Portfolio
API
Others
UIWebView
over
HTTPS
HTML
pages

23. Reusable
Components
Popover
with
bottom
fade
effect
Securities
labels
with
ratings
Security
Charts

24. Publish/Subscribe
Architecture
Based
on
Event
subscription/notification
from
NSNotificationCenter
User
taps
to
see
mini-­‐quote
Each
row
subscribes
to
its
security
object
When
the
app
receives
updates
to
a
security
object,
all
subscribers
get
latest
data
and
update
views

25. Internal
Features
• Feature
Toggles
• Internal
Server
Connection
• “Shake”
Feedback
• Logging
&
Performance
Monitoring

26. Feature
Toggles
• Allow
us
to
experiment
with
new
features
• Can
be
used
to
enable/disable
features
based
on
context
Mobile Solutions Development
10/22/13
Team

27. RESTful
APIs
• Since
we
cannot
control
published
app
customer
upgrades*,
we
have
to
make
sure
the
server
supports
multiple
client
app
versions,
different
locales,
multiple
products.
– REST
with
JSON
over
HTTPS
– Cacheability,
CDN
friendly
(Akamai/Varnish)

28. RESTful
API
Examples
• HTTPS
GET/PUT/POST/DELETE/OPTIONS
• Endpoint
convention
– Format:
https://{dns}/{ServicePrefix}/{resources}
– ServicePrefix
• /service/1.0/locales/en-­‐US/products/RT/
– REST
resources
• /securities/USA:MORN/news
• /securities/USA:MORN/quotes
• /securities/USA:MORN/info
• Example
– GET
https://mobileservice.morningstar.com/service/1.0/locales/en-­‐US/products/
RT/securities/USA:MORN/news

29. Standard
Data
Formats
• “Glue”
between
client/server
• Standard
formats
for
Security,
Holding,
Portfolio,
News
etc.
• Reusable
parsers
• JSON
data
types
• DateTime
in
UTC
(ISO8601)
• Regardless
of
data
formats
from
different
data
sources,
mobile
server
and
app
share
one
common
format

30. Async
I/O
Promise<HttpResponse>,
WS.getAsync
and
Promise.waitAll
Server
Chained
of
HTTP
response
Promises
waitAll
Thread
yield
transform
&
serialize
results
Security
Data
Portfolio
API
Async
calls
CMS

31. Launch
Results
• Public
launched
on
Sep
16,
2013
• 5,000
app
downloads
in
1
week
• 1M
web
service
calls
in
1
week;
4M
calls
in
3
weeks
• Average
web
service
response
time
is
~712ms

32. Rome
was
not
built
in
a
day
• Agile
is
more
a
guideline.
Mix
&
match
for
your
team
• Focus
on
working
software
• Iterate,
iterate
and
iterate
• Internal
feedback
is
good;
external
feedback
is
great
• Deadline
vs
Feature
dilemma
• Continual
improvements
and
releases
are
key
to
improve
user
engagement
&
satisfaction

33. First
release
is
just
the
beginning
Creating
masterpiece
is
the
end
goal
Thanks
&
Questions?
@_wee_