2D in Unreal - Getting Started With Paper2D

hello everyone and welcome to a very special season Sam Fox training livestream I'm your host Chris Wilson I'm the designer on the project first of all thank you very much to epic for allowing us to be part of the stream and secondly the rest of the team is actually sitting in chat right now so hopefully between myself the design and the art guys we can answer all your questions but let's move straight into it okay let me just just a few windows open this evening okay so yes the topic is getting started with paper 2d I just like to stress that it really is an introduction I'd love to move on to further things and someone saying volume please or keep up with this thing before yeah we'll see how it goes so yeah it's an introduction and if it seems nice you know if you guys are into it then we'll be happy to expand it so here's what we're going to talk about today I'm going to open up a completely blank project the one that ships with Unreal Engine the default paper 2d one so no cheating there I'm gonna take the existing material and I'm going to change it so it allows a lighting to be applied to it and then I'll import a couple of sample assets this is where as a designer I am cheating because I will be using lovely assets provided by our art team then I will create a tile set and from that tile set I will make a tile map and finally I will just give you a quick demo of the lighting just so you can see that honestly to get to this stage probably isn't as hard as you think okay so I just reading the chat I'm not used to so many windows okay then I'll move over to our projects at the siege and the sandbox and again I'll show you our tile set so you can see that it's similar but there are differences that hopefully we can talk about and I will show you the materials we use and you'll see that they are largely similar to the ones that are in the example I'm going to make and I'll show you the normal Maps this obviously is something different emphasis on show not fully I show the process of creating them but also show you some of the other sort of general tips and tricks we're using because I feel like each one individually probably you know isn't too complicated they're all approachable but all of them together is probably what is making some people think you know there's some real magic trick going on here and of course I left plenty of time for questions both as time goes on and you know there should be hopefully time at the end to just chat through everything but just repeat again at least I am squinting at the chair at least one of our our sisters in the chat so if I'm going along if anything sort of specific art leaps out you hey just go for it okay now for the fun part the part that I'm most worried about not working but I'm sure would be fine so got a little option here to zoom in on this a little bit so you can look more closely so as I said no cheating here we're going to use the 2d side-scroller project with no starter content and I'm going to leave it with the lovely original name of my project because I can't name your project yes so let's click create project there and let's move this back over to this one yes oh my god spoilers let's get rid of that yes let me just check over here yes okay so I just loads up it won't take too long the first thing we're gonna do is just get rid of the default level because I want to show you that we're coming up from nothing and also it's just not helpful I'm sure many of you guys have seen this and for you know a different style of 2d game this is suitable and this character has its uses but we don't use any of this so I'm going to go and straight away and go into the maps and just check my thing over here yes and right click and go to level and I'm gonna call it new world because I love that name and then I can save that one doesn't really matter and then as you see nothing that's what I want we'll come back to that later so the first thing we want to do is import one of our textures so I'm going to be fairly lazy with a folder structure here because everyone has their own folder structure in fact I can show you the crazy complicated structure we have but I'm just going to keep it simple so I will just go here making you folder and I will call this textures now I've got two textures here which I'm just gonna pull in there's nothing special about these textures they are just yes sorry Westman it'll zoom there it is they're just normal DJs nothing special about the sexiest and the easiest way to import them in this instance is just literally I will grab the tile set one first and I will drag it in that's all I need to do get back to this here we go so the first thing to note is if I have a look at this now it doesn't it doesn't look right you can see that even over twitch I'm sure you can see that it's it's being filtered so it's blurry we shall see normally it's the kind of thing you want but as our game as a pixel art game we want things to be pixelated that's actually the correct look you'll also see over here I think I can again guess I'm aware that on stream it's not always super clear if I don't do this you can also see you've got some compression settings here which we don't want again artists can fill them a specific details I don't want to get that wrong I just know that as we've created it we do not want the the palette we're using to be messed with and the compression settings can do that likewise as well it seems actually by default this doesn't happen any but we certainly don't want to generate any MIT Maps because as we'll be using the off graphic camera the distance never changes so we don't need that now I could go through individually and change all these options but actually a nice little paper 2d feature is I can just go here and I can right-click on it and I can go sprite actions and then apply paper 2d texture settings and if I click that and we reopen it we can see that now it's there and it's pixelated in a good way there's a different compression setting used here again I defer to artists on the absolute specifics but I know that's the one we want and we continue not to have any MIT maps because we don't need those so that's good let me just check that I have everything okay yes so the first part now is the sort of one of the first parts of debatably the sort of secret source of when people ask us how we're getting the lighting going case there are some at tricks to this allows you to make sure I do this properly because it's a little tricky so the first thing we want to do is we need to be accessing some of the sort of core plug-in functionality here normally you can't see this stuff now way down here on the bottom right and out where I know this is obscured there's a view options thing so I click on this you want view options and then you want show engine content and show plug it in content if I go back here and what this does is now when I open my sources panel if we scroll down there's a paper duty content and the one we're interested in modifying is this default sprite material now I won't just they can little thing so let's get that this is basically as simple as it gets I mean it's too complicated for me so designer but there's not a great deal going on here the important thing is though we're not making drastic changes to this so if I set this back all we're really doing here I might have do I have a thing yes there we go I don't need to change a great deal here really I see to go to the shading model and change this to default lit which will change a few things on the other side and let me just consult my notes to make sure that's all correct yes that's fine so the main thing we need to do here is and again this is the time for the artists to step in and tell them exactly why but if we hold down control so we can grab this node we can just drag it from there up to here and once that's done there's only one other thing we need to do here well two other things but to achieve the same thing because obviously you know Unreal Engine is hugely powerful thing and it's got a lovely lighting and PBR etc etc a lot of those things that we just we actually not going to use in that sense and a lot of that comes down to just how shiny our objects would look they would look strange so what we want to do is we don't want any specular and I'm aware that you have it you are normally told not to mess with this in fact I remember Jess Haider of epic yourself saying you never need to mess with this and I'm like yes but sometimes you do so we'll have to speculate that and also we want the roughness and I I always get this the wrong around I think you want it to be one you want it to be the most rough so it is matte we'll find out the fun way but that is basically all you need to change there now normally what you probably want to do is actually copy this and you know keep this existing one around the default sprite material but for this example I'm just going to leave this one because it should be it should be fine for demo purposes so I've hit apply there and that should be fine so that's one part of what we need to do now here are the other a middle sort of secret source things that you need to do I'm just checking it this in the right order yes so the other problems exist around with the orthographic camera there are some lighting issues and things don't work now lofts did a default render and now is the deferred renderer for which for most of is is great and to be honest we'd like to move back to it one day but currently we can't use that to what we need to do is if we go to project settings if you go to project settings and then we want to find forward shading and we want to enable forward shading so that's enabling the forward renderer and then a relación helpfully says hey by the way you need to restart to do this so there's no reason not to do that now so we'll save that texture that we're working on and we will reload it so while that's loading that takes care of one problem there's still another problem that when you have light sources in the game because the orthographic camera in many ways isn't sort of actually moving around you'll find that your light sources will just fade off when they get further away they're basically being culled and that is something we also need to fix and thankfully there is a workaround and it is definitely a workaround but it functions for us so let me just check the right term it is min screen now go so minimum screen radius for lights again artists can probably give more detail but the general gist is hopefully what I said that because you know it's it's meant to cold lights that you can't see anymore that wouldn't actually be involved in the scene but because the orthographic camera doesn't necessarily give this information we ended up in situation is why even in are quite small levels the lights were just very weak so what we do basically is we say we set this to zero which basically means hey don't don't ever call my lights trust me not to get this wrong which you know here's a big ask but that's what we do okay so that should be that so we have all material we change your engine settings now we actually need to make a tile set for a bit from this texture so let's go back to our content and let's go here and check that's there and check it still looks okay yep so we will make a new folder and we will call this one tile set and well open that and we wall right-click and we will then go to paper 2d and tile set pretty straightforward and yeah I'm going to imagine if we call this new paper tile set because I am okay so when we open this we don't actually need to change a huge amount for reasons I will explain and what did we call this I think we called it okay so we'll just import that there it is that looks fine now the thing to mention here is that there are options here through for changing the tile size and margins and things like that they're fairly self-explanatory I'll show you more detail and of how this works out for our project but the important thing to note here is that the artists are very kindly provided me something that matches the defaults so in this instance I don't have to change those settings but you may do depending on your tiles but other than that we don't have to do much else here except I will even though we're not gonna have a character running around so we don't need it I feel like it's open anyway so that we should take a look at the collision it's pretty simple so if you've got a tile like this where obviously you know we expect the collision to just be the whole tile then we can just hit this box button and we're done some of the other tiles things are slightly more complicated and there's a polygon button and as we'd expect the player to walk up these stairs here then basically we only need the bottom surface to collide like this again I'm doing this FLE so you know spend as long excuse me as you would need to do that and I think I always I always forget with this editor can you just double click to win them let's find out yes you can double click to win them it probably even says that see I don't even read um but okay so I believe you can only do these one by one I'm happy to be corrected so I just you know do a few you get the idea you can make slightly more complicated shapes but to be honest it's probably a bad idea to make shapes that are too complicated and make a mess like this like an idiot like I listed there so I would stick to simple shapes but anyway there's a nice editor for that here oops I broke that one no one saw that nothing happened it's totally fine anyway so you would go through and do those while you're there but there's not too much more to mention there it just kind of works so we've got our tile set and now let's make an actual map of it which uses those tiles so if we go back up here a little bit of organization add a new folder call it tile map and we'll open that folder and then we will right click and go paper 2d tile map and imaginably I will call this new paper tile map oh yes I have those in the chat because this is the common thing Keith whatever else is in sister everything is power of two on the grid and I will you know what no it's not I might have a little bit of time to pick up on that but it kind of yeah to Rails me like it just did anyway generally you should use a power of two grid it makes sense but just just just let me do this okay yes so now we're actually going to use a map where we're going to actually paint those tiles that we've set up it's on the left hand side here we can click this to pick an asset and we only have one so that's easy and then you can move around this thing with the right Mouse just scroll through it and you can zoom in with the mouse wheel now the other thing to notice obvious this is this is pretty small like so we've got the map width I'm at height over here so let's just make it a bit bigger obviously this is you know completely down to your project but the point is it's pretty flexible to do flexible to do that and then all you need to do you're about to find out why I'm a designer not an artist is just drag the tiles that you want say I'm just left clicking and dragging and you can just put down some tiles and as I said this is not an art stream so I'm just gonna just just slamming down anyway let's put a lovely wall here girl this is amazing I mean why do we even need those guys I'll put those in and I know why not some stairs I'm super steep stairs that go nowhere this is also a situation where you can shift drag in here so say for example these stairs I can shift drag round those and get them and I could move them well I could add another set there I can also press e to get the eraser get rid of those and then you can see here we've got this black tile so what I would actually do probably is just click a few of these in shift drag a white just shift drag those ones shift drag again do that okay fine so now let's see if I want to put something behind these stairs I'm going to need more than one layer and luckily of course we just have this it's very sort of Photoshop styled layer control so I will call this one foreground and I will make another one and call that background and I will place that below the foreground obviously okay come on you and we'll do that to background and then you know again are going to be crying but I'm just using something that has a lot of contrast so you can see so I can place these behind there's your different layer wow what a glorious scene that is isn't it beautiful and you can turn them all on off as you're going but we'll talk about that more in our project so the last thing to do in here as you may have noticed is the material we're using so it's not actually using our lip material at the moment now I have this thing where I always forget what I have named the material it's not that is it it's every time I do this it is I will go look I wrote it down here it's funny I was talking about let's say early today it's always just the one thing I forget even though not difficult it's default default Spratt material so easy why didn't I know that okay default sprite material and then do that and we save it and that should be fine so that is our tile set and our tile map so we'll put those in the level in a little bit a different level because this is the first one again but what we need to do now is that I'm just checking I haven't missed anything nope what we need to do now is make our flip book so we'll go back to our content back to the folders we were using and first of all we need to import the texture that we're using for that there's nothing exciting here this is just another another texture same same TGA same style basically and we'll just drag it in and import it and just to show you you know again so again if we leave it on the normal settings it's all filtered and gross and there's the wrong type of compression and you know it just it looks awful and rather than messing around with it we can just right click sprite actions apply paper TD settings and there we go delicious pics a lot not made by me so that's the first stage the next thing we want to do here is obviously cut out the individual ones to use them as separate frames for this flipbook now you can do it manually but the cool thing here is actually there's a tool for this again so same menu if we right click sprite actions extract sprites you get this menu here let's see if my enhance button or work for this yes okay so I can zoom in on these so I can't I so it has an auto mode which I don't know may do a good job in certain situations you can see here it's like it's not completely wrong but it is because these stuff see all be the same size so we'll change this from auto to grid and now we've got it on grid I know the size of these so I can put in 64 by 64 and there we go glory yes so we have all of those there's a naming template well it's going to name all the individual files and for this you know this will suffice it's pretty self-explanatory I don't require anything more from it than this so that is fine with me so I will extract that and what that will do is dump out each frame as an individual sprite so now we've got these sprites we should probably make another folder for sprites now of course you know if this was a like full production project you'd have a folder below this folder but I'm just trying to keep it keep it running smoothly so there's just going to be a surprise folder so okay so the an open need to go the other way around don't we we will go to where I just extracted those and I'll click the first one and click the last one while holding shift and I can just drag them into there and then I can move them here and then always fix up those redirect is because you never know so okay we can go to our sprites and now also you want to make this into a cinema single animated flipbook and again paper 2ds got back so we can just select them shift-click the first one I'll times you have to click the last one right click and you can see there's only one sprite action now and that is to create a foot book so I can do that and I'm just going to leave it with the amazing name that it gives me normally and you can see straight away what we get so again enhance and I can bring this over here a little bit so there you go that gives us what we want there and you can see if I bring this up ever so slightly again you know this is this is nice little future thing we've just got each of the frames in order and you can scrub through them etc etc but again the source material is good so you know there's nothing there's nothing that needs cleanup or missing right there again the only thing we need to do is change this to let's see if I can remember yay that and we can just save that and that should be it I like the way that I've set this up so if I fail now it's going to be extra dramatic so if we go back to content and we go here and we open our other map and I'll just save that kid like certainly it wasn't it's gonna really upset the artist but this is all just for the interest of speed so it's completely black there's nothing in here at all and there are no light sources so what we want to do is go to the tile map that we made and we can just drag it in there it is what a glorious tile map and it's still dark obviously and we can go to our sprites oh I should move him into a flipbook folder but we're nearly done here so I'll just just get on with it and we'll drag him out there now normally I'll see you've sought your depth out neatly and you know all the rest of it but I'm not going to because this is just an example but what I will do is press f11 to maximize the viewport because I don't need anything else and this is it say it's alt H yes I'll to go to orthographic mode and then I will change this to lit and I'll press that's what I want then of course I need to to grab a light source so I can just bring it a point light and then what's probably happened is because I'm an idiot and just pull them in all kinds of crazy ways is it's just super far away so it'll look weird from the perspective can let's go back o H why does this look weird on the wrong side side yes so again you would be you would do this with much more care I should stress when you're doing a production thing and you know we certainly have but and I will show you that but for now the point is if I could get this guy there you go now obviously this looks horrendous because I put it together this way but the point is even reaching this stage I think a lot of people have had the misconception that this is very hard or at least you know more than a couple of admittedly slightly obscure checkboxes so what you've got here really is the foundation of what we're using right you know I can track this light around and it lights things up and I know this particular setup is ugly as hell but the point I'm trying to get across to you is this is basically what we have in our game now if any of you have seen our game maybe you don't believe me which is my cue to start switching over to our game so that will take a little bit longer so while that's happening what I can probably do is just tell you a little bit about that so the thing is as you're going to see the materials and the textures and the lighting all the same fundamentals our materials are really not that different the only thing is you know obviously the thing that's really built this up and the thing that is really important to stress within these things is that what really defines how good these things are is the quality of your source assets and we just open them up so all the things we've shown here you know the tick boxes you can turn on they're only going to enhance what you've provided in the first place and they're even though I made something that looked horrendous I was able to breathe through that tutorial because the assets that were delivered to me were the right size you know had all the correct art considerations they knew how to make the materials work for them so that's what made it easy and you know I just want to stress that that's an important part of it I feel like often when we're describing things like this and we are asked questions I think sometimes people think there's you know a single magic bullet whereas instead there are lots of normal bullets what a terrible analogy let's never use that again god our large map is quite large now but I really do want to open this one because it just has yeah just it I think it's just a good showcase of all the different things we're doing in a way that I can I can pick at come on come on you got this why do we make this map so big that's five we're nearly there so I would just check my notes think everything is fine yes okay come on you so I mentioned this is a large map it's a large map okay we're here so what I will do is I'll press f11 again to maximize a few port and it's just having a little think it's done this before there we go this is a large map and obviously streaming takes its toll so just to give you an idea like let's just zoom out and take a little look at this this is our demo thing and also I should point out look I mean it's tile maps it's still flat we're not cheating and it's not 3d in any way and what we can do now is I can show you basically I can compare let me just check it get this in the right order yes okay so what I can do is I can show you the things that are in here and you know how similar they are really just how they have been layered to give a much more impressive effect the first thing to talk about if we look at these light sources they are point lights just like I did the only difference between what I did in my scene and what is here is I just dragged a pure white light into the scene we know horrible default settings that are not suitable for something like this these all have you know nice complementary colors they've all been considered their lay it together and speaking of layers you can see that some of them for example like this they're really primarily there you know to pick out highlights in the background rather than just illuminate the obvious stuff and so what I can do about that is yes so I can see the highlight different layers I think there's some of them are even probably slightly more subtle than that also I'll try not to whip the camera around too much I know that I have made people ill with that BC ones like this for example like again I'll say I'm not too sure how well it shows up on the stream but it's pretty subtle [Music] yes okay what I gonna do I remember yes so the main thing is it's highlighting different layers on the scene there and if we minimize the viewport by pressing f11 again and go to edit map we can take a look at this that's a tile map we'll come back to that last a distraction we don't need you yet so if we look at our actual tile map it's the same principle as the other thing as the one I just showed you so we still have our foreground layer and we still have our background lair and I will show you that obviously the main you know the main detail is coming up on the foreground which makes sense that's the layer that player that is the layer that the player primarily interacts with they do also do things with the truck through layer which is literally a surface they can pass through under certain you know conditions and this climber ball which obviously I hope is quite straightforward there's not too much in this scene but there's a few little pieces like for example these these railway pieces I believe are not for ground they are climb a bottle oh no the other bits are anyway they're kind of special case the point is we still have the foreground the background and then the others are additional detail layers it's easy just kind of if I turn them on or off you can kind of appreciate what they're doing again art may wish to say more in the chat but I think they're fairly self-explanatory and I think what's even more important about this is again you know there's nothing technologically more sophisticated more sophisticated going on here than in the previous example I shows you the difference is there are just more tiles and there are more layers and you know there's been more considerably more care put into its approach than the thing I just threw together but yes I believe that's that and the other thing I couldn't go in here without showing it no one's no one's impressed by this tile sir I know what you all came to see you came to see this no you didn't but I think it's just worth showing very quickly there's still a white box tile set but I'd like to use while just planning stuff out quickly I only show this because it shows that really light in terms of collision we don't really have anything more complicated than this I think we might have a couple of pieces but we're not going crazy with the collision but anyway I guess you probably want to see this so let's have a little look at this in fact what we can do is pop over if I click this here it will find it in the content browser and then I can open in here in its other editor so here we go there's some interesting memory usage for this so I probably won't hang around in it too long this is a very large tile set but you get the idea again it's basically the same thing the end the main differences are the tiles are different sizes they're 16 by 16 and there are some margins on them again please consult with our actually why we have those margins I don't want to misspeak on that but but I just wish to stress that again you know same staff just select different settings but again you know made in sympathy with the original source assets okay I think that's good and then we can properly check the materials now I do want to check the materials but I can't help but notice we also have the normals here now this is probably of the stuff I shown you the you know the the most time-consuming the most challenging the the least authentically 2d thing we do because obviously there is a literal sense of depth and I show you them only in passing just to be like yes okay not everything is you know it's fake there is okay it's still fake but you know I mean not everything is pure old-school 2d this is something that certainly is different and we'll see that when we look at the materials which I think I can get to now on a check I haven't missed anything nope it is indeed material time and because I always get it wrong I am just gonna search masked lipped soil yes okay so let's have a look at this now think I'll actually want to mention is I will very briefly describe these things but honestly you see this the speculum the roughness that's the same you see the base color that's the same you see if we use my little where is it this one this is the same default lit nothing you know nothing here is different to what I have shown you in that other thing yes but I will very briefly go over these so you can at least tell that you know these aren't affecting the whole scene dramatically so we have this thing here again I'm not going to go into depth if you're really interested art will provide but these just this effect just puts little glimpse or little services little sparkly bits on shiny metallic things so in terms of the whole scene you know it's adding a very small amount this one we're not even currently using we're experimenting with a fog of war system that we're not currently using and it well it know what I just realized it does what it says on the tin it was desaturating and darkening the tile maps but we're not even using it at the moment and as we just look to them of course yeah we're adding the normals but I hope you can see that you know it's not it's not dramatically different to what I showed you in the example the same is true of the the one we use for the player characters and I believe NPCs let me just get this I realize I could have just typed there and be again but oh well I'm not very clever so let's open that and again I will just go through the things that here that are different and so you're aware that they're you know for specific cases so there's a panning channel here which I believe are can yell at me if this is wrong but I believe this is there's just some having effects we have like waterfalls and stuff like that I don't think it's a general-purpose function pretty sure it isn't the same glint effect again so he has a little offset there do too much and we have in the game the concept of lost known positions so we might show an outline of the player character so you know where the AI think you are and things like that you might have seen that and we also use a similar effect for tutorial like ghost to show you the path you should take so we we you know we have an effect we apply it there again that's what it says on the tin it's a little desaturation and a soft light blended layer over this plight it's bright and relates to the ghost as well we have a little thing here that let me just check something so I've just realized yes okay right I'm nearly into question time but I will say so related to the ghost there we have a sort of complementary effect here where we look at where the player actually is and we will mask out will mask out the ghost if it's behind them for example if you're following a sartorial ghost and you understand what you're meant to be doing it's really annoying if the ghost is moving with you so we literally just mask it out but anyway again the actual core thing basically the same so I hope that you can see I hope that you're at least recently convinced that like you know when we show screenshots on what game and people ask what we've done I suppose the fair way to describe it is the hard part isn't where people think it is like this technical side I admit there are some hurdles which hopefully we've you know just spread you through but actually it really comes down to the you know the source the source assets and the application of those so what I'm gonna do is I am now just going to take a little peek over at the questions because oh no there is one more thing there's one more thing I will mention there is another little thing in our toolkit so I merely they're quite subtle at the moment but I just want to point these out you see these big volumes around a lot of the areas and if I look at these these are are basically what are we calling them there are post-process volumes that's it and they're doing a couple of specific things as you enter and exit them to make it a bit more dramatic but to be honest that's not the important part the only things that are really important for you to take away from it now I tell you what I might use my enhance modes can get a better look at these central panel there we go so this again is like using you know the extended Unreal Engine toolkit you know there's call the stuff out there to use that once we go for the initial hurdle we're in a good place so we're using the tone mapper again beyond the scope of this but look into it and my favorite thing as well is we're using various look-up tables to color great things so we have for example there is a cold dawn a cold interior a cold night a cold sunset and my favorite evil dawn I don't know if evil dawn is used I like that they exists so I think I did it so how are we doing on time we're doing okay I'm gonna have a quick look over at the questions so I think a lot of these I'm getting the feeling that like we've gone into saw a serious art town which is good is to be expected so I will flick through it let's have a look right I'd see that some of these have been answered but I think it's worth talking about so someone asks all these assets available to download no these are in all seriousness these assets are the primary value of our project we'd love to share some stuff and maybe we can find something you know that's more middle ground that's more representative for our game but these literal assets and not something we're going to shift because as I said that as I hope I've demonstrated within reason you know you can get quite far in an afternoon but the actual value is those so we can't we cannot give those away okay I am flicking through doo doo doo doo can you have more than one asset in the tile map I'm not sure what you mean I need clarification on that teaming can you use more than one tile map on can you use more than one tile set on one tiled map no yes no i don't yeah i think i think we should we split ask differently so that wasn't really a concern okay I'm flicking through have you used other sprite boat other than rectangles is there an impact on performance I think that's what you're talking about now I do not know I'm sorry okay I might have missed this but are using normals for lighting your sprites I yes and keith has answered that so we're using [Music] rights okay I forget yeah keith has been working on this a long time so gradually some of the things that normal some don't I showed you that big let's go back to that it's more exciting than nothing if we go back to you let's have a look at one of them anything will do there's a girl yeah go back to edit map because I can't remember where they are it's a lovely folder structure but I don't know it lovely rainbow world there you go so some areas have it some do not I'm not sure how much of its applied yet I believe Keith has said so I will defer to him Judy came I did with you before was too heavy and lost megabytes is there a way to optimize it to be honest ah yeah I'll just finish this wit to be honest we haven't had tremendous performance issues I mean for example when you look at this map it looks large because it is dense and also if I mess it G to get make it realistic it looks large but compared to a 3d game this is tiny like it's really small and obviously by the nature of tile maps and all the rest of it sort of texture and memory usage is reasonable I'm not gonna say are we never had any issues with it but I feel like compared to you know other solutions you might find I don't think you'll find too much of a problem there at least we haven't experienced any you know dramatic challenges there okay how would you implement the floor that is being a few from the die well I said from a perspective like and gave mr. RK like in games such as tree it's rage or even Street Super Street Fighter 2 there's parallax on the floor which you placed the floor in 3d in ue4 and have the camera looking down in an angle or would you fake it with the camera looking straight forward yes that is stuff I can't think if we have any like really strong examples but we do not have outside the normals any like you know we all 3d elements so anything like that I can't think of any really strong examples but anything like that would be down to the artists interpretation you know in they would appreciate how the 3d shape would look and they would make it as a 2 G old 2d object so yeah that is one of our hard lines in terms of purity with our projects you know we will not put literally just sort you note 3d Poly's in there we try and use as much at the Unreal toolkit as we can get away with but we do have some sort of you know rules ok so that see here how do you deal with resolution I I'm sorry I will have to defer to art on this they will no I know we have had fun and games with pixel ratios we have to be quite particular about it and I will see they will have to answer no specifically I know you said there are certainly considerations but once you kind of get that set up and you know what your ratios are it basically behaves when you start to get into a mess as if you don't clearly define that okay how have you found ue4 to be performance wise for 2d games how's the overhead honestly fine I mean this took a while to open but obviously you know we've got a while to go it's not fully optimized and there's a lot of stuff in here that can be sold in terms of playing it even now when we send that package builds they run on pretty average hardware and I think you know I think you'll agree in fact I might just let me just check the old audio is muted I remember how audio devices work honest yes in fact I can probably guess now I'm safe so you know with it looking approximately like this it runs on pretty average hardware obviously in terms of our development machines no they're much more powerful but we're running you know the engineer editor behind it so I don't think I don't think we have too much problems there's also a good opportunity to point out I don't know how well it shows on stream but this great I'm walking over now that has the glint effect on it so if I it's got that cool like a fact I like that but again it's quite subtle you know the majority of the scene is not made up by that so nothing too special I will just flip through and see if I have missed any questions Xin I can't leave myself in such a horribly dull location surely there must be somewhere more exciting go bust out the debug everyone loves debug okay that's that's a bit nicer okay I'll just check I haven't missed any questions okay looks like they've mostly been answered looks like the rest of what the rest of the team has been very efficient so that is good it's okay yes that's fine right okay do you have any light sources coming off of a character a torch for example I think I think we can I mean there's literally I think it's intended in fact actually it slightly new it's probably broken because everything's broken when you're not looking um this guy here has a torch at the moment it doesn't have the lit effect is he gonna do the thing no he's not gonna do the thing how disappointing but anyway um of course I'm still in that I'm still in zooming mode I do apologize yeah we are there's a guy with the torch here at the moment you can see he doesn't actually have the you know real lighting effect I'm pretty sure we could just add that I just think we haven't yet it's not been pressing and obviously you can see you know we've got a bunch of other of course and I'll producer Aidan has pointed out there is a light source on the player it's a small one so small that I've kind of forgotten about it but yeah there is a little sauce on them let me just move up here okay so those guys decide to come back right how can I make a parallax scrolling effect with a North on off all flock and all camera I want to say that I have some 3d characters and animations in the game but still want background layers do not know specifically but I believe that let's have a look I mean parallax is parallax right as in the effect is quite straight forward I should point out the reason we don't have it yet is this basically because of that we look at it and go okay well we know how this effect works you know in very basic terms it's like well okay we have separate layers and the layers further back move you know less quickly relative to those at the front or the other way around it's late but you know that's that's quite straightforward to implement all the other stuff we've been working on implementing like for example this very work in progress visibility culling and more advanced lighting we're looking at that first so I think to be honest it would work the same as any parallax system sorry it's all saying sort of keep asking but is there a good way to profile a 2-d game I believe that the normal tools work I'm it's been a while since we've dug deep into that but I'm pretty sure the standard unreal profiling tools do the business I mean it's it's it's an unrelenting game you know the same tool should work and you'll get the same information okay looking okay so he said if at the project the tile size was 16 by 16 this leads me to wonder what takes up the most space in these projects art I'm pretty sure it's art probably art an audio those kind of assets but again my team will happily correct me so how do you handle AI without nefesh navmesh volumes no they do have navmesh volumes we're getting a little off-topic but hey I'll allow it kiss it is my baby so there you go they have never met navmesh volumes and actually you remember the collision we made for the tiles I always forget the shortcut just see actually that might be able to the steak I think it would get unhappy with the amount they were here but the the tiles themselves if I open this map I don't need you to go over here they where is it yes I saw someone else about box2d and stuff like that oops I actually needed this one and we're not using that we are using the 3d physics which you know has its own quirks but sorry I'm just making sure this is extra visible can you see no it's right at the bottom well I don't know thanks computer we are you just using the 3d physics with quite a strong quite a large collision thickness so they stick out which just allows the standard math measure to work the navmesh itself works pretty normally we is in pretty much like the 3d stuff pretty much behaves in terms of the AI navigating it sensibly way off topic I would love to do that another time I'd love to have another chat about that but yeah I could talk for another hour about it so hey let's not do that okay I go team London is unreal oh yes do visit London is unreal if you're near the London area it's a great meet I feel about using Unreal Engine for 2d stuff on mobile but I'm worried that despite only 2d features like um gee there's the 3d engine running on all cylinders do you find there's a ton of other processes processes which you could do it out in your bill would it be better to use a more 2d engine for this that's a tricky question I think the thing is it's a it's a bigger question that it's like if we were only ever going to make this game as we originally imagined it being as like a really traditional 2d game maybe but still probably not the situation we're in now hopefully I've demonstrated that you know now we're starting to leverage the systems that only exist because it's a much more powerful 3d engine we consider that trade-off to be worth it I will profess I know nothing about mobile hardware in terms of what you can and can't get away with so I don't know but for us this works well on the hard way we expect it to work and we're all able were able to add lots of kind of cool effects that I think a more pure 2d engine wouldn't be able to supply okay and also I think I can see one of our audio dudes also oh no he he's going crazy on audio but I was also going to mention that yes there's been a lot of avenues have opened up they're really exciting things to do with audio that again if we'd gone for a more traditional engine probably wouldn't have suited okay and the next question are you using a camera attached to the spring arm inside the character class or as a character or is the camera in a separate class whoo that's a topic and a half I will the debug may not be attached but if it's attached I will show you like a little is it it be turn it off we might turned it off that's sad another time short answer we have a complete completely separate camera class it's pretty smart I get to say that because I did not make it but it's completely separate to the player because it takes into account other things in the scene so it's weighted towards points of interest that can either be manually placed or could be attached to enemies for example so it's it's kind of contextual it's aware what the player is doing and it mostly follows them but we can smoothly move it around so I guess actually to directly answer your question no it's not directly attached to the player it's not just a spring arm it's its own class [Music] yes oh yes I see yes so echo level is one of our awesome audio people and yeah he's he's already saying a bunch of words that make no sense to me but if you like audio I'm sore there I'm sure they're tasty but no audio is something that I'd love to share more about soon but I would just say that yeah the new tools that have come in the last couple of versions of Unreal Engine 4 audio been really exciting for us I'm just going to check I think I have covered everything there's something there's something happening I'll just move the game again because it's kind of pretty oh no Allah have been summoned eyes a shame we did we remove the debug or did we remove it now we did what I can point out while that's coming in is that thing I mentioned with the ghost we just had the simple material boss ground it you can see it here you can see it's not fully adjusted it should be a bit bigger really but you can see that it just ensures that the character is always visible in front of it so that's just one of the minor things you know again it's not actually contributing and massive him out to the scene although actually this is a good I tell you what because I think we actually disabled some of the cool camera debug which again I'd love to do a stream just focused on that because it's kind of got there but here is a good example if you if you look at the relative position of the camera to the player Mouse everything is fairly central and if you keep an eye on the player now when we go in here you see the camera is just getting drawn higher and higher and higher but it keeps the player in focus will not in focus on screen but it's being pulled somewhere else so yeah it's not it's not directly attached to them in any way on you okay I love this light I think this may have been answered by your minions in chat they are not my minions I wish how do you deal with the instances outside the camera what do you mean I will ask well I'm not quite sure what you mean by that but I can answer the next part where someone asks have you tried using bsp full of alerting I like PSP I like it a lot it's just actually you know what I don't I like PSP a lot and I like the way it's fast for making 3d maps but look that's what these guys are for everyone but me hates them but you can make something super fast and it doesn't look as messy as the thing I made in the previous example because it's all you know a couple of colors and your intent is clear actual BSP it's overkill is this a simple answer it's not necessary to have that kind of geometry in the scene but I do love it okay I am looking here would paper 2d be suitable for a 2d isometric game say in the vein of the classic XCOM or would it be smart that's doing a 3d environment with character sprites billboard to the screen who I don't know my gut feeling feels like the latter we're not the best people to ask for that purely because if it's offer if there's ever an easy way to do something or a hard way to do something we always end up doing it the hard way because it can't help ourselves but I've I think it would depend very much on the style of your game I'll be honest like I hope again you've seen through this that like a lot of the stuff in this game is really down to starting from starting from the art of a direction that goes and then finding the effects that complement it so I can certainly see both ways will work technically it just depends what you know what you want the overall style of the game to do and I'll produce an has confirmed that tile map support isometric I wasn't sure because obviously we haven't used it so yeah you can you know you can do it either way I think it's really more of a stylistic choice rather than you know a hard barrier to stuff like that okay I think I think why did I do the circuit I think that might be everything and we're pretty much on time but I will hang for a little bit just in case anything shoots in I thought you know what let's go back to the I know I just put the catch at the start of the level we just don't know because what I will do is I can just place her a little bit and see if anyone has any questions about specific bits if nothing comes up that's fine too as someone's asking I can see us direct for a chat it's correct to using a custom collision or just a default capsule collision well let's have a look I think the capture is definitely in there but you know what I thought there you go they have a capture component and I think it's pretty stock that's their ID this might be a risky move ah let's have a look I love the way that they're laughing at me every time I go in here by the way it's great so I should stress there's some stuff working progress I thought that does but we're not using it for the camera I know that for sure yeah I believe so I believe it's a pretty standard capsule our physics are pretty normal they're 3d they're just honestly constrained constrained 3d rather than actual 2d so yeah there's nothing too special going on there nothing crazy let's get back here I can see someone asking do we have an ETA for when the game is released we do not please follow us please look at our website CBS and Fox comm Twitter all those things I hate to be that guy but that's the reality we're not sure yet we're making good progress that I think so someone asking in a 3d development used level streaming and read the things inside your view how do you approach this in a 2d environment so we have experimented a little bit with level streaming the honest answer is at the moment we just haven't needed it if you remember that I've said that so I wouldn't do this before that actually compared to a 3d game the map is technically really small like you know the scale of all these objects compared to any 3d game is small so as it stands we haven't needed to really lean into it I think we'll have to use it a little bit to sort of mask initial load and things like that you know as it loading from the main menu but I don't think we're too concerned with having to do lots of you know streaming volumes and holding people in place to load the next section because compared to you know traditional massive triple a 3d game it's actually quite resource light okay so yeah I will give it I'll give it a couple more minutes everything rolls through if not I think we can start to you wrap up haha awesomeee alla asks is your camera system inspired by insanely twisted shadow plan at all it is massively inspired by in twenties insanely twisted shadow planet why does it have the name with that yes that was a big point of reference oops even realized isn't any same point of interest yes we're able to turn on debug I think we've sort of switched our current debug you'd see that it's very similar it's a bunch of overlapping circles and you know they're weighted and they can all meet up with each other you can see there's a very strong one here as well that's dragging the camera up and back towards that but yes anyone who anyone who's interested in game cameras which I hope that it would be some of you here find the video of the team and say new swimsuit shadow planet describing their camera system because it's great I think for 2d games is one of the best I have seen of that style okay we all set questions or most of the questions okay I think I think we're about good yeah I think that's about right let me just check everything is in order excuse me I'm not used to having quite so many screens okay yes I think we get so thank you very much for coming on to this stream honestly it's been it's been a pleasure to it I'm so happy that epic let us show what we're doing with their engine I hope it's been really useful and I should point out obviously that I know we haven't gone make it into making it in depth we just want to get the ball rolling see if people are interested and demonstrates that you can actually get closer to what we've got then you might think pretty quickly I will try to go for the forum threads and answer any of the questions that we haven't and hopefully the guys still chatting away there and you know answering some of the more in-depth questions which I'll be honest I ever don't know or couldn't answer succinctly beyond that just a little bit of the usual the usual admin please if you are interested in our game please do check out our website or our course on all the usual channels please do check us out I try very hard to respond to everything that comes through yes we're good so thank you very much guys yeah hopefully see you again soon goodbye

Channel: Cardboard Sword

Views: 78,822

Keywords: Siegefox, The Siege and Sandfox, Sandfox, Pixel Art, Video Games, Stealth, Metroidvania, Indie, Dev Diary, Dev Blog, Game Dev, UE4, Paper2D, Training, Tutorial

Id: a1hKdNauLLw

Length: 60min 45sec (3645 seconds)

Published: Wed Nov 15 2017