One of the cool new features in Blend 3 is the option to import Adobe Illustrator and Adobe Photoshop files. This makes the interaction between Designer and Developer even better.

Today I had a question concerning an adjustment layer applied in Photoshop that Blend didn’t recognize. Okay, not everything can be imported from Photoshop, but you can try to find a workaround for it.

So what was the question. This guy wanted to create something like an Image Viewer, and when you didn’t hover over the picture, it was Black and White when hovering all the colors needed to show up.

To change an image to BW is pretty easy in Photoshop by using the Channel Mixer and selecting the monochrome option.

What you do basically is applying an adjustment layer on the image. When you save this one to PSD and import  it into Blend, Blend will tell you that some of the features are not supported and that it will be ignored:

The workaround for this problem is to make a copy of the image in Photoshop, applying the adjustment layer on the copy and than merge the copy with the adjustment layer.

So Duplicate the image in Photoshop:

Apply the adjustment on the copy of the image

Now right-click the adjustment layer and the copy and merge the layers

Save this and close Photoshop.

Open Blend 3, make a new project and open the Import the PSD in Blend

When Blend opens the PSD, you can choose if you want to have all the layers separately or as 1 image. If you want to adjust the layers afterwards go for option 1. We will also go for this option because we need to have the layers separated from each other. To import the two layers, select both checkboxes. Don’t check the Compatibility layer, because that one will flat everything.

Click on OK and have a look at your objects and timeline pane:

For the mouse over effect, you can use the Visual State Manager. Set the visibility option for the Channel Mixer to Collapsed or you can play with the Opacity, which can give you some amazing results :-)

K.