Build Your First Mobile App in 1 hour with Windows App Studio

Preview:

DESCRIPTION

Microsoft App Studio is an innovative new tool to design and build a starter app for Windows Phone and Windows Store without writing any code. Whether you’re a mobile development neophyte or a savvy developer filled with great ideas but not enough time to prototype them, App Studio can help you get started by building the core of your application using multiple page templates and data sources, such as RSS feeds, YouTube videos, Flickr photos, HTML content, custom collections and more. In this session, we’ll build a live & working mobile app for both Windows Phone and Windows Store on the fly, exploring the various options of App Studio. We’ll then generate the source code and dive into Visual Studio to understand the various parts produced by App Studio and how to extend them. We’ll discuss how to add custom features to the starter app, turning our prototype into a real-world app, such as advertising, in-app purchasing and such. Lastly we’ll go over what’s involved to get the app published, how the submission process works, and where to take your app from there. If you still haven’t published any mobile apps, it doesn’t get any easier than with App Studio. Come learn how to get from “Idea” to “Publish” in just a few hours. Here are some examples of live published apps I have built with App Studio, all but one created live in front of the audience in one of these sessions: About WoW (Gamer hub for World of Warcraft players) http://aka.ms/aboutwow The Second City (for fans of the famous improve comedy theatre) http://aka.ms/2ndcity Halo Central Hub (for fans of the Halo franchise) http://aka.ms/halohub-wp8 Shadowrun Gamer Hub (for fans of the Shadowrun cyberpunk franchise) http://aka.ms/shadowrun-wp8

Citation preview

http://www.bigbaldapps.com

www.AgeofMobility.com

@ActiveNick 2005-2014

Can you build an app for my garage band?

Can you teach my kid’s class how to code?

I can’t program a VCR, but I want to build an app, can you help me?

We have a lunch meeting with a client in a half hour, can you whip up a basic app for them?

Social

Tools and Productivity

Information and Promotion

Games Entertainment

Macy’s NY Times Engadget

PGA TourAll Recipes Arsenal Blog

Men’s Health Workouts

Yelp

Las Vegas Guide

CNN

More than 1.5M App Studio users

More than 370,000 app projects

30,000+ apps published to Windows Phone Store

appstudio.windows.com 12

About WoWhttp://aka.ms/aboutwo

w

Netduino Ninjahttp://aka.ms/nninja

The Second Cityhttp://aka.ms/2ndcity

Watch Corner Gas(retired, N/A)

The Story of my First App Built with Microsoft App Studio!

Plan/Design

Use Visual

Studio to

Code App

Test/Debug

App in

Emulator

Test App on

Real DevicePublish App

in App Store

Use App

Studio to

Create App

Choose

template

Select

tiles

Select

theme

Enter

publish

info

Add

content

Sign into

App

Studio

Generate

app

Demo: Creating an app

• RSS

• HTML

• YouTube

• Flickr

• Bing

• Facebook

• Collection

• Call Phone

• Email

• Nokia Music: Play Artist Mix

• Nokia Music: Artist

• Nokia Music: Search

• HERE Maps: Directions

• HERE Maps: Address

Data Model

View

XAML

Code-Behind

Event HandlersData Model

View

XAML

Code-Behind

View Model

State +

Operations

Change notification

Data-binding and commands

• http://wpdev.uservoice.com/forums/216486

• http://social.msdn.microsoft.com/Forums/wpapps/en-US/home?forum=wpappstudio

• http://aka.ms/appstudioeducation

• http://channel9.msdn.com/Events/Build/2014/2-565

• http://aka.ms/wp81js

• http://channel9.msdn.com/Events/Build/2014

• www.microsoftvirtualacademy.com/product-training/windows-phone

• http://code.msdn.microsoft.com/wpapps/Windows-Phone-81-samples-08631ca7

www.ageofmobility.com/?page_id=961

blogs.windows.com/windows_phone/b/wpdev

blogs.windows.com/windows_phone/b/windowsphone

www.developer.nokia.com/Community/Wiki/Category:Windows_Phonewww.dvlup.com

http://conversations.nokia.comhttp://apps.windowsstore.com

www.AgeofMobility.comhttp://flip.it/95YFG

www.geekchamp.comwww.wpcentral.com

Thank You!

Slides will be posted on my Slideshare account. Demos are on GitHub.

Slideshare: www.slideshare.net/ActiveNick

Blog: www.AgeofMobility.com

Twitter: @ActiveNick

Mobile Apps: www.bigbaldapps.com

LinkedIn: www.linkedin.com/in/activenick

GitHub: github.com/ActiveNick

Email: nick.landry@microsoft.com

The information herein is for informational purposes only and represents the current view of Microsoft Corporation as of the date of this presentation. Because Microsoft must respond to changing market conditions, it should not be

Interpreted to be a commitment on the part of Microsoft, and Microsoft cannot guarantee the accuracy of any information provided after the date of this presentation.

MICROSOFT MAKES NO WARRANTIES, EXPRESS, IMPLIED OR STATUATORY, AS TO THE

INFORMATION IN THIS PRESENTATION

Legal statement

• Create a RSS data source for a section

• Specify the RSS URL to select the posts to display

<p>HTML5 is a <em>markup</em> language used for structuring and presenting content for the <strong>World Wide Web</strong> and a core technology of the Internet.</p>

HTML5 is a markup language used for structuring

and presenting content for the World Wide Web

and a core technology of the Internet.

• Create a HTML data source for a section

• Add and format your content

• Create a YouTube data source for a section

• Specify a search, user, or playlist to select the videos to display

• Create a Flickr data source for a section

• Specify a search or a user to select the photos to display

• Create a Bing data source for a section

• Specify a search term and country to select the search results

• Create a Facebook data source for a section

• Specify a Facebook page to display

• Find a hashtag that shows relevant photos

• Create a Instagram data source for a section

• Specify the hashtag to select the photos to display

• Create a Menu data source for a section

• Add MenuActions to your Menu

• Create a Collection data source for a section

• Specify your columns and types

• Edit your collection data