ThreePointLighting

Why?

The three-point lighting is a commonly used technique that makes a subject look better by providing balanced illumination, which reduces harsh shadows and highlights important details. The key light serves as the main light source, the fill light softens shadows, and the back light adds depth by separating the subject from the background. This setup enhances the subject’s three-dimensional appearance, making it look more lifelike and visually appealing.

⚠️ When used with dynamically moving subjects the lighting distance should be increased to cover the whole area of movement. Also, in this case manual targeting should be used to focus on the center point. Currently it is not possible to dynamically update the lighting target point so it moves with the target. Might be added later but the performance implications are currently unclear.

Requirements

This component can be used in an oncyber world and relies on the currently integrated versions of three.js and @oo/scripting. Changes in these packages might require updates to this component.

Preparation

Adjust the global lighting intensity of your world (LightingComponent) so it does not overpower the effect you want to achieve with the three-point lighting.

1. Setup & Targeting

Add this component to your world and target the lights (setting the center point of the lighting setup) using targeting mode Component or Manual (Three-Point Lighting Settings -> Subject)

Component Targeting
Positions of lights are based on the position of the subject. Go to Three-Point Lighting settings -> Subject and drag another component from your world into the Target field.

Manual Targeting
Go to Three-Point Lighting Settings -> Position & rotation and change the position to where you want the lighting to be centered on.

2. General Settings (optional)

Go to Three-Point Lighting Settings -> General to enable or disable the lighting and helpers (show position of lights in the editor) and adjust settings like vertical offset (Height) and distance relative to subject/target point (Distance)

3. Individual light adjustments (optional)

For each of the 3 lights there is a menu to enable/disable, adjust color, intensity, angle and offset to create all kinds of variations that suit your needs. The defaults are not set randomly but are based on best practice so it should work well out of the box, except lighting intensity has to be adapted to your scene. 

Remix

https://v2.oncyber.io/three-point-lighting

Feedback

Please comment below if you have any feature requests, found a bug or need help when using the component.

Changelog

• Aug 5, 2024 - v1.0.0 - Initial release