Upload
mario-gonzalez
View
669
Download
0
Tags:
Embed Size (px)
DESCRIPTION
Thesis Presentation 2012
Citation preview
Thesis Presentation:Evaluation and prototyping of an HTML5 Client for iOS
devices
Amit Purkait
mobile
WEBNATIVE
native is
easy!
mobile
Platforms
Native
Native
Objective CJava
Java ME
C#
C/C++
.NET
RubyLua Visual Editor
Java EE
Native
!Native
Other platformsDefragmentation
What if?Native
http://www.publicdomainpictures.net/pictures/10000/velka/spider-web-pattern-1128739369633HK.jpg
web
why web?Runs on browser
Universal
HTML5 + CSS3 + JavaScript
Rapid development
Rapid deployment
Web
ProgrammingLanguages
Web
HTML5 CSS3
JavaScriptJavaScript
Web
HTML1989
HTML52011
HTML41997
CSS3Rounded borders
Animations3D acceleration
Translation
Transformation
Transperancy
Border Image
Gradient Background
Multiple Backgrounds
Word wrapWeb fonts
Overflow-x
Overflow-y
Web
JavaScript
Mobile Frameworks
Jquery Mobile
Jquery UI
iUI
The-M-Project
Sencha Touch
iWebKitJo-Mobile
jQ Touch
zepto.js
Frameworks
Help is there
Frameworks
Comparision tables 1
http://www.markus-falk.com/mobile-frameworks-comparison-chart/
Comparison ChartFrameworks
Filters:
● Platform : iOS, Android, Windows Phone, Blackberry OS, Symbian
● Languages : HTML CSS Javascript
● Target : Mobile website, web app
● UI Widgets : yes
Frameworks
Frameworks
HTML5 Client for iOS devices
mQuest
GWT(Java)
Web (HTML5, CSS3, JavaScript + Frameworks)
Analysis
GWT
Javascript
UI
JSNI Calls
Callbacks
interacts
Web Techonologies
Analysis
Analysis
Previous Client
Analysis
THESIS
OBJECTIVES- Define a better User Interface
- iOS look and feel
- Implement the required functions
UI Change
Need jquery theme
jQuery MobilePackage
CSS JS
Themeing mQuest
Change with jquery theme
.ui-header { ...}
li.ui-buttons { ...}
ui-text { ...}
ui-footer{ ...}
iOS Styling with CSS3
Change with jquery theme
iOS Styling with CSS3
Need old image
Results
Functions
Better UI Architecture
Functions
Expression parser
Functions
Date/time Questions
Functions
Matrix Question
Functions
Rank Question
Functions
GPS with HTML5
Deploying
mQuest
With PhoneGap
why PhoneGap?
Deploy
Deploy
PhoneGap's features
Source: http://phonegap.com/about/feature
Deploy
Process
Results
Final
thoughts
mQuestHTML5 Client
Questions?