“A Project Managers Perspective” Presented by: Brian Fischer Houston Engineering, Inc. WLIA Conference, 02/14/2013 A JOURNEY THRU MOBILE APP DEVELOPMENT

BACKGROUND Native Platforms Native Platforms Apple iOS Apple iOS Windows Mobile Windows Mobile Android OS Android OS RIM Blackberry RIM Blackberry Mobile Web Mobile Web HTML5 / JavaScript / CSS3 HTML5 / JavaScript / CSS3 Bridging Technologies Bridging Technologies Adobe Flash Builder Adobe Flash Builder PhoneGap PhoneGap Appcelerator Appcelerator

TYPES OF MOBILE APPLICATION Collaborative Public Information Dissemination Field Data Collection Other Types GamesAdvertisingUtilities/ProductivityCommunicationsMultimedia

CONSIDERATIONS MobileSolutionMobileSolution How will application be used? What’s the Fiscal Resources? Disseminate content Collect data Picture/video/voicePicture/video/voice GeospatialGeospatial Offline access Existing personnel skills Return of investment What devices? Targeted users/devices DeploymentDeployment

MOBILE DEVELOPMENT PROCESS Project Discovery Project Definition Design Development QA / Revisions Deployment / Maintenance

ND ROADS: PROJECT OVERVIEW Goals for North Dakota Dept. of Transportation Provide a service to the public for road conditions “safely move people around in the State” Create a mobile application for existing Travel Map Create a class leading mobile application

ND ROADS: PROJECT OVERVIEW

PROJECT DISCOVERY Gain a general understanding of the needs Stakeholder education Evaluate “Mobile Web” versus “Native” app Device component access Functionality Deployment Maintenance

PROJECT DEFINITION Target audience Stakeholder interviews External and Internal Understand data services Choose technology Design considerations Cost estimating Project Definition phase is the foundation of providing a great mobile solution

DESIGN / VISUALIZATION Sitemap

UX DESIGN / VISUALIZATION Wireframing Outline functionality and allows for feedback before graphic design and coding

UX DESIGN / VISUALIZATION Moodboards Provides design feedback for graphic designers, partnered with The Nerdery

DESIGN / VISUALIZATION Visual Composites Establishes final design before any coding is done, partnered with The Nerdery

DEVELOPMENT Technology Backend ArcGIS Server / SDE Cached map services Custom JSON feeds for text views and messages Frontend Jquery Mobile ESRI JS API 3.2 (compact) HEI’s wq library Heavy use of HTML 5 (local storage, geolocation)

QA / REVISIONS Test on as many devices as possible Use of ticket collaboration environment Great for communication and making testers document bugs

DEPLOYMENT EASY! THIS IS A MOBILE WEB APP! CLASS LEADING MOBILE APP = PROJECT MANAGERS + UX DESIGNERS + MOBILE DEVELOPERS + CLIENT STAKEHOLDERS

NDROADS APP LESSONS LEARNED No build system for ESRI JS API = challenging loading issues Mobile device settings (private browsing) Resolution of devices (iPhone 5 retina display) Touch friendly icons Refreshing data / local storage Older mobile devices / browsers Android 2.x, IE 8

GO RAMSEY MOBILE: OVERVIEW Goals for Ramsey County Mobile App Discover and explore recreation opportunities in the County Provide a mobile alternative to the Silverlight application Low cost solution

DEVELOPMENT Technology Backend ArcGIS Server / SDE ESRI map services Frontend Jquery Mobile ESRI JS API 3.2 (compact) HEI’s wq library Heavy use of HTML 5 (geolocation)

GO RAMSEY MOBILE

GORAMSEY: LESSONS LEARNED Geolocation Map Service scales ESRI popups Loading too many features in Jquery Mobile view

DATA COLLECTION APPS Whole other talk! Audience is different Focus is on efficient data entry Streamline workflows Backend integration

RIVERWATCH Collect Monitoring Data Water Quality Snow Precipitation Single sign-on Data validation Backend integration Public portal

DEVELOPMENT Technology Backend PostGreSQL + PostGIS Python / Django Wq.db REST services Frontend Jquery Mobile Leaflet HEI’s wq library

DATA COLLECTION APPS: LESSONS LEARNED Data entry with few clicks Big data Offline editing Photos Data validation

Presented by: Brian Fischer QUESTIONS? SOME FUN!