Commits

Jason McKesson  committed 50546ad

Tut12: Almost all images complete. Need the 2.2 Gamma function graph.

  • Participants
  • Parent commits f9a380d

Comments (0)

Files changed (16)

File Documents/Illumination/Blinn vs Phong Compare.png

Old
Old image
New
New image

File Documents/Illumination/DarkDayVsNight.png

Added
New image

File Documents/Illumination/Gamma Compare.png

Added
New image

File Documents/Illumination/Gamma Correction.png

Added
New image

File Documents/Illumination/Gamma Lighting.png

Added
New image

File Documents/Illumination/GammaCorrectFunc.mathml

+<?xml version="1.0" encoding="UTF-8"?>
+
+<math xmlns="http://www.w3.org/1998/Math/MathML">
+  <mrow>
+   <mi mathvariant="italic">GammaRGB</mi>
+   <mo>=</mo>
+   <msup>
+    <mi mathvariant="italic">LinearRGB</mi>
+		<mfrac>
+			<mrow>
+				<mn>1</mn>
+			</mrow>
+			<mrow>
+				<mi>γ</mi>
+			</mrow>
+		</mfrac>
+   </msup>
+  </mrow>
+</math>

File Documents/Illumination/GammaCorrectFunc.svg

+<?xml version="1.0" encoding="utf-8"?>
+<svg:svg xmlns="http://www.w3.org/1998/Math/MathML" xmlns:svg="http://www.w3.org/2000/svg" height="19.901826pt" width="135.307297pt" xmlns:svgmath="http://www.grigoriev.ru/svgmath" viewBox="0 -17.311982 135.307297 19.901826"><svg:metadata><svgmath:metrics top="19.9018255485" axis="6.57421875" baseline="2.58984375" bottom="2.40234375"/></svg:metadata><svg:text font-size="12.000000" text-anchor="middle" y="0.000000" x="30.662109" font-family="Times New Roman" font-style="italic" fill="black">GammaRGB</svg:text><svg:g transform="translate(64.657555, -3.984375)"><svg:text font-size="12.000000" text-anchor="middle" y="3.984375" x="3.383789" font-family="Times New Roman" fill="black">=</svg:text></svg:g><svg:g transform="translate(74.758469, 0.000000)"><svg:text font-size="12.000000" text-anchor="middle" y="0.000000" x="28.051758" font-family="Times New Roman" font-style="italic" fill="black">LinearRGB</svg:text><svg:g transform="translate(55.716797, -11.039770)"><svg:g transform="translate(0.416016, -0.865962)"><svg:text font-size="8.000000" text-anchor="middle" y="0.000000" x="2.000000" font-family="Times New Roman" fill="black">1</svg:text></svg:g><svg:g transform="translate(0.839844, 4.401118)"><svg:text font-size="8.000000" text-anchor="middle" y="0.000000" x="1.576172" font-family="Times New Roman" font-style="italic" fill="black">γ</svg:text></svg:g><svg:line stroke-width="0.416016" x1="0.000000" x2="4.832031" stroke="black" stroke-linecap="butt" stroke-dasharray="none" y1="0.000000" y2="0.000000" fill="none"/></svg:g></svg:g></svg:svg>

File Documents/Illumination/GammaFunc.mathml

+<?xml version="1.0" encoding="UTF-8"?>
+
+<math xmlns="http://www.w3.org/1998/Math/MathML">
+  <mrow>
+   <mi mathvariant="italic">LinearRGB</mi>
+   <mo stretchy="false">∝</mo>
+   <msup>
+    <mi mathvariant="italic">Voltage</mi>
+	<mi>γ</mi>
+   </msup>
+  </mrow>
+</math>

File Documents/Illumination/GammaFunc.svg

+<?xml version="1.0" encoding="utf-8"?>
+<svg:svg xmlns="http://www.w3.org/1998/Math/MathML" xmlns:svg="http://www.w3.org/2000/svg" height="13.105664pt" width="114.344231pt" xmlns:svgmath="http://www.grigoriev.ru/svgmath" viewBox="0 -10.515820 114.344231 13.105664"><svg:metadata><svgmath:metrics top="13.1056640625" axis="6.57421875" baseline="2.58984375" bottom="0.0"/></svg:metadata><svg:text font-size="12.000000" text-anchor="middle" y="0.000000" x="28.051758" font-family="Times New Roman" font-style="italic" fill="black">LinearRGB</svg:text><svg:g transform="translate(59.050133, -3.984375)"><svg:text font-size="12.000000" text-anchor="middle" y="3.468750" x="5.639648" font-family="Lucida Sans Unicode" fill="black">∝</svg:text></svg:g><svg:g transform="translate(73.662766, 0.000000)"><svg:text font-size="12.000000" text-anchor="middle" y="0.000000" x="18.662109" font-family="Times New Roman" font-style="italic" fill="black">Voltage</svg:text><svg:g transform="translate(37.324219, -6.750879)"><svg:text font-size="8.520000" text-anchor="middle" y="0.000000" x="1.678623" font-family="Times New Roman" font-style="italic" fill="black">γ</svg:text></svg:g></svg:g></svg:svg>

