Problem with detail of edges

[kalabedo]

Hi there,

I’m working on a website displaying different doors
In some cases, a small portion of the door is cut out to show a specific model line. Cutting out works perfectly with “react-three-csg”. The problem I encountered is the following: Since the doors are painted, it is hard to distinguish the door surface from the cutouts. I tried to solve the whole thing with lighting/shadowing, but didn’t find a suitable solution. Does anyone have an idea how I can lift the whole thing so that the cutouts are clearly visible? Attached below are the images:

Here is what i want to achieve (related to the edge visibility):

[PavelBoytchev]

My suggestion is to try EdgesGeometry. The left image is with slightly protruding details, but because of the colors they are hard to see. The right image has edges drawn with the help of EdgesGeometry.

[drcmda]

if it’s supposed to be realistic im not sure about edge geo. i would try n8a0. if you have the model in a quick codesandbox i can try.

[kalabedo]

Hi @drcmda here is a link to a simplified codesandbox i made:

EdgeTest - CodeSandbox

What is n8a0? i did not find anything on that term:)

[drcmda]

i only see a plain plank in that link. here’s a door from sketchfab with ao. ao is ambient occlusion. lingering-lake-5dx7ks - CodeSandbox

[kalabedo]

It looks like a plank, but its a door with a slight cutout, same as i have in my project:)

[Chaser_Code]

Ambient occlusion

[drcmda]

try to apply the code, but these insets are too slim, i think only very harsh light will edge them out. ps, needs a refresh, made a small mistake canceling out the effect.

and this is the difference between ao and no ao

[kalabedo]

yeah you are right, with this small cutout it makes no difference… The cutouts can change in size, i guess my solution to make them more visible is to load a transparent greyscale image with it to imitate the shadows. Just to make sure the user can see the cutouts properly.
Thanks for your help though i learned a bit more about postprocessing:)

[kalabedo]

I fixed it. My problem was, that my cutouts had no rounded edges. Here is a comparison of the cutout with and without rounded edges:

Rounded:

Not Rounded: