superherobr-battleroyale

[superherobr-battleroyale]

Evaluation

I really enjoyed this project. Learning c++ and making a plugin for multiplayer was super fun and I'll be able to take this new knowledge into the next project and learn even more.

I did have quite a few serious problems, like when making my plugin having the project say there are 10000 errors for no apparent reason was pretty scary for a first-time c++ coder, but I did eventually get that fixed with a semi-colon fixing it all. Another problem I had was getting players from the starter map to the main map and having it work well over the network and across multiple networks. After fixing one problem another problem would appear out of that one, The plane problems started with when a client would join it would possess the cine camera for the plane cut scene, rather than possessing the character, To fix this I ended up just rendering out the cut scene then deleted the camera. After that it then only lets the server jump out of the plane and not the client this took me a while but I had to do a lot of changes to how the player jumps out of the plane, it's not perfect but it works reliably.

The map was definitely the best part of this project. It started off very bland and dull but I decided to redo it. The remake was very nice with a nice landscape material and trees. It was actually rather easy to make with it all done with blueprint brushes rather than using hand sculpting which would have been a nightmare.

The abilities were kind of a fail but I didn't really get time to properly look at them and get them to work, I definitely was going in the right direction though. The chest system that went with it was very cool too, spewing out abilities and would randomly spawn the ultimate ability so it wasn't so overpowered.

The next project is exciting and I will be doing mostly c++ which is even more exciting since I want to get even better at it and understand it more.

[superherobr-battleroyale]

Main Menu Rework

My main menu was lacking in the looks and functionality department, since I had been focusing so much on the actual game I hadn't had time to do anything to my main menu. So today I took the time to make my main menu look a bit better.

This is what the main menu used to look like and I didn't like it, So I decided to change most of it.

So I started with the buttons, It used to be 2 buttons on either side at the bottom of the screen, now its 2 buttons neatly aligned at the side of the screen, which looks like this:

As you can see the quit button is also now in the top left rather than the top right, I felt the quit button should be on the opposite side of the join and the host buttons and those buttons should be on the right.

The next part was the default level in the background, this didn't look very nice even if you were just on the screen for a few seconds. Now looking at a lot of other games like Valorant, Fortnite, Siege, Apex and Overwatch 2, all these games have a 3d background, meaning they have something going on in the background that is 3 dimensional and is moving either being a character or a place, with apex and Fortnite they put the characters in the main menu, so I thought I would do the same.

This is my new main menu, I wanted to add colour and things to the background but I ran out of time and may add it in the future.

This isn't all my menu can do though.

Yes, I added dances. I found these dances and wanted to put them in my game somewhere so why not have a dance on the main menu.

It also has the material that is animated using the sequencer that runs when the player presses okay on the warning at the start, after that it then players an animation montage .

I think this is super cool and could improve on it in the future.

[superherobr-battleroyale]

play testing

I have play tested my game in 2 different situations. The first one was in college, I has 3 people download my game and try and run it, now since its an online game it needs steam as well as to get past the firewall, only 1 out of 3 people could even run the game, I did learn that multiplayer is a problem on these pcs because of the heavy restrictions, so I decided to get a bunch of friends together at home and try. It worked flawlessly, no glitching, no lagging, and everyone was seeing the same thing which was great, even though you can’t kill each other and the abilities are quite broken since i’ve been focusing on multiplayer. But I think the play test went rather well. Since my game is a bigger map with alot of trees I was worried about performance on different pcs, my laptop handled it fine since it has a 3060 (but is a laptop 3060) and a ryzen 7 5700H which are both pretty beefy and would get around 70 to 80 fps which is pretty good, my desktop is worse specs with a ryzen 5 2600x and a RX 5500xt which is around a 1660/1660 ti for nvidia cards, so it did struggle with an fps at 30 to 45 but it didn’t stutter or freeze. My brother tested it with me and has a beefy pc with a ryzen 5 5600G and a RX 6700 xt which easily ran the game at a nice 90 to 100 fps. I’m not sure what specs my friends pcs are but one said it ran around 30 to 40 which is around the same as mine. So I Think this test was quite successful.  

[superherobr-battleroyale]

Dynamic volumetric sky

I got this plugin for free on the unreal marketplace and I wanted to test it out. So since I had a project that dynamic weather would go well with since players will be in the game for a while. So I added it to the project. 

It was very easy to set up all I had to do was to just drag in an actor and it just works, making sure to delete the default sky and lighting solutions. 

The plugins has all sorts of things, there is a time of day system going really in-depth including seconds, minutes, hours, days, months, years. You can also set the longitude and latitude. It also has clouds as well as rain and snow. 

It does all of this dynamically by itself or you can set it to do a certain thing at a certain time.

The last thing about this plugin is that it also simulates wind. Which is really cool looking. If you have grass or trees or bushes in you world it will make them wave in the wind, the wind is also very customisable, you can change the direction and strength. There is also a component that you can add to different actors to make them move with the wind. These items can be picked up by the wind and fly away depending how light or heavy you make them. 

Night time with clear sky

Day time with clear sky 

Day time with partially cloudy

Day time cloudy

Day time overcast

Day time foggy

even though it doesn’t look like it it is day time raining.

Day time snow

[superherobr-battleroyale]

Randomization

RI have now implemented the random part of my game. I added chests that when interacted with will spawn abilities in front of it. These abilities can be picked up by the player and used. 

I started by adding the widget on screen so when you look at the chest with the crosshair it will add a widget. 

This line trace runs on a tick which checks to see if it hit an object that has the interact interface on it, then will add it or not add it depending on what was the outcome of the check was. 

Then I added the ability to press F and open the chest. 

I used the Interact event that is added when adding an interface to an actor, then the rest of the code runs in the chest itself. 

Here we are checking if the widget is on the screen, if it is then we set the chest to its open position. 

This part spawns the abilities, I used the location of the chest then added some to it to make the new abilities location. I originally had it set up so that the e and the q ability was the same actor but this was hard since each one does very different things I thought it would be best to redo it and separate it. I then ran into another problem, they would spawn inside each other so I had to make them not do that. Where they spawn is actually random since it gets random float in range of -100 and 100 then it will take that and add it to the Y value of the cube which spawns it. 

Now the ultimate ability is slightly different. It spawns in the same way but there is a probability it wont spawn in, now its a very big probability since its only 50/50, that’s because I didn’t want the player to get loads of ultimates but I also wanted the player to have one since they are very cool.

This is the code we run when the player walks into the sphere collision for the ability. It casts to the player and gets the Hud reference then depending on the ability blueprint, we check this boolean to see if the player has already picked up an ability so they can’t just pick up abilities over and over again. After that we set the hud so that it shows the icon on the hud then set the correct boolean so that for the check then destroy the actor 

[superherobr-battleroyale]

Character

My character is pretty complex already, Currently it is just the default mannequin but in the next week it will be a cool looking superhero/secret agent/ ninja. I’m not quite sure what it is but from the drawings my friend did its going to look really cool. 

These are 3 designs my friend came up with based on the research I had done.

I spent quite a while using a app that you can paste pictures too or even just drag them in. It was so handy for me to do this so I could get a clearer image in my head of what I wanted. 

I knew I wanted them looking more like this person

since the kind of black suit like splinter cell games would be super cool, even if it didn’t really suit my game perfectly.

If I had enough time then I would have been able to make the character with a hood off and hood on so the player could have some customization, but it’s a want right now, I also think that it’s quite dense on the island with all the trees and so I was thinking to have the black suit have lights on them to make the player easier to find

This is all I have on the character right now but I will be modeling and rigging and animating soon.

[superherobr-battleroyale]

physics cube testing

I was asked to test something that simulated physics in a multiplayer game and my game being fully multiplayer was a great testing ground so I added a bunch of cubes in an area that won’t let them out. 

these are the cubes i set up

when testing with another pc over steam conclusions were interesting, some cubes were replicated near perfect while others struggles to stay in sync and were in completely different places on each pc. This means that you only want small meaningful things to be replicated anything that doesn’t really matter like a ball pit with a bunch of physics based balls just wouldn’t need to be replicated

[superherobr-battleroyale]

Testing

I did a small test will a few people in my class it was okay and was kind of a fail.

Now I’m not sure if it was my game or if it was the computers having it blocked from the firewall and it thinking It’s a virus. The weird thing is, is that it works on some of the pcs but doesn’t on others which is even more confusing. I’m not sure how I could fix this since this seems to be beyond my game so I cant do much. But maybe rather than using steam I could maybe use NULL subsystem which is epic games’ way of saying LAN.

