Download Lumia 925 Emulator Skin

Have you seen this feature demo video of Avirall? (jump to 00:50)

Do you like the emulator? This is Visual Studio Windows Phone Nokia Lumia 925 emulator skin, i created :D.

Nokia925_UP

You can also create your own app demo video with this skin! Download this skin from here.

Instructions about how to apply skin to your emulator are here.

Happy skinning, oops!

Talk About Your App

As an app developer you are supposed to reach out to your prospective users as much as you can to let them know about your app. Social networks – FB, Twitter, Reddit, etc. are some great tools to spread the word. I also think creating a small video about your app and publishing it to YouTube is an effective way to let your users quickly get to know about your app. These are some fantastic posts to talk more about how to promote your apps:
Making A Love Connection? Build Relationships To Promote Your Apps
The Simplest Things People Don’t Do To Market Their Apps (But should)

In this post I will share some points about creating video.

The simplest and very effective way of creating a video is capture the physical phone screen while you are using it. That’s it. You can upload it as it is with your commentary in it. If you want to be fancier, there could be many other pricey options – e.g. hiring an advertising agency. Here I would talk about a no-cost (but a little extra work) option for creating attractive videos showcasing your app. The two videos, listed below, are created with following tools and processes.

In this setup I chose not to go for a video on physical device screen because i wanted to keep focus on the functionality and information about the app, rather than telling about how to use the app. I used emulator instead. It’s easier with emulator and it also gives more control to capture the desired section on the screen.

Prepare Emulator

You could choose to use the default generic emulator image to show your app in. Following is the generic emulator skin which comes with the IDE:

WM7_Skin_Up

Or, to make your video more personalized/interesting, you could use a custom skin. You can customize skins at your heart content, for example, for one video I created this skin:

Nokia925_UP

More about the above skin here.

Once you have taken care of the device skin, have your app installed on the emulator. Don’t forget to prepare example data and load with the app, if your app is data heavy and you want to showcase the same for your users. Set up a nice background on your desktop (it could be your app’s or company’s branding). Background is required because in this case you would have the complete HD movie created along with the background. The least HD movie size is 720P, so apart from the device there would be a lot of background in the video.

Animations and 2D Graphics

Silverlight is an ultimate tool to create fantastic 2D animations. You need to come up with a story as to how you would want to present information to the audience. Think about dynamics of the information, their movements, exit, and entry. Plan 5-10 slides. Create animations and transitions in Silverlight desktop application. If your animations and graphics are showing on the same screen with the video, first capture the video and using VideoBrush add the video in the Silverlight application. Fine tune the timing of the video while test running the app. You can see in the videos below, one of the video is a completely Silverlight video captured on screen and other is a mix of Silverlight and pre-captured video. You can have your titles, credits, and subtitles in the app itself with your custom animations.

Raw Video Footage

I captured screen with Expression Encoder 4 (I hear that the studio has been discontinued, but there are other tools available to download with which you can effectively capture screen). Set the capture size to minimum 1280X720 to play well in HD. Run the app on emulator, or run your desktop Silverlight application and capture the video.

Voice Over

You might want to include commentary in your video. It might be your own voice or you can choose to use text to audio tools. In both the cased you will need a script to read. Prepare the script  by running and re-running the video and match your speed with the video speed. The best free tool to prepare audio is Audacity. You can add commentary, music, effects in a single with multiple tracks. You can adjust the speed of your audio and match it with your video output.

Fuse Video And Audio

Now remains the simple task of bringing Video and Audio together. In this step you would make least changes to video or audio so a simple video editing tool like Movie Maker is enough. Export the video in MP4 format with the source dimension locked.

Examples

Windows Phone: Progress Indicator Plus

In Windows Phone, progress indicator on System Tray is a quick and easy way to indicate that some activity is running in the background. It is all right if you want to indicate progress from a single thread. What if you have multiple threads running and all need to use progress indicator?

I created a ProgressBarManager wrapper class to handle multiple thread progress indication scenario. This class can work in both scenarios – indeterminate or determinate, but in case of multiple background processes the preferable way is indeterminate. The accompanied progress text from different processes can show progress value in the text. Following is example screen shot of ProgressBarManager in action.
MultipleMessage

Usage Example

At class level define ProgressBarManager:

        ProgressBarManager ProgressBarManager = new ProgressBarManager();

In constructor of the form where you wish to show progress bar with multiple clients, instantiate the class like so:

        SystemTray.SetProgressIndicator(this, new ProgressIndicator());
        ProgressBarManager.Hook(SystemTray.ProgressIndicator);

