Stylization with a Purpose The Illustrative World of Team Fortress 2. Jason Mitchell

Size: px

Start display at page:

Download "Stylization with a Purpose The Illustrative World of Team Fortress 2. Jason Mitchell"

Peter Marsh
6 years ago
Views:

1 Stylzaton wth a Pupose The Illustatve Wold of Team Fotess 2 Jason Mtchell

2 Outlne Hstoy of Team Fotess Chaactes At decton Shadng algothms Envonments Meet the Team Post-shp Sneak Peek of the next Meet the Team shot!

3 Team Fotess Mod

4 INITIAL Team Fotess 2

5 INITIAL Team Fotess 2 M! c ed

6 Team Fotess 2

7 Why The Unque Vsual Style? Gameplay Readablty Bandng

hats and clothng folds Selected weapon What s he packn?

8 Read Heachy Team Fend o Foe? Colo Class Run o Attack? Dstnctve slhouettes Body popotons Weapons Colo Swatch Shoes, hats and clothng folds Selected weapon What s he packn? Hghest contast at chest level, whee weapon s held Gadent fom dak feet to lght chest

9 Ealy 20th Centuy Commecal Illustaton J. C. Leyendecke Dean Conwell Noman Rockwell

10 Ealy 20th Centuy Commecal Illustaton Chose to adopt specfc conventons of the commecal llustato J. C. Leyendecke: Shadng obeys a wam-to-cool hue shft. Shadows go to cool, not black Satuaton nceases at the temnato wth espect to a gven lght souce. The temnato s often eddened. On chaactes, nteo detals such as clothng folds ae chosen to echo slhouette shapes Slhouettes ae often emphaszed wth m hghlghts athe than dak outlnes

11 Clothng Folds J.C. Leyendecke Thanksgvng J.C. Leyendecke Tally-Ho, 1930

12 Rm Hghlghts Red Temnato J.C. Leyendecke Aow colla advetsement, 1929 J.C. Leyendecke Swmmn Hole, 1935

13 Rm Hghlghtng

14 Rm Hghlghtng

15 CHARACTER CREATION 1. Chaacte slhouette 2. Inteo shapes 3. Model sheet 4. 3D Model 5. Chaacte Skn 6. Fnal Chaacte n game

16 Chaacte Slhouette Buldng block of chaacte desgn Identfable at fst ead

17 Inteo Shapes Solvng nteo chaacte desgn wth shadow shapes Keep t conc Wok out desgn n thee quate pose

18 Model Sheet Use concept pantng as gude Solve desgn poblems usng slhouette only Solve nteo desgn wth shadow shapes

19 3D Model Match slhouette to model sheet Solve 3 quate desgn wth sceenshots / pantoves Model wth chaacte n mnd

20 Base Ambent Occluson map

21 Chaacte Skn

22 Fnal Chaacte 3D model wth textue and basc shadng

23 Engnee Concept

24 Engnee model

25 Pyo Concept

26 Pyo model

27 Chaacte Shadng Algothm Pevous wok n Non-Photoealstc Rendeng Chaacte lghtng equaton n Team Fotess 2

Gooch, 1998 Hue and lumnance shfts ndcate suface oentaton elatve to lght Blend between wam and cool based upon unclamped Lambetan tem, undelyng albedo and some fee paametes

28 Gooch, 1998 Hue and lumnance shfts ndcate suface oentaton elatve to lght Blend between wam and cool based upon unclamped Lambetan tem, undelyng albedo and some fee paametes Exteme lghts and daks ae eseved fo edge lnes and hghlghts Conventonal Shadng Gooch Shadng ( ) ( ) ( ) nˆ lˆ + k + α k + 1 nˆ lˆ + ( k + βk ) blue d yellow d

