Simulation Dashboard for Windows Phone Apps

Simulation Dashboard for Windows Phone Apps

  • Comments 8
  • Likes

Hi folks, I’m Jonathan, the PM Lead for the Windows Phone Tools and SDK team.  A wise man once said “your code’s as good as your people, and your people are as good as their tools.”  We believe that great tools help great people write great apps.  To that end, I’m excited to share this post with you from Rahul Bagaria covering Simulation Dashboard.


Phone apps need to be designed and developed to manage a variety of different conditions that are common in daily life, such as changing network conditions, intermittent network failures, and unexpected phone interruptions. Building and testing apps under lab conditions does not ensure that they will behave well in real-life conditions or handle unexpected user behavior appropriately. There can be many problems which the apps face in real life, such as:

· Crashes due to unhandled network interruptions in flow of data

· Unresponsiveness due to large downloads over slow networks

· Media playback jitters on high-latency networks

· Games continuing in background unaware of a phone call received by user

Currently, you cannot validate your app's performance and functionality in all such conditions during development, which can lead to disappointing user experiences and negative reviews in the Store. However, the new Windows Phone SDK 8.0 addresses these types of conditions through the introduction of Simulation Dashboard. It lets you validate in advance how your app will behave in real life conditions. You can simulate various network conditions and phone interruptions from the dashboard and tweak your app to ensure that it behaves well under these conditions. All this will lead to satisfied users and good reviews!

Simulation Dashboard

The following image shows the options available for the dashboard.

clip_image002 

· You can simulate different network conditions with custom settings of Network Speed and Signal Strengths (network speed and quality will be limited by the actual network of the development environment).

· You can trigger the Lock Screen on the Windows Phone emulator or device to validate how the app manages its state under Activated/Deactivated events.

· You can trigger Reminders to validate an app's behavior when it is interrupted and partially obscured with Obscured/Unobscured events.

Want to know more about the Simulation Dashboard and see what all can you do with it? Let’s explore the various scenarios using a typical photo app. This app allows you to browse your Flickr account pictures, play them in a slideshow, and even upload Instagram-style artified images from within the app. (Check out the PhotoSlydr app, which was optimized using the steps outlined here.)

About the Demo App

You will first have to register with Flickr and get a personal API Key which you can use in your app to use Flickr APIs and create your own Flickr client. For more information, see The Flickr developer guide: API. Our typical app has the following design, which we will validate under real-life conditions:

· Select a photo album from a signed-in Flickr account

· Browse the pictures in a scrollable wrap panel

· Tap a picture to go to the slideshow

· Browse the pictures in the slideshow mode or play the slideshow with custom speeds

We start the app under Debug mode to see how it functions. As you can see from the screenshot, we select an album from the home page and tap Go to explore it.

clip_image004clip_image006

Network Simulation

In a typical run on broadband connections, I could see that the images came in a jiffy, and it was all nice and quick. However, we should see how it would have performed if the user did not have access to a Wi-Fi network and was using the app under 3G.

1. In the Tools menu, select Simulation Dashboard.
The Simulation Dashboard will open in Visual Studio.

2. Select the Enable Network Simulation check box to set up the connection with the emulator or device.
When using the device, you will have to restart it after you enable network simulation for the first time.

3. Select 3G speed and Good Signal Strength, and then click Apply.

image

4. Click the Back button on the phone to go back to the home page in the app.

5. Select a different album, because the previous one must have been cached, and click Go to explore it.
This time, you see that the pictures appear extremely slowly, which would be frustrating for the user if it occurred in real life.

clip_image011

Luckily, the Flickr API allows you to download thumbnail images, which are ideal for our case and appear blazingly fast! You can just replace the “url_m” argument in the API with “url_t” for tiny thumbnails. When you run the app again under simulation, the images appear instantly.

Lock Screen

Let’s disable Enable Network Simulation for the time being by clearing the check box in the Simulation Dashboard. Click any image in the grid to display a slideshow of pictures. You can navigate left and right using the icons, or click the play icon to start the slideshow. At this time, you can select the Locked option on the dashboard to trigger a lock screen on the device or emulator; then you can select the Unlocked radio button to come back to the app.

clip_image013clip_image015

