What's new

With Microsoft Expression Blend, you can create websites and applications based on Microsoft Silverlight 3, and desktop applications based on Windows Presentation Foundation (WPF) 3.5 with Service Pack 1 (SP1).

Expression Blend provides new support for prototyping, interactivity through behaviors, special Silverlight functionality, and on-the-fly sample data generation.

Using Expression Blend, designers can make applications that are easy and fun to use.

Prototyping

Introducing SketchFlow

With SketchFlow, Expression Blend introduces a new set of features designed to make it easier for you to experiment with dynamic user experiences and to create compelling prototypes.

SketchFlow helps you communicate design ideas to stakeholders, and makes it easier to collect feedback by using annotations. You can import Microsoft Office PowerPoint files into screens in your project. You can also export Microsoft Office Word documents that contain screenshots of all your screens. New categories in the Assets panel organize SketchFlow styles and other assets.

Designers can use SketchFlow to model the navigation and composition of an application in a very visual manner. SketchFlow prototypes can be as simple as a series of sketches, but can evolve to be as real as you need them to be to communicate your design intent. SketchFlow uses the existing features of Expression Blend. Other new Expression Blend features, such as Photoshop import, visual states, behaviors, and sample data, can also be used in prototyping projects.

For more information, see Prototyping with SketchFlow.

Design

Importing Photoshop and Illustrator files

You can use Expression Blend to import both Adobe Photoshop (.psd) files and Adobe Illustrator (.ai) files directly into your projects, while retaining layers, shapes, text elements, and more for easy editing inside Expression Blend itself.

For more information, see Import Photoshop and Illustrator files.

Note

Adobe live effects, blend modes, and the symbol sprayer are not supported. When you import an Adobe file, Expression Blend will display a message to let you know if any features of the imported file are not supported, and what actions you can take.

Effects

Expression Blend introduces support for WPF and Silverlight graphic effects. Open the Assets panel, click the Effects tab, and drag an effect onto an object. You can modify the properties of the effect in the Properties panel.

For more information, see Applying effects.

Design-time annotations

Designers can now add visual bubble annotations (very similar to Microsoft Visio comments) to the artboard. These annotations are stored in the XAML file in the form of attached properties. They can be used to improve communication between team members. The annotations do not appear at run time.

For more information, see Annotate a document.

Assets panel

The Asset Library has been redesigned and made into a dockable panel that can remain open while you work on the artboard. Assets are categorized for easier searching and organization.

For more information, see Assets panel.

Styling controls

Creating templates from artwork

You can use the modified Make Into Control command to select artwork on the artboard and to convert it into a skin (control template) for a control.

For more information, see Create a user control from existing objects.

If you are working in a Silverlight project, you can right-click objects in your template and click Make Into Part to assign objects in your control to specific roles. For example, if you convert artwork to a Slider control template, you can then select one of the objects in your template and assign it to the role of the slider's HorizontalThumb. The Parts panel makes it easy to manage and create the parts required by a control template.

For more information, see Styling the parts of a Silverlight control template and Styling tips for common Silverlight controls.

Creating TextBox templates from artwork

If you use the Make Into Control command and choose either a TextBox control or anything derived from a ContentControl control, Expression Blend will copy typographic properties from any TextBlock object that it finds (in the objects that you are converting) into the appropriate part in the resulting control template.

States

Improved support for VSM

Support for the Silverlight Visual State Manager (VSM) in Expression Blend has been improved with a revised user interface for the States panel. You can see more states for controls, regardless of whether those states were defined in your XAML file originally, and the States panel displays a warning indicator when a property has been changed in more than one state group. States are now supported in more scenarios. For example, you can define states in the MainWindow.xaml document of a Windows Presentation Foundation (WPF) project.

For more information, see Defining different visual states for a control.

State pinning

You can pin a preview of one state in a state group while modifying another state in a different state group.

Editing state transitions

You can select the storyboard for a state transition and modify it in the Objects and Timeline panel.

Drawing into state

When you select a state and draw a new element, the new element will be visible only in the selected state at runtime. This is called drawing into state.

Smooth layout transitions

You can create a gradual transition between states that define changes to layout properties. In previous versions of Expression Blend, if you changed such properties as the Row, Column, ColumnSpan, or RowSpan of an object in different states, the change would be instantaneous, even if a transition duration was specified. By selecting Turn on FluidLayout , you can make an object move smoothly from one cell in a Grid layout panel to another.

For more information, see Transition between layout changes smoothly.

Previewing transitions

You can preview transitions by clicking Turn on transition preview  in the States panel. When transition preview is on, each time you change your selection from one state to another, the currently-defined transition between those two states plays out on the artboard just as it will at run time.

Note

Transition preview does not support FluidLayout.

Interactivity

Behaviors

