2012 emerging tech, migrating to mobile gis - tips for success, andy gup

Migrating to Mobile GIS Tips for Success

Andy Gup

Agenda

Walk away with 6 migration tips Differences between desktop and mobile 3 Approaches

Who am I?

Andy Gup, Esri

Tech Lead for Web APIs and Android

Esri Developer Network

agup@esri.com

http://blog.andygup.net

@agup

Who are you?

No longer just building for one screen size

1920x1080

Your Choices

Web app

+

Native mobile app

Web app

+

Web mobile app

(a.k.a Hybrid)

Web app only

(a.k.a Responsive)

1.

2.

3.

Development Skills (a generalization)

Fewer Skills More Skills

Desktop HTML + JavaScript

Hybrid Native Mobile HTML + JavaScript

How mature?

1991 2012

Sources: html5rocks.com, Wikipedia, W3C

iPhone 1

June 2007

Android v1.5

April, 2009

X X

if(device == mobile)

{

difference1: expectations,

difference2: look_and_feel,

difference3: capabilities,

difference4: performance

}

Wait…how do I pan and zoom the map??

Hmmm…how many map layers do I load?

VS.

1 GB RAM 16 GB RAM

How come my map loads so slooow?

VS.

Mostly connected Always connected

My survey crews use GPS heavily…

VS.

Limited battery Unlimited power

Desktop Web App

One size fits all Works with most desktop browsers Works across Windows, Mac, Linux Mobile web did not exist No GPS, camera, SD card

Using desktop app on smartphone

Native Mobile App

Targeted only to specific devices Targeted only to specific OS versions Direct access to GPS, camera, SD Card Requires specialized development skills

Native devices

!= !=

Native devices

ArcGIS SDK for Android ArcGIS SDK for iOS ArcGIS SDK for Windows Phone

Native devices

Java

Many OS versions

Many different

manufacturers

Many different screen types

OEM variations in OS

IDE = Eclipse

C#

Limited OS versions

Limited number of devices

IDE = Visual Studio

Objective C

Limited OS versions

Very limited number of

devices

IDE = Xcode

Responsive Web App (circa >= 2011)

Tailors content and view based on browser type No direct access to GPS, camera, SD card Works with many different desktop and mobile browsers Works across Windows, Mac, Linux

Responsive Web App

ArcGIS API for JavaScript - Compact

http://esriurl.com/compactJS

<script type="text/javascript"

src="http://serverapi.arcgisonline.com/jsapi/arcgis/?v=3.1compact">

arcgis.com

1440 x 900 480 x 800 hdpi

Portrait Landscape

Web app that looks native

The challenge Mobile JavaScript frameworks…

Hybrid App

Looks and acts like a native app Re-uses existing web content Works across different devices Access to GPS, camera, SD Card Requires fewer specialized skills than native

+ Android SDK

Java Project

ArcGIS

JavaScript +

Mobile

JavaScript

Framework

=

Hybrid App

Hybrid Web Apps

Examples of Hybrid Web Apps

http://www.phonegap.com/app

Hybrid Web App Platforms

Migration suggestion #1

Start prototyping today

Migration suggestion #2

Analyze existing usage

Mobile usage stats for my website?

Web Server logs Web analytic tools

Sample web-site stats from esri.com

Migration suggestion #3

Re-evaluate ALL use cases and workflows

?

? ?

Migration suggestion #4

Expect to re-write code

When in doubt, discard and re-write

Migration suggestion #5

Buy as many test devices as possible

Migration suggestion #6

Dig deep into browser differences

Understand browsers

caniuse.com

Demo Putting it all together

Andy Gup, Esri

Tech Lead for Web APIs and Android

Esri Developer Network

agup@esri.com

http://blog.andygup.net

@agup