With thousands of applications and millions of downloads, the App Store has been a resounding success that has prompted other phones manufacturers to develop their own App Stores. Developers and businesses alike took notice of the early success and sales of iPhone apps and now the rush is on to build native mobile applications. Now businesses say they need an mobile application before they know what the business case for the application will be. But are native applications really the future of mobile? What happened to the promise of the Mobile Web? And what about hybrid applications? When does it make sense to build each type of application? What are the limitations of each? And where is each technology headed? Learn how to make and informative decision between these two approaches.
3. What’s the difference?
What is your product or service?
Who is your audience?
What are your resources and budget?
4. Native Apps
Specifically designed to run on a device’s operating system.
• Device feature integration
• Tailor user experience
• Performance
• Monetization
• Push capabilities
• Multiple platform development
• Multiple skills needed
5. Mobile Web
Uses HTML5, JavaScript, CSS and runs in a devices browser
• No download required
• Device agnostic
• Same base code can be used
to support any device
• Lower cost
• Reach a higher audience
7. Hybrid
HTML5 + JavaScript with a wrapper that gives it native
capabilities.
• Access native features
• Content is loaded via browser
• Better performance
• Multiple platform development
• Multiple skills needed
8. PhoneGap
An open source framework that allows you to access native
APIs for iPhone, Android, BlackBerry, Windows Phone 7 + more
Capture photo: • Accelerometer
function capturePhoto() { • Camera
navigator.camera.getPicture(onPhotoDataSuccess,
onFail, { quality: 50 }); • Compass
}
• Contacts
... • Geolocation
<button onclick="capturePhoto();">Capture Photo</button> • Notifications
• And much more…
9. Appcelerator
Recompiles HTML + JavaScript into native code for each
device
• Completely native app
HTML • Faster development cycle
+ Native App • Leverage existing skills
JavaScript (HTML, CSS, JavaScript)
• Cross platform efficiency
• Known to have optimization issues
10. What is your product or service?
Who is your target audience?
• Functionality and feature set?
• Device capability needs?
• Online or offline?
• Audience reach?
• What content will you be
delivering?
11. Resources and budget
”When we update the Facebook product we have to update
about seven different versions… It's becoming a real
engineering challenge for us, as well as other technology
companies.
The end goal is that we'll be able to develop one version of
Facebook for mobile devices, that runs on all different kinds
of mobile phones. That's really where our focus is now.”
-Bret Taylor, Facebook CTO
12. UCLA mobile
Based on the UCLA Mobile Web Framework.
• Single set of base code
• Progressive enhancement
• Works with any language: PHP, .NET, Java, Python
• Device agnostic
• Implemented across University of California system:
Berkeley, San Diego, San Francisco
16. Mobile First
Prioritize mobile context first when creating user experience
and focus on core content and functionality
Walgreens website
• 5 links on the homepage
account for 59% of traffic:
Photos, Search, Prescriptions,
Pharmacy link & Store locator
• These 5 links only take up 3.8%
of the homepage.
17. Responsive Design 1.0
Serves same HTML content and assets for every device and
then scales via CSS using media queries.
18. Responsive Design 2.0
Dynamically loads HTML content and assets based on screen
size and features.
• Targets device features and
not actual device
• Responsive images are loaded
dynamically and not scaled.