You can add interactivity to your application, without having to write code, by using behaviors. Behaviors are reusable components that can be directly applied to any object on the artboard, and they are composed of extensible triggers, extensible actions, and behaviors.

Behaviors can be selected from the Assets panel, but developers have a rich API that they can use to write their own triggers, actions, and behaviors for use in Silverlight and WPF projects.

You can find more information about writing your own behaviors in the Expression Blend SDK documentation available on the Help menu.

For more information, see Adding behaviors to objects.

Data

Using sample data

Expression Blend makes it easy to prototype, build, and test data-connected applications without having access to live data. You can use the Data panel to generate sample data or to import sample data from an XML file. You can generate flat collections or hierarchical collections (for use in a TreeView control), and you can specify the content to generate for four types of data (String, Number, Boolean, and Image).

Sample data is available to controls on the artboard at design time. You can extensively customize your sample data details, and you can easily switch between using sample data and using live data at run time.

For more information, see Creating sample data.

Data binding

Expression Blend includes the following new data binding features:

• The ability to drag items of data from the Data panel into the Objects and Timeline panel to create data bindings.

• The ability to bind the property of one object to a property of another object in Silverlight projects.

• Support for the DataGrid control in applications.

• Support for master/details scenarios by using the list view and details view of the Data panel.

• Improved support for binding to a data context.

• The ability to define hierarchical collections of sample data that enable you to prototype data-connected applications.

For more information, see Displaying data in controls.

Sample data for developers

You can use your own custom business objects to define the sample data, and you can use that sample data source in your application. Your business objects don't have to be changed to be more XAML friendly. For example, Expression Blend handles objects that don't have public constructors, and properties that don't have setters.

Silverlight

Silverlight 3 support

You can create and modify Silverlight 3 applications in Expression Blend. If you open a Silverlight 2 project, Expression Blend will display a dialog box to ask if you want to update your project files from Silverlight 2 to Silverlight 3.

For a list of Silverlight learning resources, see Learning and community resources.

Website support

When you create a new Silverlight project in Expression Blend, you have an additional project type called Silverlight Application + Web Site. When you create a Silverlight application using this kind of project, you get both a Silverlight application and an associated website with a default HTML page that will load your Silverlight application.

Enable a Silverlight application to run outside the browser

You can configure a Silverlight application to run outside the browser, in its own application window, by using the Silverlight Project Options on the Project menu. For more information, see Test or run a project.

Cache the application library extensions

You can configure a Silverlight application to cache library extensions by using the Silverlight Project Options on the Project menu. This can speed up your Silverlight application.

Note

Caching library extensions does not work with out-of-browser Silverlight applications.

Source file version control

TFS support

Expression Blend 3 introduces support for Microsoft Visual Studio 2008 Team Foundation Server. If you have access to a Team Foundation Server, you can perform common source control–related tasks on solutions and projects such as checking in, checking out, merging, and more.

For more information, see Working with Team Foundation source control.

Animation

More properties available to animate

In a Silverlight project, you can record keyframes for many more properties than before. To help with this, there is a new menu command, Record Current Value, on the Advanced property options menu that appears when you click the marker  next to individual properties in the Properties panel.

Better support for easing in Silverlight

You can apply predefined, named easing functions to individual keyframes by selecting a keyframe and then selecting an EasingFunction in the Properties panel.

For more information, see Change animation interpolation between keyframes.

Animating to resource values

You can animate to and from some resources. For example, you can animate a color property from a static value to a color resource.

Text

Improved embedding of fonts and subsets of fonts

With Expression Blend, you can easily embed and create subsets of fonts in Silverlight and WPF projects. You can use the new Font Manager to select fonts installed on your computer and customize which subset of the characters to embed.

Workflow

Docking and workspace configuration

Expression Blend extends the workspace configuration features found in earlier releases by providing full docking support for all panels. You can customize the Expression Blend user interface to your liking and save this configuration as a preset.

For more information, see Making more room to work and Saving different views of your workspace.

Gradient tool improvements

In Expression Blend 3, the gradient tool is more powerful and easier to use than in earlier versions. You can now change the offset values of a gradient directly for an object that has a gradient applied to it. To change a stop position, just drag the stop. To add a new stop, hold down the ALT key, and then click the gradient adorner. You can also quickly redefine the gradient by dragging a new gradient adorner onto the artboard. When you double-click anywhere on the artboard, a color picker appears. You can use the color picker to change the color of the stop.

Layout operation improvements

Expression Blend 3 introduces several improvements to layout operations. Moving objects with direct manipulation on the artboard is now more consistent and predictable, alignment adorners are shown for more containers, layout properties and bindings are preserved when reparenting or grouping objects, and layout properties are no longer written to the XAML code-behind file unnecessarily. Additionally, you can now use the property inspector to change the width and height of an object even when these properties are set to Auto. Expression Blend will automatically compute the appropriate margins needed to make sure that the object is the size that you specify.

