Useful Links: Designing and Development for Windows 8

>>> Kudos to Chris Bernard who produced this list – May help find rapidly a few design guidelines for Windows 8

Inspiration

Meet Windows Store Apps
http://msdn.microsoft.com/en-us/library/windows/apps/hh974576.aspx

App Gallery
http://windesigngallery.azurewebsites.net/

UX and UX Updates

Summary
http://msdn.microsoft.com/en-us/library/windows/apps/bg182890.aspx

Covers…

  • Resizable windows
  • Tile updates
  • Search updates
  • Charms work on every screen
  • Integrate with people and events
  • Speech synthesis
  • Alarm app support on the lock screen
  • Updates to work-item scheduling

 

Envisioning

Defining Vision
http://msdn.microsoft.com/library/windows/apps/hh465427.aspx

Responsive Design and Form Factors
http://msdn.microsoft.com/library/windows/apps/hh465400.aspx

Migration Design
http://msdn.microsoft.com/en-us/library/windows/apps/dn439353

Website to App
http://msdn.microsoft.com/en-us/library/windows/apps/hh868264

iPad to App
http://msdn.microsoft.com/en-us/library/windows/apps/hh868262

Windows 8.0 to 8.1
http://msdn.microsoft.com/en-us/library/windows/apps/dn263113
http://msdn.microsoft.com/en-us/library/windows/apps/dn376326.aspx

Category Idea Books
http://msdn.microsoft.com/library/windows/apps/hh868274

Covers…

  • LOB
  • Enterprise
  • Finance
  • Medical: In Patient
  • Health: Administration
  • Retail Apps: Social CRM
  • Games
  • Entertainment Apps
  • News Apps
  • Productivity Apps
  • Sports App
  • Shopping Apps
  • Travel Apps
  • Education Apps
  • Health & Fitness Apps

UX Guidelines

Index of UX Guidelines
http://msdn.microsoft.com/library/windows/apps/hh465424.aspx

Covers…

New

Instructional UI
http://msdn.microsoft.com/en-us/library/windows/apps/dn440595.aspx

Command Patterns
http://msdn.microsoft.com/en-us/library/windows/apps/hh761499.aspx

Navigation Patterns
http://msdn.microsoft.com/en-us/library/windows/apps/hh761500.aspx

Also…

  • Layout and navigation
  • Layout and commanding
  • Layout and page design
    • Laying out an app page
  • Animations
    • Drag
    • Edge-based animations
    • List animations
    • Content transition animations
    • Page transition animations
    • Transient UI animations
    • UI animations
  • Touch interaction
    • Touch interaction design
    • General user interaction guidance
    • Touch targeting
    • Visual feedback
    • Semantic Zoom
    • Swipe and cross-slide
    • Optical zoom and resizing
    • Panning
    • Rotation
    • Selecting text and images
    • Mouse interaction
    • Keyboard interaction
    • Pen interaction
    • Touchpad interaction
  • Scaling
    • Flexible layouts
    • Window resizing
    • Scaling to screens
    • Scaling to pixel density
  • Contract, charms and capabilities
    • App contracts
    • Global search
    • Share and data exchange
    • File pickers
    • Location-awareness
    • Print dialog
    • Proximity gestures
    • Multimedia
  • Tiles and notifications
    • App tiles and secondary tiles
    • Notifications
  • Commands
    • App bars
    • Nav bars
    • Buttons
    • Check boxes
    • Radio buttons
    • Toggle switches
    • Search box
    • Sliders
    • Rating controls
    • Select control
    • Time pickers
    • Login controls
  • Navigation
    • SemanticZoom
    • FlipView
    • ListView
    • Links
  • Transient UI
    • Flyouts
    • Message dialogs
    • Context menus
    • Tooltips
    • Progress controls
  • Images
    • Thumbnails
  • Text and input
    • Fonts
    • Text boxes
    • Login controls
    • Spell checking
    • On-screen touch keyboard
  • Roaming
  • Settings
  • Single sign-on
  • Fundamental app features
    • Splash screen
    • Suspend and resume app state
    • Auto-launching and “Open With”
    • Globalization, localization and app resources
    • Accessibility
    • App help
    • Store categories

