SketchFlow – Sketching and Prototyping in Expression Blend

I had a interesting discussion this morning with a business school looking at introducing Mobile App development one of the key things within their assessment is the proof of prototypes and wireframes we got onto discussing the opportunity and advantages of using Microsoft Expression, SketchFlow.

SketchFlow addresses three pain points in software sketching and prototyping:

It makes it easier to experiment with ideas for dynamic user interaction.
It facilitates communication of design ideas and intent between designers and other stakeholders.
It makes it easier to gather, evaluate and use stakeholder feedback on design ideas.

Sketchflow is a fun, informal, flexible, quick and powerful way to sketch and prototype rich, dynamic interactivity with Expression Blend.

SketchFlow

The mission of the Expression team is to help designers to create great user experiences. We believe that this mission needs to begin with the early exploration phases of design. SketchFlow,

SketchFlow is a set of tools for Expression Blend to create sketches and prototypes of interactive content and applications, giving Blend a new role in pre-production and design phases of the development process.

SketchFlow is informal and quick, enabling you to sketch out plentiful ideas for dynamic interactions in a cost effective manner. SketchFlow also supports the evolution of your rough sketches into living and breathing prototypes that can be as real as you need them to be.

SketchFlow is part of Expression Blend so FREE from www.dreamspark.com

Throughout the software industry, we historically have not spent much effort on the earlier stages of design. This lack of upfront investment in design often leads to increased cost due to a need for expensive rework at a later stage and to products that may not satisfy our customers.

Great design for software needs a great design process, and ways to make the exploration, communication and evaluation of interaction and design fast and effective are an important part of great process.

Sketching, and, at a slightly later stage of the design process, prototyping, are wonderful techniques to explore a multitude of ideas quickly, without excessive investment and emotional attachment. Software interaction is highly dynamic, and over the last years we have consistently have pushed more in the direction of rich, dynamic visuals and interaction methods. Expectations have risen greatly. However, it is far from easy to create meaningful design studies and sketches of dynamic interactivity entirely with traditional tools. There are many reasons for that, including the fact that most design tools have been created as production tools, focused on the creation of final production assets, where precision, quality and finish matter. Another reason is that most tools still treat UI as something that is just a small derivation from an otherwise static comp.

Gathering feedback

SketchFlow provides a way to showcase your prototype to others using the SketchFlow Player. The SketchFlow Player allows you to explore the prototype from the first moment on, even while it consists of nothing but a few rough sketches. The player lets you navigate your prototype, run animations that illustrate how your prototype might work, or switch into different states of your UI, all without wiring up actual UI elements. This lowers the cost of evaluating ideas in early stages before much expense has been incurred.

But showing a prototype to others is only part of the review process, so the SketchFlow Player provides tools to collect feedback from reviewers. Reviewers can provide feedback either as text, like the comments in the Feedback tab in the screenshot below, or as ink, like the red arrow in the screenshot below. Then you can incorporate this feedback into the prototype using the Feedback panel in Expression Blend, allowing you to iterate on your design using suggestions from your team.

Resources

Tutorials on Sketchflow https://www.microsoft.com/design/toolbox/school/tutorials.aspx

For more information, watch a video on Sketchflow