Category Archives: shoot em up

In search of pleasure – again

Or.. “If it’s fun then please let me do it again”.

I have for a long time been preoccupied with what you might call the hedonics of playing arcade games but have always failed to accurately articulate my thoughts.

Games that sell have mass appeal and when we place them under the microscope we probably look a little too hard for a magic ingredient or design feature.
If you place a football in to a room of schoolboys and watch them play you’d not expect them to suddenly form strategic patterns as you would see on a Saturday afternoon in the Premier League. Nor would you expect them to immediately nominate a captain or designated free kick taker. These things just don’t matter to them. What does matter is getting a kick of the football.

The pleasure in playing football lies in the chance to kick the ball and score a goal. Everybody on the pitch would be thrilled to score, even the Goalkeeper.

In video games I often think that designers try to force gamers in to a place where they don’t necessarily want to go. In some cases the pleasure accompanies them wherever the designer takes them but in others the gamer is left pondering where all the fun went.

Pleasurable experiences in games can be found in countless places. What’s more if something is fun it is in my view something to be repeated not necessarily saved for that brief and infrequent moment that you manage to collect all 50 sacred items. If the attack style is fun to execute, fun to watch and fun to perform on your adversary then make it a central feature of the game.

The Legend of Zelda and Prince of Persia:Sands of Time are two fine examples of a cool feature that the player can repeat without having to be in any specific situation (spin attack, wall run). OK, so you have to be stood near a wall in PoP. But there are walls everywhere !

It is precisely this that makes me go back to Shoot ’em ups so frequently. The pleasure in shooting aliens (or whatever) is in the immediacy of the shoot >¬† die > explode combination. The pleasure is all in the hitting the fire button and then having that translate in to a very visual sequence of events on the screen.

PRESS FIRE BUTTON > STREAM OF LASERS > AUDIBLE RESPONSE > DESTROY ALIEN > AUDIBLE RESPONSE > ALIEN EXPLODES IN TO TINY SHARDS

But there is a bit more to it than that.
When you press the fire button you actually feel the control. You feel the tactile response from the button and in most cases it’s a highly satisfying thud in to the game control surface.
In the arcades my beloved Defender epitomised this sensation. At home games like Jet-Pac continued it.

But it’s not just in shoot ’em ups. It’s everywhere.

Gran Turismo has always been an excellent game experience.
With the default controls you still get a fantastic sense of control that is fed back to you in spades via the stunning audio and breathtaking visuals. As a real driving simulator you do of course need to learn how to drive the cars but once you’re there there’s no going back.
So where’s the thrill in such a game ?
Why play a racing game ?

Simple – drive as fast as you possibly can whilst whistling past the other cars.
If you want more detail I’d say that the thrill of any racing game is mastering the corners such that you use every bit of road available. Combine that with actually passing the car you’ve been following for 3 laps and you’re in to orgasmic territory.
The thrill in a driving game is in tearing up the road with little consideration for anything other than the speedo.

Burnout and Need for Speed:Hot Pursuit are other fantastic arcade variations on the theme. Just drive as fast as you can – we’ll handle the physics.

Working as a game designer / producer in a AAA studio must be a real challenge. Not only do you have the pressures of delivery but you also have the multiple egos of your team to deal with. In some cases maintaining a vision for your game must seem like an afterthought.
If I had that role I’d make sure that I communicated the absolute core of my game and to get to that I’d quickly identify where the fun was to be found. Where is all the pleasure ?
It would serve as a single line design document that I’d probably staple to the wall in the studio. Everything in the game would be a spoke off of it. If a new design idea for the game was presented I’d want to see it logically link back to the core pleasure in one single step. If not, well it’s probably not right for the game.

HyperGunner – collision detection improvements

Something that I should have paid more attention to with the development of HyperGunner was the collision between the player’s starship and the alien’s bombs. During the more intense battles it’s not uncommon to see the player trapped within a mess of bombs with very little room to move.
The problem was that the collision detection worked on the bounding boxes of both sprites. Unless the sprites contain pixels drawn to the very edges the illusion (and resulting loss of life) will be less than satisfying for the player.

Take a look at this graphic.

Collision detection

Here you can see (on the left) how I was previously performing the collision detection. Where things happen quickly and on a larger scale it’s rather more forgiving to have this style of detection. For example – the player’s laser colliding with an alien. Generally speaking players are far more forgiving when the resulting effect is in their favour !
But with a slow moving alien bomb drifting down the screen it can be highly irritating to “die” when you’re fairly sure you’ve missed it.

So I took a leaf out of my beloved manic shooters and shrank the collision box. In those games it’s fairly common to have just a single pixel in the centre of the player’s ship to collide with. But my game just isn’t that chaotic !

The net effect here is of course that you can generally be pixel perfect and watch the alien bomb pass through the outer 4 pixels of the player’s ship. But that is far more acceptable than what we had previously.

 