Application Certification
http://msdn.microsoft.com/library/windows/apps/hh694083.aspx

Downloads
http://msdn.microsoft.com/en-us/windows/apps/bg125377

Covers…

  • PSD Templates
  • Human Interface Guidelines in a Downloadable PDF
  • Balsamic Templates

Controls

Covers…

  • Hub control
  • Navigation bar (top app bar)
  • Command bar (bottom app bar)
  • Search box
  • List view

 

Visual Identity

Modern Design
http://msdn.microsoft.com/library/windows/apps/hh781237.aspx

Brand
http://msdn.microsoft.com/library/windows/apps/hh465418.aspx

Layout and composition
http://msdn.microsoft.com/library/windows/apps/dn439352.aspx

Motion
http://msdn.microsoft.com/library/windows/apps/dn465804.aspx

Type
http://msdn.microsoft.com/library/windows/apps/dn439354.aspx

Icons
http://msdn.microsoft.com/library/windows/apps/dn439350.aspx

Color
http://msdn.microsoft.com/library/windows/apps/dn439319.aspx

Charms and contracts
http://msdn.microsoft.com/library/windows/apps/dn468030.aspx

Edges
http://msdn.microsoft.com/library/windows/apps/dn468031.aspx

Live tiles
http://msdn.microsoft.com/library/windows/apps/dn468032.aspx

Semantic zoom
http://msdn.microsoft.com/library/windows/apps/dn468034.aspx

Splash screen
http://msdn.microsoft.com/library/windows/apps/dn468035.aspx

Navigation
http://msdn.microsoft.com/library/windows/apps/hh761500.aspx

Windows 8.1 RTM sees over 2 million downloads by developers in just 24 hours | WinBeta

…and the last post about numbers today – So, you have a got picture of the situation 🙂

During the Intel Developer Forum (IDF) this week, Microsoft’s Tami Reller revealed that Windows 8.1 RTM has seen over two million downloads by developers in just 24 hours. Windows 8.1 RTM was released to TechNet and MSDN for app developers to get an early start at developing their apps for the new operating system update scheduled to roll out October 17th/18th.

via Windows 8.1 RTM sees over 2 million downloads by developers in just 24 hours | WinBeta.

Windows 8 rockets to 7.41% market share as Windows XP falls below 35% mark – The Next Web

Already a few weeks old (data end of August)…

The latest market share data from Net Applications shows that August 2013 was a massive one for Windows 8, which gained 2.01 percentage points (from 5.40 percent to 7.41 percent) while Windows 7 recovered 1.14 percentage points (from 44.49 percent to 45.63 percent).

via Windows 8 rockets to 7.41% market share as Windows XP falls below 35% mark – The Next Web.

How to get more ratings for your apps

(Good) Ratings and Reviews are key success factors for your apps and business.

The quality of the ratings is closely bound to the quality of the services that you are offering and how well and freshly are you offering them. This is a very vast topic that I won’t cover within this post. The aim of this post is to help you increasing the number of ratings/reviews of your apps.

Here 3 simple hints:

  • Few users rate/review apps spontaneously. For this reason, you should ensure that your app stimulates the user to rate it. Implementing such a feature is quite easy: At the end of the post, you will find some demo code for this.
  • If your app make use of “in-app-purchase” mechanisms, you can offer free or discounted goods in exchange of ratings.
  • Use your other assets (web page, blog, social network,…) to request ratings.
Code Sample – Rating Feature

NB: This code is provided as it is: You can use it and change it upon your need. Be aware that I cannot offer you a “bug-free” certification, so test it smartly within your own context.

In this case, I work with a UserControl that I place on my app main page within a fully blown, hidden ViewBox, as latest/highest control within the main Grid of the main page:

<Viewbox Grid.RowSpan="2" Grid.ColumnSpan="2">
            <Controls:RateMe x:Name="ucRateMe" Height="766" Width="1366" Visibility="Collapsed"/>
        </Viewbox>

