Difference between revisions of "Illustrative Rendering in Team Fortress 2"

From Team Fortress Wiki
Jump to: navigation, search
(hatnote + quote)
(They're not called strings, they're parameters)
 
(9 intermediate revisions by 4 users not shown)
Line 1: Line 1:
 
{{Infobox video
 
{{Infobox video
 
|preview=Irintf2
 
|preview=Irintf2
 +
|name=Illustrative Rendering in Team Fortress 2
 
|release_date=August 13, 2007
 
|release_date=August 13, 2007
 
|length=3:34
 
|length=3:34
 
}}
 
}}
{{Redirects here|Artstyle|Steam_Workshop#Items|l1=guidelines on TF2's visual style}}
+
{{Redirects here|Artstyle|Steam Workshop#Items|l1=guidelines on TF2's visual style}}
 
{{Quotation|'''Illustrative Rendering''' Abstract introduction|In ''Team Fortress 2'', we chose to employ an art style inspired by the early to mid 20th century commercial illustrators [[w:J. C. Leyendecker|J. C. Leyendecker]], [[w:Dean Cornwell|Dean Cornwell]] and
 
{{Quotation|'''Illustrative Rendering''' Abstract introduction|In ''Team Fortress 2'', we chose to employ an art style inspired by the early to mid 20th century commercial illustrators [[w:J. C. Leyendecker|J. C. Leyendecker]], [[w:Dean Cornwell|Dean Cornwell]] and
 
[[w:Norman Rockwell|Norman Rockwell]]. These artists were known for illustrating characters using strong, distinctive silhouettes with emphasis on clothing folds and they tended to use shading techniques which accentuated the internal shape of objects and characters with patterns of value while emphasizing silhouettes with rim highlights rather than dark outlines.}}
 
[[w:Norman Rockwell|Norman Rockwell]]. These artists were known for illustrating characters using strong, distinctive silhouettes with emphasis on clothing folds and they tended to use shading techniques which accentuated the internal shape of objects and characters with patterns of value while emphasizing silhouettes with rim highlights rather than dark outlines.}}
'''Illustrative Rendering in Team Fortress 2''' is a developer video showing off the creation of "illustrative rendering" as it pertains to ''Team Fortress 2''. It was originally shown at the 2007 International Symposium on Non-Photorealistic Animation and Rendering.
+
'''Illustrative Rendering in Team Fortress 2''' is a developer video showing off the creation, mechanics and usage of "illustrative rendering" as it pertains to processing the artstyle of ''Team Fortress 2''. It was originally shown at the [https://dl.acm.org/doi/proceedings/10.1145/1274871 2007 International Symposium on Non-Photorealistic Animation and Rendering].
  
 
== Video ==
 
== Video ==
 
{{youtube|ebvbVO1QE5o}}
 
{{youtube|ebvbVO1QE5o}}
 +
 +
== Video transcript ==
 +
{| class="wikitable collapsible collapsed" width="100%"
 +
! class="header" | Transcript
 +
|-
 +
|[''[[Playing With Danger (Soundtrack)|Playing With Danger]] plays as the camera pans to the [[classes]] outside of [[RED]]'s base in [[2Fort]] while the title of the video and the names of three developers (Jason Mitchell, [[Moby Francke]], and [[Dhabih Eng]]) appear.'']
 +
 +
'''Jason Mitchell''': "In this paper, we present a set of artistic choices and real-time shading techniques which support each other to enable the unique rendering style of ''[[Team Fortress 2]]''."
 +
 +
[''Concept art of the [[Engineer]], the [[Pyro]], and the [[Spy]] are shown before their in-game models on various areas in [[Well (Control Point)|Well]].'']
 +
 +
'''Jason Mitchell''': "Heavily influenced by early 20th century commercial illustrations, the 3D models and shading algorithms in Team Fortress 2 work together to quickly convey geometric information using rim highlights, as well as variation in luminance and hue, so the players are able to quickly identify other players in the game and assess the possible threat."
 +
 +
[''The Spy shoots the camera before it fades to black.'']
 +
 +
[''Cuts to static silhouettes of the nine mercenaries against a white background sliding across the screen.'']
 +
 +
'''Jason Mitchell''': "Through very intentional art direction, this goal was supported by designing characters with distinct silhouettes that can be easily identified even with no lighting cues. The body proportions, weapons, and silhouette lines were explicitly designed to give each character a unique silhouette.
 +
 +
[''The silhouettes fade into their coloured versions.'']
 +
 +
'''Jason Mitchell''': "In the shaded interior areas of the characters, the clothing folds were designed to echo silhouette shapes in order to emphasize the silhouettes, as observed in the commercial illustrations which inspired our designs."
 +
 +
[''Cuts to exterior shots of 2Fort.'']
 +
 +
'''Jason Mitchell''': "For the architectural elements of the world associated with each of the two teams, we define specific contrasting properties. While the RED team's architecture tends to use warm colours, wooden materials, and angular geometry, the BLU team's buildings are composed of cool colours, industrial materials, and orthogonal forms.
 +
 +
[''Concept art of the areas near the 2Fort [[Intelligence]] are shown before their in-game versions.'']
 +
 +
'''Jason Mitchell''': "By maintaining a minimal level of visual noise in our world design, we employ an almost impressionistic approach to modelling. This philosophy was also central to our texture painting style throughout the game. The red and blue colours used to paint opposing areas of the game world are analogues to one another as guided by this reference colour swatch with muted colours dominating and small areas of saturation used to provide further visual interest.
 +
 +
[''The colour swatch shows up on screen.'']
 +
 +
[''Parts of Well, such as floors and pipes, are shown with their texture on the right.'']
 +
 +
'''Jason Mitchell''': "The texture maps used on the 3D world are impressionistic and maintain a minimum level of visual noise. This is consistent with background plates found in animated films, particularly those of [[w:Hayao Miyazaki|Hayao Miyazaki]], in which broad brush strokes appear in perspective as if present in the 3D world, rather than on the 2D image plane. We apply the same approach because we feel that its inherent frame-to-frame coherence has superior perceptual properties to an image-spaced painterly approach."
 +
 +
[''Cut to the [[Heavy]] walking outside RED's base in Well with his [[Minigun]] revved up.'']
 +
 +
'''Jason Mitchell''': "To shade our characters, we combine a variety of traditional and novel lighting terms."
 +
 +
[''Heavy freezes and turns completely white with generic grey shadows.'']
 +
 +
'''Jason Mitchell''': "Here we see a character with a traditional clamped Lambertian diffuse term and constant ambient. You can see that the character loses definition for pixels not hit directly by the light source."
 +
 +
[''Heavy's shadows become redder, stronger and more contrasted while its light warp texture shows up on the bottom left.'']
 +
 +
'''Jason Mitchell''': "We scale, bias, and warp the Lambertian term to achieve a look consistent with our illustrative influences."
 +
 +
[''Heavy turns grey, showcasing the ambient cube.'']
 +
 +
'''Jason Mitchell''': "Instead of a constant ambient term, we sample from an irradiance volume in order to provide a higher quality spatially varying directional ambient term."
 +
 +
[''Heavy turns white again to show the new shadows.'']
 +
 +
'''Jason Mitchell''': "Here, we show this term added to the warped per-light diffuse contributions."
 +
 +
[''Heavy's textures return.'']
 +
 +
'''Jason Mitchell''': "And here, we show these diffuse terms multiplied with the albedo."
 +
 +
[''Heavy turns completely black. Faint, yellow highlights can be seen on some parts of his body and his Minigun.'']
 +
 +
'''Jason Mitchell''': "We also add a number of view-dependent terms to further enhance the look of the characters. Traditional Phong highlights from up to four local lights are incorporated, where quantities such as a scalar mask, Fresnel parameters, and specular exponents can be specified by artists. We combine these Phong highlights with additional broad Phong lobes which are modulated with a harsh Fresnel falloff, causing them to appear only at grazing angles."
 +
 +
[''The yellow highlights fade away in lieu of faint white rim lights.'']
 +
 +
'''Jason Mitchell''': "Finally, we add in a dedicated rim term which is derived from our irradiance volume, so that characters are always highlighted with an appropriate rim term, even if they are far away from local light sources."
 +
 +
[''The yellow highlights fade back in.'']
 +
 +
[''Heavy returns to normal, fully lit and fully shaded. He continues walking with his Minigun revved up.'']
 +
 +
[''Cut to Heavy firing his Minigun on [[Dustbowl]] in ''[[Meet the Heavy]]'' while the [[Team Fortress 2 (Main Theme) (Soundtrack)|Team Fortress 2 theme]] plays.'']
 +
 +
'''Jason Mitchell''': "This combination of art direction and technology choices has enabled us to create a compelling visual style while serving critical gameplay goals, such as the ability of players to readily identify each other during the fast-paced action of Team Fortress 2."
 +
 +
[''Cut to class group photo with Team Fortress 2 logo.'']
 +
|}
  
 
== Trivia ==
 
== Trivia ==
* The color palette in the video would return on the [[Steam Workshop|contribute page]] in order to guide users on how to color certain weapons and hats.
+
* The colour palette in the video would return on the [[Steam Workshop|contribute page]] in order to guide users on how to colour certain weapons and hats.
* The [[Pyro]], [[Spy]], [[Soldier]], [[Heavy]], and [[Engineer]] were showing a different type of Phong shading, while in-game they use basic "$phongexponent"s instead of their own "$phongexponenttexture"s.
+
* The [[Pyro]], [[Spy]], [[Soldier]], [[Heavy]], and [[Engineer]] were showing a different type of Phong shading, while in-game they use basic {{code|$phongexponent}} instead of their own {{code|$phongexponenttexture}} parameters.  
 
* In 0:55, some classes are different in the video. One consistent difference between all classes is that they used their beta heads, found in their gibs.  
 
* In 0:55, some classes are different in the video. One consistent difference between all classes is that they used their beta heads, found in their gibs.  
 
** Scout appears to wield the [[Nailgun]] which it didn't make it to the final game. His belt buckle is also darker.
 
** Scout appears to wield the [[Nailgun]] which it didn't make it to the final game. His belt buckle is also darker.
Line 29: Line 109:
 
* [https://steamcdn-a.akamaihd.net/apps/valve/2007/NPAR2007_IllustrativeRenderingInTeamFortress2.wmv Movie's original file]
 
* [https://steamcdn-a.akamaihd.net/apps/valve/2007/NPAR2007_IllustrativeRenderingInTeamFortress2.wmv Movie's original file]
 
* [https://steamcdn-a.akamaihd.net/apps/valve/2007/NPAR07_IllustrativeRenderingInTeamFortress2_Slides.pdf Accompanying slideshow]
 
* [https://steamcdn-a.akamaihd.net/apps/valve/2007/NPAR07_IllustrativeRenderingInTeamFortress2_Slides.pdf Accompanying slideshow]
 +
* [https://ghostarchive.org/varchive/ebvbVO1QE5o Archive link for YouTube movie (Low quality)]
  
 
{{Video nav}}
 
{{Video nav}}
  
 
[[Category:Videos]]
 
[[Category:Videos]]

Latest revision as of 19:09, 26 October 2024

Illustrative Rendering in Team Fortress 2
Irintf2.png
Video Info
Released: August 13, 2007
Run time: 3:34
"Artstyle" redirects here. You may have been looking for guidelines on TF2's visual style.
In Team Fortress 2, we chose to employ an art style inspired by the early to mid 20th century commercial illustrators J. C. Leyendecker, Dean Cornwell and Norman Rockwell. These artists were known for illustrating characters using strong, distinctive silhouettes with emphasis on clothing folds and they tended to use shading techniques which accentuated the internal shape of objects and characters with patterns of value while emphasizing silhouettes with rim highlights rather than dark outlines.
Illustrative Rendering Abstract introduction

Illustrative Rendering in Team Fortress 2 is a developer video showing off the creation, mechanics and usage of "illustrative rendering" as it pertains to processing the artstyle of Team Fortress 2. It was originally shown at the 2007 International Symposium on Non-Photorealistic Animation and Rendering.

Video

Video transcript

Trivia

  • The colour palette in the video would return on the contribute page in order to guide users on how to colour certain weapons and hats.
  • The Pyro, Spy, Soldier, Heavy, and Engineer were showing a different type of Phong shading, while in-game they use basic $phongexponent instead of their own $phongexponenttexture parameters.
  • In 0:55, some classes are different in the video. One consistent difference between all classes is that they used their beta heads, found in their gibs.
    • Scout appears to wield the Nailgun which it didn't make it to the final game. His belt buckle is also darker.
    • Soldier's RPG is from Trailers 1 and 2.
    • Pyro has a hose connecting their Flamethrower and gas canister. They also have completely solid emblems (instead of the slightly opaque ones on their final playermodel), and a black gas canister, with a smaller grey one accompanying it.
    • In 0:01, Demoman's class emblem is a stick of dynamite, as in release TF2. In 0:55, Demoman's class emblem is completely blank, like in Meet the Demoman.
    • Heavy's class emblem uses the prerelease skull and crossbones emblem, seen in Meet the Heavy.
    • At 0:28, Spy is seen with lighting and flex errors, giving him a ghoulish appearance. At 0:55, he has an appearance which can be seen in his locker and Ubercharge textures. His Revolver had a wooden grip instead of ivory, giving it a similar appearance to the Festive Revolver.
    • Medic uses his gib head model (with the texture used present on his body texture) & he also holds a black Syringe Gun.
    • At 0:01, Soldier uses a model for his head different to Trailer 1 and Trailer 2. But at 0:55, his head uses its Trailer appearance.

Resources