3. What we will see today?
-‐‑ Introduction to Mobile Apps
-‐‑ The Data.One App Competition
and platforms to launch and
promote application
-‐‑ Ge>ing Started
-‐‑ Choosing a direction
-‐‑ Structure of starting an App
-‐‑ PhoneGap Demo
-‐‑ Where to go from here?
4. Mobile Apps
Benefits for Business – Apps:
Build relationships
Build loyalty
Reinforce your brand
Increase your visibility
Increase your accessibility
Solve the problem of getting stuck in spam folders
Increase exposure across mobile devices
Connect you with on-the-go consumers
Give you tools that are driving the "New App Economy"
Enhance your social networking strategies
6. Native App? HTML App?
Native (built for single device)
-‐‑
iOS (objective-‐‑c), Android (java)
-‐‑
Access to phone’s internal features
-‐‑
Faster runtime
-‐‑
Harder learning curve
-‐‑
More development time and costs
HTML APP (built for all devices at once)
-‐‑
Using universal website language
(HTML, CSS, Javascript)
-‐‑
Support for various API, JSON files and etc…
-‐‑
Quicker to develop and easy to update
-‐‑
Does not support all phone’s internal features
such as Camera
8. What is HTML?
Hypertext Markup Language
Hypertext Markup Language describes:
- Structure
- Content
- Typographic hierarchy
- Rudimentary style (bold, italics, etc.)
9. HTML Document
It might feel chaotic and unstructured …
But the entire content of the page exists here.
10. What is CSS?
Cascading Style Sheets
- Separates style from content
- Easier to change formatting and update an entire Web site
- Eliminates page load
- Flexible design
- Better user accessibility for search bots and screen readers
- Allows you to design for multiple browsers and multiple Operating
System (Linux, PC or Mac) environments
15. Analysis
Planning
Design
Development
Design
The entire experience of the mobile app is
dependent on the design and interface, here are
some focus points
-‐‑ Less interaction
-‐‑
Clean interface
-‐‑
Easy to use
-‐‑
Font selection
Quality
Assurance
Delivery
Marketing
18. Analysis
Planning
Design
Development
Delivery
Finally, your app is complete! Well, not quite.
-‐‑ Delivery to App Store
-‐‑
Delivery to Play Store
-‐‑
(Couple of weeks + feedback)
*Learn more of platform delivery at
phonegap.com
Quality
Assurance
Delivery
Marketing
20. PHONEGAP DEMO
GOTO http://www.phonegap.com/install/
- CLICK NODEJS Link
- INSTALL NODEJS
- OPEN TERMINAL on MAC | CMD on PC
- Navigate to Desktop (cd Desktop)
- Type “phonegap create myApp”
- On desktop you will see all the files created for you, open “WWW”
- This is where you store your web files (a demo is added for you)
- Open config.xml and rename between
- <name> and </name>
- End of Widget id
- <description> </description>
21. PHONEGAP DEMO
BUILD APP
- COMPRESS your folder on desktop (create myApp.zip)
GOTO http://build.phonegap.com
- Sign up
- Upload .zip from desktop
- Download APK for Andriod or ipa for iPhone
- *iPhone requires apple developer account
22. Where next?
- Check out Data.One competition
- www.gov.hk/en/theme/psi/contest
- Learn more on app development with some
resources like
• Codeacademy.com
• Google.com
• Or hands on with BSD Courses in Central