Pages

Thursday, September 20, 2012

C++ Direct2D (XAML) App Walkthrough: Assets

Assets in the vanilla app include 3 different logos and a splash screen. I know from Windows Phone development that there are lots of guidelines concerning tiles. Here is a link that describes what images are required and what sizes.

Logo.png

This image is 150x150 and is used to display you app on the start screen. This file is required according to the Windows 8 App Certification Requirements:

1.4 Each app must display only one tile after it is installed

The image on an app’s tile must be reasonably related to the content of the app.
I found this lengthy article about tile design. The article mentions that if you are not doing a live tile then you only need the square tile.
Use only a square tile if your app will not use tile notifications to send updates to the user. Wide tile content should always be fresh and regularly updated. If you aren't using a live tile, do not provide a wide logo in the manifest.
This means I will not be needing a wide tile for version one. I will have to blog later about live tiles since I think they are important to drawing users back into your app. But to make my deadline I think that I am going to have to forgo a live tile.

SmallLogo.png

It took me a while to figure out exactly what this image did but I found this that describes it:
A small image shown in the corner of the tile to identify the app. For more info on how to specify the image in this attribute, see Remarks.
From what I have seen from other apps this image is one color with a white background so it can pick up the  tiles color since it is shown on the main tile.


SplashScreen.png

The splashscreen is required and for a game a splash screen can double as a loading screen. When I ran the app the splash screen was really small (620x300). This is . I am going to have to make it bigger. The settings for the splash screen is in the package.manifest file and it gives you two settings: Image and BackgroundColor. This is the code behind. VS has a nice gui to walk you though setting up the splashscreens and logos.
<SplashScreen Image="Assets\splash-sdk.png" BackgroundColor="#00b2f0"/>
It also appears that the splash screen is static so to show a loading bar you have to switch out the image with an identical image on a xaml page. This trick is demoed in a sample app provided by Microsoft.

StoreLogo.png

The store logo is required. The image is 50x50 so there is not a lot of pixels. Use them wisely.

That is the breakdown of the assets file. On to the Common folder.

No comments:

Post a Comment