Sunny Pixels

Blend 3: Photoshop Import- Supported Features

There are a variety of features in Adobe Photoshop that are supported when importing .psd files in Expression Blend 3. This post is a continuation of my previous post “Blend 3: Introduction to Importing Photoshop Files”. The goal is to provide further information about the supported Photoshop features in Blend 3. I’ll cover the features that are supported in the Blend 3 Preview and also include a preview of some features that aren’t in the current public release but that we will be including in the final release of Blend 3 :)

The following is a detailed set of supported features that can be successfully imported and in some cases edited in Expression Blend 3:

Text

The text styles that are supported and editable in the Expression Blend 3 Preview include: FontFamily, FontSize, Foreground, Underline, StrikeThrough (WPF only), FauxBold, FauxItalic, FontBaseLine (WPF only), Text, AllCaps, Justification, AutoHyphenate (WPF only), RenderTransform (currently only scaling, rotation not included).

Note: The final release of Expression Blend 3 will only support editing the text styles listed above. Feel free to leave a comment and list any additional text styles you would like supported in a future release :)

Blend Modes

The current release of Expression 3 Preview supports importing a subset of Photoshop blend modes.

To maintain the look and feel of blend modes you must merge & flatten related layers in the Photoshop Import dialog otherwise they will be ignored. Info-tips will be available to provide guidance:

See the “Blend 3: Photoshop Import – Merging Layers” blog post for an example of the workflow to achieve expected results. When related layers are merged, the Expression Blend 3 Preview supports rasterizing and importing the following blend modes: Normal, Color Burn, Color Dodge, Darken, Difference, Exclusion, Hard Light, Lighten, Linear Burn, Linear Dodge, Linear Light, Multiply, Overlay, Pin Light, Screen and Soft Light.

Here’s a preview of the UI for the import dialog displaying a variety of the supported blend modes:

 Note: The final release of Expression Blend 3 will support rasterizing and importing all Photoshop blend modes. Photoshop blend modes are not editable in Blend 3. This is a preview of the updated UI.

Adjustment Layers

The current release of Expression Blend 3 Preview does not support importing adjustment layers.

Note: The final release of Expression Blend 3 will support importing most adjustment layers. To maintain the look and feel of adjustment layers you will need to merge & flatten related layers in the Photoshop Import dialog otherwise they will be ignored. When related layers are merged, the final release of Expression Blend 3 will support rasterizing and importing the following adjustment layers: Brightness/Contrast, Black & White, Channel Mixer, Color Balance, Curves, Exposure, Invert, Levels, Posterize, Photo Filter and Threshold.

Below is an example of a file with an image and three adjustment layers enabled: Color Balance, Channel Mixer, and Brightness/Contrast. The hover thumbnail displays the original image and the preview section on the left displays what will be imported if the related layers are merged. Adjustment layers can be checked on/off and previewed automatically in the dialog:

 The image above is a preview of the updated UI that will be available in the final release of Blend 3.

The final release of Expression Blend 3 will not support importing the following adjustment layers: Gradient Map, Hue/Saturation, Selective Color, Vibrance.

Layer Styles

The current release of Expression Blend 3 Preview does not support importing layer styles.

Note: The final release of Expression Blend 3 will only support importing and editing the drop shadow layer style.

The example above shows a Photoshop file with an image and a text element with a drop shadow layer style applied. In Blend 3 you can select this file to import and chose the import as “Editable text” option for the text layer.

On import Blend will create an image and a WPF/Silverlight text element (depending on what kind of project you have active) with a DropShadowEffect:

All supported properties from the Photoshop drop shadow layer style are converted and set to the supported WPF/Silverlight DropShadowEffect. You can now select the DropShadowEffect on the Objects and Timeline panel and edit the properties of the effect in the Properties panel:

Drop Shadow is the only supported layer style that will be editable in the final release of Blend 3 on import. All other layer styles will be ignored.

Gradients

The Expression Blend 3 Preview only supports importing and editing linear and radial gradients. All other gradients are rasterized and not editable. Below is an example of a gradient imported from a Photoshop file. Notice the gradient adorners on the artboard that allow you to manipulate and edit the individual gradient stops. You can also use the Properties panel to edit the gradients. For more info on creating and editing gradients see Joanna Mason’s post in the Expression Blend & Design team blog :)

For more info on merging layers and the workflow for importing some of the Photoshop features listed above see the “Blend 3: Photoshop Import – Merging Layers” blog post. Also see the overview post on Photoshop import in Blend 3.

Happy Blending!

Janete