Rect Area Light not lighting up the fabric of Character model properly compared to the rest of the body

In these 2 images, I have used RectAreaLight for the first image, and SpotLight for the 2nd image. The RectAreaLight is not lighting up the fabric properly, I am not sure of what is the problem here, is it because of a material issue or something ?

This is how the RectAreaLight for the Girl has been set up in the scene

{/* Girl Fill Light */}

            <rectAreaLight

                ref={girlRectFillRef}

                position={[60.5, 1.75, -3.7]}

                width={0.75}

                height={2}

                color="#a5c0d5"

                intensity={0.8}

            />

This is how the Girl Character’s material structure is setup in the .jsx file that has been generated through gltfjsx, not sure if it would help or not

<skinnedMesh

                    name="Body"

                    geometry={nodes.Body.geometry}

                    material={materials.Skin_Mat}

                    skeleton={nodes.Body.skeleton}

                    rotation={[Math.PI / 2, 0, 0]}

                    scale={0.01}

                    frustumCulled={false}

                />

                <skinnedMesh

                    name="cloth_low"

                    geometry={nodes.cloth_low.geometry}

                    material={materials.Cloth_Mat}

                    skeleton={nodes.cloth_low.skeleton}

                    rotation={[Math.PI / 2, 0, 0]}

                    scale={0.01}

                    frustumCulled={false}

                />

                <skinnedMesh

                    name="Face"

                    geometry={nodes.Face.geometry}

                    material={materials.Skin_Mat}

                    skeleton={nodes.Face.skeleton}

                    rotation={[Math.PI / 2, 0, 0]}

                    scale={0.01}

                    frustumCulled={false}

                />

                <skinnedMesh

                    name="Hair"

                    geometry={nodes.Hair.geometry}

                    material={materials['Hair&Shoes_Mat']}

                    skeleton={nodes.Hair.skeleton}

                    rotation={[Math.PI / 2, 0, 0]}

                    scale={0.01}

                    frustumCulled={false}

                />

                <skinnedMesh

                    name="L_Eye_Ball"

                    geometry={nodes.L_Eye_Ball.geometry}

                    material={materials.Skin_Mat}

                    skeleton={nodes.L_Eye_Ball.skeleton}

                    rotation={[Math.PI / 2, 0, 0]}

                    scale={0.01}

                    frustumCulled={false}

                />

                <skinnedMesh

                    name="L_Eye_Brow"

                    geometry={nodes.L_Eye_Brow.geometry}

                    material={materials.Skin_Mat}

                    skeleton={nodes.L_Eye_Brow.skeleton}

                    rotation={[Math.PI / 2, 0, 0]}

                    scale={0.01}

                    frustumCulled={false}

                />

                <skinnedMesh

                    name="L_Eye_lash"

                    geometry={nodes.L_Eye_lash.geometry}

                    material={materials.Skin_Mat}

                    skeleton={nodes.L_Eye_lash.skeleton}

                    rotation={[Math.PI / 2, 0, 0]}

                    scale={0.01}

                    frustumCulled={false}

                />

                <skinnedMesh

                    name="L_shoes"

                    geometry={nodes.L_shoes.geometry}

                    material={materials['Hair&Shoes_Mat']}

                    skeleton={nodes.L_shoes.skeleton}

                    rotation={[Math.PI / 2, 0, 0]}

                    scale={0.01}

                    frustumCulled={false}

                />

                <skinnedMesh

                    name="Lower_teeth"

                    geometry={nodes.Lower_teeth.geometry}

                    material={materials.Skin_Mat}

                    skeleton={nodes.Lower_teeth.skeleton}

                    rotation={[Math.PI / 2, 0, 0]}

                    scale={0.01}

                    frustumCulled={false}

                />

                <skinnedMesh

                    name="R_Eye_Ball"

                    geometry={nodes.R_Eye_Ball.geometry}

                    material={materials.Skin_Mat}

                    skeleton={nodes.R_Eye_Ball.skeleton}

                    rotation={[Math.PI / 2, 0, 0]}

                    scale={0.01}

                    frustumCulled={false}

                />

                <skinnedMesh

                    name="R_Eye_Brow"

                    geometry={nodes.R_Eye_Brow.geometry}

                    material={materials.Skin_Mat}

                    skeleton={nodes.R_Eye_Brow.skeleton}

                    rotation={[Math.PI / 2, 0, 0]}

                    scale={0.01}

                    frustumCulled={false}

                />

                <skinnedMesh

                    name="R_Eye_lash"

                    geometry={nodes.R_Eye_lash.geometry}

                    material={materials.Skin_Mat}

                    skeleton={nodes.R_Eye_lash.skeleton}

                    rotation={[Math.PI / 2, 0, 0]}

                    scale={0.01}

                    frustumCulled={false}

                />

                <skinnedMesh

                    name="R_shoes"

                    geometry={nodes.R_shoes.geometry}

                    material={materials['Hair&Shoes_Mat']}

                    skeleton={nodes.R_shoes.skeleton}

                    rotation={[Math.PI / 2, 0, 0]}

                    scale={0.01}

                    frustumCulled={false}

                />

                <skinnedMesh

                    name="Tounge"

                    geometry={nodes.Tounge.geometry}

                    material={materials.Skin_Mat}

                    skeleton={nodes.Tounge.skeleton}

                    rotation={[Math.PI / 2, 0, 0]}

                    scale={0.01}

                    frustumCulled={false}

                />

                <skinnedMesh

                    name="Upper_teeth"

                    geometry={nodes.Upper_teeth.geometry}

                    material={materials.Skin_Mat}

                    skeleton={nodes.Upper_teeth.skeleton}

                    rotation={[Math.PI / 2, 0, 0]}

                    scale={0.01}

                    frustumCulled={false}

                />

RectAreaLight work with units where 1 is 1 meter, not santimeter. Increasing intensity will give not good result. Try set scale of girl to 0.1 or 0.01

Okay, but if it is properly lighting the skin of the character and the issue is only happening with the fabric, are you sure the problem is with the scale of the model ?

Not sure. I just remember that rectarealight love small objects and to be close to them.

RectAreaLight only MeshStandardMaterial and MeshPhysicalMaterial are supported.

1 Like