HyperGunner update

HyperGunner screens

I’m in the final stages of tidying up my new frantic shooter HyperGunner.
I’ve loved putting this game together and thoroughly enjoyed playing it. It’s a huge step closer to creating something in the mould of my favourite manic shooters – Ikaruga, Don Pachi, Esp RaDe et al.

I still have concerns with the collision box but essentially the game is playable.

http://www.wilfscorner.co.uk/games/hypergunner

I’m now working on streamlining the game for mobile devices. Specifically iOS and Android.

HyperGunner – not much more to do

So I thought I’d share the link.

http://www.wilfscorner.co.uk/sandpit/hypergunner/ (development version)

About 80% complete.
Some more sprites to create and a few more backdrops but essentially the core game is in place.

Feedback welcomed.

HyperGunner – new screens

HyperGunner screenshot

HyperGunner screenshot

HyperGunner screenshot

Lots of colour. Lots of action. Chaos ! I love it.

HyperGunner – level / wave design theory

HyperGunner is turning in to something to be proud of. I’m very excited to be developing it just now and am thoroughly enjoying assembling different game elements – scoring multipliers, power-ups, hyperspace bonus phase etc.

hypergunner title graphic

HyperGunner titlescreen graphic

What I’m most thrilled about is the pace of the action.
When I first started assembling the game code based off the previous game – Wizard Wars – I fell firmly in to the trap of thinking it should be just another formulaic shooter a la Galaxians. As much as I loved that game in my youth I knew that it needed something more.
A brief foray in to manic shooters taught me a great deal about maintaining pace in a shooter and increasing the perception of pace through some visual trickery.
I employed as much as I could in HyperGunner.

 

I guess the biggest success in terms of game design was the concept of waves within waves.

Initially I created a screen full of about 32 aliens all jiggling across the screen and essentially lining up to be shot.
It was dull. I knew I needed something more and that something was to have the aliens move much more freely. Rather than simply being cannon fodder they needed to be cannon fodder with a bit of movement.
So I stripped the alien count down to 8 and implemented movement patterns.
Depending on which stage of the wave you are in you will see the aliens move in a certain pattern.

Naturally each wave was over very quickly since with just 8 shots you could dispatch the lot !

HyperGunner in-game action

HyperGunner in-game action

So I looked in to having layered waves. That is, waves within waves.
On the first level you have 3 waves of aliens to clear before you officially complete the stage. Or level. Depending on which terminology you prefer.
On later levels you can have up to 25 waves of aliens to clear.
Each wave to be cleared is represented by a small flag icon in the lower part of the screen. This visual indication is vital to show the player what he must achieve.

 

I implemented 4 movement patterns for the aliens and it plays very well. But again it needed something more.
So I looked in to having a wave that is quite different. For this I looked at an old Atari game Threshold. This game had swooping bird-like aliens falling down the screen and I loved the way that it broke up the standard flow of the game. It was quite simple to implement even though the calculation for adjusting the x co-ordinate took some playing with. I’m still not totally happy with the movement of the swooping aliens (they tend to fall in to line too easily) but there’s enough in there for a challenge. For now.

 

HyperGunner in-game action

HyperGunner in-game action - older version

So with the core challenge figured out I set to looking at the bigger picture. After all, it’s fine blasting through countless waves of aliens but it’s important (I think) to focus on greater goals.
I was obsessed with the idea of hyperspace. So much so that I wanted to encourage the player to aim for hyperspace. I also wanted to have the visual effect of hyperspace with the stretched stars falling down the screen at high speed.

So I implemented an energy bar that is boosted with the collection of stars.
Bright gold stars fall down the screen when aliens are shot. Essentially the aliens release them. The more stars that the player collects the larger the energy bar. When the energy bar reaches right across the screen the player enters hyperdrive !

Hyperdrive is both a visual diversion and also an opportunity to score double points for each alien hit.
It currently lasts for about 10 seconds. I also went to the trouble of affording the player 5 lasers per button press as opposed to the normal in-game maximum of 3. The effect (I think) is stunning.
The rewards to the challenge of collecting so many stars without losing a life are great on both levels – visual and interaction.

By the time the hyperdrive phase is complete the player could have easily scored an additional 10,000 points.

I will discuss the game elements in detail a bit more once the game is complete. I have quite a bit more to do before I can call it complete. But for now it is, I think, a hugely thrilling game to play.

New game – old game: HyperGunner

I’ve been very busy this last few days turning Wizard Wars in to a vertical scrolling shooter.
It was very easy. Some things cropped up en route that I thought were worth a mention.

When I designed Wizard Wars I made sure that the pipeline was simple. That is, I define the images and animation specifics in the code and then I’m free to go off in to Photoshop to create some sprites. I wanted to be in a position where I could comfortably hit F5 and see my new artwork in an instant. (Chrome’s inexplicable caching aside this has been fine)