On the constructor of the main page, I then initialize my UserControl:

         public MainPage()
         {
             this.InitializeComponent();
             ucRateMe.Check(3, 14, 3);
         }

The parameters are:

  • Number of times the app is run before the rating screen appears
  • Number of days to wait before showing the rating screen again, in the case the user has chosen the “remind me later” option
  • Max Number of times the rating screen will appear (we don’t want to be too tedious).

The UserControl (nothing fancy) XAML looks like this:

<UserControl
    x:Class="Controls.RateMe"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:local="using:Controls"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    mc:Ignorable="d"
    d:DesignHeight="768"
    d:DesignWidth="1366">

    <Border BorderBrush="#33000000" BorderThickness="0" Margin="0" Background="#CC000000">
        <Grid>
            <Grid.RowDefinitions>
                <RowDefinition Height="4*"/>
                <RowDefinition Height="8*"/>
                <RowDefinition Height="60"/>
                <RowDefinition Height="1*"/>
            </Grid.RowDefinitions>
            <StackPanel Height="60" Grid.Row="2" Orientation="Horizontal" HorizontalAlignment="Right">
                <Button x:Name="btnDontBotherMeAgain" Content="Do not bother me again" HorizontalAlignment="Stretch" VerticalAlignment="Stretch" BorderThickness="2" Margin="0,0,20,0" Tapped="btnDontBotherMeAgain_Tapped"/>
                <Button x:Name="btnRemindMe" Content="Remind me later" HorizontalAlignment="Stretch" VerticalAlignment="Stretch" BorderThickness="2" Margin="0,0,20,0" Tapped="btnRemindMe_Tapped"/>
                <Button x:Name="btnRateMeNow" Content="I'll rate you now" HorizontalAlignment="Stretch" VerticalAlignment="Stretch" BorderThickness="2" Margin="0,0,20,0" Background="Red" Tapped="btnRateMeNow_Tapped"/>
            </StackPanel>
            <TextBlock HorizontalAlignment="Center" Margin="173,62,166,107" Grid.Row="1" TextWrapping="Wrap" VerticalAlignment="Center" Height="267" Width="1027" FontSize="22">
            	<Run Text="Dear User, "/>
            	<LineBreak/>
            	<Run/>
            	<LineBreak/>
            	<Run Text="Your feedback is key to my success an evolution: I really hope that you really me and I would very much appreciate if you could please rate me and maybe write a short review, if you have suggestions on how make me better!"/>
            	<LineBreak/>
            	<Run/>
            	<LineBreak/>
            	<Run Text="Thank you very much in advance."/>
            	<LineBreak/>
            	<Run/>
            	<LineBreak/>
            	<Run Text="Your App! "/>
            </TextBlock>
            <Image x:Name="imgLogo" HorizontalAlignment="Right" Height="100" VerticalAlignment="Top" Width="100" Source="ms-appx:///Assets/Logo.png" Margin="0,20,20,0" />

        </Grid>
    </Border>

</UserControl>

Which looks visually as follows:
rateme
And finally the necessary code behind is:

using Data;
using System;
using System.Collections.Generic;
using System.IO;
using System.Linq;
using Windows.Foundation;
using Windows.Foundation.Collections;
using Windows.System;
using Windows.UI.Xaml;
using Windows.UI.Xaml.Controls;
using Windows.UI.Xaml.Controls.Primitives;
using Windows.UI.Xaml.Data;
using Windows.UI.Xaml.Input;
using Windows.UI.Xaml.Media;
using Windows.UI.Xaml.Navigation;

// The User Control item template is documented at http://go.microsoft.com/fwlink/?LinkId=234236

