Susan IbachTechnical Evangelist
Having never used Blend before I was amazed how fast and easy it was to create my simple app.
The source code for this Windows 8 app and many others can be found on my GitHub (http://bit.ly/17NwuAw)
After joking with a friend of mine, we came up with a fun little app that would tell you your fortune, we called it “Cookie fortune”. This oracle disguised as a chocolate chip cookie was something I thought would be easy to implement and would be a fun app to make.
After deciding on a language, C#, my next step was research. I was looking for the fastest way to create the XAML layout I wanted for my app. This is where I bumped into Blend. I remembered briefly looking at Blend a few years ago but never really sat down and used it. Reading through the documentation I quickly discovered that it had some awesome features that should really speed up the design process. One of the biggest ones that jumped out at me was the fact that it’s a visual editor, what you see is what the user will see. I loved this because it means less compiling and running just to see simple changes. Another feature that also helps in this regard is Interactive mode. Interactive mode lets you design your apps in states that would normally only be available at runtime. No more guessing how snap view would make my app look. Add in the ability to drag and drop Windows app controls onto the design surface and I was falling in love. I was even more delighted when I realized Blend for 2012 was already installed (It’s comes with Visual Studio 2012 including Express for Windows 8 and free trial versions). To get a better feel for the tool I decided to follow along with the example “Design your first Windows Store app in Blend” (http://bit.ly/FirstWindowsApp) on the Windows Dev Center website. Within 30 minutes I had completed it. This made my confidence soar. I was ready to create my Cookie Fortune app with Blend.
Below are some highlights from the development of my app, but in no way is it meant to be a step by step guide. Feel free to download the code for a more complete picture.
I started by creating a new project and selected the blank app, because of the simple nature of my app it seemed like the best fit.
My next step was to change the background image to one that I had created. I imported it as an existing item Project>Add Existing Item or Ctrl+i. Then I placed the newly imported asset in the design view, the image below shows the result.
I then added three more images, one of the cookie whole and the two pieces of the cookie when it was broke.
My plan was to hide the two broken pieces when the cookie was being shown then to hide the cookie image and show the broken cookie pieces when the user clicked or tapped. This gives the illusion that the cookie breaks in two on the user’s input. The image below shows the cookie in its whole state.
I completed the cookie’s breaking ability by writing some basic lines of code. One big thing to note here is I never had to leave Blend to write the code, I actually wrote it right inside of Blend’s code editor.
Below is the code I used to make this happen.
private void Grid_Tapped(object sender, RoutedEventArgs e)
if (ApplicationView.Value != ApplicationViewState.Snapped)
//Hide the whole cookie
CookieWhole.Visibility = Visibility.Collapsed;
//Display the broken pieces of the cookie
CookieBrokenLeft.Visibility = Visibility.Visible;
CookieBrokenRight.Visibility = Visibility.Visible;
isFirstTap = false;
//Display the whole cookie
CookieWhole.Visibility = Visibility.Visible;
//Hide the broken pieces of the cookie
CookieBrokenLeft.Visibility = Visibility.Collapsed;
CookieBrokenRight.Visibility = Visibility.Collapsed;
isFirstTap = true;
At this point I was on a roll I had dragged a dropped a few images wrote a few lines of code and in extremely little time I had a pretty cool breakable cookie. Next it was time to make the cookie dispense some wisdom. I quickly gathered together some fortunes from lists I had found on the web. I picked XML as my method of storing these fortunes and found a great example and information on how to parse the XML file using the XmlReader Class on the MSDN library website (http://bit.ly/KE9Ges). Below is a sample of the code I wrote to parse the fortune XML and add it to a the “fortune” list.
string fortuneString = null;
// Create an XmlReader
using (XmlReader reader = XmlReader.Create("Assets//Fortunes.xml"))
fortuneString = reader.Value;
After writing a few more lines of code to make the fortune text appear when the cookie was in its broken state and disappear when the cookie was whole, I now had a fully functioning fortune telling cookie. I could hardly believe how quick I managed to get to this point. Since it was moving along so quickly I decided to add a feature. I thought wouldn’t it be great if you could share your fortune with others. With Windows 8’s share feature this was a snap. While still in Blend I added the following code to easily add the share function to my app.
private void RegisterForShare()
DataTransferManager dataTransferManager = DataTransferManager.GetForCurrentView();
dataTransferManager.DataRequested += new TypedEventHandler<DataTransferManager,
private void ShareTextHandler(DataTransferManager sender, DataRequestedEventArgs e)
DataRequest request = e.Request;
request.Data.Properties.Title = "Cookie Fortune";
request.Data.Properties.Description = "Share your fortune with your friends.";
My app was almost ready for the store it only needed one more feature to be complete and to pass the Windows Application Certification Test, snap view. Again to my delight Blend made this unbelievably easy. Like I said in the beginning, Blend has a very useful feature called Interactive mode. With interactive mode you are able to design your application in various states like snap, filled and full screen. Check out this link if your would like to know more about how to use Interactive mode (http://bit.ly/11xje4d). The image below is a screen shot of Blend while in the app is in the “snap” state.
As you can see creating a simple app is very fast using this powerful tool. In under 24 hours I was able to create my application, add custom layouts for the various states and even add the share contract feature. Blend can truly speed up your development time, I know I will be using it for designing my future applications.
Check out this great documentation for more information on getting started with Blend(http://bit.ly/18ESHSH) and as an extra challenge why not try using this as a starting point for creating a “Magic 8-ball” style application.
How do you submit a new version of an app to the Windows store after you have made updates to the code?
You’ve submitted your app, and now you’ve made some improvements based on comments or feedback from users, or maybe just because you had some time to improve it. Let’s see how you submit an update for your app!
I recently submitted an app to the store and I had to remove a feature because it wasn’t working. Later I had time to go back and finish up that feature, so now I want to update my app in the store. Here’s how you do it.
Log in to the Windows Store at dev.windows.com and go to the Dashboard.
Select Details for the app you want to update
When you get to the Details page, select Create New Release
You will need to upload a new package to the store containing your new code.
Go to Visual Studio, open the .appxmanifest file, go to the Packaging tab and increase the Version number, so it indicates this is a new version of your app.
You decide how you want to increment the version numbers, but here is some general guidance:
Now go to the menu and choose Project | Store | Create App Package and follow the prompts to build your new app package. It’s always a good idea to launch the Windows Application Certification Kit on your updated app to make sure it still passes the tests with your updates.
After you have built your new package, return to your app submission screen, select Packages, and upload the new package from your Visual Studio project AppPackages folder (REMINDER: the package is the file with the extension .appxupload).
When you submit a new version of an app, you must indicate the contents of your update in the Description section.
Enter a description of the update in the Description of Update field.
Although it is not required, if you are adding new functionality to your app, consider updating other fields that describe your functionality to users. You want to ensure potential users are aware of the full functionality of your application when browsing the store. Attributes you might want to updated include the Description, the App features list, or the Screenshots.
If you wish you may change other attributes of your app such as price, age ratings, but that is not required to submit the update.
After you have uploaded your new package, completed the description of update and made any additional changes you wish to make, select Submit for Certification to submit your updated app to the store.
Congratulations you have just submitted an updated version of your app to the store!
Take pride in your work, talk to your users, find out what they would like to see improved. Learn more about the capabilities of Windows 8 apps, could you create a live tile that shows current information on the start screen. Are you leveraging Search? Share? Could you improve the snap view? Check out Azure Mobile Services. Now that you have a handle on creating and updating apps the sky is the limit!
ZipApp is a tool that claims to allow non-programmers to build Windows 8 apps quickly. Their claim seems to be accurate!
As Windows 8 matures, more tools and templates are appearing to help developers and non-developers create Windows 8 apps. Two weeks ago, I tested IdeaPress. Today, I will test ZipApp by creating an app for my sister’s running group.
The promise: “Quick, simple and faster than hell”, “You don’t need to be a programmer”
The reality: Yes, a non-programmer can build a useful app in an afternoon.
ZipApp supports creating apps with the following types of content
Not much, you should have an idea for a suitable app and the content you want to include in the app.
When you finish creating your app, the ZipApp tool will send you a .zip file containing the code for your application. You cannot just take that code and publish it to the store. You will need Visual Studio 2012 and the Windows 8 Software Development Kit (SDK) to build the package that you submit to the store. Installing the Windows 8 SDK requires Windows 8. So all that to say, if you plan to publish the app you need
Now let’s dive into the tool and see how it works!
Visit ZipApp and create yourself an account by selecting Register
You can use a Twitter, Facebook, Microsoft, or Google account to log in, or you can just create a local account with a username and password of your choice.
Once you log in you are brought to your application screen. The developer of this tool must have a sense of humour, when you first log in you get a message “Yikes! You don’t have any applications…Click the ‘Create New’ link below to create one.”
As per the instructions, select Create New to create your first application
Next you are asked to enter some basic information about your app: a name and a description.
Select one of the predefined templates, they give you a snapshot so you get a sense of how the application will look with each theme.
Select a pre-defined icon. The icon you select will appear as a logo for your app on tiles, and if you have a blog feed with posts that do not have associated pictures, the icon will appear as a default image.
NOTE: I couldn’t find a way to upload my own icon, which was a little frustrating because I had a logo I wanted to use. If this really bugs you, it is possible to open up the application code after you get the package from the tool and replace the logo. Of course that means if I use the tool to update my app later I’ll have to re-do the work of replacing the icon. Maybe down the road they will add a browse to upload your own icon.
When you have entered your information select Create to continue.
NOTE: You can come back later and change any of these settings and values later if you change your mind.
Now you are back at the application dashboard and you can see your Application in the list. To add content to the application you need to create groups and articles.
Select View Groups to start adding content.
Since you have no content you see an empty list and a suggestion to create a new group.
There are 5 types of groups you can create
NOTE: You can re-order the groups after you create them by clicking on the arrows icon
I want to include a calendar of different races. Sadly, there is no RSS feed for that, but I do have a list of them I can provide as static content
A Static group by itself doesn’t display any content, so now I have to define articles to display in the group. For each article I can include formatted text, images, and hyperlinks.
Select View Articles to start adding content to the group.
Now I can add my first article to the group by selecting Create New on the Articles page.
Now I can specify a name, subtitle, and description for the article. I can also specify an image to display above the article.
If you decide to upload an image. You must browse to the image you want uploaded, then select the image and choose Insert to add it to your article.
NOTE: The image is optional, if you don’t specify one, the app will display the icon you selected when you created the app as an image. Including images for each article makes for a more attractive application.
NOTE: I found uploading images a bit buggy. It always showed the spinning icon as if it was still uploading, but when I selected Cancel and came back to the image screen, the image was in fact uploaded and I was able to select it and add it to my article.
Continue adding all the articles you want in the group. When you are ready to add a new group just click on Groups in the left hand menu.
This is really easy, just create a new group. Select the Facebook tab and then enter the page for the Facebook page whose posts you want fed into the application.
NOTE: You don't enter the entire URL just the page name, so for example if the page is at www.facebook.com/MyGreatPage you would just specify MyGreatPage in the Page field. I made the mistake of putting the entire URL and couldn't figure out why my Facebook group wasn't appearing. I didn't get an error message, I just didn't see the Facebook group in the finished app.
Creating a Twitter group is easy. Create a new group, select Twitter and specify either a twitter handle or a hashtag you want to use as search criteria for tweets to display in your app.
NOTE: Make sure you read the small print here, if you enter a hashtag AND a twitter handle, you will only see tweets from the specified user which use the specified hashtag!
Creating a YouTube group is easy. Create a new group, select YouTube and specify either a Username whose YouTube Playlists you would like listed, or the RSS feed for a YouTube feed.
Creating a RSS Feed group is easy. Create a new group, select RSS and specify the URL for the RSS feed (e.g. a blog feed) whose content you would like listed.
After you have defined all the groups and articles for the content you want to provide in your app, it’s time to download the app. Select Download from the top bar.
At the bottom of your screen (at least in Internet Explorer, that’s where it appears) You will see a pop-up showing a .zip app you can save to your computer.
Save the file to your computer.
Congratulations you have just built an app!
Yeah, I know, seeing a .zip file, or a list of files inside a .zip file isn’t that exciting, so let’s look at how you test and publish the app.
You will need to install Windows 8 and the Windows 8 SDK to test your application and see it running.
Once you have the Windows 8 SDK installed, launch Visual Studio 2012.
If you unzip the .zip file you downloaded, you will see the files that make up your Windows 8 app. The file with the extension .jsproj is the file you want to open from Visual Studio.
In Visual Studio on the top menu select File | Open | Project/Solution and then browse to and select the file ZipApp.jsproj
You may be prompted whether you will allow Visual Studio to open projects from untrusted sources. You cannot open the file in Visual Studio unless you select OK.
The project will now be loaded into Visual Studio. You can see the files listed in the Solution Explorer pane on the right hand side.
There are two ways to test the game.
To test your app, go to the menu and find the drop down arrow beside the play button where it says Local Machine, use that drop down to select either Local Machine or Simulator.
After you select your preferred testing option, select the play button or use <F5> to start the game.
Go ahead and try it!
NOTE: For some reason when I ran my app the first time I got a message telling me “my file content does not conform to specified schema” because my description attribute was invalid. When I double clicked on the error message it opened up the AppxManifest.xml file and when I scrolled over on the line that said started with <VisualElements I noticed some weird characters in the middle of my description string “#A13;D45” stuff like that. When I deleted those extra characters, the error went away.
Once your app is up and running try it out! select different groups and articles to see how it works.
NOTE: Unfortunately Search and Share do not seem to be supported. I suppose that might be difficult to do with all the different content, but it’s a shame, because Search and Share are great features to support in a Windows 8 app. As a programmer I can always add those features after the fact.
When you want to leave the app, return to Visual Studio (<CTRL><D> takes you back to the desktop) and select the Stop button to Stop running the code.
Now that you have seen the app in action, you may wish to go back to the ZipApp website and change the theme, the icon, add additional content, or change titles and subtitles and regenerate a new copy of the app. Do this as often as you want until you are happy with the results.
This How to Publish an app post provides detailed step by step instructions on how to publish your app.
ZipApp does allow someone with no programming experience to create an nice app with good content. It does not support key Windows 8 features such as Search and Share. You do require Windows 8 and the Windows 8 SDK to publish your application. There appear to be a few minor bugs, but all in all, a very nice tool for those who want to build an app but do not have the coding experience.
Instead of building Hello World to get started learning Windows 8 development, consider customizing your own version of Pong.
“I want to build a Windows 8 app/game, but I don’t know how to get started.” “I want to do a workshop with some kids but I am not sure what to do.” “I want to do a workshop with a group who has little or no coding experience, what can I do?” “I know how to code but I’ve never built a game, how do I get started?”
“I want to build a Windows 8 app/game, but I don’t know how to get started.”
“I want to do a workshop with some kids but I am not sure what to do.”
“I want to do a workshop with a group who has little or no coding experience, what can I do?”
“I know how to code but I’ve never built a game, how do I get started?”
When I’m learning I work best with a goal in mind, and it helps if I am having fun. That’s the spirit of this how to guide.
I sat down with my 10 year old son, who is comfortable playing with computers but doesn’t really know how to code, and I gave him these instructions and with it he was able to create PokePong (which we also published, he was VERY excited to download it from the store).
But enough talking. If you or someone you know is interested in getting started with Windows 8 development, but is not an experienced coder here are step by step instructions to get started with Windows 8 apps by making your own version of pong. Here’s what you’ll find in this Step by Step guide.
Install the Windows 8 SDK. Installing the Windows 8 SDK gives you a copy of Visual Studio Express you use to edit the project. NOTE: You must be running Windows 8 to install the Windows 8 SDK.
If you do have access to a full version of Visual Studio 2012 and Expression Blend, install it before you install the Windows 8 SDK. When you install the Windows 8 SDK it will detect your copy of Visual Studio 2012 and install the Windows 8 templates into your existing copy of Visual Studio. Visit the windows dev center (dev.windows.com) to download the tools and SDK.
If you do not have a copy of Visual Studio 2012 already, then all you need to do is download the tools and SDK and it will install a copy of Visual Studio 2012 Express and Blend for Visual Studio on your system so you can start developing.
Download the Pong Game from SkyDrive to your computer. You will get a .zip file containing all the files required for Pong.
Unzip the package to a folder on your computer.
Launch Visual Studio 2012
From the menu choose File | Open | Project/Solution and then navigate to the folder where you unzipped the package.
Go to the subfolder HTML5 Template Complete and select the file HTML5_Template.sln and select Open.
The .sln file is called the solution file, when you open a solution file Visual Studio will open the solution and all the files that make up that solution. In this case, Visual Studio will open up all the files that make up the Pong Game.
You may be prompted to only open projects from a trustworthy source, you will have to select OK to continue and open the project.
After the solution is open, your Visual Studio should look something like the screenshot below. The name of the project you opened is in the top left corner and you should see a list of files in the Solution Explorer Windows on the right hand side.
Next you need to run the pong game to make sure all the code is working on your computer.
There are two ways to test the game.
To test the game go to the menu and find the drop down arrow beside the play button where it says Local Machine, use that drop down to select either Local Machine or Simulator. After you select your preferred testing option, select the play button or use <F5> to start the game.
Go ahead and try out the game. You have now successfully installed the Windows 8 SDK and the Pong game on your computer
When you want to leave the game, return to Visual Studio (<CTRL><D> takes you back to the desktop) and select the Stop button to Stop running the code.
In this workshop we are going to have some fun personalizing your own version of Pong. You can create your own paddles, ball, background, sounds, and tiles.
Here are the assets you should create and their dimensions. Don’t worry I’ll explain what tools you can use to draw your assets and how to set the size of the images.
Because you are creating a Windows 8 app you will also need to create images to display on the various size tiles and the splash screen that is first displayed when you launch the app
If you have no artistic talent, here are some royalty free art assets to help you out
I would suggest downloading the free tool Paint .NET
Let me walk you through creating a paddle image. These should be 22X75 pixels.
Start Paint .NET choose File | New from the top menu. When the popup windows is displayed enter the width and height in pixels of the image you want to draw then select OK.
Now you can start drawing! For the smaller images, you will want to zoom in using the zoom buttons so you can see what you are doing.
The toolbar on the left lets you choose how you draw your object.
As you start to draw you will see a history Window appear, this is very useful because you can use the back arrow to undo one or more steps if you make a mistake.
To change the color, you will need the Colors Windows. So go to the top menu and choose Windows | Colors
TIP: If you accidentally close any of the other windows like history, or the toolbox, you can open them again by selecting them in the Windows menu.
Choose Primary from the dropdown list and pick the color you want to use when you draw from either the color wheel or the color palette.
Have fun drawing and experimenting until you have the image you like, then save it as a .png file
Have you ever put an image on a PowerPoint Slide and there was a white rectangle around the image? To avoid that effect with your paddle and ball you will want to create a transparent background.
The easiest way to do that in Paint.NET is to select an area that you want to be transparent and then use the DELETE key to erase that area.
There is a magic wand selection tool in the toolbox. If you click that wand and then click on an area it will select everything of the same color.
Tap the DELETE key and you will see a checkerboard background, the area with the checkerboard background is now transparent.
If the area you are trying to make transparent isn’t all one color, you have two other ways to erase the background
Option 1 – Use the eraser on the toolbar to erase the background. Set the brush width to control the size of your eraser and zoom in and out for up close work.
Option 2 Use the lasso select to select an area and delete it.
TIP: You can also use Lasso select to select the part you do NOT want to make transparent and then use <CTRL>+<I> or Edit|Invert Selection from the menu to invert the selection and erase everything else!
There you have it, you are ready to build some cool art assets for some fun versions of Pong!
Now that you have the game loaded in Visual Studio you can start changing the art assets.
In Visual Studio, in the Solution Explorer window, expand the Assets folder.
This is the folder where the images are location
Now you can go to Windows Explorer and overwrite these files with the art assets you created.
Go to Windows Explorer and navigate to the folder where you unzipped the project files. Then navigate to the subfolder HTML5 Template Complete | Assets.
Replace the existing files with your image files.
Now test the game and see how it looks (Select the play button or use the <F5> key)
Depending on the type of background you drew, you may find that the image is being chopped off at the edges. There are two variables in the code called SCALE_X and SCALE_Y that determine the size of your background image in the game. You can adjust this number up and down until you like the way it looks. For my background image, setting these variables to 2.9 worked nicely.
To adjust the scale:
1. Go to Solution Explorer
2. Expand the js folder
3. Double click on the file default.js to open it in the file editor
Scroll down until you locate the variable declaration for SCALE_X and SCALE_Y
Change the values and test the game again, keep trying different numbers until you are happy with the appearance of your background on the game screen.
Now save your changes by choosing Save All in the menu. Wondering why there are two different save buttons? That’s because the solution is made up of multiple files. Clicking on the single diskette only saves the active file, clicking on the multiple diskettes saves all the files that make up the project.
When you launch the game you may have noticed you get a box with an x through it. That’s the default splash screen image. If you look at your start screen you will also notice you have a default tile for your game as well. Our next step is to change the images that appear on the tiles and splash screen of your game.
Go to Solution Explorer and expand the images folder.
The images folder contains the files for the logos that are displayed on the splashscreen and tiles.
Chances are your new splash screen image looks great but now you are thinking, ugh how do I change the background color so it looks nicer.
The background color of your splash screen and tile is set in a file called the app manifest.
2. Double click on the file package.appxmanifest to open the app manifest editor in the editor window.
3. Scroll down the tab marked Application UI, you will find a field where you can specify the background color of the tile and a field where you can specify the background color of the splash screen.
The field expects you to enter the hexadecimal or hex code for the color. A hex code is a code used to specify colors on web pages it represents the amount of Red, Green and Yellow required to create the color. Since you probably have no idea what the code is for different colors here are two ways to find the hex code for the color you want.
If you just want to look at different colors and pick one you like
· go to this Web Color Picker (www.colorpicker.com) and click on the color you want, and find out the corresponding code.
If you are a perfectionist, and want the color to match the color you put on your splash screen logo perfectly.
1. Open your splash screen logo in Paint .Net
2. Select the color picker from the Tools Window
3. Now click on the area that has the color you would like for your splashscreen
4. Now display the Colors Windows, by using the <F8> key or choosing Windows Colors from the menu.
5. The primary color is the color you just selected. Select More and you can get the hex code for that color.
One you have the code for the color you want, enter it as the background color. Don’t forget to put the # in front of the code! If you forget you will get an error message telling you it’s an invalid color.
Okay you now have a working Pong game and it looks good! Your next step is just to specify a few values in the app manifest file to get it ready to publish.
Go to the Application UI tab of your app manifest (the same file you edited to set the background color)
Set the Display name to the name you want to give your app
Populate the Description with text that describes your game.
Now go to the Packaging tab
Specify a Package Display Name and a Publisher Display Name (your publisher display name should be the name of your Windows Store account)
Save your changes by selecting Save All from the toolbar.
Your next step is to create a build of your app that is production ready!
Change the Build type in the menu from Debug to Release.
From the menu select Build | Build Solution this will create a compiled version of your application ready to package and submit to the store! You will know the build worked if you see the message
Build: 1 succeeded, 0 failed appear in the Output Window.
If you see a few warnings appear in the Output Window don’t panic your app can still be published and still works. If you see Errors, those will need to be fixed before you can publish your app.
Congratulations you have an app that is ready to submit to the store!
Of course you can do more than just change art assets, you can start exploring the code to make the game more interesting or challenging! Here are some suggestions of code changes you can try
Less than 10 lines of code
10-100 lines of code
More than 100 lines of code, but still something you can do!
If you want to publish your game, follow the links to find instructions on how to create your account and publish your app .
A team of students from Vancouver talks about the experience of bringing a Unity game to Windows 8.
This series features interviews with student Windows 8 app developers who share the lessons they learned building windows 8 applications.
This week’s interview features Team Hungry ECE Programmers, a student team from UBC Computer Engineering who built a game called Day of the Living Dead
In a world where zombies want to become humans, a saviour uses a heartbeat to lure zombies to the church to convert them back into human form. Keep humans alive as long as possible. Tap the mouse cursor to generate a heartbeat that lures nearby zombies and direct the zombies towards the church. Keep yourself from dying from a heart attack (full red health bar).
Further instructions are available at: http://members.shaw.ca/blau120039/Game/Instructions.pdf
To publish the game for the Windows store, we exported our game from Unity to a Visual Studio project using the pre-release Alpha of the Unity plugin for Windows 8. Because this plugin is pre-release, there were unsupported features as well as bugs.
The exported project failed WACK because of two unsupported third-party dll files, NGUI.dll and boo.lang.dll. Trying to figure out how to get the app to pass WACK without using those two dll files in the visual studio project was the most frustrating part of the submission process.
The NGUI.dll file was a relatively simple fix. When we developed the initial version of the game during the Global Game Jam, we made many of our scenes using the NGUI framework but displayed unsightly watermarks in our game. After the Global Game Jam, we decided to spend time redesigning our scenes to remove the NGUI framework. When we were ready to export the Unity project, most of the NGUI framework was removed from our game already. The solution was a simple matter of deleting the unused NGUI framework from our project.
During the development of our game, we never considered screen size and resolution. We should have considered positioning the objects so that it would be dynamically adjustable when people play the game on different resolutions. When making the user interface in the Unity Game Engine, we developed and optimized the game in a small window instead of full screen. When playing the game in full screen, the user interface does not fill the whole screen. When using different resolutions, game objects appear in slightly different locations.
We could have put more emphasis on playing the game on a touchscreen. Our gameplay was designed for a mouse click. We thought that tapping a touchscreen and using a mouse click would be no different. We found out that when playing our game on a touchscreen, there were some minor inconvenient issues. After tapping the touchscreen, the location of the cursor would not stay at the position tapped, but instead would move back to the location of the mouse cursor before the screen was touched. This made it difficult for players to see the radius of the heartbeat cursor.
Upon exporting the Unity project to Visual Studio, I was able to compile and run the game in Visual Studio without needing to make any modifications. I was expecting to fix compilation errors before being able to run the game in Visual Studio. The game looked the same as it did when testing it in the Unity Game engine, which was unexpected as I was prepared to make changes to the user interface to optimize it on Windows 8.
No. During the 48 hour Global Game Jam, we exclusively developed and tested on laptop and desktop computers. After winning the Microsoft Surface Tablet, I exported the game to ARM and installed it on the Surface tablet, which we used to demo our game at the UBC IEEE project fair.
We use the mouse cursor to control the zombies in our game. The game is playable by tapping the screen, although using a mouse is preferred
Exporting our Unity Game into a Visual Studio project and being able to publish it the Windows Store with few modifications.
In the 48 hour Global Game Jam, our group was able to develop a game. Only minor modifications were made to enhance the game after the Global Game Jam before submitting to the Windows Store. Modifications were made to make the game easier, since the feedback received during the demonstration period of the Global Game Jam was that our game is too difficult. We also decided to remove the NGUI framework due to the unsightly watermarks that it displayed on the user interface.
The game is already published on the Microsoft Store.
The game failed the WACK tool but we made changes to ensure the WACK tool passed before submitting the app for certification in the Microsoft Store.
Our group is composed of six 4th year computer engineering students (Crystal Ng, Joanne Chow, Peter Yeung, Brian Lau, Timothy Tang, and Steven Chow). We are all graduating in May 2013.