Direct selection improvements

Expression Blend contains some significant changes to the selection model. These changes make it easier to change your selection and draw new objects on the artboard. The changes include extending the functionality of the Selection tool to behave similarly to the Direct Selection tool, and improving the creation and parenting behavior on the artboard with the help of visual indicators that appear while you draw or move objects.

Marquee selection of points

When you use the Direct Selection tool, you can now select individual points on a path by using marquee selection. Just drag to define the area that contains the points that you want to select.

Auto-scroll and zoom improvements

When you move or resize an object, the Expression Blend artboard scrolls automatically. If you move the pointer past the artboard, the scrolling will stop. Rotating the mouse wheel zooms the artboard by default.

For more information, see Zoom or pan the artboard.

Keyboard shortcuts and modifier keys

Expression Blend makes common tasks easier by introducing new keyboard shortcuts and modifier keys for actions such as direct selection, marquee selection, duplication of content, panning, zooming, and more.

For more information, see Keyboard shortcuts and modifier keys.

Improved TileBrush support

You can now create and edit tiled image brushes for Silverlight applications. In addition, for both Silverlight and WPF applications, you can set the Source property directly from the Brushes category of the Properties panel instead of recreating the brush.

Copy and paste images from the Clipboard

Image data put on the Clipboard by other applications such as Windows Internet Explorer, Adobe Photoshop, and Microsoft Paint can now be pasted directly into Expression Blend. Expression Blend determines the type of project elements to add based on where you perform the paste action. For example, pasting an image in the Resources panel will add an image file to your project and create an ImageBrush resource.

Template structure

If a control includes templates that are applied in specific scenarios, such as when a control has to display a collection of data, those templates now appear in the Edit Other Templates category of the Edit Template item on the Object menu. This is to make it easier to navigate to templates such as the ItemContainerStyle template of a ListBox control.

Serialization of default values

Expression Blend does not explicitly set a property value when it is not needed. Expression Blend 2, when setting a property such as HorizontalAlignment to Stretch, wrote the value in your XAML file even though it was unnecessary because it is the default value. Expression Blend does not write this value out except in special cases (such as when the value is being set by a style).

The default value can still be set explicitly using the Convert to local value command on the Advanced property options menu that appears when you click the marker  next to the property in the Properties panel.

Improved UserControl control editing experience

When you modify the XAML that defines a UserControl control, you no longer have to rebuild the project to update all the UserControl objects on the artboard.

Additionally, you can enter editing mode for a UserControl control by double-clicking one of the UserControl objects on the artboard.

Searching for files in the Projects panel

You can search for items in the Projects panel. When you clear the search window, the nodes that were expanded during your search remain expanded so that you can easily locate the items you searched for.

Find in Files command

You can search for text in multiple files by using the new Find in Files command on the Edit menu (CTRL+SHIFT+F).

Expansion of the Projects panel

Expression Blend now remembers the expansion state of the various nodes in the Projects panel when the solution is closed and reopened.

Code editing

XAML, C#, and Visual Basic Code Editing

Expression Blend improves on its XAML support by introducing time-saving features. You can now modify C# and Visual Basic code-behind files right inside Expression Blend. The code editor supports several features that you can use to increase your productivity when you modify code. These features include IntelliSense (syntax completion), auto-formatting, brace matching, function summary writing, event handler creation, and more.

XAML editing improvements

The object tree remains expanded if you make an invalid change to your XAML while in Split view. Additionally, you can continue to work on an object on the artboard when a property of the object is set to an invalid value in XAML.

Add event handlers in Visual Studio

Expression Blend now includes a code editor for modifying your C# and Visual Basic code-behind files. By default, when you use the Events view of the Properties panel to add event handler code to your code-behind files, Expression Blend will open the code-behind file in the internal code editor. However, you can instead choose to use Microsoft Visual Studio to add event handlers.

Extensibility

Extensible Assets panel

You can populate the contents of the Assets panel in Expression Blend by registering a directory that contains one or more assemblies. You can write your code to display custom icons and more. You can also instantiate controls stored in those known assemblies, and Expression Blend will then add the necessary assembly references to your project.

Artboard extensibility

Expression Blend 3 introduces more refinements to the extensibility APIs for Silverlight and WPF. The extensibility points are compatible with the Visual Studio designer, and you also have more flexibility to extend the artboard.

Extensible project templates

Expression Blend supports extensible project templates, which provide customizable project and item stubs to improve project creation. These project templates, which are a subset of what Visual Studio supports, can be used to create complex solutions with interproject dependencies and assembly references.

See also

Concepts

Learning and community resources

Other resources

Microsoft Expression community site