Super Spineboy

Showcase
#1

–> Download the JAR now! <–

Controls: A/D is left/right, space is jump, click is shoot, alt+enter for fullscreen.

Super Spineboy is a simple platformer where you shoot everything that moves. The game was used at the '14 A MAZE game festival in Berlin (here’s the puppy and I) to show off Spine animations. It was written by myself and Shiu in ~3 days using libgdx and is open source on GitHub. It uses a loose MVC architecture for nice code organization. You can see the code here (start browsing at SuperSpineboy.java, then check out Model.java, View.java and the rest).

You can use the menu or number keys (1-6) to slow down time so you can better see the animations. Pressing Z will zoom in/out so you can see better. In particular, check out how landing from a jump transitions into running. Also, the Spineboy skeleton is manipulated to point the gun at the mouse and his torso, head and arms are adjusted so he leans forward/backward.

A good deal of effort was put into polish. For example, if you are running and jump a little late, after you fall off a ledge, it still jumps. If you hit jump a little too early before you land, it still jumps when you land. The camera has lookahead (only horizontal) for the direction you are looking, but this is reduced based on the distance to any enemies behind you (otherwise enemies behind you hit you before you get a chance to see them). There are lots of little things like this.

We didn’t have a lot of time so the level is quite short and the difficulty ramps up quickly. The game does have an ending, so don’t give up. :slight_smile: These tips may help (spoiler alert! you may want to play first before reading these!):

  • Don’t move through further into the level until you’ve killed all the enemies you find.
  • Spineboy’s weapon shoots very fast, but suffers from reduced accuracy when shot continuously. Cease firing momentarily to regain accuracy.
  • You cannot shoot backward when running away, but you can jump while running away and shoot backward in the air.
  • Standing your ground and mowing down enemies is great, but there are quickly so many enemies that you get overrun. When this happens, goomba head stomp the enemies. This is key to winning!
  • Getting sandwiched between two groups of enemies is a sure way to die. Head stomp your way to one side so you aren’t surrounded.
  • If the game runs poorly, try unchecking Background in the menu.
#2

I’m glad I didn’t read all those tips before playing, because it was nice to find all of them out myself (except for that background one :wink: it worked fine for me :slight_smile: ).

The animations are beautiful, everything is smooth, spineboy looks fine, the gameplay is limited but perfectly okay. A score at the end of the level would make it much more appealing, though :wink:

But I’m sure the most interesting about this project is the source code, so yeah ^^

#3

Too bad we don’t have a spoiler forum tag. :slight_smile: I have stood next to 30-40 people playing the game. Most people totally suck at it and need the tips. In fact even with the tips most still suck, so I guess the game is a bit hardcore in its difficulty. Only one guy made it to the end (on his second try), but he was definitely an exception. In fact, I had intended Spineboy to have only 3 hitpoints, but I used 5 at the exhibition and then settled on 4 for the code on Github.

It was fun to write, a nice change of pace from working on Spine (for two years straight now!). I feel OK about the code, the MVC worked out pretty well. The model objects have a field for the view but it is never used in the model, it is just for convenience to avoid a model -> view object mapping. There are a few events that the model tells the controller about via a method. I figured proper events would be overkill. Reaction to the events could have gone in the view, but it was easier doing it there. The animations are kept in the view where they belong, the model just has states and times that the view uses to choose animations. I think this approach would scale pretty well for a more complicated game. Unlike an entity system, this loose MVC organization is pretty close to how I think people are used to coding and thinking, so should be a pretty easy style to adopt.

If anyone is curious about how the animations are done, you can grab the Spine projects here (alien and spineboy folders) or in this ZIP and open them with the Spine Trial. The alien has death, hit, jump and run animations. Spineboy has death, hit, jump, run, shoot and idle (and walk, but it isn’t used in the game).

#4

love the exploding alien brains, really nice touch :slight_smile:

#5

Thanks kappa! :slight_smile: When the alien head explodes obviously the head and splatter changes images a few times, but notice Spine is used to scale, fade and translate the images.

I change the alien head to the first frame of the exploding head when they have one hit point left, and they behavior changes to be more aggressive. It wasn’t planned to use the first frame like that, but it looked cool. 8)

#6

It is funny how well polish goes over your head when it is very well done, but in this case, I really enjoyed this very simple display of Spine. I did beat the game, but it didn’t take me two tries… more like 5 ;D

#7

Great animation and artwork, I still couldn’t get too far ha. I found a bug in the left bound when you first spawn. I kept jumping and got stuck in the wall for a bit.

#8

Nice…

If you maximize the window (not fullscreen with alt+enter), the mouse aiming won’t work correctly…

#9

Mr.CodeIt, yeah I haven’t bothered to fix that bug. :slight_smile:

atombrot, strange, it works for me no matter what the window size is. Maybe you are just seeing the recoil? There is quite a lot of recoil, to give you a reason not to shoot (otherwise why even have a shoot button and shoot all the time? :)).

#10

Oh sorry, you are right. I see it now. I think I have started to shoot and then pointed down in all my maximized windows test. False alarm :wink:

#11

It looks and works great, thanks for the source!
Animations are very nice, but the Spineboy looks aliased, especially on smaller sizes.
Is it possible to avoid that?

#12

Thanks. :slight_smile: Spineboy looks aliased in the screenshots and when the window is sized smaller because the source graphics are pretty high resolution. It should look nice maximized or full screen (alt+enter or use the menu):

You can see how the skeleton size is computed here:


This sets the scale of the skeleton data loaded from JSON to “Player.height / Player.heightSource”. Player.height is the height you want the player in game units. Player.heightSource is the height the player was in Spine in pixels. So if you want the player 10 game units tall and it was 200 pixels tall in Spine, you’d use a scale of 10/200=0.05.

That is how you would scale the skeleton data to whatever you use for units in your game. Eg, with Box2D you may be using meters instead of pixels. However, the same technique can be used to scale the skeleton data to match a texture atlas of a different size. When you pack your texture atlas, you might scale it up or down. Spine can pack an atlas using a scale, so can Texture Packer Pro, etc. You probably want to pack 2-3 atlases at different sizes to target a few resolutions. At runtime you choose the best atlas for the resolution and set the scale accordingly. Eg, if you pick an atlas that is 33% the size of the art used in Spine, you would use “json.setScale(0.33f)”. Of course you can combine this with a scale for your game units, “json.setScale(Player.height / Player.heightSource * 0.33f);”.

#13

I didn’t read any tips and died twice…finally I found that floating platform. Stand on it and shoot until they are all dead as red wedding! Enjoyed! :slight_smile: