UE4 Mobile Game #02: Setting Project Standards

hi and welcome to our Unreal Engine Meetup this month we want to talk about building the standards so we want to do some housekeeping stuff we want to make sure that we're all on the same page I'm going to try and flick through this pretty quickly because we want to move along and we've also got a contribution from someone a game that Paul would like feedback from so we'll get into that so with this we're going to be talking about textures and materials meshes asset naming conventions artistic styling and modular grid system textures okay so with our textures we want to keep them all Square and so because we're developing for mobile everything is a bit more stringent than just developing for a PC game and so we're following the rules pretty closely now with a typical game you don't have to make your textures perfectly square but it helps or you want them to be in a power of two so if you follow the 512 by 512 or what you can see there those rules that is great but don't ever exceed a 204 eight and we want to use smaller texture sizes where the quality of the material is not too noticeable I'm going to flick over into our project now when you clone the project from git hub through your good Kraken which I've got open here you'll clone the project open it up and you'll see this empty project scene all you need to do is open up the map open level and I've called this one asset field so when we open up that now you'll see the fun stuff you'll see some of the contributions made and first we can look at this gun here so take a good look at that isn't that beautiful look at the you know where the missiles come out and we've even got a logo for the aliens or their planet what represents them or their defense system force and this is the work of John so we should give John a big round of applause now for contributing this to the game project thank you John and as a thanks from all of us and Unreal Engine we want to give you a Epic Games lanyard and a thing that you can put your credit card in which has unreal all plastered over it so thank you that's our thanks and if you contribute something to this project we want to sort of give you some praise and give you something and we'll be getting shirts made up and other things like that so swag is really what we want to be on about ok so we're going to actually just for fun I'm going to hit play and turn on the volume all right I have to get closer to the actor all right there we are look at that Gaby closer first it has Nigel generator two generators one inverted and was made a flying machine with that and I've just knocked it together with them so that it so I didn't have to create anything and I don't I don't want to be creating a whole bunch of jobs simply close it we won't start you guys doing so just stop here what to see he is dr. pol and we put it together you can see it work and so it's here is and aliens run social physics humans who've landed on the planet so you don't want to be in the play that's place pretty cool huh stop on that and there are some other things in this level I'm going to show you but we'll just move along so oh wait my point of coming to here was to show you this now you can see the texture quality on that box here would suggest to me that that box is like a filler for the distance you know the actor is not going to come too close to it so we're happy with that quality and that brings me back to this point here you can use smaller texture sizes where it's something like that in the distance and it's just filling up to build the environment in the context of that environment that makes sense right let's move on hey cool yeah so we would pack them on there to reduce draw calls now if we're bringing in textures we want to just make sure that we've got these settings set up now these are set by default so unless you get in there and mess around you won't have a problem but if we look here for a texture that we've got now I've got all of my engine assets showing in here so I can hide them by going to view options and unchecking them I don't need to see them I just want to see the assets that we've been building and okay so this is an example of a diffused texture that we've imported and on the top you can see up here we've got the image size and compression settings so that's by default and we wanted to leave it at that also make sure your F RGB is enabled so that was also on that texture property box if you're importing textures which are not mesh specific and I'll give you an example of that so if we go back into a project and we'll cut close this down and let's look at the gun that's a good example okay so this texture here that John has built for us it's specifically for that gun we can't use it anywhere else well maybe if you're creative but the point of this is when you build an asset you want to bring all of your textures and materials and meshes and everything all in the one place but if you're creating a material which could be used elsewhere then you can put it in content project material library so later on we're going to talk about our housekeeping rules but where we put files and and that is part of that system at play so with materials we want to be really super simple with materials we're not going to be too complex and I'm going to be way out there and that's because we're all about performance mobile devices some of them can't really hack it so we're going to say no more than five texture samplers and if you think that's really tight well we want to use two okay we really don't want to get up to using even four if we can use two three and keep it around about there we're happy that makes the likelihood of our game working and also your job simpler but what if you want to scale it to exercise so typically when we scale textures we use a texture coordinate so that's that little red node there and it's driving the size of these textures and so it outputs a different sized texture so if you have like a brick and you want to change the scale that that brick is perfect to that now this is what you typically do but we don't want to do that we can do something different the better way is to run your texture coordinate node into a customized UV has anyone done this before have you done the previous way before I often do this with my work and and now with mobile I'm thinking this is now the way that we have to do it now this quote here is from unreal everything in the pixel shader on mobile is evaluated with half precision floats this causes blocky looking textures and some other artifacts when pixel shader math is done on texture coordinates to customize UV inputs however are done with full precision so they get around this problem now what does that kind of mean okay well if we're in the thing out of the two shader types pixel shaders and vertex shaders what is doing the most work currently every pixel in this scene is having to be drawn so even if we're looking at this you can see little pixels down there the black little dots down there so all of that has to be drawn now if we go to wireframe well look at that so between a vertex shader and a pixel shader you can clearly see that the vertex shader is not doing anywhere near as much work it just has to draw these triangles so that's the theory here that is where we're directing the processing to be done by using a customized UV and all that means is when you're creating your material and we can do that here we're just go into material library make a new material all of our conventions which we'll talk about in a minute and we'll just call this test and if anyone here hasn't yet built a material in unreal this is how it's done it's it's very easy once you know what you're doing we can just press T and left-click to get out a texture node come on or you can right click if that doesn't work and just go whoa texture sample there we are that'll do the job and I know we have a texture in here for a carbon fiber so we use that one and we can just copy that one because we had some problems with our shortcut and let's say we want to make this one our normal map okay so once again we'll just start typing the name of the texture and it will bring it up so the diffuse is it's like the color information and that goes here into base color and the normal map and that feels that 3d effect when you're looking at the material and when the light is moving across it you can sort of see that it well I look 3d and that's through the normal map and now when we look at this little preview er you can see that that's a really big carbon fiber texture and when we're building for mobile you might have your textures and you you want to sort of scale that texture to suit so to to fix that we're going to select the material node and over here in the information details under the material you've got to drop this to get some more options and you'll see number of customized UVs so let's just bump that up to one okay so now when we add the other shortcut is working now so if you press u and then left click you'll get the texture coordinate so if we make the value 2 for the U and the V tiling and then port that over into customized UV I look at that our texture on this cube has condensed and so we can tweak that however we like and that is a very performant way of adjusting texture scales for mobile there you go and making a carbon fiber material now with the material like that it might be very useful for another asset that someone else is working on so in which case please put that in the material library folder here clear as mud static meshes all right now you know that we want to be very performant without mobile developing and really the big thing that you need to look out for for static meshes is just the number of triangles on that thing reduce that if you can but you don't want to sort of have to compromise too much if your object is something in clear closed site and you need to have the details well sometimes you just have to throw a lots of triangles on it and that's just how it has to be but there are things you can do and it's just important to keep that in check and obviously you don't ever go over 65,000 vertices that is the limit for unreal and in a scene such as this we don't want to ever have more than 700,000 triangles and to find out we can go up to window and statistics and in here you'll see how many triangles we have in this scene it's this one here where is it does someone see it well with each with each static mesh here is okay so that's the total there so I have to see that for a minutes inverted so five hundred nine thousand triangles we have in this scene currently and you can see for each static mesh what that value is but its thymus by how many static measures of that type are in the scene so with that turret gun of John's that's a total of two hundred three thousand so we might have to do something about that and we can so that's something to keep in mind when you're modeling your meshes we know that already and yes speaking of something that you can do it's the level of details so if we wanted to look at I don't know John gun and let's just have a look at this in wireframe so you can see it's quite busy that's yellow but just because I have it selected but yeah around here it's really busy we can go to optimization it's view modes and look at the quad overdraw and let me zoom out you'll see where the big green areas are that's the areas of concern so yeah okay we want to do something about that gun so we go back to lip I'm going to open up just this piece and we can now look at our level of detail settings over here so there are some presets with Unreal Engine and you can make your own or you can toy around with the ones that they already have let's just try this one but first we want to see the wireframe okay that clear enough on your screen and if we adjust that to high detail we just say yes to that just look at the top here it's 26,000 vertices just currently if this doesn't crash it we'll see what happens when we zoom out all right look at that so when you're right up close it's 40,000 triangles we zoom out slowly it will drop 20,000 10,000 and all the way to 1200 I don't know we'll get any lower than that who would care let's hit save and let's just look at the visual quality of that mesh now let's see if that spoils it for us well here it looks fantastic as we zoom back looks fine I can notice a few little things changing with it but it's not that bad it's not that bad keep going back who would be happy with that that's a good outcome so level of details is something that you want to apply to your static meshes when you bring them in and test them out all right so the style guide someone on our discord Channel suggested that we use the Ella style guide and that is like a naming convention system and it's like the housekeeping it's like how we where we put our files and how they're arranged and stuff like that and what it means is everyone can easily jump into a project and understand it so if you're finished with this one that we're working on and you go into a project somewhere else and they're using the same kind of style guide it's easy right you know where to find stuff you know how to name stuff no one's going to knock on your door now these are some principles that are set out by the guy who I guess put this together they're kind of interesting too to read all structure assets encoding any Unreal Engine 4 project should look like a single person created it no matter how many people contributed so that's that point friends do not let friends have bad style okay does anyone remember watching perfect strangers so Balki would often say like I forget it's been a while you say uh ah don't be ridiculous don't be ridiculous cousin so if you see someone doing something in this project that's ridiculous you can tell them don't be ridiculous you can use Balki voice so we want to be following that oh yeah don't break the law okay so don't pull images off the web that are clearly copyrighted we don't want to see men again we want to see original content so stuff that you create this chocolate in there instead so we're talking about the naming structure and this is really what it is you put your prefix at the beginning your base asset name and you can see how here we've got each different word capitalized makes it easier to read right if everything's just lowercase that's just one big word then the variant and then the suffix so some examples for a material M underscore tree-bark underscore and then the type alright makes sense and just for a normal map you'd end up with an N okay so for a diffused texture we would end up with a d for diffuse now here are the common uses for that so blueprint BP underscore the name of the blueprint there's your material static mesh I used to always use SM some people use F I guess with this project we use s I'll change my ways art styles okay so with this we've already had some wonderful contributions and we're not going to tell those people hey we want to go cartoon now so you're going to have to just get into substance painter and redo it we're not going to tell that to someone John spent probably hours on that gun probably not every 10 minutes so we're going to run with that what he has done is good for us we're happy with it and like this box here this was done by Nigel beautiful right so the style here seems to be heading in the direction of realism we want to impress people and we're using Unreal Engine of course we want to impress people and why not we can make things look realistic right and that's the point here we're a community driven but at the end of it when we play the game we will get a feel for it and we'll be like well maybe I can tweak this bit to sort of look a bit more realistic or maybe the whole overall thing will change a bit we'll just see how we go now just can everyone just for a moment imagine what an alien looks like no look if you're not thinking of that I think you're lying because that is just what comes into my mind and I think it has to be going into everyone else's mine right honestly but I'll have to think outside the box I really want us to think about what alien life could be like what the planet could be like we're not just creating meshes and building a mobile game we're really having to think about the details do they have buildings on their planet and what kind of materials do they use are they the same kind of proportions that we are here the kind of the same they've got the big heads and stuff I've seen people who look like that so they might end up looking like that that might be an alien you know like a hex bugs so just think about that the flora and fauna gravity is that something we're going to have to deal with it we're going to have to add physics to this and sort of really tweak them because we're on another planet okay now our modular grid system it's it's going to make your life easier when you're playing around and building the level it's fun to build because when you build something for this you know that other people you come along and have to manipulate your meshes are going to have fun doing it so I'm no mire expert I've only jumped into that program over the past two weeks but I managed to get this panel made up ok so I guess it was inspired from sitting on a plane or something and then the bulkhead above probably from sitting on a Logan city bus but they're the panels that work with our system and that's because they follow the dimensions and these systems are going to be suitable for buildings fences all of those things but especially spaceships so that panel that you saw there is really a component of a spaceship and we're not going to use that in the game all right that's just an example you guys can do better so for things that clearly don't need to follow this grid system obviously it's a non-issue so that box we saw before the other box phones can open these inflatable pets we heard Christina wants to bring some inflatable pets I'm not going to do that to a grid system get real so these are the dimensions of our grid system one meter by one meter how easy is that so if you're modeling up something in Maya or 3ds max or whatever just make sure that it's a multiple of one meter in height width length if that can't work because sometimes it can't just make it a 100 mil increment okay or 10 centimeters so we've got like the macro grid which is one meter and in the micro which is 10 centimeters and so that's how I built this panel it is one meter by one meter like looking at that floor panel there and the exception is the height because I didn't want to have this 3 meters higher I want it to be 2,700 higher and so that's when we're jumping back into the 10 millimeter up sorry 100 millimeter increments all right and I'm just going to demonstrate that really quickly in here so with this panel if I want to copy it and move it along it's just a matter of me coming up here to the scale and I can change it to 10 or 100 now I know this panel is one meter in width so I'll click on 100 and 100 centimeters if I hold down alt and drag along the x-axis I'm copying that along and it's perfectly aligned to the panel behind it so I could just keep that suckered going and that's what I've done along here you can see I've had a lot of fun copying and I've done the same with the ceiling panels it it's kind of rewarding but that's how that system works and the same for the floor now you can see that I've built this floor of many different meter square pieces well if you know that this hallway is going to be 16 meters long you can just make that one panel 16 meters long but you know it's still a multiple of a meter so that's the point of that easy as right now in your modeling program make sure that the piece has its gizmo set to a corner or a transform make sure it snaps that and then you bring it to the center of the scene so that'll be in world space zero zero zero so that when you export that and you bring it into Unreal Engine it means that your gizmo will be at that very point and that will allow you to use this system if that's off even slightly by a few mil it's not going to work it's going to look bad okay you know about that keeping the project optimized okay so these are some of the questions we need to ask ourselves as we go and this is you know as you know a community project so we want your feedback as we go we realize you're going to come up with some ideas and we don't want to be driving the ideas I'm just throwing some ideas out there and then you guys have to say yeah no this is what we want let us know we want it to be driven by you guys and that includes the style of the game we have to be thinking about our target mobile devices and so for that reason I can't just give you a list of everything for the settings but you need to put it into your editor because there are so many different devices out there that we need to put a bit of thought into that and that's where you need to maybe get on our discord channel and just say you know what I still have a Nokia and I don't want you guys to forget about me all right so we'll have to take everyone into consideration your suggestions we're going to do some research so this isn't just building a game but we're going to do market research and part of that market research is understanding what people are using if you're curious and you want to jump in your editor and see what it will look like on a mobile device you can do that so to do that settings and preview rendering level you can just jump down here and select default mobile or Android preview or Apple now if I were to hit those it'll say compiling shaders and we'll be steering at that to 20 minutes so I'm not going to do that but you can try that out and I did before and it didn't look too bad I once again was admiring the guns and I didn't notice too much of a lack of luster okay so we were looking at this just before and you probably won't need to be using this a lot if you're just creating meshes but overall as the level builds and comes together you want to see what the effect is for the entire environment and that's when you can come in here to optimization view modes and just try them out share their complexity and quads I like this one lots of green makes me happy red and green and kind of jolly but that's what you want to see and if you see a lot of red around the place and sometimes that happens I've had projects which are mostly red and even up to white white extremely bad you don't want what and what can bring white is masked materials if you have a tree and you've made a material that's mask so you've got your like your diffuse part of the material is the leaf right and everything else around it is transparent it's extremely wasteful it's very bad for performance and on a mobile device it's sometimes unacceptable so you'll notice I think it's on here the Sun Temple demo built by Unreal Engine if you walk around that building in there on a high-end Android device it works fine but if you look at the window and if you look out the window you'll see the trees in there and those trees they have the overlapping leaves with the with the must materials on them and it's just white so they say that if you look out that window at that tree you might crash okay so now you know and if you're developing for mobile be very very wary of using materials that are translucent you will move on questions do we have any questions yeah I think that's going to happen as we go so along this journey so far we want to understand what a good mesh is and so as people create meshes we'll look at them and if we can see that a mesh is unacceptable if it's just like someone's gone ahead and done a Moreton Bay fig tree and it's just you know ridiculous we're going to let you know but we're going to do it very graciously and we're going to probably look at many ways of reducing the triangles on that tree so we'll look at maybe doing something in Maya or 3ds max to reduce it that's where you want to do it first you want to do your best in those programs and then when it comes over into Unreal Engine then you can use your level of details but the point is give it a go we want people to give it a shot even if what they end up submitting is not something we can use for done right try to make it work and we will yeah I guess if we have something which needs to be multiplied over like if you just have like grass for example I guess that's one challenging mesh to have in a scene because you have so many of them and so you've got to use level of details you've got to have them coal you've got to have them disappear at a certain length completely sometimes we have to really play as we go and then use the optimizations in the in the view modes to just see what works and also keep an eye on frame rates because you know in the end we're just going to have to try things out because we'll come across things that we won't really get answers to so this is where we have to try there'll be a lot of trial and error there might be tears but at the end of it I assure you they'll be tears of joy any other questions cool all righty

Channel: Brisbane Unreal Engine

Views: 5,530

Keywords: Brisbane, UE4, Unreal Engine 4, Game, Mobile, Game Dev, Game Development, Mobile Game, Mobile Game Development, Epic, Epic Games, Unreal Engine

Id: bLVz1Z5aqQI

Length: 38min 35sec (2315 seconds)

Published: Sat Aug 19 2017