Still celebrating National IT Professionals Day with 3 months of free Premium Membership. Use Code ITDAY17


Bevel like an object is underneath it.

Posted on 2006-07-19
Medium Priority
Last Modified: 2011-09-20
How can i achieve a better bevel than this like there is an object underneath it and it is rounded towards the screen...

either by brushing or layer styles etc...  thanks!
Question by:TheRookie32
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
  • 4
  • 2
LVL 26

Expert Comment

by:David Brugge
ID: 17165674
Bevel is usually used to refer to the rounded or angled edges of a raised, flat object. But the red arrow is pointer to the center of an object so I'm not quite sure about your question.
If I understand you correctly, you want to give the appearance that there is something beneath the surface of the plane that is raising it up. Whereas, the area that the arrow is pointing to looks to be an indention in the plane that is receding downwards.
Bevels, indents, grooves, ribs, reveals, beading and the like can be very difficult sometimes. If you draw a bump on a surface and then turn it upside down, it will look like an impression.

When we can’t see something in 3D, the brain needs other clues to tell it if something is moving forward or away.
I took the sample that you gave and increased the shadow and highlight.

It works because the brain already has a clue as to which way the light is shinning, and knows how objects will behave in that light.
The green arrow in the above figure points out the strong shadows that we need to match to make the object appear raised. These don’t quite match in darkness and softness of the shadow. A little more work would make the effect more convincing.

How this was done:
I drew a shape roughly the shave of the object in the sample. I filled it with the same color as the surface. Then I selected Bevel and Emboss in the layer style and adjusted the position of the light, the depth, the softness of the shadow and the degree of darkness to match the existing shadow.
Making the object lighter where the light would strike it adds to the effect. Because the sample was already fairly light, I darkened the background image just a touch so that the contrast would be more apparent.

As a last touch, I extended the painting of the object off of the edged of the canvas so that I would not see the embossing going across the top and the bottom of the object.

I hope that this is what you are looking for.

Author Comment

ID: 17172796
The pic i posted was a slice of something bigger i had been working on and you are right that when i look at it again, it does look more like an indent.  DO you think that haivng a shadow dead in the center of it would make it look more rounded?  Then whiter on the sides?
LVL 26

Accepted Solution

David Brugge earned 1000 total points
ID: 17173077
DO you think that haivng a shadow dead in the center of it would make it look more rounded?  Then whiter on the sides?

Try it and see!

Take a moment and look at something in the real world to see how the shadows fall. I made a little sketch to show why your origional looked like it was indented.

What I was trying to say before, taken out of context, the shadows of something indented looks exactly the same as something raised, they just come from a different direction. The brain looks for other clues to determine if something is raised or indented.
In the case of the sample that you show, the brain sees a strong shadow on one side of the underlying object, so it KNOWS which direction the light is comming from. It is the position of the shadows RELATIVE to where we think the light is comming from that tells us if something is raised or not.

Here is a sketch that shows how the shadows should line up to give one illusion or the other.
Concerto Cloud for Software Providers & ISVs

Can Concerto Cloud Services help you focus on evolving your application offerings, while delivering the best cloud experience to your customers? From DevOps to revenue models and customer support, the answer is yes!

Learn how Concerto can help you.

LVL 26

Expert Comment

by:David Brugge
ID: 17173124
I'm taking the long way to answer your question because I think that it is important to understand the basics.

In Photoshop, draw the basic shape WITHOUT the raised area on a layer.

Now apply your Bevel and Emboss layer style. Play around with the position of the light, size and the soften, the gloss contours, until you get a look that you like.

Then add a new layer, and using the same color as below, draw just the raised area.

Now select effects layer of first layer in the layers pallet, right click and select "copy layer style". Then select the top layer, right click, and select "paste layer style"

You should have a section that is raised up from the base. You can double click the effects layer of either layer to fine tune the effects.

Author Comment

ID: 17173178
No worries on taking the long route.  ;)  And that sketch you posted is great!  Did you make that?
LVL 26

Expert Comment

by:David Brugge
ID: 17173195
Yes I did. It keeps me from getting back to the work that I should be doing, but don't want to do.
Thanks, my kids always interupt me with "just the short answer, Dad."

Featured Post


Modern healthcare requires a modern cloud. View this brief video to understand how the Concerto Cloud for Healthcare can help your organization.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Introduction When sharing photos, especially via e-mail, the large resolution images that most cameras take today make for extremely large file sizes. The time required to upload these files to forums, send in e-mails, post to blogs or even placi…
In this article, I'll explain how to change the color of a selection in Photoshop. I'm sure there are a couple different ways to do this in photoshop, but this is my preferred method in Photoshop. I am using Photoshop CS6 and I will be adjusting the…
In this tutorial viewers will learn how to correct colors in Photoshop using the Color Balance adjustment Open a photo for editing in Photoshop: Open a photo for editing in Photoshop: Select "OK" on the dialogue: The Color Balance adjustment works b…
Illustrator's Shape Builder tool will let you combine shapes visually and interactively. This video shows the Mac version, but the tool works the same way in Windows. To follow along with this video, you can draw your own shapes or download the file…
Suggested Courses

662 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question