Tutorial: Working with Lighting through Components

Transcription

1 Tutorial: Working with Lighting through Components With a populated scene we can begin layering in light sources to add realism and light to our level. For this we will need to use an environmental probe to define the render area, the Time of Day Editor and light entities. You will learn how to do the following: Set up an Environmental Probe Modify lighting with the Time of Day Editor Set up lights using light components Prerequisites This tutorial requires that you have successfully downloaded and installed the Lumberyard Editor. This tutorial also requires you to use the getting started levels included with the Lumberyard download. You must have the following before starting this tutorial: Lumberyard Editor v or greater It is recommended that you are familiar with the Lumberyard component system, and have been following along with the Component basics series, you may want to complete these tutorial first. Introduction to Components and Mesh Component. Quick Start Guide: Lighting. Step 1: Setting up the Environmental Probe with Components For this tutorial we will be working in a set level from the Getting Started levels in the editor. This is a pretty simple process, you want to open the editor and open a level rather than making a new level. To open the provided level follow these steps: 1. If you have been following along with the Getting Started Series, open your My_First_Level file and skip ahead to Step 2. Otherwise, open your lumberyard editor, and click the Open Level button on the Welcome Screen.

2 2. Next we will open the level, the level we want to open is called, start-section04-lighting located at GettingStartedFiles> start-section04-lighting And now you should see a scene similar to the image below.

3 The next step in the tutorial is to set up the Environmental Probe in order to define the area within the viewport we wish to render lights and shadows. The probe also gives us control over cubemap resolution, shadow color and many other options for controlling render settings. To set up an Environmental Probe please follow these steps: 1. Right click in the Viewport and choose the option to Create New Component Entity. 2. In the Entity Outliner your new Entity should be selected already, so we will now add a Rendering Component to the entity. To do this click the Add Component button, in the Entity Inspector and navigate to Rendering -> Light -> Environment Probe.

4 3. Next we will want to play with the settings of the Environment Probe component in the Entity Inspector. In the light properties panel, set the Area X,Y,Z values to the size of the entire map. In this file, that should be X=1024, Y=1024 and Z=250 Tip: if you have the helper on you should see the environmental probe area box at the edges of the map like the image below.

5 4. Now that the probe's properties are set, it's time to create a Cubemap. To do this, we need to click on the Create button in the Light Properties panel in the Entity Inspector, and wait for the Cubemap to generate. It will take a couple of minutes. Congratulations!!! You have now set up a basic environmental probe to render lighting, and you should notice the shadows of the scene get a bit lights and much more realistic. Your scene should look something like this.

6 Step 2: Using the Time of Day Editor The Time of Day Editor gives us the ability to quickly change and even animate the global lighting cast by the sun and moon. The Time of Day editor features a variety of tools to adjust and manage time of day settings. This tutorial focuses only on changing the time of day. To set the Time of Day please follow these steps: 1. Open the Time of Day Editor by selecting it through Tools -> Other -> Time of Day or by clicking the Icon in the Editor Toolbar.

7 2. The Time of Day Editor contains the following menus and settings: 1. Editor toolbar - Icon toolbar for most common functions: Undo, Redo, Import, Export. 2. HDR Settings - Settings to manage HDR lighting 3. Time of Day Tasks - Management of basic tasks within the time of day editor 4. Current Time - Display of times, start/end, and play speed 5. Update Tasks - Controls to update the play or stop of time of day, based on play speed setting 6. Timeline editor - Management of light settings along a 24-hour time cycle 7. Parameters - Lighting settings to adjust time of day conditions 3. In the Tasks area, choose Import from File. Navigate to SamplesProject -> Levels -> GettingStartedFiles and open TimeOfDay.xml. This loads a set of time of day settings created for this tutorial. Notice the changes in light, fog, and sky colors.

8 4. In the timeline, slide the time line marker (set at 12:00 by default) to 21:00. Your scene now shows night. Experiment with changing the timeline marker to different times of day to see the lighting changes in your scene. Observe how this time adjustment also changes the settings in the Parameters area. Now that our scene is set to nighttime we are ready to add some light entities to our level. Step 3: Setting up Light Components In this section we will begin adding some entities to our level and adding Light components to those entities. To add entities with Light components to your scene please follow these steps: 1. First we will want to navigate our viewport so we are looking closely at the lamp posts. We will be attaching our entities with light components to the lamps posts to make them look turned on. 2. Next right click in the Viewport and choose the Create New Component Entity option. 3. Next with the entity selected in the Entity Outliner we will go to the Entity Inspector panel and click the Add Component button. Then, navigate to Rendering -> Light -> Projector Light to attach the component to the new entity.

9 4. Position the newly created light entity just under one of the lamp posts. The light is oriented sideways. Use the rotate tool to select and rotate the light entity so that the X Axis points down toward the ground. 5. Next we need to add a texture for our light shape. To do this click the button in the Light properties panel of the Entity Inspector next to the Texture field open the directory \SamplesProject\textures\lights\generic. Open spot_075.dds.

10 6. In the Light Properties Panel, you can modify a variety of settings to customize the light. For this tutorial, use the following settings: 1. Color = 250,250, Diffuse Multiplier = Max Distance = AttenuationBulbSize = 6 5. FOV = Experiment with these settings to get a feel for how the differences between bulb size, radius, and diffuse multiplier change based on the input values you use. Copy the light and place one under each streetlight. When finished your light should look something like this:

11 8. Next, lets add some fill lights to soften those dark areas in-between the streetlights. Right click in the Viewport and choose the Create Component Entity option again. Next with the entity selected in the Entity Outliner we will go to the Entity Inspector panel and click the Add Component button. Then, navigate to Rendering -> Lights -> Area Light to attach the component to the new entity. 1. Color = 250,250, Diffuse Multiplier = Max Distance =u Area Width = 5 5. Area Height = 5

12 9. Position the newly created light entity in-between two streetlights and above the ground. Experiment with these settings to get a feel for how the differences between bulb size, radius, and diffuse multiplier change based on the input values you use. Copy the light and place one under each streetlight. When finished your light should look something like this: Congratulations! You have successfully added entities with light components to your scene. Related Tasks and Tutorials Now that you have a level with lights and shadows, let s see what else you can add with components. The Camera Component Working with Physics and Collider Components Want to learn more about Lumberyard? Visit the complete Lumberyard Tutorials Page. We d love to hear from you! Head to our Tutorial Discussion forum to share any feedback you have, including what you do or don t like about our tutorials or new content you d like to see in the near future.