Alive with activity tiles notifications and background t asks
This presentation is the property of its rightful owner.
Sponsored Links
1 / 35

Alive with activity Tiles, notifications , and background t asks PowerPoint PPT Presentation


  • 242 Views
  • Uploaded on
  • Presentation posted in: General

Alive with activity Tiles, notifications , and background t asks. Kraig Brockschmidt Senior Program Manager, Windows Ecosystem Team Author, Programming Windows 8 Apps with HTML, CSS, and JavaScript 3-101. Agenda. Visual tour: understanding the user e xperience

Download Presentation

Alive with activity Tiles, notifications , and background t asks

An Image/Link below is provided (as is) to download presentation

Download Policy: Content on the Website is provided to you AS IS for your information and personal use and may not be sold / licensed / shared on other websites without getting consent from its author.While downloading, if for some reason you are not able to download a presentation, the publisher may have deleted the file from their server.


- - - - - - - - - - - - - - - - - - - - - - - - - - E N D - - - - - - - - - - - - - - - - - - - - - - - - - -

Presentation Transcript


Alive with activity tiles notifications and background t asks

Alive with activityTiles, notifications, and background tasks

KraigBrockschmidt

Senior Program Manager, Windows Ecosystem Team

Author, Programming Windows 8 Apps with HTML, CSS, and JavaScript

3-101


Agenda

Agenda

  • Visual tour: understanding the user experience

  • Three ways an app configures updates

  • The role of background tasks for notifications

  • Writing and debugging web services for notifications


Alive with activity tiles notifications and background tasks

How do we create an environment that’s “alive with activity”without having apps runningall the time?


Demo a visual tour

Demo:a visual tour


Live tiles

Live tiles

Tiles updated using pre-defined templates

Updates include both square and wide tiles

Text-only, image-only or combination

Local, scheduled, periodic and push updates

JPEG, GIF, or PNG, max size 200 KB, max 1024px size

Optional “peek” animation


Toast templates

Toast templates


The lock s creen

The lock screen

  • App content


Alive with activity without apps r unning

Alive with activity without apps running

  • Issue direct updates, perhaps using queue, scheduled, and expiring updates

  • Tell Windows a service URL where it can to obtain periodic updates

  • Obtain a Windows Push Notification Service (WNS) channel and have a service send notifications to that

  • These actions can happen from app code or background tasks

  • There are three ways an app configures this

  • to happen


What makes an update

What makes an update?

  • Choices: Tile template catalog, badge catalog, toast template catalog, plus Toast audio options catalog

  • Whoever issues an update builds the XML

    • URIs for images can use http[s]://, ms-appx:///, orms-appdata:///local/

  • Notifications Extensions Library providesan object model

  • Reduces mistakes that cause updates to not show

  • Tiles, badges, and toasts are bits of XML that come from predefined templates (to avoid chaos)


Xml badge u pdate s chema

XML badge update schema

  • <?xmlversion="1.0"encoding="utf-8" ?>

  • <badgevalue = "1-99"|"none"|"activity"|"alert"|"available"|"away"|...

  • version? = "integer" />


Xml tile u pdate s chema

XML tile update schema

  • <?xmlversion="1.0"encoding="utf-8" ?>

  • <tile>

  • <visualversion? = "integer" lang? = "string" baseUri?= "anyURI"

  • branding? = "none" addImageQuery? = "boolean" >

  • <!-- One or more binding elements -->

  • <bindingtemplate = "TileSquareImage"|"TileSquareBlock"|...

  • fallback? = "string" lang? = "string" baseUri? = "anyURI"

  • branding? = "none" addImageQuery? = "boolean" >

  • <!-- Some combination of image and text -->

  • <imageid = "integer"src = "string"

  • alt? = "string"addImageQuery? = "boolean" />

  • <textid= "integer"lang? = "string" />

  • </binding>

  • </visual>

  • </tile>


Xml toast n otification s chema

XML toast notification schema

  • <?xmlversion="1.0"encoding="utf-8" ?>

  • <toastlaunch? = "string"duration? = "long"|"short" >

  • <visualversion? = "integer"lang? = "string"

  • baseUri? = "anyURI"branding? = "none"addImageQuery? = "boolean" >

  • <!-- One or more bindings -->

  • <bindingtemplate = "ToastImageAndText01"|"ToastImageAndText02"|...=""

  • fallback? = "string"lang? = "string"baseUri? = "anyURI"

  • branding? = "none"addImageQuery? = "boolean" >

  • <!-- Some number of child elements -->

  • <imageid = "integer"src = "string" alt = "string"addImageQuery? = "boolean" />

  • <textid = "integer"lang? = "string" />

  • </binding>

  • </visual>

  • <!-- Optional audio -->

  • <audiosrc? = "ms-winsoundevent:Notification.Default"|...

  • loop?= "boolean"silent? = "boolean" />

  • </toast>


