Windows 8 & 8.1: Improve the visibility of your app by inviting users to rate it

The rule is the same for all applications stores. The more good ratings you have, the more visible your app will be.

And there are some simple things you can do to increase the number of good ratings you can get:

• Create a good app. There is no magical way to transform a crap app into a wonderful and super useful app.
• Invite your user to rate the app: Users are not always accustomed to the rating system. Your app must help them discover the feature and obviously it should encourage them to give a good rating.

To create a good app, you can find a lot of information on the Microsoft Dev Center.

For inviting users to rate your app, many strategies can be applied and I will talk about two of them in this article. I used both of them for my app Urzagatherer and I’m pretty satisfied by the result:

I will use JavaScript for the code samples. Obviously the same thing can be done with .NET as I only use WinRT code.

Strategy 1 – At the very first launch

The first solution I used to invite users to rate my application was to display a screen with a button to rate the application at the first launch of the app.

To do so, you just have to compare the current version of the application with a locally saved variable:

var currentVersion = version.major + "." + version.minor + "." + version.build + "." + version.revision;
var hintsVersion = Windows.Storage.ApplicationData.current.localSettings.values["hintsVersion"];

if (!hintsVersion || hintsVersion != currentVersion) {
    // Display the invitation

    Windows.Storage.ApplicationData.current.localSettings.values["hintsVersion"] = currentVersion;
}

Simple, isn’t it? You just have to save the current version to the local settings so that you will not bother the user twice. In my case, I also add a “what’s new” list to the invitation screen:

Strategy 2 – When you are sure that the user likes your app

Another solution can be to check that the users REALLY appreciate your app before talking about rating. To do so, we can again use a locally saved variable and increment it every time the user launches the app. When the count is equal to a specific value you can display the invitation:

var currentVersion = version.major + "." + version.minor + "." + version.build + "." + version.revision;
var hintsVersion = Windows.Storage.ApplicationData.current.localSettings.values["hintsVersion"];

if (!hintsVersion || hintsVersion != currentVersion) {
    Windows.Storage.ApplicationData.current.localSettings.values["hintsVersion"] = currentVersion;
    Windows.Storage.ApplicationData.current.localSettings.values["hintsCount"] = 1;
} else {
    var count = Windows.Storage.ApplicationData.current.localSettings.values["hintsCount"];
    count++;
    Windows.Storage.ApplicationData.current.localSettings.values["hintsCount"] = count;

    if (count == 5) {
        // Display the invitation
    }
}

Displaying the invitation

For displaying the invitation in a non intrusive way, I decided to use a SettingsFlyout (or a _Popup_ in XAML):

<div id="hintsDiv" data-win-control="WinJS.UI.SettingsFlyout" data-win-options="{width:'wide'}">
     <div class="win-header accent-back">
         <button type="button" onclick="WinJS.UI.SettingsFlyout.show()" class="win-backbutton">
         </button>
         <div class="win-label" data-win-res="{innerText: 'WhatsNewTitle'}"></div>
     </div>
     <div class="win-content" id="whatsnew">
         <div class="whatsnewBlock hintBlock accent-back" id="feature00"></div>
         <div class="newsBlock" id="feature00Text" data-win-res="{innerHTML: 'feature00'}"></div>
         <div class="whatsnewBlock hintBlock accent-back" id="feature01"></div>
         <div class="newsBlock" id="feature01Text" data-win-res="{innerHTML: 'feature01'}"></div>
         <div class="whatsnewBlock hintBlock accent-back" id="feature02"></div>
         <div class="newsBlock" id="feature02Text" data-win-res="{innerHTML: 'feature02'}"></div>
         <div class="whatsnewBlock hintBlock accent-back" id="feature03"></div>
         <div class="newsBlock" id="feature03Text" data-win-res="{innerHTML: 'feature03'}"></div>
         <div class="whatsnewBlock hintBlock accent-back" id="feature04"></div>
         <div class="newsBlock" id="feature04Text" data-win-res="{innerHTML: 'feature04'}"></div>
         <div class="whatsnewBlock hintBlock accent-back" id="feature05"></div>
         <div class="newsBlock" id="feature05Text" data-win-res="{innerHTML: 'feature05'}"></div>
         <div class="whatsnewBlock hintBlock accent-back" id="feature06"></div>
         <div class="newsBlock" id="feature06Text" data-win-res="{innerHTML: 'feature06'}"></div>
         <hr id="hintsSeparator" />
         <button id="rateButton" class="externalButton" data-win-res="{innerText: 'rateApp'}"></button>
         <button id="facebookButton" class="externalButton" data-win-res="{innerText: 'facebook'}"></button>
         <button id="donateButton" class="externalButton" data-win-res="{innerText: 'donate'}"></button>
     </div>
 </div>

To display it, just use this code:

document.getElementById("hintsDiv").winControl.show();

Invoking the rating screen

Finally when the user clicks on the rate button, you have to call this WinRT functions to navigate to the Windows’s rating screen:

Windows.System.Launcher.launchUriAsync(
          new Windows.Foundation.Uri("ms-windows-store:REVIEW?PFN=15798DavidCatuhe.UrzaGatherer_x8akzp4bebrnj")
);

To find the good Uri for your app, you must open the package.appxmanifest file in your project and go to the Packaging tab:

The Package family name value is the key for your Uri.

Other things

There are tons of others thing to do to be able to gather a lot of ratings but these two solutions are a good start. Do not also forget to check the comments of your users and to update accordingly your app.