Art Directing VFX for Stylized Games

stylized games the format is micro talks so they're about 11 minutes each before speakers hopefully time at the end for questions it's the idea is that there's four completely different projects from different companies all with different visual styles and goals and hopefully I'll come away with different approaches to stylized effects so why are we here a lot of times X teams for games can be short staffed and you've got a lot of work to do so you're often left to do a lot of the art direction on your own and you don't usually get a lot of concept art and iteration in that way for effects so games with the more realistic style often it's a lot clearer to understand where you're supposed to get to with unique art styles it's a little bit harder to find the path to the final result so we've got myself Jeremy Mitchell from Double Fine shin from Motyka bill clatters from epic and Brianna from volition so my name is Jeremy Mitchell I'm a senior VFX artist at Double Fine and making games for ten years or so here's some games I worked on and today I'm gonna talk about head lander which is a side-scrolling action game from Double Fine and just so you know it's about I'll play this little clip from a trailer it's not a whole trailer just a short clip just been revived but there just ahead living in a helmet that is a scientific with this helmet our hero and remove those pesky heads and jog into their neck holes and take the wheel so as you can tell Highlander has a pretty unique visual style it's based heavily on themes from 70s sci-fi movies so the goal of the game was to capture the look and feel of these movies so the point of this short talk is about my approach and thought process when trying to do effects for this game so since we wanted to look like they were pluck straight out of a 70s sci-fi film we've looked at a bunch of classic films like the ones you see here to reference themes and ideas for just the overall design of the game and for environment art and the general art in the game it was pretty clear that you'd use 70s sci-fi sort of design inspiration but for effects it was a little harder to tell exactly where we should go so when I was watching these I noticed a few key points about effects in these films the first is that there's two types of sort of styles for VFX the first is sort of standard Hollywood practical effects these are things are shot on set filmed in with real lighting in the real world and there are generally 2d hand-animated rotoscope effects that are done through film process after the fact and these generally tend to sit on top of the frame and not integrated well with the background and there are a few artifacts that give this away and so you can see here this shot from 1979's black hole these laser hits did not integrated with the background at all there you can see these little sparks that come off of them they're clearly hand animated but then there's these blue flashes that are definitely shot on set practically so the things that give it away are like a lower frame rate lack of lighting influence on the environment and often the hand animated effects will drift or stick to the camera in strange ways which is an interesting point for a 2d side-scroller game where you kind of want the gameplay centric effects to be separated from the background so the idea was to extract these sort of artifacts and wield them for stylistic direction so this was sort of the loose rule set going forwards that any effects that would be real-world if it were a film would just be done with traditional like fluid sims and textures and all that nothing unique there but to keep the film metaphor alive anything that would have been done in post with sort of a chemical process or hand animation I would try to play up the cheap 2d effect to capture some of that vintage artifacts so I'm not really going to talk about explosions or any of those traditional VFX stuff because that's the well-trodden ground but I'll move onto something more exciting in my opinion which is bad animation so when I first got started I did a handful of like somewhat detailed like hand-drawn animations the problem with this is I'm not an animator that's probably the best I've ever done so I it was kind of an uphill battle and I didn't think that I would be able to do hand animated assets for the entire game for every effect so but I liked the look of it so I wanted to figure out some kind of solution to to get to that point faster so here's some few more examples of it so when I was looking up reference for the stuff I found this video from 1983 it was a the making of the HBO intro sequence and they had this really cool dynamic like starburst effect you see there and I when I'm looking at it I would have assumed that was just hand animated like every single dot but it is actually as you can see here it was just two transparent screens run across each other to create the sort of slitscan effect it's like super cheap and the thing that I learned from this was that when approaching these sort of effects even experts cheated and that you should try to do the same thing so so this was the first effect I did probably one of the first things I made for the game it's sort of like our Star Trek transporter you'll see it probably a hundred hundreds of times in the game it's all over the place and it's actually just like this little cheap like 32 pixel small frame animation and it worked pretty well so my thought process was this with this whole thing was that a I would establish a rudimentary structure with these tiny animations that I could do quickly and then just slather it in post-effects so this was pretty much how I did most of the effects on the game there's a charge a charge slight attack I've done the same way you can see it's just a handful of tiny frames covered in channel splitting and blur and all that stuff here's another example of a similar thing using just a couple of assets mixed together it looks a lot more complicated than it is so another thing I did a lot of was screen space effects which plays into the sort of film post process sort of stuff this was a reference from Foxy Brown 1974 film it's not exactly sci-fi but this sort of cut out silhouette effect was used a lot in the 70s so we tried to do something similar this was a mock-up done in after-effects and then here's a version of it in the game yeah so the the point of this one was that it clearly the effects stand out from the background but it totally sells the 70s aesthetic another example is these shield effects so when the characters powered up with the shield this is what happens so originally I'd done it with a pretty traditional sort of mesh with a fancy video game shader on it but it never seemed to really fit in the world they didn't really get that separation of like the fake effects versus real effects I talked about earlier so if this were done on a film this would have been a sort of hand rotoscoped every single frame run through some multi chemical bath process and lit from the back and all this crazy stuff but in video games we just render to a separate buffer run a ramp shader on it and it's done similar there's another example of use it here as well this was a terminal that you need to disable the shield and before you can use it and originally I had a very complex crazy mesh with a shader on it and and this was just a bunch of Spears and you set him to render to that buffer and then you got this weird sort of cheap post-process effect I use it all over the place this was a some particles I could just tell the particles to render into that buffer and it did a lot of crazy stuff use it an intro sequence just absolutely everywhere in the game because it looks really cool so final thoughts for my section of this not every game obviously can be intentionally cheap right and not every game is set in 1970s science fiction but the key point is that you should approach your work from every direction and you should not be afraid to try completely different workflows that you're used to because the effects that work for one game probably don't work perfectly for another game that you're working on so you should try to distill your art direction and inject that directly into the creation process and you might be surprised with what you do hi I'm Jen Ming Spurgeon I'm a senior effects artist at mo tiga in Bellevue Washington and I'm here to talk about the way we think about our effects and the process we have when we are creating our effects gigantic is a MOBA and a third person shooter with five-on-five PvP action players choose from a huge roster of characters and those characters have lots of unique weapons and abilities and you're fighting against the enemy team to take down their guardian so you'll power up your guardian by using creatures that you summon and hopefully you'll just kill the other Guardian we believe in for character design we believe that personality takes precedence over realism so we think about what is that character about how do we describe that character in one or two words or maybe a sentence the character up here is HK 2:06 his design says robot firepower clunky in our game HK is a jittery bucket of bolts and he roams around shooting missiles and spring bullets everywhere we have another principle that we also adhere to four characters and that's shapes taking being the first priority and then we look at anatomy a second so uncle's been here he's he's very inaccurate as far as Anatomy goes he's basically a water balloon that walks around and and so his his big shapes shapes take priority over realistic in anatomy and if a character has then stick like arms for example we keep the shapes in mind and we try to fill the anatomy into them later so strong shapes are gonna define that character so how does this fit into effects so on the right we have what we do and then on the left yes no that's incorrect all the way around we have one realistic fire here or one realistic explosion here and another stylized one the unrealistic one is obviously going to work a lot better just because it fits in with the characters more but the principles are important because we need to make sure that feeling carries over to rfx a realistic explosion is also not going to be very dimensional for for our work just because it's going to be on a billboard so how do I simplify this explosion or a muzzle flash one of the things that we do is pay attention to those shapes and the choices we make and we tried to imbue some sense of personality into into the effect but that doesn't mean we don't fill in the gaps with exaggerated realism so this diagram represents who the stakeholders are when it comes to creating characters some studio structure their teams where only certain people are influencing the visual and gameplay direction of the game and that only allows people to experience a very particular vision for us we we start to incorporate a lot of the employees even down to keyway you'll see that we don't have an art director and that's been a fairly positive experience for me it's new but just different the limitations force us to to seek out information rather than letting it just come to us and so at the end of the day from concept to playing the character in game we were left with a character that we feel is the right move for our roster and that's it that's how you make a bunch of stylized characters and effects in the end so super easy now the scale [Applause] so actually I'm not done what happens is now I have to figure out what I'm doing I have to get the character see its animations figure out who she is this is Beckett she's she's a our professional adventure she's mobile she's got a jet pack and she's armed to the teeth and I need to figure out like what her visual effects are gonna look like so I explore what her personality is is she fun-loving is she scholarly is she a bit of a gearhead what sort of role does she she fill in the game is she offensive is she a defender does she work paired up with another person these are all things that slowly developed the effects because it's it's not just making a muzzle flash and calling it good so what kind of weapons does she have for her specifically she has guns that transform and a jet pack that she flies around with but we've also got to figure out like how does how does magic how does that look for magic fit in with more ballistic effects so on the on the Left we have hk's fortified minigun and on the right we've got char knox meteor in gigantic our characters need to feel unique from one another and and their weapons and mode of transportation also need to feel intentional as if they've always belonged to them on the right again we've got hk's grenade and Beckett's grenade and I really wanted the tutu to be distinct from one another while existing in the same world they they need to feel again unique so I made her gasps great or her grenade to be more of a gas explosion type instead of a concussion or shrapnel grenade what you're also seeing for beckett is an older version so we'll dive into what it looks like soon so we've asked who Beckett is we've considered her weapons and now I've got to think about what that visual language looks like and does it share anything with anybody else is it is it whimsical is it dark I need to ask these questions of myself so that I can get to that point of of making them for her so let's dive into the tools we use Unreal 3 you guys might have heard of it but Unreal 4 is out now we also use Photoshop for textures 3d studio max for mesh creation and then rave fire for any destructible stuff that we need to do so these are the high level goals that I try to keep I wanted to avoid drawing anything so that was gonna that was going to be really time-consuming and also doing any sort of 2d effects was also going to be limited to camera facing the billboards so I removed all that and tried to focus on like using just meshes because you can observe those from 360 degrees let's see we have a lot of characters and we need to make sure that the characters fit the character but they also need to not take away from gameplay when you start making a bunch of unique effects for for like 16 plus characters you start to get a lot of effects noise and you need to make sure that gameplay is not impacted by that on a personal note my own goal is to create an effect that I want to see over and over again uh audio artists have to think about what sounds will will be like over and over again and sometimes I can get grating and effects is the same way you don't want to see something silly over and over again if it doesn't feel right these are the restrictions that I've had to enforce on myself so again no it can't just be specifically sprites because that's that's not going to work when I run around in circles I need to the effect to work on uneven terrain so I need to think about the environmental considerations for that and possibly even you have it disappear quickly or just sink into the ground and and lastly performance is the big thing that's really going to determine how much I put into this because we have the potential to have two Becket's in in a match that's going to double the cost of meshes that are being utilized and because Unreal 3 is a forward rendering engine meshes can be really expensive surprise so we're gonna go on to how am I gonna turn this into 3d this still is from the jinx video that riot made and it looks super cool super stylized and this is just like one of the many references I pulled to make this explosion and so I need to think about where I'm getting my information from and then what do I want it to be in our game I look at the assets that I also have available to me what I can reuse so I got like sparks and flashes but ultimately I want this effect to be a visual landmark so when a teammate sees this explosion they can determine whether or not they want to go to that teamfight so when you're doing your research take note of of the shapes that you're going to be working with because that will that will help you simplify what you're doing when it comes to making geometry in 3d these are all my prototype meshes that I'd worked on some of them were simple some of them actually they're all simple they're all just geo spheres and each mesh represents some variation on the visual that I was trying to achieve ultimately I learned that volumetric meshes were just the best way to go they give the dimension that I need to the effect and they can also be vertex painted so I can do cool stuff so the one on the far right is vertex painted and I'll show you what that looks like with the material it's a mask material and it uses a myriad of different textures to give the unique erosion look the color for the mesh comes from a parametric vector in the material instance and the materials erosion comes from the color over life module on cascade I use the mesh vert color node in the material so that I can separate that color information basically allowing me to use it like another dynamic parameter just with the color over life I can't take all the time to explain how the material works but I'm gonna burn through some gifts that show what that color over life module does so on the on the Left we've got the zero everything zeroed out but then when you go from zero to five on the red it makes the color black point in and the green Channel will when going from zero to five will make the the material black point out and then with all with all three in use the blue will make both channels black point out but then the red and the green will be black pointing in Blooming it and then black pointing out eventually so on the Left we've got a wireframe of the meshes isolated so all that orange and and gray stuff is are those meshes and this is just to demonstrate that there's nothing being done to the meshes themself it's just spinning and and scaling over time and then adding in the velocity oriented bells and whistles later so the final asset looks like this and it used to have that giant pillar but I changed that I wanted it to be more of a concussive radial habit that look to it so the mature material in particular has allowed me to focus on the effects art style and and it's given us a lot of versatility with just that material alone we can drop it on a mesh and it pretty much works out of the box I'm able to reuse that material and and the mesh that I've made originally for this airstrike that Beckett has again the intent was to let people know if they wanted to go and help or not and then this is one of our Guardians rampaging through the map the smoke cloud from is exiting and entering is made up of two different meshes but this is just another example of what that material can do and how versatile it is it's a different use of it and we've taken that material and just duplicated it adding a few extra components that were unique to that smoke but ultimately it's still the same material we utilize the this material in melee swipes as well and a few other uses like ribbons so it's got a lot of versatility and I wish I'd showed more examples of that but that gives you another reason to just go and play the game so in conclusion here are some rules that I think are pretty important the first one feels obvious but it's sometimes ignored some games keep doing the same thing that they did in the last title mixing and matching effects and sometimes that just doesn't integrate well with characters or environment so you got to ask yourself like does the environment effects need to be more obvious than the character or vice versa and think about the rules that you're establishing should we have transparent materials should we have just opaque materials you'll want to define your shapes break down your your effect into as many simple shapes as possible that'll help you know where your visual noise is coming from it'll also help you focus on your solutions just by it my performance needs you want to take some time to immerse yourself in as much satellite imagery as possible the more you consume the more you'll have to pull from and it just gets you more excited this is an official endorsement of interests so please use that always get feedback from people it's easy as an artist to hide yourself and just silo your work sometimes but you definitely need that feedback and you also need the feedback outside of the effects Department because the effects Department is always going to look for very nitpicky things which is good but you also need to know if people outside of your department are understanding the work as well so talk to keyway talk to engineers talk to people who don't do the same thing as you and lastly just push the effect towards weird stuff just get weird with it make it bigger than you think it should be you'll you'll end up with the results that you're you'll be really surprised by so that's it thanks next is big hi everybody that's loud so thank you for coming my name is Bill cleitus I'm a senior visual effects artist at Epic Games and today I am here to talk to you about for tonight well what is for tonight it's epics upcoming survival sin sandbox game we're gonna team up with other players to loot craft weapons and traps build forts and defend against monsters of the storm so the image on the right here that you can see is 100% in engine and it helps establish our visual style for the game it's bright its colorful and in the styles that's kind of inspired by big studios such as XR or DreamWorks so what is the art direction for the effects inside a fortnight if I had to try to map it out somewhere against the gradient I put us a little bit or in between anime and like a Pixar film right a little more of a bias towards Pixar we have contrasting elements right so we have things like smooth shading and fluid movement for things like smoke or the storm or stuff like that but then we have like really hard edges and staccato timing like you would see an anime for like damaging and impactful effects and it's all you know they're bold but they're not like overdone and they're not you know in terms of color and value so we can see a small taste of the different effects that embody this range in contrast that we have inside of fortnight and the focus of this talk I apologize can be a little more technical but we're going to be talking more about like mesh particles and materials techniques and how we use them to achieve this style thin fortnight and you might be saying you know well meshes why do I talk about mesh is specifically because they're not new we've been able to spawn them for a long time within particles but we've got some new tricks and new abilities that we can do to make them even better some of the things that we can talk about our the advantages are that they have superior volume and shading over traditional you know quads or sprites they allow us to break away from flipbooks as like the standard for what I call intra particle movement and that means movement within an actual single particle or sprite and in a stylized art environment with such as ours we can actually have some significant performance advantages in certain situations which we'll talk about shortly so we're gonna like I said we're just gonna do some brief technical high-level overview of some of this stuff that we've done so to start we need to talk about the vertex animation tool because we use this a lot in setup for tonight and in nutshell this allows us to animate with traditional rigs deformers fluid sims you name it and bake down that data into textures so on the left you can see what I've made inside of Maya which we're going to talk about here in the quick process and then on the right we can see it used inside of cascade right so that's not a skeletal mesh that's a static mesh and the movement is being updated through the material so how does it work is it magic it feels like it when I get to use it because it's really empowering this was a tool that was made by John link whist he's a technical artist on our team on for tonight and it uses two primary methods and method one is the one we use the most is the like texture based method so it takes either either an animation or a frame by frame a snapshot of meshes and it bakes down the the Delta basic which is the difference between the positions of the vertices in world space and then they're verticals and it bakes it down to these two textures so I'm going to move the laser corners you can see this is the vertex position and this is the vertex normal looks like a weird kind of barcode and then it uses world position offset and in the material and the normal input and it just pans those frame by frame you can see that right here and it's updating the mesh as we go so it's all done through a material function we can get explicit control through like a dynamic parameter inside of cascade a scalar multiply against time however you want to do it there's some really key advantages there's smooth interpolation between frames so when you slo-mo it or time dilate it this isn't shown well in this example here obviously because it's going by frame in Maya but if you do with slow-mo in engine it'll actually smoothly interpolate between those and there's a lot of wiggle room that you can do eventually it'll break down but we don't get that you know that that's staccato frame by frame with regular flip books but there's disadvantages right there's – you know we're bringing in two texture calls and memory and material instruction count and all that stuff the last thing is that it's a single mesh so that means the topology has to stay the same so where I'm putting the laser pointer here this is actually the first frame and then it's being updated frame by frame after that so we can't change topology excuse me so how does this work well first we need to establish what we're trying to make and I've put together or I grabbed a piece of reference for a like I'll call it a smoke switch this is something that like when a character quickly runs they leave like a switching trail behind them so what I've learned is that working backwards actually is really powerful and it's a good place to start so to start with that that means we need a model and I've modeled the at the final shape that we're going to animate in so on the left here I made hysterically embarrassing layout of different just spheres stretch out and then I just brought it inside of ZBrush and I used two things they use dynamesh and zremesher if you don't know what those are dynamesh is kind of just like a boolean operation it just combines it all into one match removes the stuff in the inside so you have like a solid hole and then zremesher like does magic because I have no idea how it does this but it gives you this awesome layout of quads that are really easily deformed and a little little move nicely when you deform it against a skeleton so it gives us a slider we can adjust how many how much density you want in this case this is probably pretty low in terms of ZBrush standard Polly's that's only 1030 verts then we need to be able to move it so I say you know model like it's 2d and animated like it's 2d and even rig it like it's Duty so we want to make rigs that support the intended motion and final movement or final shape excuse me so this has a very precise level of movement right the swish that curls around trying to do this with a fluid sim I'm not gonna say as impossible by any means I think it would be difficult to art control right your art director says I want it to curl a little more a little less or something like that I think it would be very hard to do that so doing this manually by hand is really the the choice especially for us on fortnight so what I did is I just made a spline and constrain those joints on the rig to the spline so you can see up coming here when it loops you can see as I move the joints right there they're actually constrained to that – spline and it gives us the curling motion and make sure you utilize everything right like I'm showing here like scale rotate squash you know secondary deformers and things like that so we need to bring it inside of the engine and we need to maybe be able to draw material on it so what techniques can we do to sell style and preserve performance right because anybody that's an effects artisan here that we can break performance the easiest so when we're getting we're aiming for a stylized smoke right this means simple shading a three color cell shaded highlight which we'll talk about shortly and like a hard erosion edge that you see in anime where it kind of curls away from itself so mass materials inside of Unreal 4 are the are an excellent choice so on the left you can see that's the the master smoke material shader that we use and on the right it's the same shader but it's made into lit translucency and ignore the fact that it's a little darker I think just with some some value pushes you can you can get them to match but you can see some clear advantages the one on the left it just has so much more volume and body because of its shading it's casting much nicer shadows and the way it's eroding is a lot cleaner too for our style but taking the next step and look at inside a shader complexity mode you can really see how this shines deferred rendering is our friend Shen mentioned you know meshes can get expensive quick especially in Unreal 3 because it's a four word renderer we're now using a deferred render it looks like it stopped let me see if I can get that to play there we go since since it's a deferred render all we're really doing right is the camera casts down and hits the first surface and it doesn't need to go past that there's no sorting it doesn't have to draw anything behind it so it's really clean right there's still a one bit depth test cost but it's it's kind of minimal in comparison so in addition to that we want to make sure that the material feels kind of grounded inside of this so we have a four-night is dynamically lit right there's no light Maps or anything like that and we want to make sure that it kind of reacts to time of day changes and that means shading and color so the time of day manager is something that's like in blueprints in code it's writing to what we have what's called a material parameter collection if you don't know what that is material parameter collection is this like laundry list of vectors and scalars right and anybody can write to it and then the cool thing is tons of materials can all read from one point so you update that one value and all the materials on the fly update with that value so the time of day manager is writing the time of day and the light vector light vector is just if you imagine my hand this is just the way the the direction of the light that's moving which is gonna be the Sun or the moon so all we have to do is take that light vector and do a dot product between that and the vertex normal and we get the results on the left only turn the laser pointer back on so you get the result on the left here and you can see as the time of day changes that highlight changes with it we can just do some simple math to round it out to three state or three steps and then in addition to that we can take a standard for now and dot between this and a standard for now and what this allows us to do is it gives us highlights that are a little more biased towards the camera excuse me so what that means is sometimes you might get highlights that are behind the mesh because the vector is coming towards you right so you can't see anything anymore and it kind of makes the the meshes feel flat so if you mix I put a value here of 0.55 it's roughly halfway you get a little bit of that push forward so that you always see a highlight no matter where you are in addition we can do artist derived highlight colors so if you look here and the examples in the back this guy this guy in this guy those are all using the same exact three colors no matter what the time of day is it does change a little bit you can see especially at night there's a much more blue shift towards it but if we use our own functions to be able to change those colors based on the time of day you can see this example here and this one and this one you can see you can get much more artist friendly control and you can give it a lot more style and feel to make it feel you know romantic or anything like that Adam so how do we get our our materials to disappear I've seen other games do stylize smelt like this and they just simply you know shrink it to a point right they'd scale the particle way I'm not really a big fan of that I wanted to like kind of neatly disappear in the style right that anime style of smoke eroding so we have mass materials we've got the one bit opacity that we talked about it and we're stylized so we can capitalize on this so all we do is we just take a standard for now and then we're just gonna bias against this right bias just means adding or if you want to subtract you add a negative number so on the right here we're just doing an example of biasing from one to negative one and this gets fed into opacity mask so you can see that the mesh is eroding away neatly based on the normals and it'll change based on the camera angle so you get unique results based on angle or particle rotation so all that put together you can see our little small smoke swirl when she runs she's got a big trail of mesh particles and traditional particles and there's a big swish that kind of gets lost from this angle but when she starts running its you can see the swish it's little bigger so cool so how can we get even more out of cereals and meshes and the answer is explosions so the master smoke material inside of for tonight has a static switch to enable heat for explosions right so I use the term heat explosion or I'm sorry heat and density heat would be like the emissive part of a material density is gonna be the smoke after the fuel is spent right so we can use these same techniques applied for a secondary transition oh it looks like the video stopped playing PowerPoint doesn't like me so to get that transition from the hot to the dark parts of the smoke we can use the same same techniques right we can take it for now invert the for now round it off and then just bias against that so we can get our transition we can use our same three color cell shading highlight for the for the emissive part but we can use an artist dr.light vector because it doesn't really need to accept light direction right explosions they admit they are emissive by definition so so with explosions you know they're complex right there's a lot of motion movement undulation all sorts of things and shapes and we can do this hand animated in fact that's how I started with like a hand had a mushroom cloud but if we really want to get that sense of believability that sense of like Pixar real is what I call it right we can use our existing tools and combine that with fluid sims and the vertex animation tools so again we can capitalize on our existing smoke and material ocean style and that we've talked about like you know volumes with meshes erosion and reach apology we can take that fluid sim that I showed you in the previous slide and convert that to a series of meshes so we take again working backwards we take the last frame turn the sound over time we take the last frame right here of the of the fluids and convert to mesh you can see it's really nasty in terms of density and topology right it's not going to be usable we can bring it into ZBrush ZBrush excuse me and reat apologize that we do lose a little bit of detail here I think it's kind of like a serendipitous thing though for something like for tonight because with our stylized material that I've showed you it kind of like rounds things out and it looks a little smoother and then now we can just work backwards to be able to get this to animate so this guy right here that I'm highlighting is the last frame what we do is something called a shrink wrap which just projects all the vertices in and we come Lyde with the frame previous in the explosion then we just go back to that and then you know project in and we just go frame by frame we can automate it somewhat but it doesn't really look that great in all areas so that means that we have to do some hand painting to fix certain areas so it's a little bit of busy work but once you get it in you get the end results this is just showing it in like a debug loop right so you can see it going from start to end and then inside the airstrike you can see it use this AK or obviously use with a bunch of other traditional particles right but you can see it being used with like some trails and some camera shake and some stylized players and stuff like that so that's work in progress we're gonna make it even cooler before we leave the vertex animation tool however there is a second method I told you we primarily use the texture method but there is the model sequence method which basically allows us to take any arbitrary amount of meshes with varying topology and just flip through them like a flipbook so there's some key advantages that are right we don't need continuous topology like I said we can have any arbitrary amount of frames good for complex shapes and things like that there's no textures no expensive material function there is a material function but it's it's a lot cheaper but some key disadvantages are it's these mesh assets get like really big really fast so you can end up with like a 10 Meg static mesh if you're not crazy and there's no interpolation between frames or anything like that and good luck you being 70 frames of meshes yeah so the takeaways meshes are excellent right they provide excellent volume and shading they allow us to do 3d movement and used in conjunction with blueprints and Unreal Engine 4 they are an exceptionally powerful tool for VFX and tech art that's all for me we have breanna onesie that was a pretty unreal talk bill hi everyone my name is Breanna Lindsay and I'm a senior VFX artist at Deep Silver volition if you're not familiar with Deep Silver volition it's been known from developing a lot of titles over the last 20 years from Saints Row to the Red Faction series and our most recent IP is called agents of mayhem and I'll be talking to you about the VFX of agents of mayhem today so agents of mayhem just has a little introduction it's a a 3d third-person open-world game and the agents of Mayhem's art style is heavily influenced by 80s cartoons we define our art style as 80s cartoon nostalgia drawing largely from classical cartoon animation for inspiration and for us in real time effects this presents a unique challenge how do we render these retro style effects in a fully 3d world for the overall artistic vision of agents of mayhem the art director broke down our division into three visual pillars for us artists who interpret I'm going to talk to you about these three pillars my talk focuses a lot more on art direction than the technical side and I'm going to talk to you about how we approach to applying these pillars to our VFX and I'm going to talk about where we failed and where we succeeded in applying this direction our pillars are simplified here meaning feeling clean and bold it's still belonging in the cartoon world of agents of mayhem we focus heavily on silhouette gameplay messaging and readability for our simplified effects vibrant here meaning colorful intensive and snappy we focus heavily on color timing and layers of complexity to get vibrancy across in our VFX and lastly theatrical hear meaning over-the-top and dramatic think wow moments and showstoppers when it comes to our VFX with good staging camerawork cinematic destruction and presentation so our directors they gave us this poster of a breakfast sandwich to help us visualize and break down our artistic pillars you know it's a kind of fits into that whole cartoon theme having a good understanding of these pillars helped us to apply and deliver these real-time effects that fit into the gameplay needs and artistic expectations of the IP so when we first rolled onto agents of mayhem we asked ourselves what two 80s cartoons look like and how do we tap into that nostalgia in order to understand this we ended up watching a lot of older shows for reference so we can better understand our source influences artistically GI Joe was one of the many pieces of source material we looked at and one of the key takeaways for me was that in order to get that retro cartoon look we had to start thinking about how the VFX were constructed in these classical cartoon shows the V effects and all of these examples were not done digitally but they were painted on animation cells by hand meaning that there wasn't any opacity fade going on and the effects work all of these shapes had to resolve and kind of break apart in terms of their shapes and these GI Joe references play heavily into the first pillar simplified so as we get into simplified I want to talk about one of the things we struggled with the most when it first came to making simplified and readable effects blood so with blood how do you make blood something that isn't a staple of these classical stylized retro cartoons fit into your open world city games with the shooting mechanic it's kind of hard so early on in the project we tried using fluid simulations and flip books and I think we kind of did this just because this was something that we were used to when it came to generating liquids but it didn't really give us a result that worked well with our art style so this resulted in blood that we considered to be out of style our blood looked like it didn't belong in the rest of the world it felt way too noisy and it didn't hit her artistic pillars we felt it was unsuccessful in meeting our artistic expectations as well as messaging effectively for gameplay it didn't read very well from far away and it lacked the silhouette needed for a simplified effect so we had to go back and think about what made good-looking stylized blood 80s cartoon effects are hand painted meaning that they have a more simplified look to them so going back to our GI Joe example we reappropriation to achieve this kind of look we decided to hand paint our blood material textures instead of using flip books and heavily utilized alpha Crush in our particle materials to get that retro look we desired and when I say alpha crash that's the word we use it Felician to mean alpha erosion or alpha clip it's the same sort of technique that you know I know that bill mentioned it in his talk – same idea a different word this is our blood alpha crush material in our in-house material letter editor importantly with the way the toolset works the scalar values over here are externalized into our particle system and we can kind of control we have a finet control over how much crush is out and where so what you see here it's just it's a really simple shader you know we take the camera world position and the world position where the blood is plain make it the distance between those two and then we just divide that by the distance we want that to happen at so this is about 15 meters away and doing this with an interpolate between the the near alpha crash and the far alpha crash it means that I can control the how much is crushing out at a distance which means that I can have the blood look more I can get a bolder shape at a distance and that was really important for us to get readable effects that read well far away in the gameplay and this is kind of the final example of that so what we see here is one of our agents of mayhem his name is Hollywood and he's treating a bad guy called a hell trooper and you can see the heavy use of the Alpha crash on his muzzle flash so those are all just hand-painted textures as well as on the blood impact which is also hand-painted and just like you'd see in these older stylized cartoons the textures kind of break apart rapidly and in succession and this later attempt at creating a stylized effect was a lot more successful than our earlier attempts which relied heavily on flip books so our next pillar is vibrant so what does that mean what do we mean when you talk about vibrant effects and what does that look like in a stylized cartoon and how can we get a similar feeling across and agents of mayhem we went back to our source material again and looked at classical eighties cartoons to find examples of vibrant cartoon animation and some of the commonalities we found with vibrancy was that the animation had a strong snappy sense of timing layers of depth and complexity as well as saturated in contrasted colors to help draw the eye so with vibrant effects color was one of the things we focused on we intentionally used bold color palettes with our VFX and agents of this is an example of one of our agents her name is fortune firing off her cannonball ability we kept a lot of her effects in a more saturated range generally speaking we try to keep the saturation and emissive levels high for all of our agent abilities to get them to pop out from the environment and this also helped to maintain the bright and vibrant tone of our reference material so layering was another thing that we focused on when constructing our vibrant effects for agents of mayhem and when I say layering what I mean is breaking down the explosion or particle system into smaller more digestible layers for use the artist one of your layers might be your initial blast wave that goes off when your explosion is first taking place it might be the fireball and smokey after effect it might be you know like a secondary layer of sparks that kind of happens after the effect goes off or it might be energy that kind of comes in as the effect is still building up and charging up and thinking about your effects and layers is a great way to for you as an artist to build your effect and also a great way for you as an artist to deconstruct reference and layering feeds directly into timing so when you combine all these layers together you get this and this doesn't look very good and it doesn't really meet artistic expectations for vibrancy it could look a lot better with some timing pass and by timing pass I mean thinking about your animation principles your twelve animation principles especially some of your principles like anticipation or secondary action our medium is a medium of motion so you need to be thinking about these things when you're building your effects so before a timing pass is kind of looked a little more jumbled but with some variation of start points can kind of feel like energy is coming in and building up and then discharging and it draws your eye a lot more effectively timing not only makes your effect more readable but it also delivers a more vibrant and impactful effect for the player and it also fits in with the vibrancy and snappiness of a retro cartoon reference so our last pillar is theatrical what does the actor code mean for us in this 80s cartoon nostalgia game is the moment when lion-o appears in a magical teleporting pyramid or is it the moment when the Autobots ship is attacked for us in VFX it's all of those things the aggregate brings a dramatic element to the game we had to stay true to that in our visual effects we tried to carry over these dramatic moments into agents of mayhem so why do we need a theatrical moments in a stylized game we need theatrical moments we felt it necessary to deliver big moments to drive the narrative much like in a stylized cartoon show this helps to finalize the moment when the players succeed the ettrick moments also help the player feel rewarded and accomplished when they complete a mission and lastly well it's just fun to blow up stuff and it definitely fits in with the spirit of our reference so this was our first attempt at kind of delivering a big scale cinematic and it required some additional passes an iteration this is a large spaceship which we call – hell barge for agents of mayhem we had difficulty lighting such a large set piece and getting it to load in memory in real time our first attempts didn't succeed in achieving the quality we wanted and it was certainly causing massive performance problems for us this trip was the size of about 40 city blocks so it was a huge technical problem to get it loading in real time we had to take a second to re-approach it and to achieve the performance and quality bars that we had set for ourselves so we decided to do some iteration we did another pass on the camera cuts and simulated the destruction in dry fire which is a 3d matte 3ds max destruction plugin we use a volition once we got the Ray fire simulation loading in the editor we layered in particle effects and used scripts to call them in our custom timeline tool the camerawork and explosions had to be scripted using place keyframes to get them to go off at the correct time this was our final result eventually we had to video capture the real-time effects going off an engine and then break it into a pre-rendered cinematic mostly due to performance constraints in memory it was way too expensive for us to have this loaded in the world with it because this was just a unique one-off asset for this cinematic and it definitely pushed us over our memory limit since we had to make a video of it anyway for performance reasons this gave us a second chance to do After Effects pass on it and layer in some additional electricity and glares our final result was a lot better than our first attempts at delivering theatrical destruction focused moments so what did we learn from creating an 80s cartoon nostalgia style effexor agents of mayhem first start with breaking down your artistic source material reference is going to help you derive a stronger vision for your game your first iterations might not be very good and it might take you some time to figure out how your V effects fit in with the rest of your art style if it doesn't look right don't be afraid to try something different and lastly six-year fundamentals timing layering color and a dramatic presentation are going to make your game's art style a lot more memorable and we should be ready for questions pretty soon before we wrap up I did want to put in a plug for my coworker James Taylor he's doing a talk in this room a half an hour after this talk is over at 3:30 he'll be talking about PBR and surfacing shaders for stylize games like agents of mayhem and I hope you can make it thanks if you have questions feel free to come up to like the microphones and ask I mean we're totally ready for any questions you might have about stylized effects alright this is for Bill you talked about sometimes creating the final frame and working backwards and one of your examples was you did a fluid sim of the big explosion and then you somehow backwards morphed that smoothly into like a small core ball I assume in engine with the material or what how did that actually work how did you reverse final frame to first frame for that explosion there you go you can hear me up there it's done in in Maya I think max has the same process you take all you take all the frames that are baked from the fluid sim and and like that gives you your shapes like your targets right so you have sculpt of every frame of the animation and then the in this specific example you have a big explosion at the end right this is always expanding outwards so then you can take that final frame and that that shrink wrap that I was talking about is it's projecting inwards and it's colliding with the previous frame does that make sense yeah so frame 50 collides with frame 49 and it kind of adheres to the previous frame and you can duplicate that and go from 49 to 48 and you just keep shrinking in and it's like it's it's literally at like a shrink wrap right like you know you put a dryer to it at like shrimps shrinks around it does that make sense is that your question and then are you exporting that into that texture vertex yeah so I'm constantly like shrink wrapping the same mesh because it keeps the same topology and then duplicating it and then shrink wrapping again so you end up with the same mesh in a sequence and then you bake that to the textures I see yeah that's great thank you thank you no question it's cool thinks a lot if you ever knew the questions we'll be around outside so thanks guys yeah thank you Ron [Applause] you

6 Replies to “Art Directing VFX for Stylized Games”

  1. Good stuff. I was thrown off by Shen-Ming's joke that he was done with his talk – I thought he was serious about thinking he was done, and just joking that it's easy to make stylized characters, and that he then realized he wasn't done and continued to give the next 2/3 of his talk. I had to watch that part again to realize that part of the joke included already being done with the talk.

    And it's interesting to see the Fortnite art before the game was released – I wonder if he had any inkling of how big it was going to become!

Leave a Reply

Your email address will not be published. Required fields are marked *