Chapter 2

Exploring the Expression Blend 4 IDE

In this chapter, you will learn how to set up Expression Blend 4 and other accompanying tools. You’ll explore and customize the integrated development environment (IDE), and you will create and test your first Silverlight project.

After completing this chapter, you will be able to

  • Download and install Microsoft Expression Blend 4.
  • Open and run your first Microsoft Silverlight project.
  • Use and customize the Expression Blend 4 user interface.

Downloading Expression Blend 4

Browse to the Expression product site at http://www.microsoft.com/expression/ and find Expression Studio 4 Ultimate in the download section. Click the appropriate download link to navigate to the download page at the Microsoft Download Center and follow the prompts and instructions that you find there.

Microsoft Download Center 

Installing Expression Studio 4 Ultimate with Expression Blend 4

Note: If you have a retail copy of Expression Studio 4 Ultimate, you should use it, instead of the trial version.
Navigate to the folder on your hard drive in which you saved the trial version of Expression Studio 4 Ultimate, and double-click the setup file. Follow the installation instructions, accept the license agreement, click Install, and then click Finish after setup completes the installation.
Note: Expression Studio 4 requires the ASP.NET 4 Runtime.  If it isn't present on your computer the Expression Installer will prompt you, and even download and install it for you.

Installing Expression Studio

Downloading Silverlight 4

  1. Go to the Microsoft Silverlight site and locate the Silverlight 4 information page, at http://www.silverlight.net/getstarted/.
  2. Download Silverlight 4 by clicking the Silverlight Runtime (Install now) link or by typing http://cut.ms/Xv2 in your browser.
  3. Chose Run, and navigate through the Silverlight installation process.

Opening and Testing Your First Silverlight Project

Now that you have installed Expression Blend 4 and the other supporting tools, you can launch Expression Blend 4 for the first time.
Important: Be sure you have installed the .NET Framework, Expression Blend 4, and the Silverlight plug-in before beginning this exercise.

When you complete this segment you will be able to open, run, and test a Silverlight Project

Opening a Silverlight Project

Exploring the User Interface

The user interface in Expression Blend 4 closely matches the interface of the other products in the Expression Studio; it is compact, elegant, and intuitive. The workspace enables you to design your own applications quickly.

The Expression Blend User Interface

Exploring the Panels

In this exercise, you will start Expression Blend 4, familiarize yourself with the panels that are available, and manipulate those panels. There are no practice files for this exercise.

Expression Blend Panels 

Tip: If you have trouble locating a panel, or if it isn’t visible in your workspace, click Window on the menu bar, and then click the name of the panel you’re looking for. You can also reset your workspace, which returns the user interface to the default settings. You can do so by clicking Reset Current Workspace on the Window menu.

Understanding the Tools Panel, Authoring Views, and Workspace Configurations

Now that you have examined some of the panels available in the Expression Blend 4 workspace. In the following exercises, you will examine the Tools panel, authoring views, and workspace configurations. There are no practice files for the exercises in this section. You can continue to use the Zune3D sample.

The Tools Panel

On the left side of the Expression Blend 4 workspace is a vertical panel called the Tools panel. This set of tools helps you create new objects and modify existing objects in your application. For instance, to draw on the Artboard, you first select a tool and then use it to draw.

Expression Blend Tools Panel

Authoring Views

Authoring views are another important feature of the Expression Blend 4 workspace. So far, you’ve looked at a project on the Artboard in only one view: Design view; however, to design and develop various projects In Expression Blend 4, you will need more than just Design view. Expression Blend 4 has three real-time authoring views, each with a corresponding button in the upper-right corner of the Artboard.

Expression Blend Split View

Customizing the User Interface

To help you work efficiently and comfortably, you can adjust the Expression Blend 4 workspace to suit the workflow required for the job you’re doing. Because it provides different workspaces, sufficient free space for its various panels, and multiple views of your Artboard, Expression Blend 4 lets you work the way you want to and doesn’t force you to adapt to its default workspace layouts.

In this exercise, you will set a different color scheme for your workspace, change the Artboard background, and use other options to improve ease of use.

Expression Blend Options Dialog

Switching Between Workspaces

In the previous exercises, you examined two workspaces in Expression Blend: Design and Animation. For maximum user customization, with Expression Blend 4 you can create and save one or more workspaces. You can also switch between workspaces easily.

Switching Workspaces in Expression Blend




You can easily make this a point to YOUR company OR hide it all together.