The document discusses the new Metro style apps platform in Windows 8. It introduces Metro apps, which are designed for touchscreens and provide an immersive full-screen experience. Metro apps can be developed with HTML5, CSS3, and JavaScript or C++, C#, and VB with XAML. The Visual Studio 11 tools allow developers to easily create Metro apps that can be distributed through the Windows Store and run across multiple device form factors. A demo of Metro apps in the Windows 8 developer preview is provided.
1. Metro Style Apps
What’s there for us
Jitendra Soni
Tech Lead | Competency Centre
Diaspark Inc.| www.diaspark.com
2. Agenda
Building Blocks: Windows 8
Tools: Visual Studio 11
Metro Style Apps unveiled
Demo: VS11 & Metro app
3. Tool Visual Studio
2011
Provides APIs and
Metro App tools, choice of
languages, deployment,
packaging, localization
API
- Same app on PC/Tablet
/Phone
Windows 8 - Easy & safe to Install
Touch-first, fluid user
experience, full-screen,
backward compatible
- Windows Live Store
- Customized for touch &
highly interactive interface
Win 8 Experience Metro Platform
4. The paradigm shift……
Increased anticipation towards mobility
User interaction models (Touch First)
New form factors
App developers want rich connectivity and sharing
capabilities, connection to customers
Win 8 Experience Tools Metro Platform
5. Windows 8
Windows Reimagined
Changing the way we operate
Win 8 Experience Tools Metro Platform
7. Re-imagining Windows
Windows 8 Experience
Cloud Services
Tools for Metro Style Apps
Metro Style Apps Platform
Win 8 Experience Tools Metro Platform
8. Windows 8 Experience
Fluid user experience
Full-screen view
Touch-first enabling inputs
Apps working together
Everything that runs on Windows 7 runs on Windows 8
Win 8 Experience Tools Metro Platform
9. Windows Live SkyDrive integration:
the cloud is growing
Win 8 Experience Tools Metro Platform
10. Cloud Services
New Metro style apps for Mail, Photos, Calendar, People
Sync
SkyDrive for the information you create
Live APIs for SkyDrive:
Win 8 Experience Tools Metro Platform
11. Visual Studio 11
Build high-performance applications for Windows 8
Win 8 Experience Tools Metro Platform
12. Experiences Promises
User Developer Productivity
Experience Experience Integration
Team Platforms
Experience
Win 8 Experience Tools Metro Platform
13. Visual Studio 11
Visual Studio IDE Improvements
C# & VB Enhancements
Data Application Development
WinRT
ASP.NET 4.5 and Web Development
Other language enhancements
Debugger and Quality Tools
Graphics Tools
SharePoint Development
Win 8 Experience Tools Metro Platform
14. C# & Visual Basic
async Programming
▫ Asynchronous programming = Synchronous programming
▫ Previously asynchronous code
• Define callbacks
• Difficulty in routine tasks
▫ Now compiler does hard work
async
Task or Task(Of TResult)
await
Win 8 Experience Tools Metro Platform
15. The Metro Style Apps
Unveiled
Win 8 Experience Tools Metro Platform
16. Metro Style App
What is Metro App
▫ Customized for the device they run on
▫ Customized for touch interaction
▫ Customized for the Windows user interface
▫ Full screen apps customized for users' needs
▫ Easy & Safe to deploy
Win 8 Experience Tools Metro Platform
17. What is there for the user?
Immersive
▫ Entire screen
▫ Completely engaged with the content
▫ Screen space maximization for content
▫ Let your users focus on the things they want to do
▫ Soul to the ultimate Windows experience
Engaging and alive
▫ Engage users with
• Info they are interested in
• People they care about
• Live tiles update users at a glance.
• Start screen
• Showing off what apps are great at
• App tiles are alive with status and activity updates
Connected
▫ Share content with social circles
▫ Send content to connected devices
18. What is there for the user?
Interactive and touch-first
▫ Apps for touch and physical manipulation
▫ Supports keyboard, mouse, and graphical scaling.
Great in multiple views & multiple form factors
▫ Support to "fluid" layout, content flows naturally
▫ Adapts to available space on devices
▫ Automatic scaling for multiple resolutions and screen orientation
Confidence-inspiring
▫ Safely install & uninstall apps, without making irreversible changes to
Windows
Designed for user multitasking
▫ Snapped view
▫ Filled view
Win 8 Experience Tools Metro Platform
19. What is there for the developer?
New APIs and tools to build Metro style apps
Choice of languages
▫ JavaScript with HTML5 and CSS3, or C++/C#/VB with XAML
▫ Touch-enabled controls, templates
New deployment method
Metro style app packaging
▫ All apps are installed per user
▫ Install, update, and uninstall cleanly
▫ No irreversible changes
Available through Windows Store
Localization
▫ Develop once & deploy in multiple locales and languages
▫ Localization API
▫ Coherent cultural experience
Win 8 Experience Tools Metro Platform
20. Platform
Metro style Apps Desktop Apps
XAML HTML / CSS
C/C++ C#, VB JavaScript HTML C C#
JavaScript C++ VB
Windows Runtime APIs
Communication Graphics & Devices &
& Data Media Printing
Application Model Internet Win3 .NET
Explorer 2 SL
Windows Kernel Services
Win 8 Experience Tools Metro Platform
21. Demo
Windows Metro style apps
Win 8 Experience Tools
22. Back to
Home
Summary
Windows 8 is Major OS change after a decade, adopting new
environment of PCs, Tablets, Mobiles.
Currently Windows 8 Developer Preview
includes Visual Studio 11 Express, Expression Blend 5, SDK,
Apps, Developer Pre-Release
The Next milestones:
Beta RC RTM GA
Download Windows 8 Developer Preview at:
http://dev.windows.com
We will get back to you on further updates
Changing world of computingMobility means devices you use while carryingNew form factors and user interaction modelsApp developers want rich connectivity and sharing capabilities, connection to customers
Fluid user experience: Responsive and alive with animations making it highly engagingFull-screen viewTouch-first enabling inputs through a touch-screen display, full keyboard and mouseApps working togetherEverything that runs on Windows 7 runs on Windows 8
Synchronization: Use of the Cloud is a central feature of Windows 8. It enables keep data on go. Machine to Sky & Sky to Tabletdata on go.
New Metro style apps for Mail, Photos, Calendar, PeopleSync across your PC devices and phoneSkyDrive for the information you create:Stores your photos, documents and files to the cloudLive APIs for SkyDrive: Build your own cloud connected Metro style apps
Not CoveredOther language enhancementsDebugger and Quality Tools Graphics Tools SharePoint Development
Visual BasicIterators. Call Hierarchy: enables to navigate through code by displaying all calls to and from a selected method, property, or constructor. Global keyword: lets you define a namespace out of the root namespace of your project. C# & Visual BasicAsyncasynchronous programming almost as straightforward as synchronous programming.previously asynchronous code define callbacks makes routine tasks, such as exception handling, awkward and difficult. Now compiler does the hard work for you.async & awaitan async method returns a Task or Task(Of TResult). The task contains information that the caller of the asynchronous method can use, such as the status of the task and its unique ID.await operator is applied to the returned task. The await operator suspends execution of the method that called the asynchronous method until the task is completed.
Immersive Metro style apps fill the entire screen and immerse users in the experience you create. Your users can be completely engaged with the content they love, in a full screen app. We moved the operating system out of the way to maximize screen space for your content. Your apps are the center of the Windows experience. Take advantage of the space but don't clutter it. Let your users focus on the things they want to do.Engaging and alive Your Metro style apps engage users with the info they are interested in and the people they care about. Live tiles update users at a glance and draw them into your app.The Start screen is about showing off what apps are great at. App tiles are alive with status and activity updates, encouraging your users to dive into your app. When designing your tile, you need to:Highlight your brand. Your app tile is a chance to visually define your brand for your users. It should be attractive and distinct.Showcase the info and activities your users are most interested in. You want your users to keep returning to your tile, looking for updates, checking in. You want those updates to pull your users back into the app itself. The more thoughtful you are about the kinds of info and activities you showcase, the more likely users are to engage. For more info on designing and creating an app tile, see Guidelines and checklist for tiles and Guidelines and checklist for notifications.Connected Your users can share content with their social circles and send content to devices they are connected to. Learn more at Searching, sharing, and connecting (JavaScript).Interactive and touch-first You design your apps for touch and physical manipulation, and Windows gives you keyboard, mouse, and graphical scaling support for free. To learn more, see Designing for touch and Responding to user interaction. Great in multiple views & on multiple form factors Apps use controls that support "fluid" layout, so content flows naturally and adapts to the available space on devices of the users' choosing. The platform provides automatic scaling to make it easy to design for multiple resolutions and screen orientation. Learn more about Designing for different form factors.Confidence-inspiring Your users can safely download, install, use, update, and uninstall your apps, without making irreversible changes to Windows or to their other apps. Designed for user multitaskingWhile apps immerse your users in a full screen environment, Windows also makes it possible for them to multitask.Snapped view Your users love doing more than one thing at once! They want to use your app while they chat, surf the web, watch a movie, or do their taxes, so make your snap view useful and maintain context when going between snapped and unsnapped.Filled view Hey, users might snap another app and keep your app in the fill space. Account for reduced horizontal screen space to accommodate this view.
Immersive Metro style apps fill the entire screen and immerse users in the experience you create. Your users can be completely engaged with the content they love, in a full screen app. We moved the operating system out of the way to maximize screen space for your content. Your apps are the center of the Windows experience. Take advantage of the space but don't clutter it. Let your users focus on the things they want to do.Engaging and alive Your Metro style apps engage users with the info they are interested in and the people they care about. Live tiles update users at a glance and draw them into your app.The Start screen is about showing off what apps are great at. App tiles are alive with status and activity updates, encouraging your users to dive into your app. When designing your tile, you need to:Highlight your brand. Your app tile is a chance to visually define your brand for your users. It should be attractive and distinct.Showcase the info and activities your users are most interested in. You want your users to keep returning to your tile, looking for updates, checking in. You want those updates to pull your users back into the app itself. The more thoughtful you are about the kinds of info and activities you showcase, the more likely users are to engage. For more info on designing and creating an app tile, see Guidelines and checklist for tiles and Guidelines and checklist for notifications.Connected Your users can share content with their social circles and send content to devices they are connected to. Learn more at Searching, sharing, and connecting (JavaScript).Interactive and touch-first You design your apps for touch and physical manipulation, and Windows gives you keyboard, mouse, and graphical scaling support for free. To learn more, see Designing for touch and Responding to user interaction. Great in multiple views & on multiple form factors Apps use controls that support "fluid" layout, so content flows naturally and adapts to the available space on devices of the users' choosing. The platform provides automatic scaling to make it easy to design for multiple resolutions and screen orientation. Learn more about Designing for different form factors.Confidence-inspiring Your users can safely download, install, use, update, and uninstall your apps, without making irreversible changes to Windows or to their other apps. Designed for user multitaskingWhile apps immerse your users in a full screen environment, Windows also makes it possible for them to multitask.Snapped view Your users love doing more than one thing at once! They want to use your app while they chat, surf the web, watch a movie, or do their taxes, so make your snap view useful and maintain context when going between snapped and unsnapped.Filled view Hey, users might snap another app and keep your app in the fill space. Account for reduced horizontal screen space to accommodate this view.
Your choice of programming languages You can create your app in the languages you're most comfortable with: JavaScript with HTML5 and CSS3, or C++/C#/VB with XAML. To learn more about Windows Runtime and your language options, see The Windows Runtime.New deployment method Your users can safely and simply install your apps. Removal is just as safe and simple, and won't lead to degradation of system performance over time.Metro style app packaging You package your apps for deployment as Metro style app packages. With Metro style apps, all apps are installed per user; they install, update, and uninstall cleanly; and they don’t change the operating system in an irreversible way.Windows Store (not yet released)New UI and touch-centered input You can create apps with controls that put your users' goals first, that support direct manipulation of UI elements. Localization You can develop your app once and deploy in multiple locales and multiple languages. Not only that, Windows Developer Preview provides an API that ensures your app responds to users' language and cultural preferences—like date, time, number, and currency formats—with little to no effort on your part. The end result is a great app with a coherent cultural experience tailored to each user and to all users everywhere. Learn more about Globalizing your app. Developer tools With free versions of Microsoft Expression Blend and Microsoft Visual Studio 11 Express for Windows Developer Preview, you get a development environment and templates that help you design, develop, package, debug, and deploy your app.