Secondary t iles

Secondary tiles

Tiles created by “pinning” content from app

Pin initiated by app via simple runtime call

User confirms pin operation via system UI

Exposes a personalized surface for app

Increases Start screen presence

Same capabilities as app tiles

Launch leads to relevant content

See Windows.UI.StartScreen.SecondaryTiles classand Secondary Tiles Sample


Issuing updates from the app

Issuing updates from the app

Updates appear immediately

Running app orbackground task

Tile and badge APItoast API

In Windows.UI.Notifications namespace:

TileNotification>> TileUpdater, SecondaryTileUpdaterBadgeNotification>> BadgeUpdater

ToastNotification>> ToastNotifier


Scheduled notifications

Scheduled notifications

Scheduled notification API

Running app orbackground task

System process

Queue

Suspendedor not running

In Windows.UI.Notifications namespace:

ScheduledTileNotification>> TileUpdater, SecondaryTileUpdaterScheduledToastNotification>> ToastNotifier


Configuring periodic u pdates

Configuring periodic updates

System process30m to 24h frequency per service

Tile and badge updater API

Running app or

background task

URI

web service

HTTP Request

Suspendedor not running

In Windows.UI.Notifications namespace:

TileUpdater.StartPeriodicUpdateand StartPeriodicUpdateBatch

BadgeUpdater.StartPeriodicUpdate


Demo writing and debugging a periodic u pdate s ervice

Demo:writing and debugging aperiodic update service


Configuring push n otifications

Configuring push notifications

web service

Channel request API

Running app or

background task

Send channel to web service

Sendupdate

Suspendedor not running

Push updatesto client (tile, badge,toast, raw)

WNS

Running app: PushNotificationChannel.PushNotificationReceived event(in Windows.Networking.PushNotificationsnamespace)

Background task: PushNotificationTrigger


Register the app via store dashboard

Register the app via Store dashboard


Demo writing and debugging a service for wns

Demo:writing and debugging aservice for WNS


Building a cloud s ervice with windows azure

Building a cloud service withWindows Azure

Building a Cloud Service with Window Azure

  • How do I do that with Windows Azure?

  • Windows Azure Mobile Services

  • www.WindowsAzure.com/mobile

  • 11/1 4:15pm - Baker – Windows 8 Connectathon with Windows Azure Mobile Services (3-129)

  • Also see offerings from Urban Airship:http://urbanairship.com

  • What a push service needs to support:

  • Secure service API for channel URI registration

  • Persistent storage ofchannel URIs

  • Storage for tile andtoast images


Background tasks for notifications

Background tasks for notifications

  • Maintenance triggers – monitor state changes, renew WNS channels

  • System triggers - AC power, non-lock screen

    • InternetAvailable, NetworkStateChange for connectivity

    • LockScreenApplication[Added | Removed]

    • ServicingComplete app has been updated

  • Lock screen triggers - AC or battery power

    • ControlChannelTrigger (sockets for RTC), TimeTrigger,

    • SessionConnected, UserAway, UserPresent

    • PushNotificationTrigger to receive raw notifications

  • All tasks subject to CPU and network activity quotas

    • Independent of main app (can use mixed languages)


Renewing wns channels register t ask c

