Tech days faridabad

470 views

Published on

1 Comment
0 Likes
Statistics
Notes
  • Check out a great review on internet explorer here http://kesilconsulting.com/web-designer-magazine/new-internet-explorer-10-review/#axzz2N0cILhx4
       Reply 
    Are you sure you want to  Yes  No
    Your message goes here
  • Be the first to like this

No Downloads
Views
Total views
470
On SlideShare
0
From Embeds
0
Number of Embeds
1
Actions
Shares
0
Downloads
7
Comments
1
Likes
0
Embeds 0
No embeds

No notes for slide

Tech days faridabad

  1. 1. Windows 8 and Metro-Apps Windows 8 App using HTML5 and JavaScript Ankur Mishra Christian Moser © Zühlke 2011
  2. 2. Windows 8 App Using HTML5 and JavaScript | Ankur Mishra 2/9/2013 © Zühlke 2011
  3. 3. Windows 8? Metro-Style Apps für Windows 8 2/9/2013 Christian MoserWindows 8 App Using HTML5 and JavaScript | Ankur Mishra © Zühlke 2011
  4. 4. Desktop :• Starts in a few seconds !• New Task Manager !• Improved Copy !• Explorer Ribbon !• "Factory Reset" and? Refresh function !• Internet Explorer 10 !• Automatic synchronization? Into the Cloud (Sky Drive) !Windows 8 App Using HTML5 and JavaScript | Ankur Mishra 2/9/2013 © Zühlke 2011
  5. 5. Metro UI Metro-Style Apps für Windows 8 2/9/2013 Christian Moser © Zühlke 2011
  6. 6. Metro DesktopThe new lock screen
  7. 7. Examples of Metro Style Apps
  8. 8. The Metro Design Principles :• Pride in craftsmanship A good user experience comes only with a clean craft in all disciplines• Be fast and fluid Apps are responsive, intuitive, touch-optimized and smooth..• Authentically Digital Connected, dynamic, active, strong colors, moves• Do more with less Content instead of chrome, to be good at somethingWindows 8 App Using HTML5 and JavaScript | Ankur Mishra 2/9/2013 © Zühlke 2011
  9. 9. Interaction with the Metro desktop Charms (The 5 major system functions, Task switching Are always available) Appear when the fingers is wiped from the touch-edge. App-BarsWindows 8 App Using HTML5 and JavaScript | Ankur Mishra 2/9/2013 © Zühlke 2011
  10. 10. Variations that would support every app : Snapped and full screen Horizontal and Vertical screen sizes ResolutionsWindows 8 App Using HTML5 and JavaScript | Ankur Mishra 2/9/2013 © Zühlke 2011
  11. 11. Layout Grid : A consistent Layout Grid provides consistent Appearance. Visual Studio 12 provides Ready-made templates for this.Windows 8 App Using HTML5 and JavaScript | Ankur Mishra 2/9/2013 © Zühlke 2011
  12. 12. Contracts• Applications interact via "Contracts" with each other Without knowing each other.• Each application can offer contracts that make sense to use.• Windows 8 supports three contracts: Share (Push Content) Picker (Pull Content) Search (Find Content)Windows 8 App Using HTML5 and JavaScript | Ankur Mishra 2/9/2013 © Zühlke 2011
  13. 13. Live Tiles• Icons are outdated, static, boring and offer little benefit.• Live Tiles are alive, personally, appealing to date and informative• Apps can content as secondary tiles with "deep link" to the desktop set (weather stations, friends, important share prices, ...)Windows 8 App Using HTML5 and JavaScript | Ankur Mishra 2/9/2013 © Zühlke 2011
  14. 14. Cloud-Integration• The user logs in once a Windows Live Users with Windows• Each Metro Style app gets in the cloud storage for user settings and smaller content.• Therefore, settings can be easily synchronized between multiple computers. Begins to read an ebook and need to get away ... ……... The book opens on the right sideWindows 8 App Using HTML5 and JavaScript | Ankur Mishra 2/9/2013 © Zühlke 2011
  15. 15. What makes a good Metro App1. Appears completely in the Metro-style design.2. Feels fast and fluid3. Supports scaling, snapping and alignment in a meaningful way.4. Implement meaningful Contracts (Search, Share, Picker).5. Provides valuable information on their live tile.6. Always feel connected, current and alive.7. Large power of the cloud for data synchronization.Windows 8 App Using HTML5 and JavaScript | Ankur Mishra 2/9/2013 © Zühlke 2011
  16. 16. Metro Style Apps : Metro-Style Apps für Windows 8 2/9/2013 Christian Moser © Zühlke 2011
  17. 17. Windows Runtime (WinRT)Windows 8 App Using HTML5 and JavaScript | Ankur Mishra 2/9/2013 © Zühlke 2011
  18. 18. Language Projection• Metro-style apps can be written equivalent in C + +, C #, VB or JSC# var fp = new FileOpenPicker(); var result = await fp.PickSingeFileAsync(); C++ auto fp = Windows::Storage::Pickers::FileOpenPicker(); auto result = fp->PickSingeFileAsync(); JavaScript var fp = new Windows.Storage.Pickers.FileOpenPicker; fp.pickSingleFileAsync().then();Windows 8 App Using HTML5 and JavaScript | Ankur Mishra 2/9/2013 © Zühlke 2011
  19. 19. Windows Store App. Let’s Try …!!Windows 8 App Using HTML5 and JavaScript | Ankur Mishra 2/9/2013 © Zühlke 2011
  20. 20. Metro-Style Controls Christian Moser © Zühlke 2011
  21. 21. Windows 8 brings a number of newcontrols :• WebView (without problems AirSpace)• ListView / GridView / FlipView / Jump View (with "semantic zoom")• Media player with controls• Toggleswitch• Extended TextBox• Progress ringWindows 8 App Using HTML5 and JavaScript | Ankur Mishra 2/9/2013 © Zühlke 2011
  22. 22. Comparison of Desktop and Metro : Metro Apps Desktop Software Main input medium Touch Mouse / Keyboard UI-Style Metro Windows Runtime WinRT (Win32) .NET/SL/Win32 Distribution Windows Store Download Webseite Installation .appx Package MSI System Access Only about WinRT Full accessConclusion• Business applications will continue to be primarily mouse and keyboard-based and based on WPF / SL / HTML or C + +.Windows 8 App Using HTML5 and JavaScript | Ankur Mishra 2/9/2013 © Zühlke 2011
  23. 23. Windows Store Christian Moser © Zühlke 2011
  24. 24. Navigation im Windows Store 1. Store Home : List of all categories of good, popular apps. (Can not be bought)2.Second View :Possibilities with allthe apps, Categoryand filter. 3. Application DetailWindows 8 App Using HTML5 and JavaScript | Ankur Mishra 2/9/2013 © Zühlke 2011
  25. 25. Application details : Reviews Feedback from customers, Through the app. Without buying, Try !!. Used resourcesWindows 8 App Using HTML5 and JavaScript | Ankur Mishra 2/9/2013 © Zühlke 2011
  26. 26. Licensing models :* After Certification.• The store supports Metro Style Apps and ordinary Win32 (desktop) apps.• Licenses are per user (account). Please be roamed automatically.• Microsoft earned 30%• Apps are downloaded 10 times more often if they offer a trial• 10% of the trials will be purchased later• "In-App" purchasesWindows 8 App Using HTML5 and JavaScript | Ankur Mishra 2/9/2013 © Zühlke 2011
  27. 27. Wenn die App im Store ist… The Developer Dashboard lists, All apps. 1. Vorbereitung 2. Submission 3. Nutzungsstatistik 4. Crash-DataWindows 8 App Using HTML5 and JavaScript | Ankur Mishra 2/9/2013 © Zühlke 2011
  28. 28. For more Ping me : @er_ankur_mishra /ankurmishrayugal ankur.mishra@uen.in ankur.mishra@studentpartner.com www.ankurmishra.in | www.Go4Every.com | www.blog.uen.inWindows 8 App Using HTML5 and JavaScript | Ankur Mishra 2/9/2013 © Zühlke 2011

×