Post on 21-Dec-2014
description
#codestrong
From Kitchen Sink to App: Real World Case Studies
or: How I Learned to Stop Worrying and Love the Kitchen Sink
#codestrong
Spirit Quest
@Ketan
#codestrong
Case Studies
#codestrong
Police Apps
#codestrong
Public Sector Engagement
Transparency
Open Data & Infrastructures
Multiple Devices
Cross Platform
Police Live Tweeting
Brief
http://www.flickr.com/photos/spiritquest/5070882391/in/set-72157619535937066/
#codestrong
Decisions
PhoneGap29%
Titanium39%
Sencha Touch32%
Platform Tools
Sencha Touch Titanium PhoneGap
Device Reach
GPS
Familiarity
Support / Roadmap
Public Availability
Native UI
#codestrong
Collaboration Workflow
Coffee & WIFI
Inspiration
Wireframes
App Concepts
App Context Structures
Structured Approach
http://www.flickr.com/photos/spiritquest/4103710975/
#codestrong
Outlines
#codestrong
OutlinesSplash/Loading page
Latest
Latest incident tweets
Police runnymede website RSS feeds
Police surrey website RSS feed
Surrey
List of officers
Officer Bio
Prebuilt message
Local
List of wards
List of officers
Officer bio
Text ServiceDial/call 999Detail view of selected priority
RSS list of events
Map
Local police Crimes
Outcomes
About
Help - splash
Want to see your neighbourhood here?
Email to Multizone and Surrey police
2 - step 1 Feed
3 - step 2 Maps
4 - step 3 Officer list
5 - step 4 Social media icons
6 - step 5 Priorities
Select your installed app.
Visit our Site
Email Us
On YouTube
Officers that tweet
On Twitter
Report a crime
Get Involved
On Flickr
Local phone number
Your Team
Station location
Tweet @Runnymedebeat
Runnymede
Important Phone Numbers
Priorities
Events
Emergency Call
Local Rate Phone
National Local Number (101)
Credits
Settings
Contact
Terms of use
Picture upload service
Phone
Website
#codestrong
Splash/Loading page
Latest
Latest incident tweets
Police runnymede website RSS feeds
Police surrey website RSS feed
Surrey
List of officers
Officer Bio
Prebuilt message
Local
List of wards
List of officers
Officer bio
Text ServiceDial/call 999Detail view of selected priority
RSS list of events
Map
Local police Crimes
Outcomes
About
Help - splash
Want to see your neighbourhood here?
Email to Multizone and Surrey police
2 - step 1 Feed
3 - step 2 Maps
4 - step 3 Officer list
5 - step 4 Social media icons
6 - step 5 Priorities
Select your installed app.
Visit our Site
Email Us
On YouTube
Officers that tweet
On Twitter
Report a crime
Get Involved
On Flickr
Local phone number
Your Team
Station location
Tweet @Runnymedebeat
Runnymede
Important Phone Numbers
Priorities
Events
Emergency Call
Local Rate Phone
National Local Number (101)
Credits
Settings
Contact
Terms of use
Picture upload service
Phone
Website
Mockups
#codestrong
Splash/Loading page
Latest
Latest incident tweets
Police runnymede website RSS feeds
Police surrey website RSS feed
Surrey
List of officers
Officer Bio
Prebuilt message
Local
List of wards
List of officers
Officer bio
Text ServiceDial/call 999Detail view of selected priority
RSS list of events
Map
Local police Crimes
Outcomes
About
Help - splash
Want to see your neighbourhood here?
Email to Multizone and Surrey police
2 - step 1 Feed
3 - step 2 Maps
4 - step 3 Officer list
5 - step 4 Social media icons
6 - step 5 Priorities
Select your installed app.
Visit our Site
Email Us
On YouTube
Officers that tweet
On Twitter
Report a crime
Get Involved
On Flickr
Local phone number
Your Team
Station location
Tweet @Runnymedebeat
Runnymede
Important Phone Numbers
Priorities
Events
Emergency Call
Local Rate Phone
National Local Number (101)
Credits
Settings
Contact
Terms of use
Picture upload service
Phone
Website
Mockups
#codestrong
Splash/Loading page
Latest
Latest incident tweets
Police runnymede website RSS feeds
Police surrey website RSS feed
Surrey
List of officers
Officer Bio
Prebuilt message
Local
List of wards
List of officers
Officer bio
Text ServiceDial/call 999Detail view of selected priority
RSS list of events
Map
Local police Crimes
Outcomes
About
Help - splash
Want to see your neighbourhood here?
Email to Multizone and Surrey police
2 - step 1 Feed
3 - step 2 Maps
4 - step 3 Officer list
5 - step 4 Social media icons
6 - step 5 Priorities
Select your installed app.
Visit our Site
Email Us
On YouTube
Officers that tweet
On Twitter
Report a crime
Get Involved
On Flickr
Local phone number
Your Team
Station location
Tweet @Runnymedebeat
Runnymede
Important Phone Numbers
Priorities
Events
Emergency Call
Local Rate Phone
National Local Number (101)
Credits
Settings
Contact
Terms of use
Picture upload service
Phone
Website
Mockups
#codestrong
Splash/Loading page
Latest
Latest incident tweets
Police runnymede website RSS feeds
Police surrey website RSS feed
Surrey
List of officers
Officer Bio
Prebuilt message
Local
List of wards
List of officers
Officer bio
Text ServiceDial/call 999Detail view of selected priority
RSS list of events
Map
Local police Crimes
Outcomes
About
Help - splash
Want to see your neighbourhood here?
Email to Multizone and Surrey police
2 - step 1 Feed
3 - step 2 Maps
4 - step 3 Officer list
5 - step 4 Social media icons
6 - step 5 Priorities
Select your installed app.
Visit our Site
Email Us
On YouTube
Officers that tweet
On Twitter
Report a crime
Get Involved
On Flickr
Local phone number
Your Team
Station location
Tweet @Runnymedebeat
Runnymede
Important Phone Numbers
Priorities
Events
Emergency Call
Local Rate Phone
National Local Number (101)
Credits
Settings
Contact
Terms of use
Picture upload service
Phone
Website
Mockups
#codestrong
Working the SinkEmulator
Check Platform Differences
Buy Devices
Experience
Structure/Performance
Time
#codestrong
XML Responses
YQL
{JSON}
Filesystem
Twitter & oAuth
Working with Data
http://www.flickr.com/photos/spiritquest/5849484264/in/set-72157626393768195/
#codestrong
XML Responses
YQL
{JSON}
Filesystem
Twitter & oAuth
Working with Data
Resources examples
filesystem.js
geolocation.js
map_view.js
network.js
picker_basic.js
table_view_layout.js
table_view_row_append.js
xhr_xml.js
yql_flickr.js
#codestrong
Device Resolution
Data Manipulation
Caching
Webview vs Native
UI / UX
#codestrong
Map API vs Webview
Local & Remote
UK CrimeMapper
Public Data
Mapping
#codestrong
Version Numbering
Ti.App.Properties
Changelogs
Testflightapp
Version Control
Feedback and Testing
http://www.flickr.com/photos/spiritquest/3782923164/in/set-72157621778256943/
#codestrong
Populating Data
Public Perception
Bug Fixes
Expectations
Getting It
Press
In The Field
#codestrong
Populating Data
Public Perception
Bug Fixes
Expectations
Getting It
Press
In The Field
#codestrong
Populating Data
Public Perception
Bug Fixes
Expectations
Getting It
Press
In The Field
#codestrong
Populating Data
Public Perception
Bug Fixes
Expectations
Getting It
Press
In The Field
#codestrong
Populating Data
Public Perception
Bug Fixes
Expectations
Getting It
Press
In The Field
#codestrong
Festival Apps
#codestrong
Data Management
Microformats
iUI (JS Library)
Motivation
Personal Challenges
http://www.flickr.com/photos/spiritquest/2457078664/in/set-72057594125240734/
http://www.flickr.com/photos/spiritquest/2460505217/in/set-72057594125240734/
#codestrong
Police App
Refactoring
Research
Q & A Site
Github & Blogs
Training
Build on your success
http://www.flickr.com/photos/spiritquest/1374407445/
Titanium Certified Application Developer
#codestrong
Police App
Refactoring
Research
Q & A Site
Github & Blogs
Training
Build on your success
http://www.flickr.com/photos/spiritquest/1374407445/
Titanium Certified Application Developer
#codestrong
Visual Challenges
Problem Solving
Personas
Graphic Design
Collaboration
Plot & Scheme
#codestrong
Future Design
LOGIN
IMPORT
EXPORT
EVENT EDITING
VENUE EDITING & Addition
HELP
Branding
Sponsor Details Festival Details
Festival Text / Synposis
Festival Logo
Festival Trailer
Festival Name
Image Upload (for App)
URL Sponsor
Sponsor Name
Upload Sponsor VideoSponsor
Text
Settings
Contact Details
Social Media Connections Setup
SIGN UP / SETUPPayment KEY
Online Interface
ICSEXCEL
Choose Event Type
EDIT Existing Event
Attach Video
Add Thumbnails
Edit/Add Geodata
ADD New Event
USER GUIDE
EMAIL SUPPORT
FORUM SUPPORT
ERROR HANDLING REPORTS
IMPORT REVIEWFORMATS
ICS
EXCEL
XML
CSV
#codestrong
Outlines & SchemasVenue:
Address Venue Name Venue ID Geo/ Long/Lat Phone Number Email
Phone Number
Website Box OfficeNearest Station/Tube/Bus (•)
Festival
Venue
Genre
Event Type
Cast & Crew
Events
Pricing
#codestrong
Wireframe
iMockups
Layout Design
Data Caching
Tracking
Custom URLs
Email Modal Dialog
Custom Views
#codestrong
Wireframe
iMockups
Layout Design
Data Caching
Tracking
Custom URLs
Email Modal Dialog
Custom Views
#codestrong
Wireframe
iMockups
Layout Design
Data Caching
Tracking
Custom URLs
Email Modal Dialog
Custom Views
#codestrong
Wireframe
iMockups
Layout Design
Data Caching
Tracking
Custom URLs
Email Modal Dialog
Custom Views
#codestrong
Wireframe
iMockups
Layout Design
Data Caching
Tracking
Custom URLs
Email Modal Dialog
Custom Views
#codestrong
Wireframe
iMockups
Layout Design
Data Caching
Tracking
Custom URLs
Email Modal Dialog
Custom Views
#codestrong
Wireframe
iMockups
Layout Design
Data Caching
Tracking
Custom URLs
Email Modal Dialog
Custom Views
#codestrong
Wireframe
iMockups
Layout Design
Data Caching
Tracking
Custom URLs
Email Modal Dialog
Custom Views
#codestrong
Retina Display
HIG
iTunesArtwork
No Borders / Alpha
Icon Details
Check Emulator for Retina
Icon Developmenticon.png
icon@2x.png
512 x 512 px
#codestrong
Strategies & Structures
#codestrong
Tackling Your First App
Build/Install On Device
Search / Explore
Watch Out For Updates
Install Direct From Studio
Check Network for LIVE Apps
Break away from the sink
http://www.flickr.com/photos/spiritquest/3601421463/in/set-72157619352436160/
#codestrong
Find Kitchen Sink Examples
Keep a Copy On Device.
Native vs WebView
Software Tools
Ticket Tracking
Consider Version Control
Pic n mix
http://www.flickr.com/photos/spiritquest/5604035309/in/set-72157626338910059/
#codestrong
Titanium / Javascript / Web App Meetups
Q+A
Participate
Contribute
Blogs / IRC / Github
Books
Get Help!
http://www.flickr.com/photos/spiritquest/5604047525/in/set-72157626338910059/
www.stereoartist.com/blog/codestrong-2011-session
Thank You
http://goo.gl/WFXb9#codestrong
http://www.flickr.com/photos/spiritquest/5043558251/in/set-72157627151044919/