CIS105 App Development Project Page - Spring 2014
On Monday, April 15th, App Studio and the Windows Store had some major changes. The Windows 8.1 app types is now accepted into the store. I am also hearing reports that some students are having trouble uploading the legacy 8.0 phone project .xap files. If you have this problem, try this: (1) use Firefox to generate and download your app (2) make sure you have replaced all placeholder content, including the splash screen and lock screen content with either your own images or images from the App Studio Resources, or (3) regenerate your project using the 8.1 universal project type and submit the windows download packages to the Windows store (not the phone store). Please report upload failures to me at firstname.lastname@example.org with your publisher name, app name, and a screen shot of your error message. Don't forget to report successful certifications to:
Windows Phone App Certfication Reporting Link
Windows 8.1 Store App Certification Reporting Link
List of Certified Apps from This Semester (Leaderboard)
Windows Store and Windows Phone Certification Requirements
Office and Lab Hours Tempe Campus
For virtual office hours and remote support, please download and install Team Viewer (http://teamviewer.com) so I can see your computer and help you. Then e-mail me and if I am available I will try to help you.
Office and Lab Hours West Campus
Create a Microsoft account (used to be called "Windows Live ID"). If you already have one through Hotmail or Xbox you can use that if you want.
Create a "DreamSpark" account at http://www.dreamspark.com
Get the token for a free developer account and save it where you can find it later
Create a developer account at http://dev.windowsphone.com
use the token you got from DreamSpark.com so you don't have to pay the $19 charge
Note! Your "publisher name" is the sort of the name of your company, so have fun thinking of something personal, meaningful, and catchy. This can be changed whenever you want so don't stress if you aren't feeling particularly inspired at the moment
Create an App Studio account at
Optional for Aspiring Technologists
Some of the extra credit can only be done in Visual Studio running on Windows 8. We will have a couple of computers available in the lab but you'll be much more productive using your own computer. If you decide to go the extra mile, these additional steps will get you there.
Creating, marketing and supporting an app you recreated is highly rewarding and can be a big differentiator in your job search. Most beginners think that the bulk of the work is in the "programming" of the app. The reality is that there is as much if not more work that goes in to the design of the app, artwork, and other creative elements needed when you submit your app to the store for certification. In this project you will make a simple "productivity" or "news" app that consumes either online content such as YouTube video, blog feeds, Pinterest (via rss), Bing search results, and Flickr image, and/or can display custom image and text content that you create yourself. Once you complete the first release of your app, you will submit it to one or both of the Microsoft mobile app stores for certification and publication.
App: small limited-purpose program primarily for use on mobile devices. Typically is intended for use with a touch interface, but may be optimized for desktop use, particularly in the case of Windows 8 apps
Store: searchable online app marketplace hosted by major technology brand such as iTunes, Google Play, and the Windows Store that provide a marketing and distribution infrastructure for app makers. Stores typically pay their costs by taking a percentage (30%) of the earnings from paid apps sold through their stores. Currently there is are separate stores for Windows Phone apps and Windows 8 apps.
Certification: process used by the store to make sure that the apps submitted to the comply with store guidelines, work as advertised, do not contain maliscious code, and won't break the devices they are installed on. Certification includes automated testing and manual testing by a human.
XAP ("zap") File: a compressed folder containing all of the content for a Windows phone app. The name is taken from the file extension of the file which is .xap. The .xap file is called the "publish package" on the App Studio website and is made automatically by Visual Studio every time you "build" or "rebuild" the app. The .XAP file is what you submit to the Windows Phone store for certification.
Appxupload File: a compressed file folder containing all of the content for a Windows 8 Store app. "Appxupload" is the file extension, the name of the file changes based on which version/build it is. The Appxupload file is what you upload to the store for certification.
App Studio: a web-based development tool for making simple Windows Phone and Windows 8 apps. The URL is http://apps.windowsstore.com .
Visual Studio: a professional client software application that can be installed on a computer running the Windows operating system that is used to create, modify and package windows applications, including Windows Phone and Windows 8 apps. The retail cost of Visual Studio 2013 Ultimate is $2500 but students get it free from DreamSpark Premium. Visual Studio 2013 will run on Windows 7, however it must be installed on a computer running Windows 8 to be used to make Windows Phone and Windows 8 apps.
Paint.net: a free graphic-editing program for Windows that can be used to make and edit the image files used in app creation and marketing including logos, tiles, backgrounds and promotional images.
Promotional images: small rectangular graphic tiles used in various views in the store to sell apps. Promotional images are not part of the actual app but are uploaded as part of the store submission process
Tile: square graphic icon that appears on the the phone start screen or Windows 8 start screen used to launch/start an application. Tiles can be set by the user to three or four different sizes and shapes, and in order to enable that capability the developer has to provide tile images for each size/shape.
Logo: an art image that represents an app "brand". The logo typically appears on all tile, splash screen and promotional images.
Splash screen: a graphic image that appears while your app is loading. It will typically contain your logo but may have just a text message saying that your app is loading and wait a few moments...
Lock Screen: an image provided by a phone app that
appear when the device is locked. For Windows Phone this is an option,
but it can remind people to use your app.
Build (verb): the process of compiling your app ie: converting the "text" programming language (also referred-to as source code) into something that the computer can run (object code). You "build" or "rebuild" your application every time you click on the green "run" arrow within Visual Studio. App Studio "builds" your app when you click on the "generate" option.
Build (noun): similiar to version and tracked in version numbering at 0.0.x.x. Build numbering is more important in team projects than in individual projects.
Release (verb): making your app available to the store. Sometimes it is good strategy to wait several days or longer to release an app after it has passed certification (like just before a weekend or holidy), particularly if the store promotes new apps.
Release (noun): Each time an app is updated in the store the new "version" is referred to by it sequential order of being released to the store ie: Release 1, Release 2, Release 3, etc.. This is particularly true in your apps dashboard "timeline" where you track downloads and usage and the releases appear as milestones.
Version: an internal tracking number that changes for each change to make to an app. Version numbers may relate to Release numbers, however an app may have a number of versions before the app is submitted to the store. Version number typically have four sections ie: 18.104.22.168. The number to the left is for major updates, the second number for minor update, the third is for packages, and the fourth is for builds. The numbering is not automatically enforced in the developer tools; the developer has to decide how and when to use versioning.
Publisher Name: a unique identifier/brand for the developer. It is often the name of a software company, and for small independent developer serves as the name of the developer's "company", although a single developer may have different publisher names if he/she wants to segregate apps with widely-differing audiences.
MVP (Minimum Viable Product): the smallest amount of usability, functionality, and appearance to make your app useful and interesting
Screen Shots: photographs of your app in-use that appear in the app's store page. A minimum of one screen-shot is required, with a maximum of eight. On a Mac it can be captured using command+shift+4, on a PC is windows key+prntscreen (creates folder in your local "Pictures" directory with the images inside)
Monitize/Monitization: making money off of an app through either ads, direct sale of the app, or in-app purchasing
Hook, Convince, Call to Action: the three elements of an effective app marketplace / store description.
Conversion: changing from being a shopper to a user. Usually expressed as a ratio of the people who viewed your app marketplace page to those who decided to download your app. One to three percent is typical. Ten percent is great. Fifty percent is amazing.
Velocity: the number of downloads over a given time; higher is better and high velocity improves your ranking in store searches
ASO / App Store Optimization: techniques for increasing your search ranking in the app store
Certify your first app: 100 points
Certify your second app: 50 points
App Business Fundamentals
App Marketing and Strategy
Phone Project Workflow
Do a little market research in the Windows Phone store to see what apps are already in the store around the topic you are thinking of. If there are already 50 "news" or "fan" apps on the topic you are contemplating, then you may want to pick another topic. If there are only a few however, then see what they are about and what you can do better or differently. Sometimes it will be content, other times you might just do a better job of marketing. Also look for leading "complementary" or competing apps. For example, if someone is likely to use some popular app (say Instagram), you could build an "Instagram Guide" app that you can use the Instagram search term and when people search for Instagram they will find your app too.
Jot down a few ideas for your logo. Be careful about using well established logos and brands because you might find your app removed from the store if the brand owner complains. Generally if you are making a "fan" app you can use team or brand logos without fear. Search Bing images or TheNounProject for a simple graphic to use as your base image, or if you have the time or skills you can make your own logo using the drawing tools in Word or PowerPoint, or an graphic design tool or your choice.
Reserve your App Name in your store developer account. If you aren't sure you can reserve multiple versions of your name and then release the ones you end up not using when you submit your app for certification.
Create your logo. You might have to try a couple of different versions before you are satisified. Don't overly obsess about your logo. You can always refine it in subsequent releases.
Sign into App Studio and select the "Start Building" icon. Create an "empty" app.
Add sections appropriate to your app's purpose and subject matter
Modify and edit the theme colors if it will improve your app
Select the tile "style" and edit the tile titles content and images so it looks polished and professional in all three tile views NOTE: if you leave the default text and images in the Tile and Publish Info tabs you will likely fail certification
Edit the Publish Information including the logo image and description making sure to change all place-holder text
Review your app and snip a "screen shot" of one or more of your app section pages (snipping tool in Windows or command+shift+4 on Mac/iOS)
Generate your app
Download the Publish Package
Log into your Developer Account at http://dev.windowsphone.com
Click on the submit icon and work through the workflow (see this video how-to)
Report completion of your app when submitted and again when certified
Art Asset Reference
Logo (App Studio Information Page): 160x160 .png format (tranparent background recommended)
Background .jpg max file size 500KB
Lock Screen: 768x1280 .jpg max file size 500KB
Splash Screen: 720x1280 .jpg max file size 500KB
Store Logo: 300x300 .png format
Phone Screen Shot : 768x1280 (portrait orientation) or 1280x768 (landscape orientation) .png format
Where to find the developer token on DreamSpark.com
How to Edit and Resize Images using Pixlr (for Mac users and PC users)
How to use Pixlr.com to make an image with a transparent background (for Mac and PC users)
Creating a custom logo from an Internet image using Paint.net
How to Make Background and Splash Screen Images using Paint.net
How to make the "screen shot" in App Studio that is required to submit your project to the Windows Phone Store
How to Use PowerPoint 2013 to Make Tiles and Promotional Images
How to Make an App Using App Studio
How to Associate your Windows 8.1 App to the Store
How to Submit Your App Studio Phone App to the Store
Submitting your Windows 8 app to the Store
How to Report the Completion and Certification of Your App
How to use Pinterest as an RSS feed to your app
How to use the different tile types in App Studio
How to put ads in your apps
Windows 8.1 App How-To (App Studio)
How to associate your Windows 8.1 app to the Store
New! How to submit a Win 8 Store App for certification
Windows 8.1 App Project Workflow
Project Reporting and Submission
Windows Phone App Certfication Reporting Link
8.1 Store App Certification Reporting Link
Downloads and Resources
Paint.net (image editing software for Windows)
Pixlr Browser Image Editor (for Mac or Windows)
The Noun Project (thousands of icons for free if you cite or cheap if you don't want to cite)
App Madness Challenge (get $50 & $100 cash cards for certified Windows 8 apps)
Complete online course on App Store Optimization
Common Problem Solving
I am having trouble verifying my student status on the DreamSpark.com website or
I never received the e-mail from DreamSpark when I tried to verify through my
Solution: contact Professor Carlin or Randy Guthrie to get a code, then use the "I have a code" method of verifying
I am trying to create a developer account and it is asking me to verify my
Microsoft Account using a code, and the code I got on DreamSpark isn't working
Solution: The confusion here is that your Microsoft Acccount (that used to be called a Windows Live ID or Xbox Account) is about creating a central identify on all Microsoft websites and products, and not about being a developer. The Micrsoft Account has a verification process that is separate than the Developer account verification process (yeah I know it's not the most seamless process you could imagine). The DreamSpark code is used when setting up your developer account, not your Microsoft Account, and you enter it in a field called "promotional code" where the $19 cost is displayed. The Microsoft Account (Windows Live ID) verification code is sent to you either by e-mail or text message when you click a button, depending on what contact method you specificed. You are usually prompted to enter it when using a public computer like in the lab. Sometimes the e-mail containing the code gets blocked by your e-mail provider. This happens more often with gmail than with other e-mail solutions. If you can't get the code, try going through the process on your personal computer. If that doesn't work, then the fastest way around it is to just create a new Microsoft account. Alternatively you can contact Microsoft Live Support
Phone Developer Account sign-up doesn't recognize that you are a student
Solution: Sign into Dreamspark.com, navigate to app development>Windows Phone 8 Learn More> & click "map account" and then retry making your developer account at dev.windowsphone.com
When I put in my credit card info Microsoft charged my account $1.57.
Solution: Part of the account validation process is for you to look up that charge and enter it into an information field. As soon as you put in the correct charge amount, the charge is reversed.
I don't know what to do after my app is complete in App Studio
Solution: Submit your app for certification at dev.windowsphone.com as shown in this video: https://vimeo.com/87248531 . Written instructions are follows:
- take one to eight screen shots of the main pages of your app: cmd+shift+4 for a Mac or use the snipping tool for PC (search using the term "snip"). Select only the lit part of the screen not the edge of the simulated phone hardware itself. Edit the pictures so they are 768 x 1280 pixels dimensionally. PCs need to use Paint or Paint.net; Macs can double click on the image to launch the tools utility, or your can download Gimp or use
- generate your app on the apps.windowsstore.com website
- click the Download Publish Package" to your local computer. The file name will be WPAppStudio.xap ( we call it the "zap file" for short).
- sign into dev.windowsphone.com & click on the "submit app" icon. If you only see the "join now" button, then you need to create your developer account first. Click on the box with the number one on it and fill out the requested information. Then click on the box with the number two on it and (1) upload your .xap file (the Publish Package) and after it uploads, you can the content (descriptions, search terms & images) for your app's page in the Windows Phone Store. Click save when done. Ignore the optional steps.
- Review and submit your app
- Log back into your developer account every 12 hours or so and go the dashboard to check if your app has been certified. If it has been, then report that your app is complete by filling out the survey form as explained here: https://vimeo.com/87155475 . Survey link is here: http://www.surveytool.com/s/S604E46D79
when I try to upload my .xap ("zap") file, I see an error message telling me
that I need to install or don't have the current version of Silverlight
Solution: If you have a PC and are using the Chrome or Firefox web browsers, close them and try using Internet Explorer. If you are using a Mac and are using Safari, you have a couple of options: 1. download Internet Explorer for Mac; 2. Install the Silverlight plug-in in Safari, Chrome or Firefox
I get errors when I try to
upload my .xap file such as: 2006: The WMAppManifest.xml file isn't correct.
ImageURI Path in the Template element is empty.
Solution: The official error list is here: http://msdn.microsoft.com/en-us/library/windowsphone/help/jj206735(v=vs.105).aspx. Much of the advice assumes you are using Visual Studio but it can still be helpful to look the list over. Generally try rebuilding your app and resubmit it. If it still fails notify your professor via e-mail and provide a copy of your .xap file and we will submit it to the App Studio team to try and pin-point the problem.
two wants me to upload an "app tile", a "background image" and "screen shots".
What are those?
Solution: The best way to understand what the information you are entering in the second step of submitting your app, go to http://windowsphone.com, then click on "Apps and Games" and then "apps" and select one of the apps listed. The large picture on the store page is the "background image" and you can also see the screen shots and the description. The smaller image you clicked on is the "Tile Image".
My app failed certification: what do I do now?
Solution: Open the certification test results, navigate to the bottom and read the tester's comments then look at the following "problems" and "solutions" to see if your problem is mentioned. If it isn't talk to Professor Carlin and she can suggest changes that might fix it. If you disagree with the tester's findings, then regenerate the .xap file and resubmit your app to the store without making any changes. It will probably get certified by the next tester.
I failed certification because my app had content from the template
Solution: When you create an app in App Studio, even an "empty app", there is often place-holder content such as a logo or a few words in the description. This place-holder content has to be replaced with your own content or you app will fail certification. App Studio does not check to see if this content was replaced by you, so you have to be diligent and make sure you haven't forgotten anything.
I failed certification because the tester thinks that my app information was
about one thing but the app appears to be about another
Solution: If you have made more than one app you might have uploaded the .xap file from your other app my mistake, or if you were using a lab computer or a computer shared by another student in this class , you might have uploaded the .xap file from another student's project by mistake. If you are still using a shared computer, delete every instance of the .xap file from the Documents, Pictures and Download folders. Re-download your Project Package file from apps.windowsstore.com and then resubmit your project on dev.windowsphone.com. You shouldn't have to make any other changes.
I failed certification because of a "pin to start" problem with my screen shot.
Solution: If your first section uses an HTML 5 datasource, there was probably a secondary "pin to start" window open at the bottom of the page. That little pop up can't be included in a screen shot and is a bug in app studio. The easiest way to fix it is to just delete that one screen shot. If you want to include that page, then you can turn off the pin to start option in order to make your screen shot. Go into that section's "Section Page" and then click the "extras" text at the bottom. In the screen that opens move the slider to disable "Pin to Start" and save changes. Then go back to the review screen and take a new screen shot without the Pin To Start pop up. Once you have the screen shot turn the feature back on.
I failed certification because my screen shot had extranous artifacts, phone
Solution: The Windows Phone Marketplace certification requirements require clean screen shots that contain only the lit screen part of the preview. The screen shot can't include the part of the picture representing the phone hardware, or the background behind the phone. Correcting this is easy. Sign back into App Studio (http://apps.windowsstore.com) and take some new screen shots of your pages, being very careful to only include the screen and not the phone. If you have HTML 5 pages that show the "pin to start" pop-up at the bottom of the screen, you can't include that in your screen shot. See the prior Problem/Solution set above for information on how to get rid of the pop-up.
My Windows 8 failed certification because my app referenced the Microsoft
Contact Dev Center Support
Randy Guthrie's Blog & Webpage