Upgrade to Pro — share decks privately, control downloads, hide ads and more …

O'Reilly Webcast: Apps for the Multi-device world.

O'Reilly Webcast: Apps for the Multi-device world.

We live in a multi-device world of phones, tablets, TVs, in-car navs, and smart watches. All these devices have one thing in common: HTML5. In this webcast, Lee Boonstra, technical trainer at Sencha, will discuss some of the challenges and opportunities of developing for a multi-device world and how Sencha can help you create better experiences. She will also provide some inspiring client examples and case studies.

In this webcast you will:

Learn the design challenges for developing for a multi-device world
Learn about HTML5 and Sencha Touch How to solve these design challenges with Sencha±

Lee Boonstra

August 13, 2014
Tweet

More Decks by Lee Boonstra

Other Decks in Technology

Transcript

  1. Hands-On Sencha Touch 2 A Real-World App Approach Pages: 344

    ! ISBN-13: 978-1449366520 ISBN-10: 144936652X
  2. “As a technical trainer I teach Sencha Touch and Ext

    JS. I develop courses and speak at events.” Lead Technical Trainer, Sencha Europe
  3. “I’ve a background in Java and client-side development. Before Sencha

    I worked as a lead developer for several clients:”
  4. Apps for the multi-device world. ! “The challenges and opportunities

    of developing for a multi-device world and how Sencha can help you create better experiences.”
  5. ‣ Laptop ‣ Tablet ‣ E-reader ‣ Game console ‣

    Camera ‣ Phone ‣ … What’s in my bag…
  6. ‣ Screen Size ‣ Operating System & Browser Different devices,

    different… Multi device design challenges
  7. ‣ Screen Size ‣ Operating System & Browser ‣ User

    Input Different devices, different… Multi device design challenges
  8. ‣ Screen Size ‣ Operating System & Browser ‣ User

    Input ‣ Features Set Different devices, different… Multi device design challenges
  9. ‣ Screen Size ‣ Operating System & Browser ‣ User

    Input ‣ Features Set ‣ Purpose Of Use Different devices, different… Multi device design challenges
  10. ‣ Screen Size ‣ Operating System & Browser ‣ User

    Input ‣ Features Set ‣ Purpose Of Use ‣ Data & Data Security Different devices, different… Multi device design challenges
  11. Where a multi device app fits in Database
 Server SQL

    Server Oracle Sybase MySql ... Application Server Java PHP ColdFusion .NET Ruby on Rails ... Web 
 Server IIS Apache Tomcat Websphere ... JSON/XML Transport Layer Internet / Intranet
  12. “Let’s review the design challenges: How can we solve our

    problems with the Sencha Frameworks?”
  13. Screen Size Multi device design challenges ! //in any class!

    ! plugins: ['responsive'],! responsiveConfig: {! landscape: {! dock: ‘right’! },! portrait: {! dock: ‘bottom’! }! }!
  14. ! ! ! Device profiles can differentiate views and functionality

    between multiple devices. ! Screen Size Multi device design challenges Sencha Touch
  15. Screen Size Multi device design challenges Ext.define('MyApp.profile.Phone', {! extend: 'Ext.app.Profile',!

    ! config: {! name: 'Phone',! views: ['Main']! },! ! isActive: function() {! return Ext.os.is('Phone');! }! });
  16. Sencha runs in any modern browser out of the box!

    This includes the browsers on: ! OS / Browser Multi device design challenges Mac OSX Windows Unix iOS Android Tizen Windows Phone Tizen
  17. Possibility to package apps as hybrid apps, to sell in

    app stores! ! Sencha has Adobe PhoneGap & Apache Cordova integration. OS / Browser Multi device design challenges
  18. Built-in touch and gesture support. (tap, drag, swipe, pinch and

    rotate…) ! User Input Multi device design challenges
  19. Built-in touch and gesture support. (tap, drag, swipe, pinch and

    rotate…) ! Sencha is all JavaScript! Include external API’s! User Input Multi device design challenges
  20. Build a hybrid app, to support device specific features. !

    ! ! ! Features Set Multi device design challenges
  21. Features Set Multi device design challenges ! ! sencha phonegap

    init com.sencha.myapp MyApp! ! sencha app build native! !
  22. ‣ Design apps with a purpose! ‣ Will people use

    your app on that particular device? Purpose Of Use Multi device design challenges
  23. ‣ Design apps with a purpose! ‣ Will people use

    your app on that particular device? Purpose Of Use Multi device design challenges
  24. ! ! ! The browser can contain sensitive data, a

    direct gateway for cyber-criminals. ! Data Security Multi device design challenges
  25. Data Security Multi device design challenges Sencha Space Client App

    - Ideal deployment platform for HTML5 apps - Secure and managed environment 
 for business web applications - Isolates work life from rest of the device for users - Apps within the Sencha Space can communicate with each other
  26. Data Security Multi device design challenges Management Console - Easily

    deploy apps to a encrypted mobile workspace - Remotely revoke access / wipe data - Monitor, audit & report on app, device or user activity
  27. Summary ! “When you are building apps for the multi-

    device world, you probably want to look into HTML5, because that’s language every modern device understands.” !
  28. ! “At Sencha, we want to make the life of

    an app developer easier. We do a lot to help you, to build better multi device apps, enabling customer success…” ! HTML5 frameworks, tools, training programs and support. !
  29. Hands-On Sencha Touch 2 A Real-World App Approach • Learn

    the fundamentals, including the class and layout systems • Use the Sencha MVC architecture to structure your code • Make remote connections by implementing server proxies • Save data offline by implementing client proxies • Work with view components such as maps, lists, and floating panels • Implement and handle forms • Brand your app and create custom themes • Create production and native build packages for App Stores Lee Boonstra @ladysign http://oreil.ly/1oxLeZZ