1. Building Awesome HTML Applications in Blend for Windows 8
Windows Azure
9/19/2018
Building Awesome HTML Applications in Blend for Windows 8
Kirupa Chinnathambi
3-002
© 2011 Microsoft Corporation. All rights reserved. Microsoft, Windows, Windows Vista and other product names are or may be registered trademarks and/or trademarks in the U.S. and/or other countries. The information herein is for informational purposes only and represents the current view of Microsoft Corporation as of the date of this presentation. Because Microsoft must respond to changing market conditions, it should not be interpreted to be a commitment on the part of Microsoft, and Microsoft cannot guarantee the accuracy of any information provided after the date of this presentation. MICROSOFT MAKES NO WARRANTIES, EXPRESS, IMPLIED OR STATUTORY, AS TO THE INFORMATION IN THIS PRESENTATION.

2. HTML Applications in Windows 8
Agenda
Introduction (almost done!)
Hello, world!
HTML Applications in Windows 8
Designing for Devices
Highlights
Q/A

3. Blend + Visual Studio

4. Blend is optimized for visual design tasks.
Visual Studio is optimized for coding and debugging.

5. WPF, Silverlight, Windows Phone, XAML (Windows 8), HTML (Windows 8)

6. (for building Windows 8 Applications)
HTML
(for building Windows 8 Applications)

7. Professional Design Tool

8. Expects you to know HTML and CSS.
Gives you as much or as little detail as you want.
Allows you to focus on the concepts and not the syntax.

9. Hello, world!

10. HTML Applications in Windows 8

11. Unique Style

13. Deep Integration with Windows

15. Single Page Navigation Model

17. Optimized for Devices

20. Focus on Devices

23. Different display sizes

26. Different resolution / DPIs
As the resolution goes up, elements become smaller.

27. Different resolution / DPIs
When the DPI/PPI hits a certain threshold, Windows scales all of the UI to 140% or 180% of the original size.

29. Highlights (1/5)
Accurate design surface that runs your application’s HTML, CSS, and JavaScript. We use the same rendering engine that is used by your application at runtime.

32. Highlights (2/5)
Clean and predictable HTML and CSS. We generate production quality markup you can proudly tell your friends about.

33. Highlights (3/5)
Support for working with WinJS controls, fragments, and templates. Add them. Modify their properties. Style them.

34. Highlights (4/5)
Ability to access “hard-to-reach” states at design-time. Author and style UI in areas that can only be reached by interacting with your application.

35. Highlights (5/5)
Excellent integration with Visual Studio. Use Blend for visual design tasks. Use Visual Studio for coding and debugging.

36. { web site: kirupa.com // twitter: @kirupa // facebook: kirupa };
{ web site: kirupa.com // // facebook: kirupa };