Windows Store apps development for Windows Phone developers

Avoid unnecessary elements. Bad Code

Best Practice

BackThe Accelerometer

BackThe Gyro meter

BackWindows 8Windows 8 basically for :Home and business desktops.Laptops.Tablets.Home theater PCs.

Windows 8 & Windows RTWindows 8Windows RTHardwareIntel or AMD chips.ARM-powered devices. Battery LifeEstimated battery life between 6 and 8 hours.Longer battery life than most Windows 8 devicesSoftware SupportWindows Store + Third-Party programs.Only Windows Store Business UseBusiness-friendly

Not business-friendly

Windows RT architecture

Windows 8 Store AppsMultiple Views.Touch and pen input.Use tiles instead of icons.Different UI and controls.Windows Store.

Where are you?

Desktop Application DevelopersWindows Phone DevelopersMain FeaturesWhat is new ? How can I use it?Main FeaturesSnapping and orientation.New XAML controls.Contracts.Live tiles.Toast notifications.Lock screen notifications.Background tasks

Main FeaturesNavigation.Geolocation.Storage.Context menus.File association.Camera capture.Sensors.Application life cycle.

Snapping and orientation.Windows 8 app certification requirements:1024 x 768 (minimum screen resolution & Filled state) 320 x 768 (Snapped).Your default resolution that you are planning for, generally 1366 x 768.

New XAML ControlsDifferent Navigation controls.New Controls:App BarFlip ViewGrid ViewProgress RingSemantic ZoomWeb View

App BarThe Bottom AppBar Left : context-specific commands.Right : universal commands.The Top AppBarNavigationOther purposes.202 default AppBar button Styles.

Flip View

Grid View

Progress Ring

Semantic ZoomZoom InZoom Out

Web View

ContractsContracts = Agreement.Settings Contract.Search Contract.Share Contract.File Picker Contract.Play To Contract.

Settings ContractAdd handler to Settings pane open request.Create new Settings Command.Handle all of the cases for Popup.DO NOT wait for save.DO NOT wait to confirm

Search ContractAdd Search Contract Template.What would users expect to search for in my app?Add your search results for Search Page.Define search suggestions.Forced Search by Keystrokes.

Share Contract

Share ContractTypes of content:Unformatted Plain Text Link Formatted Content / HTML Files Single Image Custom Data Format

Share ContractShare Target REQs:Add the Share Target declaration.Add method to handle when the Share Target is activated.Handle Target Page to work with share data.

File Picker ContractFile open pickerFile save picker

File Picker ContractSpecific Type (s) or any.Define start location.View mode (List/Thumbnail).Retrieve one or multiple.Folder Picker.

Play To ContractShare content from your computer to a television, another computer, or an Xbox 360.A Play To source.A play To target.

Live TilesA relationship with your user.Small & Large tiles.You must ALWAYS have a small tile.XML templates.Secondary Tiles.Turn live tile off.

Toast NotificationYOU NEED TO KNOW THIS INFORMATION RIGHT NOW!XML Templates.Long duration toasts.Setting the audio(9 files only).

Lock Screen NotificationsBadge & Text.Updated from a Background Agent.Only ONE opportunity to ask the user for permission.Glyph or number.

Background TasksThe code that runs when your app doesnt.Windows Runtime Component.Must implement IBacKgroundTask.Declare Background Tasks in package.appxmanifest file.Register your background task.

NavigationFrame.Navigate.Go Home!Passing data between Pages.Cashing pages.

GeolocationUseful for:Line of Business Apps.Games.Maps.Travel.Exercise.Updating Manifest.Getting geolocation data when it changes.

Storage

WHERE IS SYSTEM.DATA?!!!!!!!!StorageNO System.Data.You have 4 Solutions:Services(Azure).IndexedDBThird party (SQLite).Application Settings:Local.Roaming.

SQLiteRelational database management system contained in a small Cprogramming library.Stores the entire database as a single cross-platform file on a host machine.Doesnt support all the SQL features

SQLiteGet it from Extension Manager.Add references to your project.Target only one Package.Add sqlite-net package

Local VS RoamingRoamingLocalData available on all user devices.UseUse roaming for preferences and customization.Use roaming to let users continue a task.

Data available only on current device.Use:Use local for information that is clearly local-only.Use local for large datasets.Use local for instant synchronization or rapidly changing data.

Context MenuRight-click on something you couldnt select.Steps:determine the position of the clicked element.Create context menu and add commands .Show popup.Only six commands.Text box context menus.

File associationRegistering our app with Windows 8 as an app that opens files of a certain type.Suitable for Editor apps (Text, photo,).Open your own extension files.

Camera CaptureUpdating ManifestUser permission.Create CameraCaptureUI object.CaptureFileAsync to get photo or video.Setup video settings (Max duration/format type/Max Resolution).

