For Microsoft Kool-Aid Drinkers, Non-paid MS Evangelists written by a Senior Consultant, Passionate about Tech

All posts in Tools

ApplicationBar

Okay, we have finally made it to our final post on using the awesome tool, Metro Studio, by Syncfusion to create great assets for your Windows Phone Application.  Hopefully you got something out of the last three posts:

Metro Studio, Part 1 – Splash Screen

Metro Studio, Part 2 – Icons and Tiles

Metro Studio, Part 3 – Background

Todays focus is going to be on creating a quick application bar using the plethora of icons available in Metro Studio.  It is amazing how quickly we can create a great looking application bar for our application.  So, let’s get to it.

Before we get started, I have a little bad news.  My system crashed the other day and I lost the Metro Studio project that we were using for the previous posts.  I did, however,  have the Visual Studio project backed up, so we are good there.  I won’t be going back to create everything the way it was before, so, hopefully you are smarter than me and back up your work.  Okay, what do we do next?

Read more


PanoramExampleOne of the coolest design elements of a Windows Phone application is the parallax effect that uses the background image to make the content pop out at the user.  You probably won’t believe this, but yes, Microsoft had one of the coolest design concepts in their mobile platform before even Apple.  Apple is just getting this effect in iOS 7.  Over 2 years after Microsoft introduced it in Windows Phone 7.

Okay, so we have gone over how to use Metro Studio, by SyncFusion,  to create splash screens, Metro Studio, Part 1 – Splash Screen, and icons/tiles, Metro Studio, Part 2 – Icons and Tiles.  Now, let’s use the parallax effect in our application.  The best part is that it is already built into the controls that come with the Windows Phone SDK.  It is called the Panorama control and allows us to easily set a property defining the background image that it uses.

Read more


IconsWell, hopefully you are back because you enjoyed Metro Studio, Part 1 – Splash Screen of my series on Metro Studio, by Syncfusion, a wonderful tool that I use to create great looking splash screens, toolbars, application icons and more.  In my last post in the series, we discussed how to use Metro Studio to create a simple splash screen for a Windows Phone 8 application.

In Part 2 of the series, I will show you how to use Metro Studio to create an application icon, store icon and tile images for our application.  I will also introduce you to a great little tool that will take an icon we create in Metro Studio to produce a splash screen, application icon, store icon, tile images and more for your Windows Phone 8 application.

Windows Phone 8 Icons

Just a little primer on Windows Phone 8 icons/tiles might be necessary here.  If you already know everything there is to know about them, you could skip this section.  However, if you don’t, let me first give you a quick definition of a tile and it’s goal.  Here is an excerpt from the Windows 8 developer site reference that would also apply to Windows Phone 8:

A tile is the front door into an app. Sitting on the Start screen, it is an extension of the app and can provide much more personal and engaging information than a traditional icon. Invest in designing a great tile to draw people into your app.

Provide fresh content through live tiles and notifications to let people feel connected to your app. Make sure you help your users connect with the people and devices that they care about.

Though we aren’t going to talk about live tiles and notifications in depth, you will want to consider the design of your icons/tiles to accommodate them in the future.  Here is a great reference for all your Windows Phone 8 tile needs.  It can give you a lot of great information that will enable to you to plan ahead and create great solutions for your application.  I will, however, take you step by step through creating an application icon, a set of tiles and a store icon for your sample application.  Read more