Lifting the Wizard code and turning things around a bit wasn’t so much of a challenge. I implemented some simple stars that varied in shades of grey and had them tumble down the screen at varying speeds to give that oh-so-familiar starfield depth impression. I also lifted the sprites from Invaders from Mars and had them shift across the screen whilst the player shuffled his laser cannon back and to taking shots etc etc.

Making Space Invader style games is easy. I got bored of it almost instantly.

So I shelved it and went off to play a few classic shoot-em ups in MAME.
Giga Wing, Esp RaDe, Don Pachi, Loop Master… they’re all up there in my favourite list. I played them all to death.

When I got back to my own game I realised that it was all very pedestrian and lacking in colour and depth.

So I changed the image files for most things to create richer colours.
It was whilst I was adjusting the star sprites that I realised I was doing it wrong.

All I wanted from the stars was the impression of space. I could achieve this with the simple drawing of dots / lines.
I’d draw lines and shapes on the canvas before so I changed the code and hey presto I had a starfield made up of very short lines instead of graphics. I also used context.fillStyle = “rgba(r,g,b,a)” to create some colours mathematically and with varying amounts of alpha.
Not only did I have a nice colourful starfield and some added performance I also had more control. So I played with the numbers.

I’m drawing my stars using context.fillRect(x,y,w,h).
By adjusting the width and height values I could achieve a sense of hyperspace. I also increased the amount which the stars move down the screen. This changed everything. I now realised that I had a game that would be played at pace. Even if the foreground aliens, bombs, lasers etc were moving fairly slow the background pace would make the whole thing seem pretty rapid. I loved the effect. So much so that I made hyperspace one of the mini goals of the game.

Whilst the game was in its infancy I also took the time to play with the drawing.
My initial concern was that the clearRect() method was killing performance.
So I tried a newer method: g.canvas.width = g.canvas.width;
There was no improvement.
I also went to the trouble of calculating the empty spaces left by each sprite and only re-drawing those areas on every tick. When I got the code right (it was very untidy to begin with – stray pixels here and there) it worked well but there was no real gain in frames.
The biggest boost I could find was transfering the actual drawing from using HTML Images  to primitive canvas shapes Рin this case rectangles. Whereas previously I had 100 + star images cascading down the screen I now have 100+ shapes being drawn.

Google’s Chrome has easily the best performance so far. Running flat out at 250 FPS.
Firefox is the poorest at around 80 – 100 FPS flat out.
But even then the game plays very well across all browsers.

I hope to put a link up soon.

Celebrity Bloodbath – new JavaScript arcade game

Celebrity Bloodbath imageWell I’ve been far too quiet on here. In my (rapidly vanishing) spare time I managed to knock some code up based on the previous little project that I called Space Storm.

I loved the shower of sparks that were spawned and decided to craft something entirely new around the effect.

So the sparks became blood droplets and the enemy transformed in to celebrities. Admitedly UK focused celebrities since I live in the UK.

The game is something of a side project and doesn’t have the same attention to detail I gave Invaders or Hoth Strike but it was a lot of fun none the less.

This is my last old-school JavaScript game.
For my next game I will be using good old Canvas. Thanks in main to Microsoft supporting it with IE9.

So anyway go and play the blessed thing.

www.wilfscorner.co.uk/games/bloodbath

One final note I should add – I’m moving my games to my personal web site at Wilf’s Corner from now on. Wilf being the nickname I’ve had since about the age of 11 ;-) In case you were wondering.

SpaceStorm – the seeds of a new shooter

Well it’s pretty funny how developments lead to new ideas and cool games.
I’ve recently been developing a simple concept for a GUI that I decided to bring to life with some “game like” animation. Essentially I had a spark storm spawn as the mouse pointer passed over certain icons. I liked it so much that I played with it a bit and aimed for something almost Disney-like. The fairy dust approach if you like.

So I went as far as I could with the idea without exhausting it and then utilised the same code in a simple game framework. I drew a starship that you can move left and right with the arrows and spawned lasers with my standard fire buttons Z or CTRL. Since there are no aliens to shoot I set the lasers to KILL() at canvas edge. On kill the co-ordinates would be used to spawn a spark storm.

Being a nut for laser games I made it so that you could hit the fire button a ton of times and spawn countless spark showers.
I absolutely adore the resulting effect. Just need to craft a game from it now :-)

You can play it yourself at this link: http://www.rebelideas.co.uk/proto/spacestorm/

JavaScript vertical shoot ’em up and link

I’m really not keeping this blog up to date.
In an attempt to get things back on track here is a link to the vertical shoot ’em up I described in the previous post.
http://rebelideas.co.uk/proto/shooter/