Embed Size (px)
DESCRIPTION
Presented at GIS in the Rockies 2012. This presentation looks at some of the challenges with migrating from desktop web applications to smartphones and tablets. While it uses mapping and spatial examples it applies to anyone looking at migrating to mobile. You'll walk away with some technical suggestions on how to address these challenges.
Citation preview
Migrating to Mobile GISTips 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
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
DesktopHTML + JavaScript
Hybrid NativeMobile HTML + JavaScript
1991 - HTML
1995 – HTML 2
1996 – CSS 1 +
JavaScript v
1
1997 – HTML 4
1998 – CSS 2
2002 – Tableless W
eb Desig
n
2005 – AJAX
How mature?
2008 – HTML5
(1st d
raft)
1991 2012
Sources: html5rocks.com, Wikipedia, W3C
iPhone 1June 2007
Android v1.5April, 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 challengeMobile 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 SDKJava Project
ArcGIS JavaScript +
Mobile JavaScriptFramework
=
Hybrid App
Hybrid Web Apps
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
DemoPutting it all together
Andy Gup, Esri
Tech Lead for Web APIs and Android
Esri Developer Network
http://blog.andygup.net
@agup