[superherobr-battleroyale]

Interacting

INTERACTING

 I have always wondered how games add a little popup whenever a player looks at something specific, I had my theories and thought it would include some sort of line trace, and it turns out it does. I watched a really good tutorial by matt aspland I have used a lot of his tutorials since he does small simple things that most unreal engine youtubers skip over.

Here is the video I followed:

 I’ll Sum up the video, pretty much it uses a tick and checks to see if the interact widget is already on the screen, if it isn’t it will carry on. I then added my replication part so that it will only show up on the screen that is looking at the interactable. The line trace then shoots out and gets the thing it hit and only carry’s on if it hit something. The thing it hit also has to have the interface enabled in its class settings, if the check comes back true It will then do a few more checks to see if its on screen or not.

This appears in the actors event graph showing it can be interacted

[superherobr-battleroyale]

plane cutscene

I knew I wanted to do a cutscene at the start. It makes it feel a bit less jarring to go from a player to the plane. So I based it off the call of duty cutscene with the plane coming up through the clouds. I started off by adding a sequence and adding a cine camera as well as adding the plane to the timeline, then having the plane come down and move up and down then the camera panning into the plane then circling the player that is standing in the plane then moving the camera up to the back of the plane. This was pretty easy just keyframing the camera's position and rotation.

Here is the video

[superherobr-battleroyale]

Plane

I 100% wanted a plane to carry everyone in to the map but I started it off wrong. 

I didn’t know at the time that only 1 controller can posses one pawn at a time which makes very good sense otherwise people would be fighting over 1 camera. So to get this to work I made it so that when the host presses start it runs the cut scene then while the cutscene is running in the background there is a for loop which has the amount of controllers in the lobby and creates a special camera pawn which then attaches itself to the plane then gets each player controller and possess the camera it just made, so if there are 30 people in the game it will cound round 30 times then spawn in 30 cameras onto the plane then when the cutscene is finished everyone is using the camera pawn. 

This is all the nodes for what’s happening.

After that’s finished it does another loop to remove the cut scene from each player 

Then after we have removed the cutscene from the screen we need to actually move the plane so I used a timeline and a lerp (linear interpolation) to move the plane between to points. 

But this is only going to the end of the island and if the plane stops there it looks rather weird. So I added a second timeline to keep the plane moving since I had already set up timing for the first one so I just added the second one to keep it simple. 

After that we just destroy the plane since everyone has jumped out of the plane and its not very noticeable on the island with everyone fighting

[superherobr-battleroyale]

Hud part 3

I wanted to show how I made the selection so it works and will not fail.

Here’s the first part and it starts by the player pressing e, it then checks to see if the selection ring is already visible on the screen if it is it removes it and sets Eselected -> false (this is so I can do abilities and checks off this boolean), i its not on the screen then it sets it to visible and sets Eselected -> true. Now I could just leave it there but then we run into a problem with if I press the E key but then press the Q key assuming it has the same code just for the q key, it then will select both the Q and the E and set both variables to true then confusing the system which ability it should get ready to use which isn’t good. 

So I added 2 more checks for each button press which checks the rest of them

This part does pretty much the same thing as the first part but only does something if it’s on the screen, this means that if the player selected the Q key then presses the E key it will check to see if the Q selection is on the screen if it is then remove it so its only one selected. It also sets each boolean specific to each key to false.

These booleans are necessary so that I can change the crosshair when the player selects one.

I haven't fully set it up but this is the start

As you can see in the video when I hit the E key it selects the right ability then changes the crosshair and hides the default one.

Here’s the code behind the crosshair change

I hate it has to be on a tick but its not game breaking for someone on a bad pc compared to someone on a good pc.

[superherobr-battleroyale]

Hud part 2

I designed the mini map to be the corner where all the information is, like how many players are left or how many kills you have. 

Now I added the storm timer since I did want to have a storm but I think there won’t be enough time to do it since I still need to do the character model. 

The main part of my hud is the abilities. This was quite hard to design since its only 3 circles so to make them feel like they fit there is quite tricky. 

This is the main part of the hud. This shows the player what abilities they have and what is currently selected. I added a yellow circle inside each area to show how the abilities would go. 

