Game Dev Update #5

Hello World,

Since my last update, I’ve added more features to my first JavaScript game project and started working on custom menus in my RPG Maker MV project.

Supergirl VS Fireballs

I gave the JavaScript game a super-creative name (pun wasn’t intended, but I’m leaving it here) and added some features. First, with some help from the W3school tutorials, I added a border at the bottom of the screen. Then I tweaked the same code to add borders to the sides and the top as well.

After looking through the other tutorial material, I decided not to implement most of it (bouncing, gravity, and some other things didn’t really seem useful in this particular game).

So instead of using the tutorials, I started making some features on my own.

The first feature I added was to make it so Supergirl would intermittently enter a “charged” state where she would glow. While charged, if she touched a fireball all the fireballs on the screen would disappear and she would lose the charge.

This feature made her a lot more like Captain Marvel than Supergirl, but I was just experimenting with coding so I didn’t care so much. Of course, in my mind, I justified it this way: Supergirl getting “charged” meant she was absorbing more yellow sunlight which builds up her psionic forcefield (or however Kryptonian powers work) and allows her to take a hit from the fireballs (and also miraculously cause the other fireballs to vanish). The glow is just to help the player visually see the charged state. I also made the text “charged!!!” appear underneath the score so the player had a second visual cue.

So, giving Supergirl the charged feature made the game a lot easier. So, of course, I had to tweak the difficulty in the other direction. I changed my code so that, over time (technically, as your score went up), the fireballs would spawn in higher quantities and also start to move faster.

I also re-did the Supergirl image so her leg isn’t chopped off and got rid of the contrasting bright edges.

After all of that, the game turned out to be mildly fun. As a gamer, I probably wouldn’t pay for it, though. 😮

RPG Maker MV Custom Menu

Yesterday, I finally got back to what was supposed to be the primary purpose of learning JavaScript: customizing menus in RPG Maker MV.

My goal was to replace the default menu altogether. So that when you hit “escape” you would ignore the standard RPG menu (which includes commands to access your items, skills, magic, party formation, and all that good stuff) because my game wouldn’t be utilizing magic or other default RMMV features.

In the afternoon, I tried to look through RMMV’s javascript files to figure out how things worked and went to Google and YouTube to look for potentially useful tutorials. After a few hours, all I managed to do was replicate Porgy the RPG Maker’s code in one of his video tutorials: I made a window with some images/text appear in the top left corner. Then, I tweaked some of his code (which opened a custom menu with the press of the “p” button) so that the “escape” button(s) in the game would open the custom menu instead of the default menu.

That was one small thing done, but I couldn’t get the other types of menus/windows to work (e.g., windows which you could actually interact with instead of simply a window that displayed info). Unfortunately, Porgy’s tutorial didn’t really explain the basics of what he was doing (if you copied him, you could get things done, but it didn’t give enough fundamentals of what he was doing or why–not enough for me, anyway).

Unable to figure things out, I took an Animal Crossing break before getting back to work in the afternoon. I started googling other people’s attempts at creating their own windows/menus. Didn’t get much help there, either. Most searches for “custom menus” in RMMV was more about moving the pre-existing windows around (i.e., the command, status, and gold windows), or there were plugins already created by other people. There was very little information or tutorials that helped with coding your own custom menus.

After a while, with the RMMV JS files on one screen and Poryg’s code on another, I started to figure things out. Poryg was squeezing onto one .js file what the RMMV files had separated on multiple files (the rpg_scenes.js and rpg_windows.js).

Rather than copy Poryg’s code as a base, I started more or less to cobble together code with the RMMV JS defaults as a base. I also named the menus in a way that felt more natural to me.

Finally, I succeeded in making a simple command menu where the player couldchoose to “Exit Game” or “Cancel” and continue playing. It took another good chunk of time to get the window to be centered (by referencing how the RMMV programmers centered their other windows).

On the next day (aka today), I spent about half the day to add a second window which displays the in-game time and currency. The currency was easy enough; I used the code for the gold window as a base. Getting the clock to work required a little more work, but it wasn’t as hard as getting the command menu to work on the previous day.