Renewing WNS channels (register task, C#)

usingWindows.ApplicationModel.Background;

BackgroundTaskBuildertaskBuilder = newBackgroundTaskBuilder();

MaintenanceTrigger trigger = newMaintenanceTrigger( 10 * 24 * 60, false); //10 * 24 * 60 == 10 days

taskBuilder.SetTrigger(trigger);//In JavaScript, taskEntryPoint is the path of a .js file

taskBuilder.TaskEntryPoint = "PushNotificationsHelper.MaintenanceTask";

taskBuilder.Name = "UpdateChannels";

SystemConditioninternetCondition = newSystemCondition(SystemConditionType.InternetAvailable);

taskBuilder.AddCondition(internetCondition);

taskBuilder.Register();


Renewing wns channels task c

Renewing WNS channels (task, C#)

using System;

usingSystem.Threading.Tasks;

usingWindows.ApplicationModel.Background;

namespacePushNotificationsHelper {

publicsealedclassMaintenanceTask : IBackgroundTask{

publicvoid Run(IBackgroundTaskInstancetaskInstance)

{// This is a helper function to renew WNS channels. // Important here to not block the UI thread.

Notifiernotifier = newNotifier();

notifier.RenewAllAsync(false).AsTask().Wait();

}

}

}


Renewing wns channels task javascript

Renewing WNS channels (task, JavaScript)

// This code runs as a web worker

(function () {// Import the Notifier helper objectimportScripts("//Microsoft.WinJS.1.0/js/base.js");importScripts("notifications.js");varcloseFunction = function () { close(); // This is worker.close };varnotifier = newSampleNotifications.Notifier();notifier.renewAllAsync().done(closeFunction, closeFunction);})();


Receiving raw n otification r egister t ask c

Receiving raw notification (register task, C#)

usingWindows.ApplicationModel.Background;usingWindows.Networking.PushNotifications;

BackgroundTaskBuildertaskBuilder = newBackgroundTaskBuilder();

PushNotificationTriggertrigger = newPushNotificationTrigger();taskBuilder.SetTrigger(trigger);taskBuilder.TaskEntryPoint= "BackgroundTasks.RawNotification";

taskBuilder.Name = "ReceiveRawNotification";

taskBuilder.Register();


Receiving raw n otification task c

Receiving raw notification (task, C#)

usingSystem.Diagnostics;

usingWindows.ApplicationModel.Background;

usingWindows.Networking.PushNotifications;

usingWindows.Storage;

namespaceBackgroundTasks {

publicsealedclassRawNotification: IBackgroundTask {

publicvoid Run(IBackgroundTaskInstancetaskInstance) {

// Get the background task details

ApplicationDataContainer settings = ApplicationData.Current.LocalSettings;

// Store the content received from the notification so it // can be retrieved from the UI.

RawNotification notification = (RawNotification)taskInstance.TriggerDetails;

settings.Values[taskName] = notification.Content;

}

}

}


Capability summary for notifications

Capability summary for notifications


When should i update my tile or toast

Personalized, real-time status

When should I update my tile or toast?

Push

e.g. a friend achieves a new high score within a game we share

e.g. comments on my photo

Subscribed tailored content updates

Push

e.g. ongoing sporting event scores

e.g. breaking news

Application launch/usage

Local / Push

e.g. update app tile to match more recent app content

e.g. clearing the unread mail count when mail is opened

Periodically for non-personalized content

Periodic

e.g. every 30 minutes for stock or weather updates

Missed toast notifications

Local / Push

e.g. missed phone calls in a VOIP app


How s hould i not u pdate m y t ile

How should I notupdate my tile?

Avoid high frequency, streaming updates

e.g. every minute to report a play-by-play sporting event

e.g. real-time stock ticker on the tile

Do not clear the tile when the app launches/exits

Leave content on the tile to draw your user back to the app.

It is okay to update the tile on app exit, however.

Do not update to explicitly replace ‘old content’

Set the optional expirationon the tile at the time it is sent.

Only send new updates if there is new data to show the user.

Do not depend on tile ordering

Notification queue tile display order is not guaranteed – “storyboards” will not work on tiles. Tile updates must be independent of one another.


Related sessions

Related sessions

  • 11/1 4:15pm - Baker – Windows 8 Connectathon with Windows Azure Mobile Services (3-129)


Resources

Resources

  • UX Guidelines – section on Tiles and Notifications

  • Working with tiles, badges, and toast notifications

  • App tiles and badges sample

  • Secondary tiles sample

  • Push and periodic notifications sample

  • Raw notifications sample

  • Lock screen apps sample

  • Programming Windows 8 Apps in HTML, CSS, and JavaScript

Please submit session evals by using the Build Windows 8 app

or at http://aka.ms/BuildSessions


Resources1

Resources

  • Develop: http://msdn.microsoft.com/en-US/windows/apps/br229512

  • Design: http://design.windows.com/

  • Samples: http://code.msdn.microsoft.com/windowsapps/Windows-8-Modern-Style-App-Samples

  • Videos: http://channel9.msdn.com/Windows

Please submit session evals by using the Build Windows 8 app

or at http://aka.ms/BuildSessions


  • Login