This document provides an overview of Windows Phone app development. It discusses the Metro design principles, hardware specifications, development tools including Visual Studio and Expression Blend, and the application lifecycle. Developers can create apps using Silverlight and XAML or the XNA game framework. Apps are published to the centralized Windows Phone marketplace. Navigation is page-based and apps support orientation changes and common UI elements like the pivot, panorama, and application bar.

1. Windows Phone App
Development Overview
Alan Mendelevich
AdDuplex Founder
ailon@ailon.org
http://devblog.ailon.org
Twitter: @ailon

2. Agenda
• Hardware
• Metro
• Development Overview
• Publication

3. Hardware

4. Hardware Specification 2010
Display Multimedia
480x800 QVGA Codec acceleration
320x480 HVGA (future)
Capacitive Memory
touch 256MB RAM or more
4 or more contact 8GB Flash or more
points
Sensors
A-
GPS, Accelerometer, C GPU
ompass, Light DirectX 9
acceleration
Camera
5 mega pixels or
more CPU
ARMv7
Hardware buttons Cortex/Scorpion or
Start, Search, Back better

5. Hardware Specification 2011

6. Form Factors

7. OEMs

8. Metro

9. Metro

10. Inspiration

11. Metro Principles
• Clean, light, open, fast
• Celebrate typography
• Alive & in motion
• Content not chrome
• Authentically digital

12. Accent Colors
12

13. Gestures

14. Touch Target Sizes
• Minimum recommended
touch target size – 9mm
(~90 px)
• Minimum spacing between
touchable elements – 2mm
• Visible element size – 60-
100% of touch surface

15. Application Bar
• Up to 4 buttons
• Only the main
actions
• Use slide out menu
for less important
items

16. Pivot
• Grouping and filtering of information
• Switching by tapping or swipe gesture

17. Panorama
• “Rich” content
• Leads user to the
next screen
• Starting point for
multiple
destinations
17

18. Metro & Your Own Style

19. Development
Overview

20. Flavors of Applications
 Modern XAML/event-driven  High performance game
application UI framework framework
 Rapid creation of visually  Rapid creation of multi-screen
stunning apps 2D and 3D games
 Metro-themed UI  Rich content pipeline
controls  Mature, robust, widely adopted
 500,000 developers technology
spanning Windows spanning
and web Xbox 360,
Windows,
and Zune

21. Free Powerful Tools
• Expression Blend • Visual Studio

22. Free Powerful Tools
• http://create.msdn.com
– Visual Studio 2010 Express
– Windows Phone Emulator
– Silverlight
– XNA Game Studio 4.0
– Microsoft Expression Blend for Windows
Phone
– .NET Framework 4

23. Silverlight for
Windows Phone
Overview

24. Silverlight 4+
• Based on Silverlight 4
• Plus specific modules (phone functions,
sensors, etc.)
• XAML + C# (or VB.NET)
• Optimized for performance on smaller,
less powerful devices

25. XAML
• eXtensible Application Markup Language
• XML based
• Used in WPF and Silverlight
• Declaratively describes
UI, animations, etc.

26. Theming
• Users can switch system
colors
– Select black or white
background
– Select “accent” color
• Standard Silverlight
controls automatically
adapt to selected theme
• Preset styles

27. Navigation
• Navigation is page based
– Similar to web navigation
– Pages are identified by
URIs
private void hyperlinkButton1_Click(
object sender, RoutedEventArgs e)
{
NavigationService.Navigate(
new Uri("/SecondPage.xaml",
UriKind.RelativeOrAbsolute)
);
}
27

28. Back Button
• Returns to the previous page
– UI shouldn’t duplicate this functionality
• The behavior could be overridden when
going to the previous page isn’t logical
– Closing a pop-up dialog, etc.
– Can’t be used for actions absolutely unrelated
to “returning”, like shooting, etc.

29. Application Bar
• Use AppBar instead of a
custom menu system
• Up to 4 buttons + menu
• Buttons for most
important tasks only
• White color on the
transparent background
(without circle)

30. Orientation support
• Pages can be vertical, horizontal or change
orientation automatically
• Set via SupportedOrientations property
• PortraitOrLandscape value – automatic
orientation switching

31. Data Binding
• Automatically binds object properties
• Separation of concerns
(design/development)
– MVVM pattern

32. Pivot and Panorama
• The best starting
point for apps
• Complies with
Metro out of the
box
• Present information
in easily digestible
portions

33. Pivot vs. Panorama
Pivot Panorama
• Can be used to display • More impressive
more information • Background images
• Supports programmatic automatically stretched
switching • Horizontal PanoramaItem
• LoadingPivotItem and for vizualization of content
UnloadingPivotItem of different width
events for delayed
content loading
• Effective use of screen
real estate

34. Launchers and Choosers
• Each app runs in its own sandbox and
can’t accept system resources or other
apps
• Launchers and Choosers mitigate this by
allowing indirect access to these features

35. Application Lifecycle
Fast App Resume
Resuming .. .
Restore state!
State preserved! running
IsAppInstancePreserved
IsAppInstancePreserved == Save State!
== false
true
activated deactivated
Tombstone
the oldest
app
Tombstoned dormant Phone resources detached
Threads & timers suspended

36. Publishing

37. Publishing Options

38. Publishing Process
Application and Game Submission
.xap App .xap
App
Packaging &
Submission .dll .dll
Validation
Marketplace
Windows Phone 7 Deployment Service
Add Apply .xap .xap
Metadata Test Sign
.dll
Criteria .dll

39. Summary
• Modern mobile platform
• Metro design language
• Silverlight or XNA or Silverlight+XNA
• Centralized app Marketplace

40. Additional resources
• App Hub
– http://create.msdn.com
• Programming Windows Phone by Charles
Petzold
– http://www.charlespetzold.com/phone/
• Twitter - #wpdev

41. Questions?
Alan Mendelevich
Twitter: @ailon
ailon@ailon.org