When you run the scenario, you will see that after the app comes back to the foreground, the slideshow has reset to the initial picture. The issue is related to the way the app is handling the Deactivated or Activated events. To validate, we can put a breakpoint on the Application_Activated event in the app and step through the code when locking and unlocking the screen. After investigating, it seems there is a problem with the slideshow initialization when the app is navigated to. We can solve the problem by determining if we are returning after a Deactivated event and ignoring the OnNavigatedTo method in SlideshowPage.

/*App.xaml.cs*/
IsolatedStorageSettings settings = IsolatedStorageSettings.ApplicationSettings;
private void Application_Deactivated(object sender, DeactivatedEventArgs e)
{
    settings["Deactivate"] = true;
}
 
/*SlideshowPage.xaml.cs*/
IsolatedStorageSettings settings = IsolatedStorageSettings.ApplicationSettings;
protected override void OnNavigatedTo(NavigationEventArgs e)
{
    base.OnNavigatedTo(e);
    if (settings.Contains("Deactivate")) // Do not reset when coming from Deactivated Event.
    {
        settings.Remove("Deactivate");
    }
    else
    {
        // Setup Slideshow
    }
}

In other pages and in the Application_Launching event, we will have to include the following statement to ensure we clear the flag in unwanted cases.

if(settings.Contains("Deactivate")) settings.Remove("Deactivate"); 

If we run the app again after these changes are made and perform the simulation, we would correctly see the same image on the screen when returning to the app!

Trigger Reminder

The last thing that remains to be seen in this scenario is what happens when a call or a reminder comes suddenly and you are in the middle of watching a slideshow play. We can click on play to run the slideshow and adjust the slider speed appropriately. While it is playing we need to click on Trigger Reminder button in the Dashboard which pops up a Reminder on the target.

clip_image017

It was unsettling to note that even when the reminder was up, the slideshow still played continuously in the background! That is a bad user experience and we need to handle the Obscured event to pause the slideshow when the reminder comes and Unobscured event to restart the slideshow. After this change, when we run the app with the simulation and it works perfectly.

/*SlideshowPage.xaml.cs*/
bool obscuredPlayFlag = false;
 
public SlideshowPage()
{
    (Application.Current as App).RootFrame.Obscured += OnObscured;
    (Application.Current as App).RootFrame.Unobscured += OnUnobscured;
}
 
void OnObscured(object sender, ObscuredEventArgs e)
{
    if (Play.Visibility == System.Windows.Visibility.Collapsed) 
    {   
        // Check if Slideshow is active.
        Pause_Click(sender, e); // Pause the Slideshow.
        obscuredPlayFlag = true;
    }
    else
    {
        obscuredPlayFlag = false;
    }
}
 
void OnUnobscured(object sender, EventArgs e)
{
    if (obscuredPlayFlag == true)
    {
        Play_Click(sender, e); // Resume the Slideshow.
        obscuredPlayFlag = false;
    }
}

Some useful scenarios to think about and validate

We just saw a sample scenario of a typical photo app where developers can benefit from using the Simulation Dashboard. There are many other scenarios and typical cases which are affected by the real-life conditions in which the apps get used, and you should keep these cases in mind while developing your apps:

· Handling phone interruptions while scrolling in an e-book reader app

· Buffering large media to help in low network speeds for a video app

· Validating a location-based app with network changes in the middle of use

· Validating a wallpaper changing app’s functionality using Lock Screen simulation on emulator

· Ensuring that a location tracking app runs even under Lock Screen deactivation on emulator

· Testing a network app to ensure it does not crash in cases of No Network

· Ensuring that data transfer resumes gracefully in case of network interruptions

· Validating whether calls to a web service will fail with timeout in cases of poor network

· Using network simulation to identify energy consumption of an app in different network conditions

