Getting started with Windows Phone App Studio and building your first Windows Phone app

Microsoft recently released App Studio, which is a web-based Windows Phone app creation tool. Not only it is a capable tool for creating apps without any programming experience, it can also be great tool for rapid prototyping. Recently, I was thinking about creating an app for my website and blog, and thought why not give the new App Studio a try!

There are companies and individuals that have zero or minimal software development experience but they want to create apps to show their portfolio/products. Maybe you just want to create an app for your favorite local sports team. App Studio can be a great tool to get started on building your first Windows Phone app or maybe even your first mobile app!

It is very easy to get started, go to App Studio, and either select from a template or from a blank project. Templates provide pre-defined sections and menus so it is easy to customize them with your own content. This tutorial creates an app from a blank template.

AppStudio-1

Next step is to create a title, description and image for your app.

AppStudio-2

You need to create sections for your app. If you have done WP development before, each section is a panorama item. In each section, you need to give a name to the section and datasource.

AppStudio-3

Datasource can be one of these in each section:

•             RSS feed,

•             YouTube search query or channel,

•             Flickr search query or username,

•             HTML5 page,

•             Collection (which is a list of items, and each item includes a title, subtitle, image and description)

You can also customize the main and detail pages of each section. Main page is basically the top view (list of items), and detail page is when you click on an item to get more information. For example, list of YouTube videos and playing an individual video.

The layout of both the main and detail pages can be customized from a list of text, to pictures, to pictures with text, and many more.

Each detail page automatically comes with Text-to-speech, share and pin to start features enabled by default.

AppStudio-4  AppStudio-5

Once you are done adding sections, you can customize the app style, including the accent, foreground and app bar colors, and background image.

AppStudio-6

You can also customize the tile (cycle, flip or iconic), and splash and lock screen.

AppStudio-7  AppStudio-8

Finally, your app will be generated and you can download the source code (visual studio project), download the publish package (to publish directly to the Windows Phone Store), or you can install and test on your device by scanning the certificate, and then the app QR codes. This is also an incredibly useful way to use QR codes.

You can also develop on the Visual Studio project later on when you are ready to add more advanced features.

To download and install my app; first, scan this certificate:

AppStudio-cert

Then scan this for the app itself, and it will automatically download to your phone:

AppStudio-app

Here are some screenshots from the finished app:

AppStudio-11   AppStudio-12   AppStudio-14  AppStudio-13

I am also submitting the app to be published on the Windows Phone Store, so it should be on the Store soon.