Here is an example showing if the player had 2 abilities and their ultimate as well as it selected. I still need to make the ability icons. 

[superherobr-battleroyale]

Hud

I wanted this game to have a hud so that it made my game feel more complete as well as make the game be easier for the end user to test and play. 

Hud research

I started in illustrator but not making it i decided to look at different games huds and getting inspiration from each game. I knew I wanted shield as well as heath since it’s a battle royale game so the time to kill needs to be a bit longer than normal 5v5 multiplayers. 

I looked at games like fortnite for its compass and the mini map 

All these games seem to put the health in the bottom left corner so I did the same and put it in the bottom left to make the player feel more familiar with the layout when playing my game from other games

Making the HUD

I started with the heath bars, by adding a bar then rounding the corners then adding a gradient to them, I think this looks really nice and not flat and basic. 

This looks a little different in unreal since the shield can get destroyed first so being on the bottom is a bit weird, I had to set it up quite differently in unreal so that it would look the same and feel the same.

I actually think it looks quite good in unreal.

The crosshair is rather complex. I started with looking at games crosshairs and they are all based on having a gun in your hand and needing that dot or the cross in the middle. 

so since my game has abilities and it’s not very close combat I was able to just make my crosshair how I wanted it to be. 

I started with the default crosshair this will be there when no abilities are selected.

Its basic and shows that this is the centre of the screen.

With the ability crosshairs I only thought to do them recently, I have a selection circle to show that you have selected an ability but you don’t want to be looking down at the bottom of your screen all the time so having the crosshairs change will allow for more concentration to the centre of the screen where it should be.

So this is the E ability crosshair

This is simple and shows where the e ability is going to go. 

Here is the Q ability 

This is literally the same crosshair just rotated since I couldn’t think of another crosshair 

Finally this is the ultimate crosshair 

It adds corners to the default one to make it look more “special” and more powerful.

I have already implemented these crosshairs into unreal but i'm still working on functionality 

[superherobr-battleroyale]

Making the map

It took me a while to design the map but making it was actually quite easy, it was pretty hard with how I was going to do it before but I watched a video that used to landmass plugin. This makes it rather easy to make islands, hills, cliffs, anything landbased really. 

This also goes hand in hand with the water plugin. This allows you to have nice oceans, rivers and lakes thought your world. I like how the landmass plugin is non-destructive, this means that you can move things around and model the terrain and then save it then move it to a different spot without it messing anything up.

This is the map currently it has trees and grass and some hills, eventually it will have roads using splines.

There are alot of settings to change and mess around with so you can make your world look how you want it, here are a few I used 

[superherobr-battleroyale]

Trees

The trees where annoying but needed, since without them the island looked bare and lifeless. So I had to add trees but it was having a massive hit on the performance, I watched a few videos and then created my own LODs for the trees with relatively small screen sizes so it would only have the highest triangle LOD or LOD1 would be when you are standing right next to it. 

Here is the menu to set up lods

I added 5 LODs 

Here are all the LODs

LOD1

LOD2

LOD3

LOD4

LOD5

As you can see the higher the LOD the less polygons there is meaning the farther you get away from a tree the more performance you have.

This was rather annoying to set up since it kept resetting itself but it seems to work fine now.

I also did the same process with the rocks in my world

[superherobr-battleroyale]

The Map

I have worked quite hard on the map. It has also gone through quite a few iterations. 

It started out with this plan. 

As you can see there is a starter island then a main island. The starter island has a few roads on it as well as 2 piers and a main starting area all connected with roads. 

The main island has 4 build up areas with 1 being a city, 1 being a smaller town and 1 being small housing area, the last one is an abandoned area. 

I also added some docks not sure if I like them or not. 

That was the first plan out of the map a very rough drawing.

This was the first one i made in unreal,

This is the main island and the starter island. It wasn't very good for multiple reasons, 1. it was boring colors and wasn't very vibrant and colorful 2. It ran terribly with getting only 25 fps max 3. the starter island wasn't the shape i wanted with the straight edges

So I deleted everything and started again. 

This time I used the landmass plugin and created this

I think this is 100 times better with it being more vibrant. The shape is way more realistic too. 

The landscape material is a material from the free easy building system and it works perfectly.

It also adds grass procedurally, at first it was quite the performance hit but i changed the LODs and the density so its much better now.