Mobile applications are a hot topic these days. This presentation will take you through a journey of a mobile application development project from a project manager’s eyes. The presentation will discuss different phases of the project from definition to design to development. A couple different mobile applications will be demonstrated during the presentation. One application is a North Dakota road conditions app and the other a park and recreation app. Finally, the presentation will discuss the technology used and lessons learned through the journey.

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

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

3. TYPES OF MOBILE APPLICATION
Public Information
Dissemination
Collaborative
Field Data
Other Types Collection
Games
Advertising
Utilities/Productivity
Communications
Multimedia

4. CONSIDERATIONS
How will application be What’s the Fiscal
used? Resources?
Disseminate content Existing personnel skills
Collect data Return of investment
Mobile
Picture/video/voice
Solution Targeted users/devices
Geospatial
Deployment
Offline access
What devices?

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

6. 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
• http://www.dot.nd.gov/travel-info-v2/
• Create a class leading mobile application

7. ND ROADS: PROJECT OVERVIEW

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

9. 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

10. DESIGN / VISUALIZATION
• Sitemap

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

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

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

14. 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)

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

16. DEPLOYMENT
• EASY!
• THIS IS A MOBILE WEB APP!
• http://www.dot.nd.gov/travelinfo/m/
CLASS LEADING MOBILE APP =
PROJECT MANAGERS + UX DESIGNERS + MOBILE
DEVELOPERS + CLIENT STAKEHOLDERS

17. 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

18. 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
• http://goramsey.org
• Low cost solution

19. 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)

20. GO RAMSEY MOBILE
• https://maps.co.ramsey.mn.us/goramseymobile/

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

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

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

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

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

26. SOME FUN!
• http://wqdemo.houstoneng.net/
QUESTIONS?
Presented by: Brian Fischer
bfischer@houstoneng.com