February 15, 2016 10:00 am

UWP Tile Generator Extension for Visual Studio

Windows 10 comes on a variety of form factors, which means so do your Universal Windows Platform (UWP) apps. It’s important to make sure that your app looks great on whatever device the users are tapping, typing, or clicking on—even when it’s not open.

One of the core experiences on Windows are the tiles and icons that users see on the Start Menu and Taskbar. Providing the various tile sizes will ensure that user gets the crispest looking tiles and icons which, when pinned, look right at home next to the built-in applications.

As a developer, creating the required tiles with the correct sizes whilst adhering to the guidelines can be time consuming. To save time, you can now use a Visual Studio Extension in the Gallery which takes care of all this hard work for you. With a simple right click on the image, you are able to generate all the various tile sizes and have the package.appxmanifest update, too.

Step-by-step:

  1. Add image to project.
  2. Right click on a SVG or PNG and select “Generate UWP Tiles.”

UWP Context

  1. That’s it.

solutionExplorer

packagemanifest

To get the best results:

There are a few things you can do to ensure you get the best possible results:

  1. Start with a great source so the results are every bit as good.
  2. Use SVG files, which are preferred as they scale well, but know that the tool also supports PNG files, too. If you are using a PNG, it’s wise to make sure that it is high resolution or you may get pixelated images.
  3. Ensure that your logo sits in a square canvas with very little padding. This will make sure the tool can provide tiles that adhere to the Tile guidelines.
  4. For a transparent background to your tile, ensure that it has a 1-pixel transparent border, as the tool determines the background of the tile based on the pixel at (0,0).

That’s all there is to it. With the UWP Tile Generator, you can make quick work of your tiles and icons and move on to bigger, more exciting things.

Written by Shen Chauhan (@shenchauhan), Senior Program Manager for TED Services & Devices

Updated February 15, 2016 6:17 pm

Join the conversation

  1. Thanks guys, quite a useful extension 😀 it kinda reminds me of the one built into Ionic Cli

  2. Is there a similar or equivalent extension that creates the tiles for Windows Phone 8.1 apps? When writing mobile apps, I still write them for Windows Phone 8.1 since there are still many people (including me) that have not yet upgraded to a phone model that supports Windows 10 Mobile. But either way, I think this is a great time-saver! Thanks.