Advertisement

Workshop: Flux - Critique

by

This Cyber Monday Tuts+ courses will be reduced to just $3 (usually $15). Don't miss out.

Earlier today, Wilson Lim showed you how to create a gravity-based game called Flux. In this Workshop, Matt Porter critiques Flux, explaining what it would take to turn that simple demo into a real game.


Play the Game

Use the left and right arrow keys to manoeuvre your ship, the up and down arrow keys to increase or reduce the size of the magnetic field it produces, and the space bar to reverse the polarity. Collect the white crystals to increase your fuel supply - but avoid the red ones, because they use it up. Don't hit a rock, or it's game over.

Please bear in mind that this demo was created specifically for a tutorial, rather than for release on a Flash portal, so it's naturally less polished than games we've featured in past critiques.


Introduction

Flux is a barebones game. It has one core mechanic, and very basic controls. That being said, even the most basic aspects of a game can require careful balance. With a few small tweaks, we can make something that's simple and frustrating into something that might not necessarily be a blast, but will be a much smoother and more enjoyable experience.

The core aim of Flux is to sustain energy for your ship by collecting white crystals, while at the same time avoiding red crystals. In addition, you must also avoid rocks, which end your game immediately upon contact. To mix things up a bit, the ship is equipped with a magnet of sorts, that can attract or deflect the negative crystals, but has no effect on the rocks of instant doom.

You can move your ship horizontally, but not vertically, using the left and right arrow keys. The last bit of spice in this otherwise currently bland game is that you can increase or decrease your magnet's area of effect, by pressing the up and down arrow keys respectively.

So there you have it, that's Flux. While there's very little to this game, we're about to break it down into more than the average eyes see, and come up with some simple, yet game changing, alterations.


Getting Started

The first and most immediate flaw in Flux is that there isn't really a title screen.

Flux's starting screen

There's no instructions, no place to check high score, no title, no music... you're just tossed onto a bland screen with a Start Game button. Pretty bad start, but okay, let's move on.

