Social Media
Games
Music Players
Location Based Services
Home Control
And more…
What kind of app can I write?
Hardware-accelerated Transitions, Transforms and Animations
Shadows and Gradients
Web Workers and Web Sockets
Semantic Zoom, Gestures
Much more…
IE10 Performance Enhancements
Faster JavaScript speed
Fast transitions and CSS effects
60FPS Canvas
Hardware Accelerated Goodness
IE10 Performance
Bottom line:
IE10 is an excellent UI Development Platform!
Realities
Incomplete
Or
Fragmented
Native, Hybrid & Hosted
Native
Native App
Runtime
Operating System
APIs
Hybrid
Native App Runtime
Operating System
APIs
Web
Browser
Control
JavaScript>native
API connector
Hosted
Web Browser
Operating System
Standards
Based
HTML5
Interfaces
App
Cache
InternetHosted
Web
ServerMicrosoft Store
Native, Hybrid & Hosted
Native
Native App
Runtime
Operating System
APIs
Hybrid
Native App Runtime
Operating System
APIs
Web
Browser
Control
JavaScript>native
API connector
Hosted
Web Browser
Operating System
Standards
Based
HTML5
Interfaces
App
Cache
InternetHosted
Web
ServerMicrosoft Store
What makes a Hybrid App?
Hybrid
Native App Runtime
Operating System
APIs
Web
Browser
Control
JavaScript>native
API connector
Microsoft HTML5 VS12 Template
Adobe PhoneGap / Apache Cordova
Microsoft HTML5 VS12 Template
Included within VS12
You roll your own device connectivity
Out of the box fastest, least capable
Adobe PhoneGap / Apache Cordova
Download
Modify to optimize performance
Out of the box slow, most capable
Extensible through plugins
Cross Platform Capabilities
Hybrid on Windows Phone 8: LIVE DEMO
Code reuse between platforms
Leverage existing web assets, perhaps from an existing Website
Deploy through the Microsoft Store
Large developer talent base
HTML5 vs. Native
Hybrid more complex, but allows access to more platform capabilities
Hosted allows for easy distribution, discovery and integration with an existing site - but has less access to the platform
Hybrid vs. Hosted
Ask this question:
Does the web application model fit the UI and performance expectations of the users of targeted platforms?
Is Your App a Fit?
HTML (4.x, 5)
CSS2 and CSS3
JavaScript
Skillsets
Agency Background
Web Developers
Transitions
Animations
2D and 3D Transforms
Custom Fonts
Shadows
Gradients
System UI settings
What’s new and cool
LIVE DEMO
MSPointer model
Like Mouse Events
Multi-touch input
-ms-touch-action:
enable or disable key features
Tied to native gesture system.
No need to build your own gestures!!!
Capture Multiple DOM elements
Multiple Gestures can be received at the same time
Minimize JavaScript
Optimize Images!
Use Hardware Accelerated CSS
Use innerHTML: Minimize DOM interaction
Submit like any application
Monetize using web OR native techniques
Remember MSFT submission requirements
“The Web” (Important!)
MSDN, IE Developer, Channel9
Adobe, Phonegap.com, Apache
Atari.com
Developer.nokia.com
Twitter: @jsguy (me)