29 Half Lambet Typcally clamp N L to zeo at the temnato Half Lambet scales the -1 to 1 cosne tem (ed cuve) by ½, bases by ½ and squaes to pull the lght all the way aound (blue cuve) We have been applyng ths cuve snce Half-Lfe n 1998 Smla to Exaggeated Shadng [Rusnkewcz06] Lambetan Tem Half Lambet

30 Lake, 2000 Lake used a 1D textue lookup based upon the Lambetan tem to smulate the lmted colo palette catoonsts use fo pantng cels Also allows fo the ncluson of a vew-ndependent pseudo specula hghlght by ncludng a small numbe of bght texels at the lt end of the 1D textue map N L

31 Bala, 2006 Bala has extended ths technque by usng a 2D textue lookup to ncopoate vew-dependent and level-of-detal effects. Fesnel-lke ceates a had vtual backlght whch s essentally a m-lghtng tem, though ths tem s not desgned to coespond to any patcula lghtng envonment. N V N V N L N L

32 Chaacte Lghtng Equaton Chaacte Lghtng Equaton ( ) ( ) ˆ ˆ 2 1 ˆ =1 L d l n w c n a k ( ) ( ) ( ) [ ] ( ) ( ) v a k f u n v k f v f max k c m k spec k s s L ˆ ˆ ˆ ˆ ˆ, ˆ ˆ =1 + Vew ndependent Vew ndependent Vew Vew-dependent dependent

33 ( ) ( ) ˆ ˆ 2 1 ˆ =1 L d l n w c n a k Vew Independent Tems Vew Independent Tems Spatally-vayng dectonal ambent

34 ( ) ( ) ˆ ˆ 2 1 ˆ =1 L d l n w c n a k Vew Independent Tems Vew Independent Tems Spatally-vayng dectonal ambent Modfed Lambetan tems

k d Vew Independent Tems a L ( ) 1 ( ) 1 nˆ c w nˆ lˆ + + 2 =1 2

35 k d Vew Independent Tems a L ( ) 1 ( ) 1 nˆ c w nˆ lˆ =1 2 Spatally-vayng dectonal ambent Modfed Lambetan tems Unclamped Lambetan tem

36 k d Vew Independent Tems a L ( ) 1 ( ) 1 nˆ c w nˆ lˆ =1 2 Spatally-vayng dectonal ambent Modfed Lambetan tems Unclamped Lambetan tem Scale, bas and exponent

k d Vew Independent Tems a L ( ) 1 ( ) 1 nˆ c w nˆ lˆ + + 2 =1 2 Spatally-vayng dectonal ambent

37 k d Vew Independent Tems a L ( ) 1 ( ) 1 nˆ c w nˆ lˆ =1 2 Spatally-vayng dectonal ambent Modfed Lambetan tems Unclamped Lambetan tem Scale, bas and exponent Wapng functon Albedo 1 2 ( nˆ lˆ ) + 1 2

k d Vew Independent Tems a L ( ) 1 ( ) 1 nˆ c w nˆ lˆ + + 2 =1 2 Spatally-vayng dectonal

38 k d Vew Independent Tems a L ( ) 1 ( ) 1 nˆ c w nˆ lˆ =1 2 Spatally-vayng dectonal ambent Modfed Lambetan tems Unclamped Lambetan tem Scale, bas and exponent Wapng functon

39 k d Vew Independent Tems a L ( ) 1 ( ) 1 nˆ c w nˆ lˆ =1 2 Spatally-vayng dectonal ambent Modfed Lambetan tems Unclamped Lambetan tem Scale, bas and exponent Wapng functon Albedo

40 k d Vew Independent Tems a L ( ) 1 ( ) 1 nˆ c w nˆ lˆ =1 2 Spatally-vayng dectonal ambent Modfed Lambetan tems Unclamped Lambetan tem Scale, bas and exponent Wapng functon Albedo

41 ( ) ( ) ( ) [ ] ( ) ( ) v a k f u n v k f v f max k c m k spec k s s L ˆ ˆ ˆ ˆ ˆ, ˆ ˆ =1 + Vew Vew-dependent Tems dependent Tems

