Share via


Collaboration with Expression Blend

Expression Blend is a professional design tool to create engaging Web-connected experiences for Windows. Using WPF Designer for Visual Studio and Expression Blend, developers and designers can collaborate to create compelling user experiences.

This collaboration is enabled by a shared file format (XAML), and a shared solution and project format. This means that professional designers using Expression Blend can open and edit WPF projects created in Visual Studio, and that developers can open and edit WPF projects created in Expression Blend.

Typical Collaboration Scenarios

You can divide software development and graphical design tasks in different ways. The scenario you choose depends on various factors, such as the complexity of the project, and the skills of the designer and developer. Possible scenarios include the following.

  • Single

  • Traditional

  • Developer first

  • Designer first

  • Hybrid

Single

In the single scenario, there is a single designer/developer using both Visual Studio and Expression Blend.

In many cases, the developer and the designer are the same person. In this scenario, Visual Studio and Expression Blend are installed on the same computer. You can create your WPF projects by using either product. You may find it useful to have both Visual Studio and Expression Blend open at the same time.

Note

You can have the same project file open in Expression Blend and in Visual Studio at the same time, on the same computer. When you save a change to a file in one tool, you will get a notification dialog box when you switch to the other tool that asks if you want to reload the file.

Traditional

In the traditional scenario, the designer creates a mock-up using any drawing tool that they are familiar with, and the developer uses both Expression Blend and Visual Studio.

In this scenario, the designer exports the mock-up as an image (such as a .jpg) and gives it to the developer. The developer uses Expression Blend and Visual Studio to re-create the mock-up.

This scenario works well when the designer is not familiar with Expression Blend and the developer is comfortable using Expression Blend.

Developer first

In the developer-first scenario, the developer creates the WPF project with Visual Studio and uses the WPF Designer to define the layout for windows and controls.

Once the project is checked into source control, the designer can open the project with Expression Blend and style the windows and controls. The developer and the designer can work at the same time on the same project, with the developer authoring application logic and the designer authoring presentation resources.

This scenario works well when the designer has some familiarity with Expression Blend. Also, this scenario promotes good design because elements are based on the appropriate control or object. For example, a common designer mistake is to draw a rectangle or some other static element to represent a button, instead of applying a style to a button control. The disadvantage with this scenario is that designer can delete elements or make changes that can break code previously written by the developer.

Designer first

In the designer-first scenario, the designer creates the WPF project and defines the layout for windows and controls by using Expression Blend.

Once the project is checked into source control, the developer can open it with Visual Studio and author application logic. The developer and the designer can work at the same time on the same project.

This scenario works well when the designer is experienced with Expression Blend and understands controls and the basics of programming. The disadvantage with this scenario is that the designer is required to do more work and will require more time to create designs.

Hybrid

In the hybrid scenario, a designer creates XAML fragments that the developer imports into the project.

The designer uses Expression Blend to create styles and templates for elements in the UI and packages them in resource dictionaries. The developer imports the resources into Visual Studio and applies them to the UI.

This scenario works well for larger projects and when there are multiple graphical designers. The advantage to this scenario is that the developer has more control over the project files and can incrementally import resources during development.

See Also

Concepts

WPF and Silverlight Designer Overview

Other Resources

WPF Designer