windows (phone) 8 nfc app scenarios
DESCRIPTION
The three most important NFC (Near Field Communication) scenarios for Windows 8 / Windows Phone 8 (WP8) app developers: - Discover Your App - Share to Others - Seamless Multi-User Games & Collaboration This presentation describes these three scenarios, and shows you how to implement them in C# from a technical perspective. It contains examples for both Windows 8 and Windows Phone 8 development, based on the new Windows Proximity APIs. In addition, this presentation contains a quick overview of NFC as a technology, as well as pointers towards tools and documentation, including the open source NDEF library for more powerful and sophisticated NFC tag writing and reading tasks.TRANSCRIPT
Windows (Phone) 8NFC App Scenarios
Andreas Jakl, Mopius
Windows (Phone) 8 NFC App Scenarios v3.0.0 © 2014 Andreas Jakl 1NFC Forum and the NFC Forum logo are trademarks of the Near Field Communication Forum.
Andreas JaklTwitter: @mopius
Email: [email protected]
Trainer & app developer– mopius.com
– nfcinteractor.com
Nokia: Technology Wizard
FH Hagenberg, Mobile Computing: Assistant Professor
Siemens / BenQ Mobile: Augmented Reality-Apps
Windows (Phone) 8 NFC App Scenarios v3.0.0 © 2014 Andreas Jakl 2
Windows (Phone) 8 NFC App Scenarios v3.0.0 © 2014 Andreas Jakl 3
Seamless Multi-User Games & CollaborationShare to OthersDiscover Your App
Near Field Communication Nfc InteractorNDEF Library
PROXIMITY & TAPPING
Windows (Phone) 8 NFC App Scenarios v3.0.0 © 2014 Andreas Jakl 4
NFC Scenarios
Windows (Phone) 8 NFC App Scenarios v3.0.0 © 2014 Andreas Jakl
Connect Devices Exchange Digital Objects Acquire Content
5
Tap and Do
Windows (Phone) 8 NFC App Scenarios v3.0.0 © 2014 Andreas Jakl 6
A gesture that is a natural interaction between people in close proximity used to trigger doing something together between the devices they are holding.
System: Near Field Proximity(e.g., NFC)
Documentation: bit.ly/ProximitySpec
Windows (Phone) 8 NFC App Scenarios v3.0.0 © 2014 Andreas Jakl
Prox
imit
y A
PIs
Win
dow
s Ph
one
8 +
Win
dow
s 8
DocumentationWin8: bit.ly/ProximityAPI
WP8: bit.ly/ProximityAPIwp8
7
APP SCENARIOS
Windows (Phone) 8 NFC App Scenarios v3.0.0 © 2014 Andreas Jakl 8
Seamless Multi-User Games & CollaborationDiscover Your App Share to OthersShare to Others
Windows (Phone) 8 NFC App Scenarios v3.0.0 © 2014 Andreas Jakl 9
Seamless Multi-User Games & Collaboration
General Project Setup
Windows (Phone) 8 NFC App Scenarios v3.0.0 © 2014 Andreas Jakl 10
1 Add Proximity Capability
2 Initialize ProximityDevice_device = ProximityDevice.GetDefault();
Connect to HWDetect devices in rangePublish & subscribe to messages
How to Launch Apps
Windows (Phone) 8 NFC App Scenarios v3.0.0 © 2014 Andreas Jakl
Custom URI schemelaunches app.App needs to register.
Tag directly containsapp name andcustom data.No registration necessary.
eith
er o
r
Win8 + WP8
11
Windows (Phone) 8 NFC App Scenarios v3.0.0 © 2014 Andreas Jakl 12
Directly launch App
parameters app name 1platform 1 platform 2 app name 2 …
* For your low-level interest: type: Absolute URI, type name format: windows.com/LaunchApp. Contents re-formatted, e.g., with string lengths before each value
Encoded into NDEF message*
Write LaunchApp Tags
Windows (Phone) 8 NFC App Scenarios v3.0.0 © 2014 Andreas Jakl 13
// Arguments to pass to app, valid for all platformsvar launchArgs = "user=default";
// WP8: app's product id from the app manifest, wrapped in {}var wp8App = "{5e506af4‐4586‐4c90‐bc5f‐428b12cf48bc}";
// Win8: app ID: Package.appxmanifest ‐> source ‐> <Application Id="...">var win8AppId = "Proximity.App";var win8App = Windows.ApplicationModel.Package.Current.Id.FamilyName +
"!" + win8AppId;
// Combine to LaunchApp Messagevar launchAppMessage = launchArgs +
"\tWindowsPhone\t" + wp8App + "\tWindows\t" + win8App;
1 Launch parameters, platforms + app IDs
Write LaunchApp Tags
Windows (Phone) 8 NFC App Scenarios v3.0.0 © 2014 Andreas Jakl 14
3 Write to tags_device.PublishBinaryMessage("LaunchApp:WriteTag",
dataWriter.DetachBuffer());
var dataWriter = new Windows.Storage.Streams.DataWriter{UnicodeEncoding = Windows.Storage.Streams.UnicodeEncoding.Utf16LE};
dataWriter.WriteString(launchAppMessage);
2 Convert to byte array
Windows (Phone) 8 NFC App Scenarios v3.0.0 © 2014 Andreas Jakl 15
nearspeak: Good+morning.
Custom dataProtocol name
Encoded Launch URI
Examples*skype:mopius?call
spotify:search:17th%20boulevard
* Definition & examples: http://en.wikipedia.org/wiki/URI_scheme
User Experience
Windows (Phone) 8 NFC App Scenarios v3.0.0 © 2014 Andreas Jakl 16
No app installed 1 app installed 2+ apps installed
WP Protocol Association
Windows (Phone) 8 NFC App Scenarios v3.0.0 © 2014 Andreas Jakl 17
1 Specify protocol name in WMAppManifest.xml
...</Tokens><Extensions><Protocol Name="nearspeak"
NavUriFragment="encodedLaunchUri=%s"TaskID="_default" />
</Extensions>
Protocol name
Fixed
Note: different in Win8 / WP8
WP Protocol Association
Windows (Phone) 8 NFC App Scenarios v3.0.0 © 2014 Andreas Jakl 18
2 Create UriMapper class to parse parametersclass NearSpeakUriMapper : UriMapperBase{
public override Uri MapUri(Uri uri){
// Example: "Protocol?encodedLaunchUri=nearspeak:Good+morning."var tempUri = HttpUtility.UrlDecode(uri.ToString());var launchContents = Regex.Match(tempUri, @"nearspeak:(.*)$").Groups[1].Value;if (!String.IsNullOrEmpty(launchContents)){
// Launched from associated "nearspeak:" protocol// Call MainPage.xaml with parametersreturn new Uri("/MainPage.xaml?ms_nfp_launchargs=" + launchContents, UriKind.Relative);
}
// Include the original URI with the mapping to the main pagereturn uri;
}} Argument already handled in step 9 of LaunchApp tags (MainPage.OnNavigatedTo)
Note: different in Win8 / WP8
WP Protocol Association
Windows (Phone) 8 NFC App Scenarios v3.0.0 © 2014 Andreas Jakl 19
3 Use UriMapper in App.xaml.cs(region: )
private void InitializePhoneApplication() {RootFrame = new PhoneApplicationFrame();RootFrame.UriMapper = new NearSpeakUriMapper();
}
– If needed: launch protocol from app (for app2app comm)
await Windows.System.Launcher.LaunchUriAsync(new Uri("nearspeak:Good+morning."));
Register for URI Schemes
Windows (Phone) 8 NFC App Scenarios v3.0.0 © 2014 Andreas Jakl
Win 8
Specify URI scheme, display name + optional im
20
Tag Data After Launch
Activtion arguments in App.xaml.cs
Windows (Phone) 8 NFC App Scenarios v3.0.0 © 2014 Andreas Jakl
protected override async void OnActivated(IActivatedEventArgs args){
if (args.Kind == ActivationKind.Protocol){
ProtocolActivatedEventArgs protocolArgs = args asProtocolActivatedEventArgs;
}}
Win 8
21
User Experience
Windows (Phone) 8 NFC App Scenarios v3.0.0 © 2014 Andreas Jakl
Win 8
22
Seamless Multi-User Games & CollaborationDiscover Your App Share to OthersDiscover Your App
Windows (Phone) 8 NFC App Scenarios v3.0.0 © 2014 Andreas Jakl 23
Seamless Multi-User Games & Collaboration
Publish Messages
Proximity devices only
– (doesn’t write tags)
Windows Protocol + URI record
– Encapsulated in NDEF
Windows (Phone) 8 NFC App Scenarios v3.0.0 © 2014 Andreas Jakl 24
_publishingMessageId = _device.PublishUriMessage(new Uri("nfcinteractor:compose"));
1 Start publishing
Contains scheme,
platform & App ID
Write Tags
Windows (Phone) 8 NFC App Scenarios v3.0.0 © 2014 Andreas Jakl 25
1 Prepare & convert datavar dataWriter =
new Windows.Storage.Streams.DataWriter { UnicodeEncoding = Windows.Storage.Streams.
UnicodeEncoding.Utf16LE};
dataWriter.WriteString("nfcinteractor:compose");var dataBuffer = dataWriter.DetachBuffer();
2 Write tag (no device publication)_device.PublishBinaryMessage("WindowsUri:WriteTag", dataBuffer);
Mandatory encoding
bit.ly/PublishTypes
Seamless Multi-User Games & CollaborationDiscover Your App Share to OthersDiscover Your App
Windows (Phone) 8 NFC App Scenarios v3.0.0 © 2014 Andreas Jakl 26
Share to Others
Tap for
Windows (Phone) 8 NFC App Scenarios v3.0.0 © 2014 Andreas Jakl 27
Quick Data Exchange
ProximityDeviceExchange Windows /
NDEF messages,SNEP protocol
Long Term Connection
PeerFinderAutomatically builds
Bt / WiFi Directsocket connection
Seamless Multi-User Games & Collaboration
Establishing
Windows (Phone) 8 NFC App Scenarios v3.0.0 © 2014 Andreas Jakl 28
Long Term Connection
Trigger
Interact with TapNFC
Browse
Start SearchBt, WiFi, etc.
Tap to Trigger
Windows (Phone) 8 NFC App Scenarios v3.0.0 © 2014 Andreas Jakl 29
App not installed
App installed
Connection State
Windows (Phone) 8 NFC App Scenarios v3.0.0 © 2014 Andreas Jakl 30
PeerFound
1Proximity gesture completeDevices can be pulled away
Connecting /Listening
2Which device initiated tap gesture?→ Connecting, other device Listening
Completed
3Access socket of persistent transport
(e.g., TCP/IP, Bt)
Find Peers
Windows (Phone) 8 NFC App Scenarios v3.0.0 © 2014 Andreas Jakl 31
PeerFinder.TriggeredConnectionStateChanged +=TriggeredConnectionStateChanged;
PeerFinder.Start();
1 Start waiting for triggered connections
2 Peer found & connection established? Send message over socket
* For URI records + simple Smart Poster (w/o title), use the WindowsUri type.
private async void TriggeredConnectionStateChanged(object sender, TriggeredConnectionStateChangedEventArgs eventArgs) {
if (eventArgs.State == TriggeredConnectState.Completed) {// Socket connection established!var dataWriter = new DataWriter(eventArgs.Socket.OutputStream);dataWriter.WriteString("Hello Peer!");var numBytesWritten = await dataWriter.StoreAsync();
}}Completed
3
TOOLS & RESOURCES
Windows (Phone) 8 NFC App Scenarios v3.0.0 © 2014 Andreas Jakl 32
UX Recommendations*
User initiated peer search only Ask for consent Show connection
state
Failed connection?
Inform & revert to single-user mode
Let user get out of proximity
experience
Proximity: only if connection details
not relevant
Windows (Phone) 8 NFC App Scenarios v3.0.0 © 2014 Andreas Jakl 33* bit.ly/ProximityUX
NFC ToolsProximity Tapper for WP emulator
– http://proximitytapper.codeplex.com/
Open NFC Simulator
– http://open-nfc.org/wp/editions/android/
NFC plugin for Eclipse: NDEF Editor
– https://code.google.com/p/nfc-eclipse-plugin/
Windows (Phone) 8 NFC App Scenarios v3.0.0 © 2014 Andreas Jakl 34
nfcinteractor.com
Windows (Phone) 8 NFC App Scenarios v3.0.0 © 2014 Andreas Jakl 35
NFC Resources NFC News: nfcworld.com
NFC developer comparison
(WP, Android, BlackBerry):
bit.ly/NfcDevCompare
Specifications: nfc-forum.org
Windows (Phone) 8 NFC App Scenarios v3.0.0 © 2014 Andreas Jakl 36
NDEF HANDLINGStandardized NFC Tag Contents
Windows (Phone) 8 NFC App Scenarios v3.0.0 © 2014 Andreas Jakl 37
NDEF Message
NFC Data
Windows (Phone) 8 NFC App Scenarios v3.0.0 © 2014 Andreas Jakl
NDEF Record(e.g., URL) …
NDEF = NFC Data Exchange Format
38
SNEP = Simple NDEF Exchange Protocol
Windows (Phone) 8 NFC App Scenarios v3.0.0 © 2014 Andreas Jakl
NDEF Message
NDEF Record(e.g., URL) …
39
Reading NDEF
Windows (Phone) 8 NFC App Scenarios v3.0.0 © 2014 Andreas Jakl 40
_subscribedMessageId = _device.SubscribeForMessage("NDEF", MessageReceivedHandler);
1 Subscribe to all NDEF messages
2 Parse raw byte array in handler
http://www.nfc-forum.org/specs/
_subscribedMessageId = _device.SubscribeForMessage("NDEF", MessageReceivedHandler);
Subscribe to all NDEF messages
Parse raw byte array in handler
http://www.nfc-forum.org/specs/
// Convert the language code to a byte arrayvar languageEncoding = Encoding.UTF8;var encodedLanguage = languageEncoding.GetBytes(languageCode);// Encode and convert the text to a byte arrayvar encoding = (textEncoding == TextEncodingType.Utf8) ? Encoding.UTF8 : Encoding.BigEndianUnicode;var encodedText = encoding.GetBytes(text);// Calculate the length of the payload & create the arrayvar payloadLength = 1 + encodedLanguage.Length + encodedText.Length;Payload = new byte[payloadLength];
// Assemble the status bytePayload[0] = 0; // Make sure also the RFU bit is set to 0// Text encodingif (textEncoding == TextEncodingType.Utf8)
Payload[0] &= 0x7F; // ~0x80else
Payload[0] |= 0x80;
// Language code lengthPayload[0] |= (byte)(0x3f & (byte)encodedLanguage.Length);
// Language codeArray.Copy(encodedLanguage, 0, Payload, 1, encodedLanguage.Length);
// TextArray.Copy(encodedText, 0, Payload, 1 + encodedLanguage.Length, encodedText.Length);Si
mpl
e ex
ampl
e:as
sem
blin
g pa
yloa
d of
Text
reco
rd
Reading NDEF
Windows (Phone) 8 NFC App Scenarios v3.0.0 © 2014 Andreas Jakl 41
1
2
NDEF.codeplex.com
Windows (Phone) 8 NFC App Scenarios v3.0.0 © 2014 Andreas Jakl 42
Reusable NDEF classes
Create NDEFmessages & records
(standard compliant)
Parse informationfrom raw byte arrays
Fully documentedOpen Source LGPL license
(based on Qt Mobility)
NDEF Subscriptions
Windows (Phone) 8 NFC App Scenarios v3.0.0 © 2014 Andreas Jakl 43
_subscribedMessageId = _device.SubscribeForMessage("NDEF",MessageReceivedHandler);
1 Subscribe to all NDEF formatted tags
private void MessageReceivedHandler(ProximityDevice sender, ProximityMessage message){
var msgArray = message.Data.ToArray();NdefMessage ndefMessage = NdefMessage.FromByteArray(msgArray);[...]
}
2 Parse NDEF message
NDEF Subscriptions
Windows (Phone) 8 NFC App Scenarios v3.0.0 © 2014 Andreas Jakl 44
foreach (NdefRecord record in ndefMessage) {
Debug.WriteLine("Record type: " + Encoding.UTF8.GetString(record.Type, 0, record.Type.Length));
// Check the type of each record ‐ handling a Smart Poster in this exampleif (record.CheckSpecializedType(false) == typeof(NdefSpRecord)) {
// Convert and extract Smart Poster infovar spRecord = new NdefSpRecord(record);Debug.WriteLine("URI: " + spRecord.Uri);Debug.WriteLine("Titles: " + spRecord.TitleCount());Debug.WriteLine("1. Title: " + spRecord.Titles[0].Text);Debug.WriteLine("Action set: " + spRecord.ActionInUse());
}}
3 Analyze all contained NDEF records with specialized classes
Write NDEF
Windows (Phone) 8 NFC App Scenarios v3.0.0 © 2014 Andreas Jakl 45
1 Prepare & convert data// Initialize Smart Poster record with URI, Action + 1 Titlevar spRecord = new NdefSpRecord
{ Uri = "http://www.nfcinteractor.com" };spRecord.AddTitle(new NdefTextRecord
{ Text = "Nfc Interactor", LanguageCode = "en" });
// Add record to NDEF messagevar msg = new NdefMessage { spRecord };
2a Write tag// Publish NDEF message to a tag_device.PublishBinaryMessage("NDEF:WriteTag", msg.ToByteArray().AsBuffer());
2b Publish to devices// Alternative: send NDEF message to another NFC device_device.PublishBinaryMessage("NDEF", msg.ToByteArray().AsBuffer());
Supported Record Types
Windows (Phone) 8 NFC App Scenarios v3.0.0 © 2014 Andreas Jakl 46
Smart Poster URI
Text LaunchApp
Android Application Record (AAR)Windows Phone SettingsNokia Accessories Record
NearSpeak Voice Messages
Geo tagsSocial tagsSMS tagsTelephone callMailto tags
ndef.mopius.com
Windows (Phone) 8 NFC App Scenarios v3.0.0 © 2014 Andreas Jakl 47
Seamless Multi-User Games & CollaborationShare to OthersDiscover Your App
Near Field Communication Nfc InteractorNDEF Library
Thank You.
Andreas Jakl@mopius
mopius.comnfcinteractor.com
Windows (Phone) 8 NFC App Scenarios v3.0.0 © 2014 Andreas Jakl 48