\ JC Now Case Study in Building an App on the Cheap Nick O Day GIS Manager 1
Background Within Metro Atlanta area (30 minute drive to downtown Atlanta) Within Fulton County Population: ~1,000,000 Johns Creek Incorporated in 2006 Population: ~84,000 Award-winning public schools 80% residential/ 20% commercial Biggest issue in Metro Atlanta TRAFFIC 2
Snowmageddon 2014 Several inches of snow/ice brought Atlanta to a standstill Massive traffic jams People sleeping in their cars Metro Atlanta shut down for almost a week What if we could send push alerts to motorists to warn them of traffic? (and alerts for other emergencies) 3
App Development Choices Native Apps (built using devicespecific SDKs) Xcode Android Studio Apache Cordova Hybrid Apps (built using web technology and a wrapper ) Ionic AppGyver EXPERT App Development Difficulty Spectrum NOVICE Extensive knowledge of SDKs Cost of ArcGIS Runtime for mapping Leverage your existing web development skills Free ArcGIS API for JavaScript for mapping 4
Which flavor of Cordova? Pros Apache Cordova PhoneGap Build EXPERT App Development Difficulty Spectrum NOVICE Maximum customization Advanced capabilities Total control over your app Independent of Adobe services Cloud-based service Fast prototyping Easiest learning curve Integration with Adobe services 5
Which flavor of Cordova? Cons Apache Cordova PhoneGap Build EXPERT App Development Difficulty Spectrum NOVICE Need to set up development environments Need to install helper component programs Lots of command line work Can t add customizations beyond plugins Limit on file upload size (anything over 50 MB costs) 6
JC Now - Overall Process Framework (UI & Most Functionality) App Wrapper & Push Service Native SDK & Build Environments Xcode Apache Cordova Android Studio ArcGIS API for Javascript Parse (3 rd Party Push Handler) 7
Building JC Now Step 1: Requirements Gathering What does the app need to do? City news stories Social media integration Interactive maps Links to City s sister apps Council meeting agendas Contact the City links Receive Push notifications What does the app need to look like? New City brand and color scheme Flat design (minimalist UI) 8
Building JC Now Step 2: What do you need? City news stories Social media integration Interactive maps Links to City s sister apps Council meeting agendas Contact the City links Receive Push notifications Javascript & jquery functions ArcGIS API for Javascript Parse API & Online Service 9
Building JC Now Step 3: Frameworks & Software Download, Install & Configure: Your JavaScript IDE of choice jquery Mobile framework Apache Cordova (and associated programs like Node.js) Xcode & Android Eclipse/Studio (and associated programs) Adobe Brackets Node.js Note: If you plan on building your app for ios you MUST use a Mac. (Xcode & ios SDK are not available for Windows) 10
Building JC Now Step 4: Create your shell Cordova app Create a folder/workspace to contain the app Create the app Add platforms to the app (ios & Android) 11
Building JC Now Step 5: Build web app code & insert in framework Insert jquery Mobile framework within www Add your code, build just like a web application Be sure to add any/all JavaScript APIs, images, CSS that your pages use (this will make the app faster and reduce data usage) 12
Building JC Now Step 6: Compile App Using Xcode and/or Eclipse/ Android Studio: Compile Test like crazy every page, every link Focus on UI issues 13
Building JC Now Step 7: Debugging Preferably use actual device to test app Test on emulators too When menu is open and user clicks on sister app buttons, menu blocks alert message. 14
Building JC Now Step 8: User Testing & Tweaks to Code Load app on your testing devices Let people play with the app in both versions Stay open to criticisms (and there will be criticisms) 15
Building JC Now Step 9: Release to App Stores Sign up as a developer Compile and Upload Wait 16
Marketing JC Now Get the word out Social media City communications/ Local news media Competitions & Awards 17
\ Questions? Nick O Day nick.oday@johnscreekga.gov 18