File Documents/Illumination/HDR Lighting.png

Added
New image

File Documents/Illumination/Light Clipping.png

Added
New image

File Documents/Illumination/Scene Lighting.png

Added
New image

File Documents/Illumination/Tutorial 12.xml

             Only surfaces directly facing one of the lights should be illuminated.</para>
         <para>The <phrase role="propername">Scene Lighting</phrase> tutorial demonstrates the first
             version of attempting to replicate this scene.</para>
-        <!--TODO: Image of the tutorial.-->
+        <figure>
+            <title>Scene Lighting</title>
+            <mediaobject>
+                <imageobject>
+                    <imagedata fileref="Scene%20Lighting.png"/>
+                </imageobject>
+            </mediaobject>
+        </figure>
         <para>The camera is rotated and zoomed as in prior tutorials. Where this one differs is that
             the camera's target point can be moved. The <keycap>W</keycap>, <keycap>A</keycap>,
                 <keycap>S</keycap>, and <keycap>D</keycap> keys move the cameras forward/backwards
                     <keycap>L</keycap> to switch back to day-optimized lighting). Here, the point
                 lights provide reasonable lighting at night. The ground is still dark when facing
                 away from the lights, but we can reasonably see things.</para>
-            <!--TODO: Picture of the dark tutorial, night-optimized vs day-optimized.-->
-            <para>The problem is that, in daylight, the point lights are too powerful. They are very
-                visible and have very strong effects on the scene. Also, they cause some light
-                problems when one of the point lights is in the right position.</para>
-            <!--TODO: Picture of the night-optimized clipping problem.-->
+            <figure>
+                <title>Darkness, Day vs. Night</title>
+                <mediaobject>
+                    <imageobject>
+                        <imagedata fileref="DarkDayVsNight.png"/>
+                    </imageobject>
+                </mediaobject>
+            </figure>
+            <para>The problem is that, in daylight, the night-optimized point lights are too
+                powerful. They are very visible and have very strong effects on the scene. Also,
+                they cause some light problems when one of the point lights is in the right
+                position. At around 12:50, find the floating white light near the cube:</para>
+            <figure>
+                <title>Light Clipping</title>
+                <mediaobject>
+                    <imageobject>
+                        <imagedata fileref="Light%20Clipping.png"/>
+                    </imageobject>
+                </mediaobject>
+            </figure>
             <para>Notice the patch of iridescent green. This is <glossterm>light
                     clipping</glossterm> or light clamping, and it is usually a very undesirable
                 outcome. It happens when the computed light intensity falls outside of the [0, 1]
             aperture. It's quite a simple function, really. First, we pick a maximum intensity value
             for the scene; intensity values above this will be clamped. Then, we just divide the HDR
             value by the maximum intensity to get the LDR value.</para>
-        <!--TODO: Equation of LDR = HDR/max.-->
         <para>It is the maximum intensity that we will vary. As the sun goes down, the intensity
             will go down with it. This will allow the sun to be much brighter in the day than the
             lights, thus overwhelming their contributions to the scene's illumination. But at night,
                 <keycap>L</keycap>
             </keycombo> will go back to day or night-time LDR lighting from the last tutorial,
             respectively.</para>
-        <!--TODO: Image of HDR lighting tutorial.-->
+        <figure>
+            <title>HDR Lighting</title>
+            <mediaobject>
+                <imageobject>
+                    <imagedata fileref="HDR%20Lighting.png"/>
+                </imageobject>
+            </mediaobject>
+        </figure>
         <para>The code is quite straightforward. We add a floating-point field to the
                 <classname>Light</classname> uniform block and the <classname>LightBlock</classname>
             struct in C++. Technically, we just steal one of the padding floats, so the size remains
                 function of CRT displays. The strength of the electron beam is controlled by the
                 voltage passed through it. This correlates with the light intensity as
                 follows:</para>
-            <!--TODO: Equation of linearRGB varies with voltage^γ-->
+            <equation>
+                <title>Display Gamma Function</title>
+                <mediaobject>
+                    <imageobject>
+                        <imagedata fileref="GammaFunc.svg" format="SVG"/>
+                    </imageobject>
+                </mediaobject>
+            </equation>
             <para>This is called a gamma function due to the Greek letter γ (gamma). The input
                 signal directly controls the voltage, so the input signal needed to be corrected for
                 the power of gamma.</para>
             <para>So, given the gamma function above, we need to output values from our shader that
                 will result in our original linear values after the gamma function is applied. This
                 is gamma correction, and the function for that is straightforward.</para>
