If you already have a web application, then you can create a windows universal app in just four steps. You can read the same post over here as well. 

Step 1: Open Visual Studio and Select File -> New -> Project and Select Blank App (Windows Universal) under “JavaScript -> Windows -> Windows Universal” templates.

Step 2: Once the project is loaded, it looks like the following, delete the CSS, js, WinJS and default.html files from the project.

Now you are left with images folder and appxmanifest file.

Step 3: Open the package.appxmanifest file

Search for StartPage=”default.html” and then remove the default.html and set the URL for which you are planned to create the universal app.

For example: I have choose this URL “https://blogs.msdn.com/ “.

Add the Application Content URI Rules to the package manifest. This setting defines the URL that are part of the app. If the URL is not defined in this rule then they will open in the default browse

Set the WindowsRuntimeAccess to all, so that the URL can use access the native platform API’s.

(If you have more than one subdomain, you must use one wildcard for each subdomain)

Step 4: Press F5 and run the app.

Now you have created a universal windows app from web app.

Advantage of using this Web Apps in Universal Windows Apps are:

1. Integrate Cortana.

2. Add Live Tiles.

3. Add Toast Notifications to the Application.

4. In-App Purchase from Windows Store.

I hope this post would have helped in Creating Universal Windows App from existing Web Apps.

I have Published the same content over Creating a Windows Universal App from your existing Web Sites using Visual Studio 2015 

Let’s understand what is foreground and back ground voice commands, in foreground voice command the application will be launched by the Cortana. Where as in background voice command the Cortana activates the background task of the application and the results are populated in the Cortana’s
Canvas.

Foreground Voice Command Architecture

Step 1: VCD (Voice Command Definition) is an XML file which contains all the Commands to activate the app. When the app run by the user in the foreground, then the VCD file gets installed in the Cortana.

Step 2: User can use any command defined in the VCD file to launch the App.

Step 3, 4 ,5 6 : The speech spoken by the user is sent to Windows Speech platform and Microsoft Speech Recognition service in cloud, together they identify what the user has tried to said.

Step 7: Now Cortana receives the text said by the user and decides which application has to be launched and passes the recognized string to the application OnActivated event.

To make this happen the three important steps

1. Create the voice commands in the VCD (Voice Command Definition) file
2. Then Register the VCD XML file on Application starts
3. Then handle the voice command on the App Activation

Creating the VCD (Voice Command Definition) file is the first and foremost step.

Let’s see what VCD file is and how to create commands.

Step 1: Add an XML file to the Solution and name it as VoiceCommandDefinition.xml

Step 2: Add CommandSet Element and specify the language the commands are targeted.

E.g “en-us” for English, this commandset language should match the language set in the user device.

Step 3: Add CommandPrefix to the CommandSet, which is nothing but the unique name you can provide to your application. This name is used as a prefix or suffix to the voice command to activate the app.

E.g       <CommandPrefix> Universal Messenger, </CommandPrefix>

                 <Example> Text Sam "Hello World" </Example>

Step 4: Add a command to the CommandSet, and name it.

 E.g          <Command Name="showConversation">

Step 5:  Add an example to the command which will be displayed in the Cortana canvas.

E.g         <Example> show my conversation with Sam </Example>

Step 6: Add a ListenFor text, the text for which the Cortana listens. The ListenFor elements in the command phrases may contain optional words. These are wrapped in square brackets. User may include or may not include in there command.

E.g       <ListenFor > show [my] conversation with {user} </ListenFor>

Step 7: Add the Feedback text which will be spoken by the Cortana when launching the app.

E.g      <Feedback> Showing conversation with {user} </Feedback>

Step 8: And finally add navigate (this Element specified that the command is of Foreground activation)

E.g               <Navigate/>

An Sample VCD file commands are shown below..

<?xml version="1.0" encoding="utf-8"?>

<VoiceCommands xmlns="https://schemas.microsoft.com/voicecommands/1.2">

  <CommandSet xml:lang="en-us" Name="UniversalAppCommandSet_en-us">

    <CommandPrefix> Universal Messenger, </CommandPrefix>

    <Example> Text Sam "Hello World" </Example>

    <Command Name="showConversation">

      <Example>  show my conversation with sam  </Example>

      <ListenFor > show [my] conversation with {user} </ListenFor>

      <Feedback> Showing conversation with {user} </Feedback>

      <Navigate/>

    </Command>

    <PhraseList Label="user">

      <Item>Sam</Item>

      <Item>John</Item>

    </PhraseList>

  </CommandSet>

</VoiceCommands>

The Phraselist are the list of string which are used along with the commands.

Now the VCD file is created and we can register the file to the Cortana.

To Install the VCD file we need to use the InstallCommandDefinitionsFromStorageFileAsync Method takes the VCD file as Parameter and register it to the Cortana.

Add the following lines of code to the onLaunched method in App.xaml.cs, so the Cortana can resister and listen to the commands.

 var storageFile = await Windows.Storage.StorageFile.GetFileFromApplicationUriAsync(newUri("ms-appx:///Sample.xml"));

await Windows.ApplicationModel.VoiceCommands.VoiceCommandDefinitionManager.InstallCommandDefinitionsFromStorageFileAsync(storageFile);

When the VCD file is installed in the Cortana, the user can see the Application name and an example text provided in the VCD file will appear in the Help Section of Cortana. Now the user is ready to go with voice command to activate the app.

User Opens Cortana and says the voice command, the Cortana understands the commands said by the user and Activates the App.

In my sample application I have created voice command to how the conversation with some user. When I trigger the voice command the Cortana understands it and launch my application.

Till now we have created the VCD file and registered the VCD file o Cortana, but we haven’t handled the on Activated event. But still we are able to open our app using the Command we defined in our VCD file. But we cannot do anything specific to the command.

When we invoke the command we will see Cortana displaying the application in the Canvas.

The Third and final step is to handle the Voice command in the Application OnActivated event.

The IActivatedEventArgs has a property called Kind which specified the kind of activation is it. We can check if the application is launched using voiceCommand or by any other means, if the app is launched using voice command then we need to get the text spoken by the user, to get the string we need to cast the IActivatedEventArgs to VoiceCommandActivatedEventArgs.

The VoiceCommandActivatedEventArgs has a property called Result which will provide the SpeechRecognitionResult.

The SpeechRecognitionResult has a property called Text, which provides the Text Spoken by the user, Then using this text we can decide which page has to be displayed.

That’s our Application is integrated with the Cortana. We can launch our app using the voice commands.
In my next blog let’s see how to integrate the Cortana to the background task.

UniversalMessanger.zip