Update ProgressBar from different processes with the ProgressBarManager.Show(). In this example I have a button which starts two background threads which update progress bar asynchronously. The button’s click method is as follows:

       private void button1_Click(object sender, RoutedEventArgs e)
        {
            BackgroundWorker _bw = new BackgroundWorker();
            _bw.DoWork += new DoWorkEventHandler(
                (object caller, DoWorkEventArgs workArgs) =>
                {
                    for (int i = 0; i <= 10; i++)
                    {
                        Deployment.Current.Dispatcher.BeginInvoke(() =>
                        {
                            double _val = (double)i / 10d;
                            double _percent = _val * 100d;
                            ProgressBarManager.Show(1, string.Format("2: Progress-{0}%", _percent), false, _val);
                        });
                        Thread.CurrentThread.Join(230);
                    }
                    ProgressBarManager.Hide(1);
                }
                );

            BackgroundWorker _bw2 = new BackgroundWorker();
            _bw2.DoWork += new DoWorkEventHandler(
                (object caller, DoWorkEventArgs workArgs) =>
                {
                    for (int i = 0; i <= 10; i++)
                    {
                        Deployment.Current.Dispatcher.BeginInvoke(() =>
                        {
                            double _val = (double)i / 10d;
                            double _percent = _val * 100d;
                            ProgressBarManager.Show(2, string.Format("2: Progress-{0}%", _percent), false, _val);
                        });
                        Thread.CurrentThread.Join(500);
                    }
                    ProgressBarManager.Hide(2);
                }
                );
            _bw.RunWorkerAsync();
            _bw2.RunWorkerAsync();
        }

ProgressBarManager Class

Following is full code of ProgressBarManager class:

using System;
using System.ComponentModel;
using System.Collections.Generic;
using Microsoft.Phone.Shell;
using System.Windows.Data;
using System.Windows;
namespace YourCompany.UI.Controls
{
    public class ProgressBarManager : INotifyPropertyChanged
    {
        private Dictionary<int, string> _clients = new Dictionary<int, string>();
        private bool _show;
        private bool _inDeterminant;
        private string _text;
        private double _value;
        public bool ShowProgress { get { return _show; } }
        public bool ProgressInDeterminant { get { return _inDeterminant; } }
        public string ProgressText { get { return _text; } }
        public Double Value { get { return _value; } }

        public event PropertyChangedEventHandler PropertyChanged;

        public void Show(int ClientID, string Text, bool IsDeterminant, double Value)
        {
            if (!_clients.ContainsKey(ClientID))
            {
                _clients.Add(ClientID, Text);
            }
            else
            {
                _clients[ClientID] = Text;
            }
            _value = Value;
            _inDeterminant = !IsDeterminant;
            updateProperties();
        }
        public void Show(int ClientID, string Text)
        {
            if (!_clients.ContainsKey(ClientID))
            {
                _clients.Add(ClientID, Text);
            }
            else
            {
                _clients[ClientID] = Text;
            }
            updateProperties();
        }
        public void Hide(int ClientId)
        {
            if (_clients.ContainsKey(ClientId))
            {
                _clients.Remove(ClientId);
            }
            updateProperties();
        }
        public void Hook(ProgressIndicator FormProgressIndicator)
        {
            #region setup ProgressIndicator
            Binding _binding;
            _binding = new Binding("ShowProgress");
            _binding.Source = this;
            _binding.Mode = BindingMode.TwoWay;
            BindingOperations.SetBinding(FormProgressIndicator, ProgressIndicator.IsVisibleProperty, _binding);
            _binding = new Binding("ProgressInDeterminant");
            _binding.Source = this;
            _binding.Mode = BindingMode.TwoWay;
            BindingOperations.SetBinding(FormProgressIndicator, ProgressIndicator.IsIndeterminateProperty, _binding);
            _binding = new Binding("ProgressText");
            _binding.Source = this;
            _binding.Mode = BindingMode.TwoWay;
            BindingOperations.SetBinding(FormProgressIndicator, ProgressIndicator.TextProperty, _binding);
            _binding = new Binding("Value");
            _binding.Source = this;
            _binding.Mode = BindingMode.TwoWay;
            BindingOperations.SetBinding(FormProgressIndicator, ProgressIndicator.ValueProperty, _binding);
            #endregion
        }
        private void updateProperties()
        {
            if (_clients.Count == 0)
            {
                _show = false;
                _text = "";
            }
            else
            {
                _show = true;
                string _m_seperator = "";
                _text = "";
                foreach (KeyValuePair<int, string> _keyvaluePair in _clients)
                {
                    _text = _text + _m_seperator + _keyvaluePair.Value;
                    _m_seperator = ", ";
                }
            }
            onPropertyChanged("ShowProgress");
            onPropertyChanged("ProgressInDeterminant");
            onPropertyChanged("ProgressText");
            onPropertyChanged("Value");
        }
        private void onPropertyChanged(string PropertyName)
        {
            Deployment.Current.Dispatcher.BeginInvoke(() =>
            {
                if (PropertyChanged != null)
                {
                    PropertyChanged(this, new PropertyChangedEventArgs(PropertyName));
                }
            });
        }
    }
}