Upon pressing the button, we now see our ship, and some objects in our face. Let's just assume that we know what to do right off, and that there is a rock (instant death if it hits us) coming right at us (that'll happen when positions are 100% random). We quickly get our hands onto the keyboard (we started using the mouse, and there were no instructions, so we're not actually prepared for this), and attempt to dodge the rock.

Oh no, our ship isn't moving! Does WASD not work? Well, actually, they don't work (which is a horrible decision, as WASD and arrow keys should always both be supported where possible) - but believe it or not, that's not our issue either.

The real issue is that the game area doesn't have focus. We actually need to click the player area to gain control, even though we just pressed the Start Game button. Looks like we just blew up from an oncoming rock. So here we are, literally five seconds into the game, and all we've done is see a bland title screen and die from absolute unfairness. Congratulations, you've just lost the majority of all your players right off, and most of them have down-voted your game if it's being played on a major portal such as Newgrounds or Kongregate.

A likely response from a Newgrounds gamer

While the above is an absolute mess, it's actually quite easily fixed.

Pixel Purge's title screen, for comparison

First off, we add a simple title screen. The quality can range greatly, but at the very least, we need a title, a play button, and something related to scores - whether it's a list already on screen, or a button to let us view them all.

Next, we make sure that the play area has keyboard focus after the Start Game button is pressed. If this were my game, I would then choose to display the controls of the game to the player through pictures and text, and not just a wall of text. For good measure, I'd save a variable to a shared object that says the player has seen the controls, and I would never display them at the start of a game again (unless a "delete all data" button was pressed).

Now that the player has a good initial first impression, with a decent menu, and controls shown to them, we'd start the game. Here I would make sure that the game didn't actually start until the player moved the ship. This would accomplish two things: first, we'd know that they have their hands on the keyboard and are ready to play; and second, they wouldn't die from a randomly generated flying space rock within the first two seconds of the game.

Nothing that I just listed above is hard, but it's just changed that poor initial first impression of this game to “this has potential, let's see what happens”.


Gameplay

Now that we've taken care of analyzing the first impression, let's focus a bit on the actual gameplay.

Flux's play screen

The first thing I noticed when playing Flux, is that the movement was extremely stiff, and felt very amateur. It's obvious that the movement is locked to a set speed, and that there's no acceleration or easing. If we were to add some of that then not only would the game feel better and look more smooth, but our control would be far more precise, making for a much more enjoyable experience.

The magnet mechanic is actually pretty neat, but it's a bit rough around the edges. The first thing I noticed, is that there are no restrictions on how big or small the attract radius can be. This allows us to go negative, and eventually appear to be positive again, but the magnet won't actually do anything. This could leave various impressions on the player, from them being confused to them thinking the game looks unprofessional, so it's important that we put restrictions in place.


One More Time

Assuming that players actually have fun with the game the way it is (admittedly doubtful beyond the first play or two), we still have some fixing up to do. When the player dies, they aren't really left with any incentive to play again. The game over screen should be used as an opportunity to tempt the player to play again - and simply having a button to let them do so is not what I mean.

Flux's game over screen

In this case, the game over screen should still show the player's score, but also their all-time best score. If their previous play was their best, this should be related to the player both visually and audibly.

Pixel Purge's game over screen, for comparison

If we wanted to take things even further, we'd toss in Facebook / Twitter buttons, and allow the player to brag about their accomplishment with friends.


What Else?

As I've mentioned, even with the critical flaws fixed, and the controls a bit polished, the game is still a bit boring. While there are hundreds if not thousands of directions in which to take a game this basic, I'll just focus on some of the simpler yet still effective changes.

The first addition I would add is powerups. We've already got collision code we use for collecting crystals, so adding powerups is not that hard from a technical standpoint. For example, we could add a powerup that turns every red crystal into a white one. With a cool visual effect, and an awesome sound effect, grabbing one of these would be quite rewarding.

The next thing I would do, is add crystals of different sizes, where the bigger the crystal, the harder it is to attract or repel. Give the larger crystals a higher score value, and a more rewarding sound, and you've now got some substance to your game. You'll find players act extra risky around instant-kill death rocks, just so they can attempt to pull in a giant white crystal.

Speaking of instant-kill death rocks, why not add a way to get rid of them? With the simple press of a button (say, the X key), let the player shoot directly ahead - for a cost. To make the game more interesting, firing your weapon would require some of your energy, so it would have to be used sparingly. We could also add a powerup that explodes all rocks on the screen, or that makes the player invincible so that they can hit them without worry for a limited time.

If I really wanted to add a level of complexity to the game, I'd make it so that all crystals gained would be stored as currency, and after each game (or level), the player could spend those points on upgrading stats. These stats could range from maximum magnet radius, to increased energy regeneration from white crystals; the possibilities are nearly endless.

All of the biggest remaining issues are related to polish, and as many developers will tell you, this can take a long time to get right.

Some of the more major aspects of polish that are needed are as follows:

  • The Times New Roman font needs to be replaced.
  • The game needs consistent audio toggle buttons (to be found on all screens).
  • More visual effects are needed to increase the graphical quality.
  • The game needs to be 100% audio complete, with both sounds and music.

Conclusion

As you can see, it didn't take too much to really rip this game apart, and then point out some simple but effective ways to fix it up.

There are enormous benefits to being able to fix up such a basic game. In reality, everything that Flux has is no larger or more complex than one individual portion of any other larger game. If we look at game development like this, we then see the benefit of being able to fix up such a simple game. We're essentially able to view our bigger projects as small pieces, and we can then polish each piece up individually until it's a smooth and enjoyable experience on its own. In the end, we'll be left with a full-fledged game, comprised of many small, extremely well built pieces.

What do you think should be added to Flux? Post your suggestions in the comments - or you could even follow the tutorial and make the changes yourself...

Advertisement