42 L =1 Vew-dependent Tems [ c k max( f ( vˆ ˆ ) k f k ( v ) )] spec, ˆ ˆ k m + ( nˆ uˆ ) f k a( vˆ ) s Multple Phong tems pe lght s

43 L =1 Vew-dependent Tems [ c k max( f ( vˆ ˆ ) k f k ( v ) )] spec, ˆ ˆ k m + ( nˆ uˆ ) f k a( vˆ ) s Multple Phong tems pe lght k m boad, constant exponent s

44 L =1 Vew-dependent Tems [ c k max( f ( vˆ ˆ ) k f k ( v ) )] spec, ˆ ˆ k m + ( nˆ uˆ ) f k a( vˆ ) s Multple Phong tems pe lght k m boad, constant exponent k spec exponent (constant o textue) s

45 L =1 Vew-dependent Tems [ c k max( f ( vˆ ˆ ) k f k ( v ) )] spec, ˆ ˆ k m + ( nˆ uˆ ) f k a( vˆ ) s Multple Phong tems pe lght k m boad, constant exponent k spec exponent (constant o textue) f s atst tuned Fesnel tem s

46 L =1 Vew-dependent Tems [ c k max( f ( vˆ ˆ ) k f k ( v ) )] spec, ˆ ˆ k m + ( nˆ uˆ ) f k a( vˆ ) s Multple Phong tems pe lght k m boad, constant exponent k spec exponent (constant o textue) f s atst tuned Fesnel tem f m Fesnel tem, (1-(n v)) 4 s

47 L =1 Vew-dependent Tems [ c k max( f ( vˆ ˆ ) k f k ( v ) )] spec, ˆ ˆ k m + ( nˆ uˆ ) f k a( vˆ ) s Multple Phong tems pe lght k m boad, constant exponent k spec exponent (constant o textue) f s atst tuned Fesnel tem f m Fesnel tem, (1-(n v)) 4 k m mask textue s

48 L =1 Vew-dependent Tems [ c k max( f ( vˆ ˆ ) k f k ( v ) )] spec, ˆ ˆ k m + ( nˆ uˆ ) f k a( vˆ ) s Multple Phong tems pe lght k m boad, constant exponent k spec exponent (constant o textue) f s atst tuned Fesnel tem f m Fesnel tem, (1-(n v)) 4 k m mask textue k s specula mask textue s

49 L =1 Vew-dependent Tems [ c k max( f ( vˆ ˆ ) k f k ( v ) )] spec, ˆ ˆ k m + ( nˆ uˆ ) f k a( vˆ ) s Multple Phong tems pe lght k m boad, constant exponent k spec exponent (constant o textue) f s atst tuned Fesnel tem f m Fesnel tem, (1-(n v)) 4 k m mask textue k s specula mask textue s

50 L =1 Vew-dependent Tems [ c k max( f ( vˆ ˆ ) k f k ( v ) )] spec, ˆ ˆ k m + ( nˆ uˆ ) f k a( vˆ ) s Multple Phong tems pe lght k m boad, constant exponent k spec exponent (constant o textue) f s atst tuned Fesnel tem f m Fesnel tem, (1-(n v)) 4 k m mask textue k s specula mask textue s

51 L =1 Vew-dependent Tems [ c k max( f ( vˆ ˆ ) k f k ( v ) )] spec, ˆ ˆ k m + ( nˆ uˆ ) f k a( vˆ ) s Multple Phong tems pe lght k m boad, constant exponent k spec exponent (constant o textue) f s atst tuned Fesnel tem f m Fesnel tem, (1-(n v)) 4 k m mask textue k s specula mask textue s

