Preparing Layers

How to Prepare all Layers in Photoshop

Merging several layers

In Photoshop you can have as many layers as you want. Often one visual element will consist of multiple layers. It is important to merge these layers in Photoshop, so you have a single element to manipulate in the ResponsiveAds Fluid Ad Creator. Click Layers > Merge Layers or CTRL+E (CMD+E on Mac)

For example:

1. You might have an element in your ad of a hand holding a smartphone, where one layer is the smartphone device, one layer is the smartphone's screen and one layer is the hand holding the device. You would never want these drifting to different positions or edited separately inside the Fluid Ad Creator, it is one visual element that should be merged to a single layer for the ad.

2. Text that lies upon a button can be combined with that button as a Smart Object. This causes the button to make up one element in the Fluid Ad Creator, that you can use as is, or as a reference image for building an interactive HTML button element.

3. If you have multiple text elements always shown together, set up with complex text effects (or otherwise have no need to edit or change the text in the Fluid Ad Creator), you can merge your layers of text to make up a final one rasterized element.

Merge layers in the Photoshop layer menu

---

Hidden layers

If you have hidden layers in the .PSD, these will be added to the ad too, but set as hidden by default. If you're not using these layers in the final ad, we recommend deleting them in the editor to decrease ad weight and increase performance.

---

Rasterizing Layers

ResponsiveAds service does not currently support some of the more advanced features in Photoshop. Therefore you need to rasterize them before uploading to ResponsiveAds. These features include:

1. Layer styles (e.g. drop shadow or stroke)

2. Layer masks & vector masks

3. Layers as clipping masks (note that rectangular masks on groups are supported, see [link])

4. Layer blend modes (e.g. darken, multiply or overlay)

5. Adjustment layers

If you don’t have any of the below features used - you are all set and can upload your .PSD file.

1. Layer styles (e.g. drop shadow or stroke)

Create a new empty layer (Layer > New > Layer OR click on plus button on the layers tab) on top of the layer with layer style. Merge the empty layer and the layer with layer style by clicking Layers > Merge Layers or CTRL+E (CMD+E on Mac)

Create a new layer

Merge new layer and layer with layer style

2. Layer masks & vector masks

To rasterize masks, right-click on the mask in the layer list and select Apply mask.

Apply Layer Mask

3. Layers as clipping masks

Right-click on the clipping mask in the layer list and select Release Clipping mask.

Release Clipping Mask

4. Layer blend modes (e.g. darken, multiply or overlay)

Layer blend modes are a bit tricky to rasterize as these don't affect the layer itself but instead how the layer interacts with the other layers below it. However, it's possible to include the blend mode effect in a single layer.

1. If you have blend modes in multiple different layers, start rasterizing them from the topmost layer.

2. Select the content of the layer with the blend mode. Easiest way to do this is to select the layer from the layer list and select all (CTRL+A or CMD+A). Then select the Move tool (V) and nudge once to any direction with the arrow keys and nudge back to the opposite direction. This will change the selection to the actual content of the layer instead of the whole canvas.

3. In the layer list, toggle the layer with the blend mode and ALL the layers above it to invisible

4. Click active the layer directly below the layer with the blend mode. Select Edit > Copy merged and Edit > Paste special > Paste in place.

5. Select the new layer that was created (it will be directly below the layer with the blend mode) and the layer with the blend mode and merge the two layers (Layers > Merge Layers or CTRL+E / CMD+E)

5. Adjustment layers

Adjustment layers are not supported in ResponsiveAds and can't be rasterized as their visual effect is not related to a single layer. You can add the adjustment to each layer under the adjustment layer either by selecting each layer one by one and adding the same adjustment to that layer from Image> Adjustment.

Another way is to duplicate the adjustment layer multiple times (right-click on the adjustment layer and select Duplicate layer) so that there is a copy above each layer that you want to add the adjustment and then one-by-one right click on all the adjustment layers and select Create clipping mask. You can then merge the clipping mask and the layer beneath it by right-clicking on the adjustment layer in the layer list and select Merge Down, or by selecting them from the layer list and selecting Layers > Merge Layers or CTRL+E / CMD+E.

---

Rasterize Type layers based on their use

ResponsiveAds now generates text elements from text layers in Photoshop, but you will need to recreate the font styles for the live text in the Fluid Ad Creator. A rasterized version of the text layer will also be imported as a reference image.

If you do not wish to work with live text elements, you can rasterize the text layers by selecting the text layer and using the menu to Rasterize Type.

Rasterize Type

Want to use an image of your text instead of setting up editable text elements in the Fluid Ad Creator? Best Practice: to have your text crisp on retina displays, rasterize the text layers in Photoshop, and before rasterizing make your text twice the original size.