Live tiles

Applies to Windows and Windows Phone

Start screen with live tiles for Mail, Weather, News, and other apps

Live tiles are a key part of the Start screen and the modern experience of Windows. They provide up-to-date content and notifications. Live tiles embody the Microsoft design principle of being fast and fluid. Users can see updates and real-time information from their apps all from their Start Screen, enabling them to quickly review new information and engage with apps even before they open the apps.

Live tiles in Windows

A tile is an app’s representation on the Start screen and it can be either static or live. A static tile displays the default content, which is generally a full-tile logo image. A live tile, however, can present new and valuable content that invites the user to re-engage with your app. You can implement either a simple badge or live tile notifications to draw in your users.

Static tile and live tile for News app

Frequent updates in the form of tile notifications tell the user that the app is connected and is receiving fresh, live content. The cadence of tile notifications will depend on your specific app scenario. For example, a busy social media app might update every 15 minutes, a weather app every two hours, a news app a few times a day, a daily offers app once a day, and a magazine app monthly. If your app updates less than once a week, consider using a simple tile with a badge to avoid the appearance of stale content.

Notification badges are ideal for apps that support short summary notifications, such as a short message service app. You can use badge numbers to communicate things like status or the number of texts received since the user last launched the app. If your badge is likely to always display a number of 50 or higher, then consider using a system glyph which communicates status instead of a number.

Tile notifications should be relevant to the user and should be engaging and informative. A notification is an invitation to the user to launch the app for more details or to perform an action.

Users can resize tiles to different sizes. You can adjust live tile notification styles for the different sizes. For example, an image may be stunning on a large tile but a simple notification may be more effective on a medium tile. Consider each of the tile sizes and design live tile features accordingly.

Innovation with live tiles

Great British Chefs app wide live tile and Windows Store wide live tile

The content that is shown within a live tile can vary dramatically, from simple notifications to images to excerpts of longer content that encourage users to explore further by opening the app. We encourage designers and developers to take advantage of the visibility and timeliness of content that a live tile offers.

Characteristics that make a live tile attractive are:

  • Frequently updated content that makes users feel that your app is active, even when it’s not running.
  • Personalized or tailored updates that use what you know about the user, such as interests that the user specifies through app settings.
  • Content that is relevant to the user's current context.

Examples

Monsters Love Candy

The Monsters Love Candy game uses the entire tile to showcase its brand. The wide tile shows the XBOX banner, vivid art from within the game, and a prompt to explore and unlock more content inside.

Two views of the Monsters Love Candy app wide live tile

 

At smaller sizes, the Monsters Love Candy live tile is readable and dynamic. It first displays character art, then scrolls to text that reminds players there is still more to explore.

Four views of the Monsters Love Candy app medium live tile

 

News Bento

News Bento, a personalized news app, showcases new stories on a variety of live tile sizes. News Bento is great at aggregating content from sources that its users care about, so showcasing the source of each story on its live tile both draws attention and increases the user's trust of the app.

Two views of the New Bento app wide live tile

 

The app uses imagery from the news article in the large and wide large tile sizes. At a smaller tile size the source and headline of a story spans the tile. The iconic News Bento blue background makes it easy for users to pick out the app among other tiles, even while displaying varied content.

Two views of New Bento app medium live tiles

 

Related topics

Guidelines and checklist for tiles and badges

 

 

Show:
© 2014 Microsoft