Microsoft's App Studio just got a whole lot more powerful. In the latest version, you can make universal apps that run on Windows Phone 8.1 and Windows 8.1, as well as Windows Phone 8 apps – you can also include maps, music and RSS feeds. Even better, you can speed up the whole process by getting started in App Studio and then opening your code in Visual Studio.

Setting up sections

You can now create apps with multiple sections, pulling in information from Bing searches, Flickr, Facebook, YouTube, RSS feeds, Nokia Music and HERE Maps. You'll still start out by picking a template and customizing or replacing up to six top-level sections. You'll also have the option to add your own sections and pages in an “Empty App.” You can pick a light or dark template, or customize it with your own colors and create static, flipping or cycling tiles.

[caption id="attachment_52462" align="aligncenter" width="614" caption="Start with a template and quickly customize it with your own images and sections."][/caption]

To nest a section, create a menu section, pick a list or gallery layout and add pages to it. These can be the same RSS, HTML, YouTube, Flickr, Facebook and Bing pages that you have as top-level sections or they can be custom menu actions. These are more useful as part of a collection; a mini database you can bundle into the app or store in App Studio so it can be updated without you needing to republish the app.

App Studio assumes you'll be creating this on the site; you can't just point it at an Excel or database file and have it extract the structure, you have to create and name the columns one at a time. You also have to set any associated actions. For example, if a column contains an address, you can have a button that pulls up directions from HERE Maps.

Keeping it simple

App Studio is simple enough for someone with very little programming experience and it simplifies things like placing images on backgrounds and tiles. Images still need to be the right aspect ratio, but as long as they're high-resolution, App Studio resizes them automatically. You do, however, have to save each page as you're editing.

[caption id="attachment_52463" align="aligncenter" width="614" caption="Adding images for tiles and splash screens is simple."][/caption]

What you get for building the Windows part of your app is very basic. So far, it's just your Windows Phone app, scaled to fit on a larger screen. Unfortunately, you can't add a separate image to use on the Windows Start screen tile, which makes your app look out of context among the others. There will be more features for Windows apps, but the minimal ones, so far, are probably why there's a Windows Preview button you have to tap each time.

After loading the certificate that lets the app run, you can generate the code and sideload it to your phone or Windows PC using the barcode (created by App Studio) or the downloadable file.

[caption id="attachment_52464" align="aligncenter" width="614" caption="Download a package to install or submit to the Store."][/caption]

You can also create your entire app right in App Studio. This includes making the manifest by adding details in the Publisher info section; you'll need to create a privacy statement and include the publisher information for your developer account if you want it published to the official Store. It should also be noted that you'll have to create screenshots separately, since you can't do this in App Studio (you can either run it on your device or load it in Visual Studio and grab screenshots from the emulator).

Opening apps in Visual Studio

If you want to add social connections, tweak the Windows tile, create a multilingual app or include advertising, you'll need to open your app in Visual Studio. To do this, make sure you have Visual Studio and the latest version of the Windows Phone SDK installed (download here). Choose “Finish” on the App Studio site, then “Generate.” Along with the installable download package and the Publish package, this also generates a source code package. If you created an app in the first version of App Studio, it's worth going back and getting the source code again; the new release creates much cleaner, higher quality code using the MVVM pattern.

[caption id="attachment_52465" align="aligncenter" width="614" caption="AppStudio can make Windows Phone 8 apps or universal phone and Windows apps."][/caption]

Remember, you can choose Windows Phone 8 or universal apps here; they need Windows Phone 8.1 so if you don't have the developer preview on your phone, you won't be able to sideload them. If you want, you can generate the Windows Phone 8 app, then click the Generate button again to get the universal code. (You'll need to change the App.zip file name if you download both, but you'll probably want to do that anyway.)

If you don't want to go through the steps of starting your app on App Studio, you can also download the source code for the two sample apps on the site. This gives you an outline MVVM app you can use to get started, with placeholders that can be changed.

When you open your project, Visual Studio should automatically load the packages from NuGet that App Studio uses, but this doesn't always happen. You'll want to use the Package Manager to make sure you have the latest version or right-click on References in the AppStudio.UI section of your package and choose Manage NuGet Packages. For a universal app, you'll see three, four or even five projects inside Visual Studio; the Windows 8.1 and Windows Phone 8.1 projects and the shared projects are always there.

[caption id="attachment_52466" align="aligncenter" width="360" caption="AppStudio creates all the projects for universal apps, so you can start with a Windows Phone app and add extra features for Windows 8.1."][/caption]

Planning ahead

Plan ahead for the code you'll add in Visual Studio. If you include a Twitter feed, mock it up in App Studio so you can see the layout, then go in and change the data provider to Twitter in Visual Studio. Similarly, it's easier to add the publishing information on the site, so you have the manifest ready when you submit to the stores.

If you're going to include ads, turn on the ad option in App Studio. This will allow you to enable ad units on individual View XAML files in Visual Studio. Locate App Studio's AdControl code, but keep in mind that it's commented out, so you need to uncomment it and then put in your own AdUnitID and ApplicationID in the code (replace the demo values which are adunitid="Image480_80" applicationid="test_client”).

If you don't like the placement of the AdControl, drag it to a new position in the Visual Designer. You won't see live ads in the emulator, just test versions (to see real adverts, you'll need to build your app and sideload it onto a device).

[caption id="attachment_52467" align="aligncenter" width="614" caption="Uncomment the AdControl code and add in your own pubCenter values to include ads in your AppStudio app."][/caption]

To localize an app with multiple languages, open the AppResources.resx file in the Resources folder of your project source code. On the project's Properties page in the Supported Culture box, select whichever languages you want to use for the UI.

Visual Studio will create a new resource file for each supported language that is a duplicate of the AppResources.resx default language resource file, renamed using the locale code, such as AppResources.de-DE.resx for German and Germany or AppResources.de-AT.resx for German and Austria. Edit each language file to put in the correct UI strings. Now, when you build, your app should be multi-lingual.

The new version of App Studio makes more powerful apps than the original, but they're still basic. Opening the code in Visual Studio means you can get started with an app quickly, including adding resources like tiles and icons. In a nutshell, the new App Studio lets you get cracking on the interesting code more quickly.