52 L =1 Vew-dependent Tems [ c k max( f ( vˆ ˆ ) k f k ( v ) )] spec, ˆ ˆ k m + ( nˆ uˆ ) f k a( vˆ ) s s Multple Phong tems pe lght k m boad, constant exponent k spec exponent (constant o textue) f s atst tuned Fesnel tem f m Fesnel tem, (1-(n v)) 4 k m mask textue k s specula mask textue Dedcated m lghtng a(v) Dectonal ambent evaluated wth v

53 L =1 Vew-dependent Tems [ c k max( f ( vˆ ˆ ) k f k ( v ) )] spec, ˆ ˆ k m + ( nˆ uˆ ) f k a( vˆ ) s s Multple Phong tems pe lght k m boad, constant exponent k spec exponent (constant o textue) f s atst tuned Fesnel tem f m Fesnel tem, (1-(n v)) 4 k m mask textue k s specula mask textue Dedcated m lghtng a(v) Dectonal ambent evaluated wth v k same m mask

54 L =1 Vew-dependent Tems [ c k max( f ( vˆ ˆ ) k f k ( v ) )] spec, ˆ ˆ k m + ( nˆ uˆ ) f k a( vˆ ) s s Multple Phong tems pe lght k m boad, constant exponent k spec exponent (constant o textue) f s atst tuned Fesnel tem f m Fesnel tem, (1-(n v)) 4 k m mask textue k s specula mask textue Dedcated m lghtng a(v) Dectonal ambent evaluated wth v k same m mask f same m Fesnel

L =1 Vew-dependent Tems [ c k max( f ( vˆ ˆ ) k f k ( v ) )] spec, ˆ ˆ k m + ( nˆ uˆ ) f k a( vˆ ) s s Multple Phong tems pe lght k m boad, constant exponent k spec exponent (constant o textue) f s

55 L =1 Vew-dependent Tems [ c k max( f ( vˆ ˆ ) k f k ( v ) )] spec, ˆ ˆ k m + ( nˆ uˆ ) f k a( vˆ ) s s Multple Phong tems pe lght k m boad, constant exponent k spec exponent (constant o textue) f s atst tuned Fesnel tem f m Fesnel tem, (1-(n v)) 4 k m mask textue k s specula mask textue Dedcated m lghtng a(v) Dectonal ambent evaluated wth v k same m mask f same m Fesnel n u tem that makes m hghlghts tend to come fom above (u s up vecto)

56 L =1 Vew-dependent Tems [ c k max( f ( vˆ ˆ ) k f k ( v ) )] spec, ˆ ˆ k m + ( nˆ uˆ ) f k a( vˆ ) s s Multple Phong tems pe lght k m boad, constant exponent k spec exponent (constant o textue) f s atst tuned Fesnel tem f m Fesnel tem, (1-(n v)) 4 k m mask textue k s specula mask textue Dedcated m lghtng a(v) Dectonal ambent evaluated wth v k same m mask f same m Fesnel n u tem that makes m hghlghts tend to come fom above (u s up vecto)

57 L =1 Vew-dependent Tems [ c k max( f ( vˆ ˆ ) k f k ( v ) )] spec, ˆ ˆ k m + ( nˆ uˆ ) f k a( vˆ ) s s Multple Phong tems pe lght k m boad, constant exponent k spec exponent (constant o textue) f s atst tuned Fesnel tem f m Fesnel tem, (1-(n v)) 4 k m mask textue k s specula mask textue Dedcated m lghtng a(v) Dectonal ambent evaluated wth v k same m mask f same m Fesnel n u tem that makes m hghlghts tend to come fom above (u s up vecto)

58 L =1 Vew-dependent Tems [ c k max( f ( vˆ ˆ ) k f k ( v ) )] spec, ˆ ˆ k m + ( nˆ uˆ ) f k a( vˆ ) s s Multple Phong tems pe lght k m boad, constant exponent k spec exponent (constant o textue) f s atst tuned Fesnel tem f m Fesnel tem, (1-(n v)) 4 k m mask textue k s specula mask textue Dedcated m lghtng a(v) Dectonal ambent evaluated wth v k same m mask f same m Fesnel n u tem that makes m hghlghts tend to come fom above (u s up vecto)

