Adobe MAX: Rapidly Build HTML5 Apps with Sencha Designer

  • 1,376 views
Uploaded on

Presented at Adobe Max by Aaron Conran …

Presented at Adobe Max by Aaron Conran
Overview of Sencha Frameworks and Tooling
Shows how to use the Sencha Designer to build HTML5 Apps

More in: Technology
  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
    Be the first to comment
No Downloads

Views

Total Views
1,376
On Slideshare
0
From Embeds
0
Number of Embeds
0

Actions

Shares
Downloads
23
Comments
0
Likes
1

Embeds 0

No embeds

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
    No notes for slide
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • http://www.sencha.com/products/touch/demos/\n
  • http://www.sencha.com/products/extjs/examples/\n
  • http://www.sencha.com/products/designer/\n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • http://www.sencha.com/products/sdk-tools/\n
  • \n
  • \n
  • http://code.google.com/p/ormma/\nopen rich media mobile advertising\n
  • \n
  • \n
  • \n

Transcript

  • 1. 1 SenchaRapidly Build HTML5Apps for Any Device
  • 2. Amazing Experiences On Every DeviceWide browser support Extensible architecturePixel-perfect fidelity Native deploymentRich theming & styling Rapid development toolsNative behavior and widgetsSupporting cloud services 2
  • 3. Browsers and OS’sSafari 3+Firefox 3.6+Internet Explorer 6+Chrome 6+Opera 10.5+ 3
  • 4. Phones and OS’s 4
  • 5. Tablets iPad Xoom Galaxy Tab Playbook TouchPad 5
  • 6. DevelopmentFrameworks Tools 6
  • 7. Who am I?Aaron Conran Developed parts of:Lead Engineer of Sencha Designer - Ext JSTwitter: @aconran - Sencha TouchEmail: aaron@sencha.com - Sencha DesignerInvolved with Sencha (formerly Ext) since 2006 7
  • 8. Rich Web Apps • Single Page Applications • Native like experience in browser • Data-centric applications 8
  • 9. Sencha Touch: HTML5 Made • Cross-browser normalization • Multi-pane scrolling • Fixed-position UI Chrome • Data models • Animations • Styling and theming • Gestural abstractions • Full deck of UI components • Offline storage proxy 9
  • 10. Sencha Desktop‣ Complete application frameworks‣ Components, events, lifecycles‣ Pixel-perfect, cross-browser‣ Java and JavaScript Options ‣ Ext JS and Ext GWT 10
  • 11. Designer • Rapid interface builder • Windows, Mac OS, Linux 11
  • 12. Hands-on Demos 12
  • 13. Border Layout • Mail Client layout • Multiple Pane Resizable • Uses Tree and Grid component 13
  • 14. Login Window • Window • Form Fields • Docked Toolbar 14
  • 15. Complex Forms • Form Panel • Fieldsets • Multi column forms 15
  • 16. Product Browser • Master Detail View • Layouts • Grid • Templates 16
  • 17. Features • Promotes Object Oriented Design • Generates Best Practices Source Code • Save to Toolbox 17
  • 18. Community 18
  • 19. 19
  • 20. The leading HTML5 development community 1.2M+ developers worldwideFirst to market with HTML5 on mobileWide Enterprise application footprint 19
  • 21. Sencha EcoSystem‣ 1.2 million desktop & mobile developers, worldwide‣ 240,000 registered community members‣ 150,000 downloads per month‣ Licensed by over 25% of the Fortune 100 20
  • 22. Strong Developer Focus 21
  • 23. Additional Tooling 22
  • 24. SDK Tools • Themes • Deployment 23
  • 25. Native: Fragmented Platforms iOS Android RIM OS HP WebOS Objective C Java Java, Flash & Web Web Cocoa Android SDK WebWorks Mono Multiple languages, simulators, versions and capabilities App store submission policies, approval delays, platform longevity, changing policies 24
  • 26. Native Shells Bridge HTML5 Author HTML5 app but bridge to device APIs and deploy via App Stores 25
  • 27. Sencha Animator Plug-in-free animations for rich-media ads that run on any mobile ad Full CSS3 support, including animations, 2D and 3Dtransformations, backgrounds,borders, font effects, and more, as well as ORMMA support. 26
  • 28. Thank You 27
  • 29. Links 28
  • 30. LinksSenchahttp://www.sencha.comSlideshttp://www.slideshare.net/Demo Codehttp://www.github.com/aconran/designerdemos/ 29