Senior Capstone Dev Blog | The Making of Frog Bath (Weeks 7-13)

Previously, on Leo's Senior Capstone Blog...

We came up with three different concepts for games to work on this semester: a magnetic movement-based FPS, a third-person frog bathing game, and a 3D platformer of a beaver with sneakers. We then killed off Bucky Barefoot and the Hunt For Shoes due to art scope. So between Magnet Ops and Frog Bath, we chose Frog Bath! We as a team had more fun working on the Frog Bath prototype than we did the Magnet Ops one, and that was really the deciding factor in the end.

From there, we got to work on building up Frog Bath to what it is right now! A lot has changed since the last blog post, so I'm going to try to cover as much stuff as possible to keep you up to speed.

After we finished prototyping Frog Bath in Unity, we had a serious discussion about whether or not we wanted to continue working in that engine or move into Unreal Engine 4. Why? Well, one of the things we set out to do was network our game (which is something I'll get into later in this post) and seeing as how UNET is being deprecated soon, we felt that the networking available in Unreal would be easier to tame, especially considering that our programmer Tommy hasn't had any experience networking. We also knew that movement-focused games (especially shooters) work really well inside of Unreal, so that was also appealing. With all that being said, the only person on our team that had used Unreal prior to this semester was our artist Leanna. Even then, Leanna only knew about the Unreal workflow and art-related things like lighting, shaders, and all stuff of that sort, but not a single person knew anything about the visual scripting language in Unreal.

We knew we had our work cut out for us, so the first couple of weeks were very slow in terms of the work we got done. On top of concepting and laying out the foundation of the design for Frog Bath along with our other designer Aiden, I took it upon myself to help lift the programming load off of Tommy's back by scripting my own stuff alongside him. The first thing I did was create the bath-item system, where the player picks up the item by coming into contact with it and then delivers it to the Frog King by touching him. While this is pretty simple in concept, it was a nice introduction to visual scripting and got me used to the workflow in Unreal! Once that was done, I then had to make the infamous "rope tongue".

I say infamous because it was something that everyone on the team liked in concept but had no idea how to really execute; we tried implementing it in Unity and had to ditch it due to our uncertainties. The rope tongue is a mechanic that happens when the player picks up the bath-item. When the player picks up the bath-item, the rope-tongue spawns in with one end attached to the player's mouth and the other attached to the bath item. The rope-tongue then flops around, following the player wherever it goes, with the bath-item flopping around with it. I began my journey into implementing the rope-tongue by trying out different methods!

My first "successful" attempt at the rope-tongue.

The very first method I tried to implement used Unreal's cable's and physics joints. I tested out the rope tongue using the Frog King (which was just a green cylinder at the time) since we also had the idea of having him hanging in mid-air on a suspended throne in the level. This iteration was, in a word, a failure. To my surprise, all of the joints only respond to the physics of their respective hinges, not to the chain of joints as a whole. Because of this, each joint freaks out like you see above, and the rope starts moving without being influenced by anything else. This is not ideal for pretty obvious reasons, so I had to seek another alternative.

Attempt number two using Unreal's joints and cables.

Seeing as how I already invested time into physics joints and cables, I tried to reuse what I had in its most simple form. I removed every single joint except for 1, resulting in what you see above. While this eliminated the issue of the rope freaking out on its own, it made the rope too rigid and didn't really "flop" around like we wanted it to. That being said, what I had worked, so I could've just stopped here...

The final version of the rope tongue!

But I didn't want to! I wanted to make the rope tongue as good as we could make it, so I abandoned the joints entirely and implemented a new method with the help of Leanna. The tongue is its own 3D model which was rigged and brought into the engine as a skeletal mesh, with several joints throughout the tongue. By enabling the physics on the mesh, it does exactly as we want it to! And by adding in a socket to the frog's mesh and a socket on the end of the tongue, attaching it to where it needs to be is possible.

Asides from the rope tongue, I got to work almost entirely on the UI for the game. Not too much of it is honestly worth talking about since the game isn't incredibly UI-heavy, BUT there is one piece of the UI that I want to highlight.

The objective tracker in all its glory!

Once Aiden had finished designing the first block-out of the level, it became really noticeable that it was incredibly hard to find the bath-item on your own. The solution I came up with was the objective tracker, which translates the world-space of the bath-item into your screen-space. It also tells you what your objective is, whether its one of the bath items or the Frog King, and also pulsates when is on the edges of your screen to get your attention.

Some of the other UI that I implemented was the score-bar at the top, which changes based on the score of each individual player, objective text, which is animated whenever the player's objective changes, and the reticle, which changes shape and color based on the state of the player's tongue.

Overall, my adventures in Unreal Engine 4 came out pretty successful, albeit they took their sweet time. We had a lot of ambitions for this project within the scope of the semester, and a lot of them had to get cut out because of us learning a new engine, but I am very proud of the work we all got done.

Before I get into the next topic of the blog post, I do want to give a special shoutout to Karl Lewis, one of the designers in my Capstone class. Even though he had his own game to work on, he was always willing to help me out with learning Unreal Engine 4 and I don't think Frog Bath would be anywhere close to what it is today if it were not for him.

One of the most important parts of Frog Bath is the movement, so Aiden and I spent a lot of time concepting and iterating on different forms of movement. At it's core, we knew we wanted the player to feel "frog-like" when moving and we wanted them to have multiple options with their movement to allow for different playstyles. We eventually settled on three different main types of movement outside of just normal joystick movement, which are: tall jumping, "Perfect Frog Hopping", and the tongue-shot.

The three different heights done with tall jumping.

To allow for more vertical movement, we implemented tall jumping. The player's regular jump is only so tall, so by holding down jump (and I mean HOLD it down), each successive jump done while holding jump will be taller than the last. This caps out at 3 consecutive tall jumps as to not allow players to go too high, but the tallest jump is still pretty generous!

Perfect Frog Hopping (with an outdated particle effect)

Perfect Frog Hopping, on the other hand, gives the player more vertical movement in short bursts. If the player presses jump right after hitting the ground, they will gain a boost of speed forwards. Because this is more skill-based than tall jumping, there is no ramping up in benefit like tall jumping but rather the player will gain the highest benefit immediately. It's also worth noting that players can't do a combination of a Perfect Frog Hop and a tall jump at the same time since we wanted both forms of movement to be mutually exclusive. If it was possible to combine them, then there would be no reason to use either of them in isolation!

The tongue-shot! 🐸👅

The final and most notable of the movement mechanics is the tongue-shot. By using the reticle in center of the player's screen and holding down on the tongue button, the tongue-shot allows the player to grapple to surfaces. After the tongue reaches a surface, the player can let go of the tongue button to sling off in any direction, retaining the momentum they gained from the tongue-shot. This allows for some interesting paths in the level and some crazy ways to get the bath item! The thing is, when the player has the bath-item, since their tongue is just out and about, they won't be able to use their tongue-shot!

I had talked about how one of the reasons we decided to go into Unreal was because of the networking available in the engine, but I'm here to bring some sad news: we did not get networking to properly work for our game. Our programmer Tommy spent a couple of weeks trying to figure it out, but since he doesn't have any experience with networking, he was unable to get it working considering that we had apparently set up our physics in a way that didn't easily replicate over the network. That isn't to say that we went into this blind; we did our research and Tommy got basic networking done before we started working on Frog Bath, but it turns out that Unreal's physics and networking don't mesh super well. So considering how this is a multiplayer game, what did we do instead?

Who needs networking when you can just do splitscreen? Right?

We decided to pivot into splitscreen multiplayer! We had been avoiding doing this all semester because it cuts your screen space into a fourth, but it's not like this was the end of the world. After all, Frog Bath's silliness benefits from social interactions, and being able to yell at the person next to you adds a layer to the game outside of the screen. Of course, it would have been ideal to get the game networked, but game development isn't always going to go perfectly to plan. We rolled with the punches, got smacked, and recovered pretty well!

After 13 weeks of development, we had to go up on stage with our peers in the audience and show off what our work. This not only included what we had finished up to that point and the iteration up until then, but also our future plans and what disciplines and talents we are seeking to onboard onto our team. You see, the way that the Capstone class is structured is that after this presentation night, the faculty get together and play all of our games. After that, they pick out a select few games to move forwards into Senior Production next semester, and the rest of the games are cut. All of the people on the cut games are then onboarded onto the remaining teams based on the team's needs and their skillsets.

Leading up to this night, a lot of my tasks were allocated to creating, formatting, and practicing the presentation. I LOVE making presentations, so this was a blast for me! If you want to watch the my team and me give the presentation, watch the video below. And if you want to look at the actual presentation document, you can view it right here!

I was also tasked with making the trailer for Frog Bath which you can see in our presentation. Video editing is something that I really enjoy doing, so I was enthralled to be able to spend time making the trailer for the game. Check out the trailer right here!

Now you might be wondering: what happened to Frog Bath after our presentation? Well...

Frog Bath made it through cuts!

We at Lafterburn Studios are all extremely excited and proud of ourselves for the work that we put in. We're very happy that people enjoyed our game, and we're looking forwards to another semester of making frogs bathe their king. What's even more special is that we get to bring on more of our talented peers onto our team to make Frog Bath as good as it can possibly be! We've already onboarded our new team, but I'll leave that for another blog post.

Asides from that next post, look forwards to even more froggy content coming to you in 2020. By the end of May, I'll have graduated Champlain College with an amazing game under my belt made by a group of amazing developers. I'll see you all then! 🐸🛁

Website designed by Leonardo Robles Gonzalez

Website powered by Wix

  • Twitter Social Icon
  • LinkedIn Social Icon
  • SoundCloud Social Icon
  • YouTube Social Icon
  • Social Icon