Application Life CycleLake of resources, your app will enter a suspended state. Leave app to use another, Windows will wait a few seconds before suspending it.5 seconds before app to be unresponsive.App.XAML.CS:OnLaunched : not resuming.OnSuspending

Design & UXWelcome to store apps world !Design & UXContent Before Chrome. Using The Windows 8 Silhouette. Navigation Patterns. Fluid Motion.Make Touch a Priority.

Content Before Chrome The focus is content

STOP MAKING BUTTONS!

Could this live in an application bar?

Using The Windows 8 Silhouette Navigation PatternsDONOT use the everywhere navigation pattern.Hierarchical NavigationMaster/detail structure.Semantic ZoomBranching not flat.

Hub Navigation PatternHub pages :Entry point.Whats new and available.Section Page:Second level.Individual items.Detail pages:Third level.Details of individual items.

Fluid motionAnimation should be purposeful.Hide late load time.XAML animation library.Theme transitions.Animation transitions.

Make a touch priorityA tap and a click in Windows 8 are the same.Clickable larger than 48 x 48 pixels.Optimal places to put your buttons and content.

Performance best practiceHow to use resources Sparingly ?Performance best practicesMinimize Application Startup.Optimize loading XAML.Load, store, and display large sets of data efficiently.Access the file system efficiently.Keep the UI thread responsive.Keep your app fast when you use interop.

Performance best practicesMake animations smooth.Optimize media resources.Minimize suspend/resume time.Reduce battery consumption.

Minimize Application Startup Start time:Less than one second (Excellent).Less than 5 seconds (Good).Greater than 5 seconds (Poor).Minimize managed assemblies in the startupTwo small assemblies instead one large.Load locally instead web requests.Disk operations are faster than network operations.

Optimize loading XAML Start Page:Dont reference for controls and resources in other files.Dont include page specific XAML in apps resource dictionary.Optimize element count: Avoid unnecessary elements. Remove hidden elements or set the Visibility property to Collapsed.Same vector = an image.

Optimize loading XAML Reuse identical brushes.Minimize redrawing to the same place on the screen :Collapse elements that are entirely obscure.Create a composite element instead of layering objects.Don't use the same color for foreground and background.Prefer a Border element to draw a border around an object instead of using other objects to impersonate a border. Be aware of your margin sizes. Cache static content.

Load, store, and display large sets of data efficiently Use UI virtualization to create only visible items:Wrap Grid .Virtualizing StackPanel. Keep item templates simple. Use item template selectors only as needed.Load subsets of data:Incremental data virtualization: (ISupportIncrementalLoading.)Random access data virtualization: (INotifyCollectionChanged and IObservableVector)

Access the file system efficiently Only retrieve needed properties not all.

Windows Runtime stream adapters data buffer .

Dont use buffer for low-latency reads and writes and large blocks out of the underlying

Keep the UI thread responsive Use asynchronous APIs. Async /Await

Offload work to background threads.Calculating of computer AI in a game Keep your app fast when you use interop

Make Animations Smooth Use independent instead of dependent animations .Dependant animations

Independent animationsUI thread creates the animation tree.

Each frame is generated on the UI thread and sent individually to the compositor.

Compositor renders the scene.

UI thread creates the animation tree.

Compositor takes over and runs the animation.

Make Animations Smooth Independent animationsDependant AnimationsObject animations using key frames Zero-duration animations Canvas.Left and Canvas.TopUIElement.OpacitySolidColorBrush.ColorRender Transform Projection Clip

EnableDependentAnimation property.

BitmapCache independent animations considered dependent because the cache must be rerasterized for each frame.

Make Animations Smooth Don't animate a WebView :Swap it with a WebViewBrush for the duration of the animation .Use infinite animations sparingly .Adding ahandler for CompositionTarget.Rendering is similar to running an infinite animation. Use the animation library: (Windows.UI.Xaml.Media.Animation ) Optimize media resources Release media streams.Display full screen video playback when possible.Put other elements to the side of embedded video.Delay setting the source for a MediaElement .Set MediaElement.PosterSource.Match video resolution with device resolution. Choose recommended formats.(MP4,MP3,H.264)Optimize media resources Scale images to the appropriate size :DecodePixelWidth & DecodePixelHeight instead width and height.

Use GetThumbnailAsync for thumbnails.

Decode images once.Minimize suspend/resume time Serialize only when necessary .Use Xml Serializer:The lowest serialization and deserialization times

Reduce memory footprint:Freeing as much memory as possible at suspension Release resources.

Reduce battery consumptionRemove unnecessarily timers .

Dont use animations in snap view.

Reducing the frequency at which you poll for new info using web services.

ReferencesWindows RT.31 days of Windows 8.Windows 8 Samples.Local Database in Windows Store app.Windows 8 APP UX.Performance best practice for Windows Store Apps.Windows Store Investigation.Code reuse between WP 8 and Windows 8.