59 ENVIRONMENT DESIGN Ceatng a compellng, mmesve wold Team dstncton though mateal hue/value/satuaton. Impessonstc pantely look

60 CONTRASTING TEAM PROPERTIES Red Wam colos Natual mateals Angula geomety Blue Cool colos Industal mateals Othogonal foms

61 Red base n 2fot map

63 Blue Base n 2 fot map

65 ROUGH SHELL Ealy game sceenshot

66 CONCEPT 2D Pantove

67 ART PASS Fnal n-game sceenshot

68 Impessonstc textues Shot fom Spted Away

69 Myazak Bush Wdth Foeshotened Can easly magne a 3D camea move between these 2D vews of the same space Backgound plates fom Spted Away

70 Wold textung Textue map In-game Sceenshot

71 Wold textung Textue map In-game Sceenshot

72 Wold textung Textue map In-game Sceenshot

73 Wold textung Textue map In-game Sceenshot

74 Model textung Textue map In-game Sceenshot

Up-ezzed hands Moe facal moph tagets Moe

75 Class = Chaacte Defned pesonaltes and achetypes up font Consstent voce castng In-game taunt anmatons and context-senstve emotes So much blood Meet the Team shots Chaacte vgnette moves endeed wth game engne Game assets except: Up-ezzed hands Moe facal moph tagets Moe facal wnkle maps We fnd ouselves mxng the tems Class and Chaacte

76 How dd fans eact? NC Soft Volton Bowae Blzzad Nhlstc EA LA

77 Whee do we go fom hee? Successful multplaye games lve fo a long tme Regula updates va Steam Shpped 28 tmes snce the Beta n Septembe New featues, code optmzatons and explot fxes Ths s why we bult Steam & Steamwoks n the fst place Steam s not just a dgtal dstbuton system Can shp updates extemely quckly and fully engage the communty Extend expeence fo dedcated playes Maps Game modes Achevements New Medgun concept Unlockable weapons n Team Fotess 2 Can shp moe quckly than new maps and game modes

78 Meet The Scout Thngs to look fo Dstnct chaacte classes Shape and Shadng Analogous colo palette Pantely wold textung

79 Concluson Hstoy Chaactes At decton Shadng algothms Envonments Meet the Team Post-shp Meet the Scout

80 Refeences Bala, P., Thollot, J., & Makosan, L X-Toon: An Extended Toon Shade, NPAR 2006 Gooch, A. A., Gooch, B., Shley, P., and Cohen, E. A Non- Photoealstc Lghtng Model fo Automatc Techncal Illustaton, SIGGRAPH98. Lake, A., Mashall, C., Has, M., and Blacksten, M Stylzed Rendeng Technques fo Scalable Real-Tme 3D Anmaton, ACM Pess, New Yok, J.-D. Fekete and D. Salesn, Eds., Jason Mtchell, Moby Fancke and Dhabh Eng, Illustatve Rendeng n Team Fotess 2, ACM Symposum on Non-Photoealstc Anmaton and Rendeng, 2007

81 Readng Lst At Hstoy, Cnematogaphy & Gaphc Desgn Pantng wth Lght by John Alton The Scence of At: Optcal Themes n Westen At fom Bunellesch to Seuat by Matn Kemp Secet knowledge: Redscoveng the Lost Technques of the Old Mastes by Davd Hockney On Reflecton by Jonathan Mlle Anythng by Edwad Tufte o Macel Mnnaet

82 Questons?

Illustrative Rendering in Team Fortress 2

Illustrative Rendering in Team Fortress 2 Illutatve Rendeng n Team Fote 2 Jaon Mtchell Moby Fancke Dhabh Eng 2007 Valve Copoaton. All Rght Reeved. Outlne Motvaton and elated wok Envonment Chaacte and nteactve hadng Futue wok 2007 Valve Copoaton.