-            <!--TODO: Equation of gammaRGB = linearRGB^(1/γ)-->
+            <equation>
+                <title>Gamma Correction Function</title>
+                <mediaobject>
+                    <imageobject>
+                        <imagedata fileref="GammaCorrectFunc.svg" format="SVG"/>
+                    </imageobject>
+                </mediaobject>
+            </equation>
             <para>It would be interesting to see a graph of these functions, to speculate about what
                 we will see in our gamma-correct images.</para>
-            <!--TODO: Picture, recreating the Wikipedia article's gamma function.-->
+            <!--TODO: SVG, recreating the Wikipedia article's gamma function.-->
             <para>Without gamma correction, our linearRGB colors (the diagonal line in the graph)
                 would become the CRT gamma curve at the bottom. This means that what we have been
                 seeing is a <emphasis>severely</emphasis> darkened version of our colors. A
             <para>The <keycap>K</keycap> key toggles gamma correction. The default gamma value is
                 2.2, but it can be raised and lowered with the <keycap>Y</keycap> and
                     <keycap>H</keycap> keys respectively.</para>
-            <!--TODO: Picture of the gamma correction, with HDR lighting.-->
+            <figure>
+                <title>Gamma Correction</title>
+                <mediaobject>
+                    <imageobject>
+                        <imagedata fileref="Gamma%20Correction.png"/>
+                    </imageobject>
+                </mediaobject>
+            </figure>
             <para>That is very bright; it uses the same HDR-based lighting environment from the
                 previous tutorials. Let's look at some code.</para>
             <para>The gamma value is an odd kind of value. Conceptually, it has nothing to do with
                     <keycap>Shift</keycap>
                     <keycap>L</keycap>
                 </keycombo>:</para>
-            <!--TODO: Picture of the gamma correction, with Gamma lighting.-->
+            <figure>
+                <title>Gamma Lighting</title>
+                <mediaobject>
+                    <imageobject>
+                        <imagedata fileref="Gamma%20Lighting.png"/>
+                    </imageobject>
+                </mediaobject>
+            </figure>
             <para>This is more like it.</para>
             <para>If there is one point you should learn from this exercise, it is this: make sure
                 that you implement gamma correction and HDR <emphasis>before</emphasis> trying to
                 the lighting work right. This lighting environment was developed from
                 scratch.</para>
             <para>One thing we can notice when looking at the gamma correct lighting is that proper
-                gamma correction improves shadow details substantially. And looking at the function,
-                this makes sense. Without proper gamma correction, fully half of the linearRGB range
-                is shoved into the bottom one-fifth of the available light intensity. That doesn't
-                leave much room for areas that are dark, but not too dark to see anything.</para>
+                gamma correction improves shadow details substantially:</para>
+            <figure>
+                <title>Gamma Shadow Details</title>
+                <mediaobject>
+                    <imageobject>
+                        <imagedata fileref="Gamma%20Compare.png"/>
+                    </imageobject>
+                </mediaobject>
+            </figure>
+            <para>These two images use HDR lighting; the one on the left doesn't have gamma
+                correction, and the one on the right does. Notice how easy it is to make out the
+                details in the hills near the triangle on the right.</para>
+            <para>Looking at the gamma function, this makes sense. Without proper gamma correction,
+                fully half of the linearRGB range is shoved into the bottom one-fifth of the
+                available light intensity. That doesn't leave much room for areas that are dark, but
+                not too dark to see anything.</para>
             <para>As such, gamma correction is a key process for producing color-accurate rendered
                 images.</para>
         </section>

File Tut 12 Dynamic Range/Gamma Correction.cpp

 LightManager g_lights;
 
 Framework::RadiusDef radiusDef = {50.0f, 3.0f, 80.0f, 4.0f, 1.0f};
-glm::vec3 objectCenter = glm::vec3(-59.5f, 4.0f, 65.0f);
+glm::vec3 objectCenter = glm::vec3(-59.5f, 44.0f, 95.0f);
 
 Framework::MousePole g_mousePole(objectCenter, radiusDef);
 

File Tut 12 Dynamic Range/HDR Lighting.cpp

 LightManager g_lights;
 
 Framework::RadiusDef radiusDef = {50.0f, 3.0f, 80.0f, 4.0f, 1.0f};
-glm::vec3 objectCenter = glm::vec3(-59.5f, 4.0f, 65.0f);
+glm::vec3 objectCenter = glm::vec3(-59.5f, 44.0f, 95.0f);
 
 Framework::MousePole g_mousePole(objectCenter, radiusDef);
 

File Tut 12 Dynamic Range/Scene Lighting.cpp

 LightManager g_lights;
 
 Framework::RadiusDef radiusDef = {50.0f, 3.0f, 80.0f, 4.0f, 1.0f};
-glm::vec3 objectCenter = glm::vec3(-59.5f, 4.0f, 65.0f);
+glm::vec3 objectCenter = glm::vec3(-59.5f, 44.0f, 95.0f);
 
 Framework::MousePole g_mousePole(objectCenter, radiusDef);