What's in the project?
This project contains a new SketchFlow template that enables you to use to rapidly prototype Windows Phone apps.
What can I do with them?
With this new template you can quickly mockup a Windows Phone app using all the SketchFlow features you already know and love, sketchy controls, sample data, Behaviors and the Visual State Manager. The prototype you create will run in the SketchFlow player
(not in the phone emulator) which enables you to easy test, get feedback and quickly iterate on your ideas even if your client and stakeholders are remote to your location.
For the phone template we have added a number of unique phone features to speed up the prototyping process such as pivot and panorama, date and time pickers, map controls, the application bar as well full screen mockups of features such as the camera, Bing
search, the app list and home screen.
Let's get started!
Simply install the new template using the SketchFlowWP7.msi installer, open your version of Blend and under the Windows Phone option you’ll now have the additional option to start a SketchFlow for Windows Phone app.
When you start a new project Blend creates a number of screens for you, such as home, search, the app list and provides an empty phone screen ready for you to start creating your prototype. In addition to the screens provides SketchStyled Phone Chrome with
pre-wired buttons for Search, Home and Back that work exactly the same as the buttons on the phone.
SketchFlow provides a number of SketchStyled controls by default and the SketchFlow for Windows Phone template includes a number of other phone specific controls that you can find located in the assets panel under:
Controls –> Mockups
Controls such as Panorama and Pivot work the same as they do in standard Windows Phone projects, in fact even adding additional Panorama and Pivot items is the same, simply right click and choose add an item.
Controls such as the Toast notification can be triggered to appear simply by using a Behavior and of course it’s content can be fully customized.
The ApplicationBarMockup, like Panorama and Pivot, behaves the same as it does in a real phone app, the icons and menu items are fully customizable and by default when you test your app the ‘…’ identifier expands the AppBar with no additional work required
[View in Blend on the design surface]
[View in the SketchFlow player when ‘…’ has been pressed]
The final controls we’ll highlight in this brief introduction are the Date and Time pickers which are pre-programmed and ready to be used in your prototype. Simply add them to your project, hit F5 and then in the SketchFlow player click on the picker to
see it in action.
[View of Time and Date pickers in Blend on the design surface]
[View in the SketchFlow player when TimePicker has been pressed, yes and no buttons return you to the previous screen state.]
You can now quickly created a prototype of your phone app, deploy it, have your client test and provide feedback through the SketchFlow player and then easily turn the whole project into a Word document complete with table of contents, screen shots and associated
feedback, an ideal way to start your spec doc!
To get a great overview of the functionality and capabilities of the SketchFlow template for Windows Phone please watch Unni’s session at
MIX earlier this year.
When you are happy with your prototype and ready to create your actual application don’t forget to take advantage of our
Windows Phone 7 Design Templates. The design templates are a XAML version of the
UI Design and Interaction Guide for Windows Phone 7 and allow you to easily create common Windows Phone UI layouts by simply copying and pasting the desired look and feel. We’ve taken care of the margins,
styling, and custom controls that may not be available in the platform.