Wired2Win Webinar: Build Enterprise Apps with Live Tiles & Notifications with Windows 8


Published on

  • Be the first to comment

  • Be the first to like this

No Downloads
Total views
On SlideShare
From Embeds
Number of Embeds
Embeds 0
No embeds

No notes for slide

Wired2Win Webinar: Build Enterprise Apps with Live Tiles & Notifications with Windows 8

  1. 1. Build Enterprise Apps with Live Tiles and Notifications with Windows 8 Wired2Win Webinar Series www.winwire.com @WinWireWinWire Technologies, Inc. Confidential © 2010 WinWire Technologies
  2. 2. WinWire Technologies, Inc. Confidential © 2010 WinWire Technologies
  3. 3. Who We Are WinWire Technologies is an IT Services Company that helps business and technology leaders harness the power of Collaboration and Analytics across the enterprise leveraging technology trends such as cloud, mobility, big data, user interface and enterprise socialWinWire Technologies, Inc. Confidential © 2010 WinWire Technologies
  4. 4. Agenda Introduction to Windows 8 Platform Developing Windows Store Apps Tiles and Notifications DemoWinWire Technologies, Inc. Confidential 4 © 2010 WinWire Technologies
  5. 5. Windows 8 • Released on 25th October 2012 • Primarily focused towards improved mobile experience • New Modern UI based on Microsoft Design LanguageWinWire Technologies, Inc. Confidential 5 © 2010 WinWire Technologies
  6. 6. Windows 8 Platform Windows 8 Apps Desktop Apps View DirectX XAML HTML / CSS Controller Model C C# JavaScript HTML C C# C++ VB (Chakra) JavaScri pt C++ VB WinRT APIs System Services Communication Graphics & Devices & & Data Media Printing Application Model Internet .NET Explorer Win32 / SL Core Windows Core OS ServicesWinWire Technologies, Inc. Confidential © 2010 WinWire Technologies
  7. 7. Languages to Develop Windows Store Apps Web Development • HTML5, Cascading Style Sheets, Technologies Level 3 (CSS3), and JavaScript .NET, Windows Presentation • XAML, with code-behind in C++, Foundation, C#, or Visual Basic. Microsoft Silverlight • Native C++ and HLSL to take full DirectX advantage of graphics hardware.WinWire Technologies, Inc. Confidential 7 © 2010 WinWire Technologies
  8. 8. Before You Begin Decide what your app is great at Decide what user activities to support Decide what features to include Decide how to monetize your app Design the UI for your app Validate your designWinWire Technologies, Inc. Confidential 8 © 2010 WinWire Technologies
  9. 9. Windows 8 Tiles • Represent your app to the user • Rich and engaging view into your app • Alive with activity and continually updated • Draw users back into your app over and over • Easy to create and updateWinWire Technologies, Inc. Confidential 9 © 2010 WinWire Technologies
  10. 10. Tile Design Philosophy • Why should I invest in a live tile? • Characteristics that make a live tile compelling • Choosing between a square and wide tile size • Using default tiles • Using peek templates • Design considerations for tilesWinWire Technologies, Inc. Confidential 10 © 2010 WinWire Technologies
  11. 11. Badges • Convey summary or status information specific to app • Numeric or glyph • Appear at lower-right corner of tile • Defined as an XML document, elements defined in badge schema • Badge catalog not extendableWinWire Technologies, Inc. Confidential 11 © 2010 WinWire Technologies
  12. 12. Secondary Tiles • Enable users to promote specific content in an app • Created via Pin to Start option in app bar • Same as tiles but can be created/deleted at runtime • Can be duplicated across devicesWinWire Technologies, Inc. Confidential 12 © 2010 WinWire Technologies
  13. 13. App on Lock Screen • Should your app be on the lock screen? • Badge only or Badge and Tile Text • Up to seven apps on the lock screen • Tile and toast notifications update text/badge • Secondary tiles on the lock screenWinWire Technologies, Inc. Confidential 13 © 2010 WinWire Technologies
  14. 14. Toast Notifications • Transient messages to user out of app context • Tap by user launches the specific area of app • Toast notification types • Standard and Long-duration toasts • Scheduled and recurring toastsWinWire Technologies, Inc. Confidential 14 © 2010 WinWire Technologies
  15. 15. Notification Delivery Methods Local A set of API calls that send notifications while your app is running Scheduled A set of API calls that schedule a notification in advance Periodic Update tiles and badges periodically by polling a cloud service Push Notifications sent from a cloud server, even if your app isnt runningWinWire Technologies, Inc. Confidential 15 © 2010 WinWire Technologies
  16. 16. Periodic Notifications • Update tiles/badges at fixed interval by polling a cloud service • Windows sends an HTTP GET request to URI, receives XML • Expire after 3 days by default • Notification cyclingWinWire Technologies, Inc. Confidential 16 © 2010 WinWire Technologies
  17. 17. Push Notifications • Enable 3rd party developers to send updates from their cloud serviceWinWire Technologies, Inc. Confidential 17 © 2010 WinWire Technologies
  18. 18. How Push Notification Works • App requests for a push notification channel to the Notification Client Platform • NCP asks WNS to create a notification channel • A notification channel is returned in the form of a URI • The URI is returned by Windows to the app • The app sends the URI to the cloud service • When the cloud service has an update to send, it notifies WNS using the URI • WNS receives the request and routes the notification to the appWinWire Technologies, Inc. Confidential 18 © 2010 WinWire Technologies
  19. 19. Globalization and accessibility • Store strings in resource file • Store local images in local storage • Append query string to cloud image URLWinWire Technologies, Inc. Confidential 19 © 2010 WinWire Technologies
  20. 20. App package structure for Globalization Strings Images /ProjectFolder /ProjectFolder /images /strings welcome.scale-80.png /en-US welcome.scale-100.png resources.resjson /fr-FR /contrast-black welcome.scale-80.png resources.resjson welcome.scale-100.png /ja-JP /contrast-white resources.resjson welcome.scale-80.png welcome.scale-100.png /ja-JP Strings Usage: welcome.scale-80.png <text id="1">ms-resource:greeting</text> welcome.scale-100.png /contrast-black Images Usage: welcome.scale-80.png <image id="1" src="ms- welcome.scale-100.png appx:///images/welcome.png"/> /contrast-white welcome.scale-80.png welcome.scale-100.pngWinWire Technologies, Inc. Confidential 20 © 2010 WinWire Technologies
  21. 21. References • Guidelines and checklist for tiles and badges • http://msdn.microsoft.com/en-us/library/windows/apps/hh465403.aspx • Tile Template Catalog • http://msdn.microsoft.com/en-us/library/windows/apps/hh761491.aspx • Tiles, Badges and notifications • http://msdn.microsoft.com/en-US/library/windows/apps/hh779725 • App Tiles and Badges Sample • http://code.msdn.microsoft.com/windowsapps/App-tiles-and-badges-sample- 5fc49148WinWire Technologies, Inc. Confidential 21 © 2010 WinWire Technologies
  22. 22. Questions Questions? Mail them to: marketing@winwire.comWinWire Technologies, Inc. Confidential 22 © 2010 WinWire Technologies