8 Comments
You must be logged in to comment. Sign in or Join Now
  • wp7Dave
    36 Posts

    In future versions, could the "No Network" setting change the NetworkInterface.GetIsNetworkAvailable() method to return false as well? That would make it easier to test offline mode. Currently the network is not functional with this option but the GetIsNetworkAvailable function returns "true."

  • Check out the best features of windows phone in 2013 mobileupdate24.blogspot.com/.../the-most-expected-upcoming-features-of_27.html

  • Top7 windows mobile are now in developing...Some are in new look...top7mobiles.com/.../top-apps-for-windows-phone

  • Korn1699
    114 Posts

    @StevieBallz is there any guide on how the network connections should be setup?  I think an am going for a reinstall of Windows this weekend since a lot hasn't been reinstalled yet and a few things haven't worked since I tried the refresh option.

  • Well, HyperV is a HyperVisor that sits beneath even the hosting machine's OS to a certain degree which obviously complicates things quite a bit. And you're correct in that the WP8 SDK seems to have been "finished" rather under pressure but they could not have waited any longer - having the OS out there but no SDK whatsoever would just not have been a viable option.

    I also had problems with network connectivity on my Windows 8 tablet after installing the SDK. Everything took forever to load after restarting the machine and sometimes Apps didn't work at all. The issue in the end turned out to be with the Network metrics concerning which interfaces to use to connect to the internet. I prioritized them correctly (e.g. Windows 8 no longer tries connecting to the internet through the Emulator interface) and since then I've had no more issues.

    In the end I'm pretty much in the same boat as you are. My only device supporting the Emulator currently is my Tablet because all other machines are Core2Duo/Quad. I mainly Dev in a Win 8 VM on the PC constantly syncing the solution to the tablet and to try out fixes I run them there (pretty nice to have multi touch available in the Emulator). Perhaps I'll switch to simply debugging on the Phone instead of using the Emulator which pretty much avoids the SLAT problem.

  • Korn1699
    114 Posts

    @StevieBallz the version of HyperV in Server 2012 doesn't require SLAT (have it on an old Pentium D at work)...just Windows 8 for some reason..

    Personally, I can't stand the WP8 SDK because the whole emulator issue is terrible and not just requiring SLAT..  Not having SLAT does exclude both gaming laptops I sometimes use for development though.  

    My i7 PC at work completely broke my copy of our internal website when I had it installed.  It couldn't authenticate me to ANY of our servers through that copy of the website, although I was still able to login to windows.  Other sites on that development machine, which didn't require network authentication, still ran fine.  I uninstalled the SDK, and after a reboot, everything was working fine again (one day wasted with that).

    The only other SLAT supported PC I have access to is my gaming desktop at home.  My first attempt on installing the SDK there had caused the emulator to constantly crash.  There is VPN software on that machine that I have to be able to use.  I had to do a "Windows Refresh" to fix all store apps being broken on that machine (which caused a bunch of other apps to not install again).  I had the SDK working fine on there for a while, even with the VPN software installed.  The VS2012 Update 1 killed my design view for Windows Phone apps.  I tried to do a repair install (thinking it couldn't get worse), and it killed ALL my network connections on that machine until I uninstalled the SDK and rebooted.  I was able to get it back on there, but the emulator was back to crashing.  I looked around online about HyperV network settings that needed to be changed.  That worked for a couple days (although killing the VPN), and then I lost all the connections again.  I ended up removing all the WP8 SDK settings from HyperV's network settings, and got my network connections and VPN working again.  I want to go back to trying to develop WP8 apps, although honestly, I am avoiding it because I don't want to have to go through hours of troubleshooting again just to be able to use the internet on that machine.

    I never had issues like that with the WP7 SDK or anything else I have ever used.  The WP8 SDK is the worst software I have ever used.  I really wish that Microsoft had actually taken the time to work out issues like that.  Oh, and I used to use VirtualBox a lot on there, but it looks like that won't work either since I have to have HyperV installed...

  • @Ajay not going to happen soon. They based the whole new Emulator on HyperV which only runs with SLAT and is only included in Windows 8. They would have to develop a completely new Emulator to make it happen. Given the time needed to do that I believe it would not arrive before the issue becomes a non-issue anyway.

    It's a problematic decission to base it upon HyperV in the first place but having chosen that route I fear there is not too much they can do about it now.

  • jonathan, let us develop for windows phone 8 in windows 7 please.

    and let us run WP8 simulator without SLAT. price in India is high. many developr cannot buy new pc for these.

    if India not with you windows phone has no success. whole Microsoft run on our talent