The code for the clock uses a variable (set using RMMV) as a parameter and translates that value into a 12-hour clock display. The trickiest part was to get the clock to show 12:XX AM instead of 0:XX AM, but I got it done eventually. Coding for the clock a relatively relaxing task since it was almost entirely from scratch (instead of having to rely on the infrastructure already laid out in RMMV).

Took two days of learning and coding (with lots of breaks) to get those simple custom windows to work.

Game Dev Update #4

So on my tangential mission to learn enough JavaScript to make custom menus in RPG Maker MV, I finished the free JS materials on Codecademy and all the free prep material on Galvanize/Hack Reactor.

Now it’s time for tutorials and attempts at simple projects from scratch (or making that RPG Maker plugin, which was the whole point in learning any JS to begin with).

Yesterday, I used the tutorials on to make a simple game where you fly around as Supergirl while avoiding fireballs which chase you around. I used the script they provided as a base and tweaked it to figure how things work a little more.

Instead of making a side-scrolling game with obstacles constantly coming from the right per the tutorial’s instructions, I used a random number generator to make fireballs show up from random sides of the screen (and, if you survive long enough, bigger fireballs start showing up from the corners).

Since this was just a learning experiment, I didn’t bother making my own art assets. I took three images found via Google searches: (1) Melissa Benoist as Supergirl (I shrunk the image substantially and made the background transparent) to fly around as the player character; (2) a fireball from by a person called Angry Frog; and (3) a cropped image of Metropolis (by Kerem Gogus).

Also didn’t bother changing the Score mechanics provided by w3schools (it basically gives you points for surviving), but I moved the display to the top left.

Not going to bother making this game available to play since it’s not very good. It’s really not “finished,” either. I didn’t get through all of w3school’s tutorial material yesterday. I’ll probably finish that up soon, adding features to this so-called game. Then I’ll move onto the next project.

Take it easy, folks.


Game Dev Update #2

All right, I finished Module 1 of Galvanize’s free prep materials. Module 0 taught fundamental building blocks, and Module 1 was the practice of those fudnamentals.

The next step (Module 2, obviously) is supposed to teach “software engineering principles, pair programming, [and] readability of code,” according to the introduction. The lessons from this module is intended to be applicable to coding in any language, not only JavaScript. Kind of a best practices sort of deal, I suppose.

Finishing the exercises in Modules 0 and 1 have been somewhat satisfying. Kind of like figuring out math problems back in grade school (assuming you’re the type of person to find that satisfying).

So far, the exercises have been mildly challenging. A handful were more than mild (although one was made superficially challenging due to a technical issue with my browser/interface more so than the coding exercise itself).

I may or may not take a break from the Galvanize modules to try to create a simple plugin or two on RPG Maker MV. Otherwise, I may finish Module 2 and 3 completely before I give that a go.

Will have to see.

If anyone actually happens to be reading this, I hope you have a nice day.

Game Dev Update #1

Still binge-learning JavaScript.

After rushing through most of Module 0 on Galvanize, I slowed down on the optional exercises towards the end. Most of my free time was (and still is) diverted to playing Animal Crossing: New Horizons.

After kicking myself in the butt, however, I finished the optional parts on Module 0 and am now about a third of the way through Module 1.

For folks trying to figure out where to start learning JavaScript: I would recommend Galvanize. Module 0 of Galvanize teaches the fundamentals of JavaScript and does it pretty well. To compare, I think Galvanize’s Module 0 covers all of the free stuff you can learn from Cocecademy (which I finished before I started with Galvanize), and the subsequent Modules on Galvanize (1, 2, and 3) provide increasingly complex exercises which, I believe, you could only get on Codecademy if you forked over some cash (of course, after the free Prep stuff on Galvanize they offer a paid programming bootcamp that extends beyond JavaScript).

And although I know I don’t have any regular readers, my content has primarily been about writing in the past so–I should probably do some writing on the side while I’m focusing on learning to code. Need to hit up my writing buddies/acquaintances.

Animal Crossing: a worthy distraction. This is the flag of the proud island of Sandwich (not to be confused with the real Sandwich Islands). I was too lazy to take a proper screenshot, so I took a photo of my Switch using my phone.