Developing a Windows 8 Application prototype

Developing a Windows 8 Application prototype

Rate This
  • Comments 3

 

I have a had a number of questions last week, from some of the UK’s University Gaming Students and Academics re Windows 8.

Over the past few weeks as part of my UK  tour with Aardvark Swift recruitment, I have been highlighting the opportunity of students building portfolio’s and publishing apps on Windows 8 Store to demonstrate their abilities to help them gain employment see the PowerPoint deck below.

 

For more resources on Windows 8 development see http://www.ubelly.com/gaming

If your interested in attending a free Windows 8 developer camp see http://www.microsoft.com/uk/msdn/windows8

Game/App prototyping

One of the questions, I was asked last week was how can student use tools to develop prototypes and proof of concepts for academic activities, I wanted to share with you the following templates for PowerPoint. Using these templates, you can quickly put together a Windows 8 app layout and iterate on it. All elements in the set are based upon regular PowerPoint vector shapes, and are fully editable and customizable.

As anyone who has seen one of my presentations, PowerPoint is a really great rapid prototyping tool its slide-by-slide approach allows you to present a flow and tell a story with your designs. You can even create basic clickable prototypes by adding hyperlinks between slides. Furthermore, PowerPoint is available on almost every computer, including the new Windows Surface devices that run Windows RT, and is fairly simple to get started with.

Download the Templates For Free!

The wireframing set is available as a .pptx file (for PowerPoint 2007 or newer) that you can download using the link below:

It is licensed under the Creative Commons Attribution-ShareAlike 3.0 Unported License.  You can therefore use it any way you want, private or commercial, just as long as you distribute the resulting work under the same license and give proper credit to the original creators:

What’s Included?

Example grid page
Example grid page displaying item previews arranged in groups.

Example page displaying details
Example page displaying details for a single group with previews for each item in the group.

Example page displaying
Example page displaying one item in detail.

Example page displaying a list
Example page displaying a list of items and the details for the selected item.

Example of a Metro app
Example of a Metro app in snapped view state.

Example of an app
Example of an app in fill view state.

Collection of common UI controls
Collection of common UI controls (part 1): button, text box, list box, check box, radio button, toggle switch, etc.

Collection of common UI controls
Collection of common UI controls (part 2): search box, date/time picker, slider, progress bar, scrollbar, etc.

Grid view
Grid view (with groups).

List view
List view and charms bar.

App header
App header, app bar, and toast.

Message dialog
Message dialog.

Text styles
Text styles.

240 app icons
240 app icons (part 1).

240 app icons
240 app icons (part 2).

Touch gestures
Touch gestures.

What about using tools such as PowerMockup

While you can build great prototypes with FREE tools and PowerPoint, you may find yourself wanting the templates to be in a format that is easier to search through.

In this case, I can highly recommend taking a look at PowerMockup, an add-on for PowerPoint.

PowerMockup provides a searchable library of wireframe elements that can easily be dragged and dropped onto a slide. Best of all, the tool allows you to add your own creations to the library and share them with others.

Andreas Wulf, www.powermockup.com has created these FREE additions

After downloading the files, switch to the “PowerMockup” tab in the PowerPoint Ribbon bar, click on “Import Files”, and select the downloaded .pmst files. Here is a screenshot of how it will look like after you have imported the templates:

PowerMockup

All elements, including the icons, are properly named and tagged, making them easily searchable.

PowerMockup

I hope you enjoy the set!

Source: http://designmodo.com/windows-8-wireframe/#ixzz2DGKTR0dv

Leave a Comment
  • Please add 5 and 3 and type the answer here:
  • Post
  • Thank you very much for sharing this! Brilliant!

  • Good article!!...thanks

  • Nice Article ...

Page 1 of 1 (3 items)