I was very honoured to be called an Expert
Educator by Microsoft. After attending an inspiring Global Forum (Barcelona
2014) and meeting 275 other Expert Educators, I really wanted to discover how
to develop your own Windows app.
After a few days (ore was it weeks?) I
succeeded in developing my own educational app: Tree
An app which was the inspiration of our own Learn-a-thon. Offering this app and
tutorial is my way to show my gratitude to Microsoft and all my fellow Expert Educators. Maybe
we can lift our knowledge to a higher level: it will be a major benefit to our
students when all teachers may develop their own apps.
First things first: there is a
distinction between developing an app to Windows Phone or Windows 8 (including
Exploring our options
Let?s take a look at our
options. After all, there are different possibilities to create an app:
1// Appstudio: offers
a very easy tool to create an app, without any form of interactivity. (http://appstudio.windowsphone.com).
2// PhoneGap: offers the option to convert a website to a native
3// Project Siena: free Windows8-app from Microsoft that allows you to create apps visually using drag and drop methods.
4// Touch Develop: this is an interactive development environment and a
visual programming language being developed at Microsoft Research. Interesting
tutorials and manuals can be found on https://www.touchdevelop.com.
5// GameSalad: freeware which offers the opportunity to develop games. http://gamesalad.com
6// Ever developed an iOS
app? This can be converted to a Windows App via Visual Studio: http://www.windowsstore.com/developers/ios
Creating a Windows Phone app using Phonegap
PhoneGap is a software package and can be downloaded free from www.phonegap.com and closes the gap between
a fully functional website and a native app. PhoneGap has been recently adopted by
STEP 1: create a website in HTML + CSS (and eventual
Example: download TETRIS: http://fmarcia.info/jquery/tetris/tetris.html
Interesting tutorials to
STEP 2: installing PhoneGap
The following steps are a bit
more difficult. You can download the
result here and directly turn to step 3.
If you decide to take the more difficult path then this requires that you install PhoneGap.
First of all you need to install Node.js at first.
1. Download and install
node.js from http://nodejs.org
2. Create a folder on your
C-drive (Eg: C:\phonegap)
Start the Command Window from your start button or menu by typing in ?cmd? into the ?search programs and files? box. Press Enter.
Navigate to the PhoneGap folder by typing cd phonegap
Download phonegap by typing: sudo npm install -g phonegap
PhoneGap is now being downloaded.
Type this command: phonegap create myapp
Open the folder: cd myapp
Look for the folder ?myapp? which can be found in Windows Explorer.
STEP 3: Put the HTML site in the folder www
Adapt the logo in the folder /img and /res. Adapt logo.png too.
Now look for the file ?config.xml? in the folder, and adapt the name, description and author as follows:
Modify the name, description
and author of the app in config.xml:
Create a zip file of the folder myapp.
STEP 4: Building the app
Now go to your web browser and navigate to https://build.phonegap.com
On the PhoneGap website, you can register a free
account limited to one app. If you want to build more apps, a paid account is
After registering and logging
in, you can upload the .zip file.
Click on Upload a .zip file and browse to the zipped app (see step 3).
The logo and name of the app
are appearing. The app can still be deleted.
Click on Ready to build.
The app can be downloaded for
Windows Phone, iOS and Android.
To Windows Phone this results in a xap file. By emailing this file (or sharing it by OneDrive) to you
device you can install it on a Windows Phone.
However, when you want to
distribute your app worldwide, you can better put it in the Windows Store. The cost of a membership
Publishing an app in Windows store
Navigate to https://appdev.microsoft.com/StorePortals/en-us/account/signup/start and hit Register
Log in using
your Microsoft account. Your account needs to be verified on computer.
Verify your email address. Click Next. You?ll receive your code
directly by email.
Choice the desired package en
After paying, you can access
your account. At first you need to choose how you want to be paid. If you want
to offer you app for free, you can skip this step.
If we?d be creating a Windows
8 app, we needed to submit the app in the Dashboard. But!
We?re creating a Windows
Phone app, so we need to navigate to Windows
Phone Dev Center on http://dev.windowsphone.com.
Click Dashboard and next .
Click ?1?: App info.
Enter the App name and choose the category.
Choose the base price and on
which markets you want to distribute.
If you want to sell the app,
you need to add financial info (tax, vat and financial info).
Click 2: Upload and describe your package(s)
Click Add new. Make sure you installed Silverlight on your computer
(download for free on http://www.microsoft.com/silverlight/default.aspx. If not, your app can?t be uploaded.
Browse to the XAP file, builded and downloaded on build.phonegap.com (previous step).
The Package is shown: name,
version, size, language, etc.
It?s possible to add certain
- Description (important!): add a very clear description to ascertain your app will be found
by search engines.
Specifiy keywords and upload an app
icon (MUST be 300x300px) and screenshot(s)
(MUST be 768x1280px or 1280x768px).
Press on the grey tiles to
browse your images.
Optionally in-app advertising
and other services can be added.
Click Review and submit to review the app.
After reviewing, click Submit.
The app will be tested by the Microsoft team. This will
take up to 5 business days. After this period you will receive an email. The
status of your app can be viewed on the lifecycle page.
In the USA it takes 24h to
pass certification. Outside the USA up to 72h.
Congratulations, your app can
be found on http://www.windowsphone.com !
The result can be found on http://www.windowsphone.com/en-us/store/app/tree-key/d48779d3-35e9-450d-bf0e-efeb2f0425a4
Sharing is caring
Liked this tutorial? Please share it!