namespace XXX.Controls
{
public sealed partial class RateMe : UserControl
{
private DateTime _refDate;

public RateMe()
{
this.InitializeComponent();
bool _fake = DateTime.TryParse(&quot;2000-01-01&quot;, out _refDate);
}

public void Check (int FirstTimeAppearanceAfter, int DaysBeforeShownNextTime, int MaxNoOfAppearence)
{
bool _ratedOrNoRatedWished = true ;
if (Utilities.LocalSettings.isLocalSettingStored(&quot;RatedOrNoRatedWished&quot;))
{
_ratedOrNoRatedWished = Utilities.LocalSettings.GetLocalSetting&lt;bool&gt;(&quot;RatedOrNoRatedWished&quot;);
}

if (!_ratedOrNoRatedWished)
{
#region getTheDataFromIS

int _nOfTimesAppHasBeenStarted = 0;
if (Utilities.LocalSettings.isLocalSettingStored(&quot;NoOfTimesAppHasBeenStarted&quot;))
{
_nOfTimesAppHasBeenStarted = Utilities.LocalSettings.GetLocalSetting&lt;int&gt;(&quot;NoOfTimesAppHasBeenStarted&quot;);
}

DateTime _lastTimeShown = _refDate;
if (Utilities.LocalSettings.isLocalSettingStored(&quot;LastTimeTheRatingMessageWasShown&quot;))
{
string _sLastTimeShown = Utilities.LocalSettings.GetLocalSetting&lt;string&gt;(&quot;LastTimeTheRatingMessageWasShown&quot;);
bool _fake = DateTime.TryParse(_sLastTimeShown, out _lastTimeShown);
}

int _noOfTimesShown = 0;
if (Utilities.LocalSettings.isLocalSettingStored(&quot;NoOfTimesTheRatingMessageWasShown&quot;))
{
_noOfTimesShown = Utilities.LocalSettings.GetLocalSetting&lt;int&gt;(&quot;NoOfTimesTheRatingMessageWasShown&quot;);
}

#endregion

if (_nOfTimesAppHasBeenStarted &gt; FirstTimeAppearanceAfter)
{
if ((_lastTimeShown == _refDate) ||
((_lastTimeShown.AddDays(DaysBeforeShownNextTime) &lt; DateTime.Now) &amp;&amp; (_noOfTimesShown &lt; MaxNoOfAppearence)))
{
// ShowMe
this.Visibility = Visibility.Visible;
_noOfTimesShown++;
Utilities.LocalSettings.SetLocalSetting(&quot;NoOfTimesTheRatingMessageWasShown&quot;, _noOfTimesShown);
}
}
else
{
_nOfTimesAppHasBeenStarted++;
Utilities.LocalSettings.SetLocalSetting(&quot;NoOfTimesAppHasBeenStarted&quot;, _nOfTimesAppHasBeenStarted);
}
}
}

private async void btnRateMeNow_Tapped(object sender, TappedRoutedEventArgs e)
{
String uri = String.Format(&quot;ms-windows-store:REVIEW?PFN={0}&quot;, Windows.ApplicationModel.Package.Current.Id.FamilyName);
await Launcher.LaunchUriAsync(new Uri(uri));
Utilities.LocalSettings.SetLocalSetting(&quot;RatedOrNoRatedWished&quot;, true);
this.Visibility = Visibility.Collapsed;
}

private void btnRemindMe_Tapped(object sender, TappedRoutedEventArgs e)
{
Utilities.LocalSettings.SetLocalSetting(&quot;LastTimeTheRatingMessageWasShown&quot;, DateTime.Now.ToString());
this.Visibility = Visibility.Collapsed;
}

private void btnDontBotherMeAgain_Tapped(object sender, TappedRoutedEventArgs e)
{
Utilities.LocalSettings.SetLocalSetting(&quot;RatedOrNoRatedWished&quot;, true);
this.Visibility = Visibility.Collapsed;
}

public void ResetData()
{
if (Constants._ISDEBUG)
{
// RESET IS
Utilities.LocalSettings.SetLocalSetting(&quot;RatedOrNoRatedWished&quot;, false);
Utilities.LocalSettings.SetLocalSetting(&quot;LastTimeTheRatingMessageWasShown&quot;, _refDate.ToString());
Utilities.LocalSettings.SetLocalSetting(&quot;NoOfTimesAppHasBeenStarted&quot;, 0);
Utilities.LocalSettings.SetLocalSetting(&quot;NoOfTimesTheRatingMessageWasShown&quot;, 0);
}
}

}
}

Enjoy it and get some awesome ratings!