How would I recreate this dissolving drop shadow look ? (image file included)

Content
1

Kind of what the title is asking,

Im trying to attempt my own version of recreating a 960px width by 390px height white rectangle, but it has an expanding drop shadow affect which disolves in the center but has sharp edges to the left and right hand edges.

Take a look at the image file below and make sure you click on it to see it in full scale mode - Obviously all you will see is the drop shadow as the rest of the image is #ffffff.

Any advice on recreation would be much appreciated as Id love to know how this was created. (I can use PS CS5 but Im sure how to get the dissolveed look with sharp edges seen elsewhere on the image)

Thanks

2

ok its not too tricky but might take a little practice till you get it spot on.

First up use the grid overlay set to 10px x 10px to give you a working grid pattern.
(enable snap to grid too)

Start with the white rectangle on a new layer. Use the VECTOR shape rather than a raster marquee and drag out to the size you want.

Duplicate that layer (CTRL+J) so you now have 2 white rectangles.

Hide the top rectangle layer as we dont need that just yet.

Change the colour of the remaining rectangle to black and select the pen tool and ‘Add Anchor Point Tool’

In the middle of base line of the rectangle, add a point (click where you want the point to be - try and get as close to the middle as you can)

Select the ‘Direct Selection Tool’ from the menu or press A so that the white cursor arrow is selected.

click on the point you just added and drag it down by a couple of grid lines. This should give you an arc shape at the bottom of your rectangle.

Right click on the layer in the layer palette and select ‘Rasterise Layer’
Go to Filter > Blur > Gaussian Blur and set it to 2.8 0r thereabouts.

Turn the top layer back on to visible and you should have a drop shadow effect.
Use the marquee tool to make a full selection of the parts you dont need and delete them.

Drop the base layer opacity down to 20% and nudge the layer up a couple of pixels to get slightly sharper edges.

See if that helps.

3

Hi Mike,

Many thanks for taking the time to reply, as my knowledge is somewhat limited to all of the adobe CS5 products, I have followed your step by step all the way through but I am obviously doing something drastically wrong, as I just end up with 1 white rectangle as the black rectangle has been rasterised.
I will write each of my steps down stating what buttons Im clicking on at each step to try and weed out where Im going wrong.

Thankyou once again, Ill post my step-by-step back imminently.

4

Hey Mike,
Just wrote this out so you can see at what point Im going wrong:

  1. File
  2. New
  3. Width = 960px / height = 390px / background contents = transparent
  4. View
  5. Show
  6. Make sure Grid is ticked
  7. Edit
  8. Preferences
  9. Guides, grid and slices
  10. Gridline Every 10px and Subdivisions 10
  11. Using Rectangle tool (below path selection tool) draw 1 rectangle filling whole canvas in white
  12. Ctrl + j
  13. Hide top rectangle in layers tab
  14. Change the colour of the visible rectangle to black
  15. Select “add anchor point tool” and click a point in the middle of the baseline of the rectangle
  16. Press “A”
  17. Click on the point that I just added and drag down the rectangle by a couple of grids.

Its at this stage I can see no anchor point, and when I do press “A” and drag down, I drag down the whole rectangle and there is no arc shape created…

5

Hey Mike,

Good news for me @ least! Ive cracked it and I must say Ive done quite a spiffing job :slight_smile: - I cannot seriously thankyou you enough for your time and knowledge.

Thankyou

6

Awesome, glad you got it working as you want it!
Glad to have helped :slight_smile: