Sopwith Back - js13kgames - Retrospective

The js13k contest ended last week and my final project can be found here on the js13k site .

I am really happy with my final game - I think it plays well and is a elegant little art piece that reflects my history and interests.

My decision to use SVG for all the game elements turned out very well. The various graphics efforts and transitions between them depend entirely on SVG/CSS facilities: control line butts and line joins; to animate stroke widths and fill colours; animate opacity of individual strokes or fills; highly customised gradients and patterns. I had no performance issues with SVG - I expected to have to mess around optimising the scrolling and setting CSS will-change values but in the end the game was side scrolling the terrain (which in 1984 mode is made from hundreds of tiny line segments to be pixellated) with tens of animated objects on the screen and still holding 50fps .SVG provides the blur and offset filters for some of the modern 2009 era effects.

Additionally, because SVG uses of an arbitrary unit system, the 'minimap' was extremely easy to implement with almost no new code.

My final product was only 10kb of the available 13kb. I wished I had a bit more time, I would have loved to implement a few more things:

• Sound Effects: I planned to do the same tricks across the eras with the sound effects - from 1984's drones and beeps to 2004's polyphonic stereo sounds. 
• Music: Some cute chip tunes would have been nice.
• Better 2004 graphics: A very better implementations of the 2004 look - using the gradients with more subtlety; using transparency more; sexier control panel for the 2004 look with some text effects..

Overall I am very happy with my final product (and I got a mail from the original author of Sopwith!).

My final version here and source code here

Sopwith - Play Testing Results

A few folk have played the game in the last few days; thanks to all those who did and their very useful feedback.

The general consensus was that the game was fun and the idea exciting. However ALL the players reported that the game was just too hard - even at its novice level. A clear UX problem. At least the AI must be less relentless especially when the player's plane is on the ground, and in general less aggressive and a much worse shot.

One player remembered (correctly) that the original had a 'No enemy' mode where you could play without enemy planes just to practice flying and bombing - this is an excellent idea and I can easily build such a 'CADET' mode.

They also expressed a general feeling that the game could be more forgiving - stall less damaging and/or less easily; make is easier to launch your bombs without dying on them and similar ideas.

Everyone noticed the changes of theme but didn't really associate them with different generations of video technology. I think I want to do something more explicit on screen for this.

A few bugs were reported:

• a way to clock up the score without any effort by messing with the AI pilots. 
• no one liked the bullets and bombs and smoke graphics - this is fine as these were just place holders at the time of the testing - I got cool graphics for them (now),
• some issues with corner case collision detection (destroyed building / plane hits plane)
• issues with the rules around planes on the ground and plane crash sites and how they affect the game play

My play testers also had a few interesting ideas I didn't expect: a change of name: Is 'Sopwith 2019' a good joke? 'Sopwith Returns' is maybe cooler?

I have quite of lot of bytes but not a lot of time - just a few refinements...

Sopwith - Play Test Time

My Sopwith homage is playable and needs to be completed in the next few days. I think it is time for real players to try it out.

 A fully playable version with three modes is available here. (requires a keyboard)

Although there is help text to assist you the keys are: Left/right arrow to steer plane; down arrow to flip; A and Z to change speed; Space to fire and B to drop a bomb.

So go play it if you want and comment below on what you think:
- Is it easy enough to understand and pick up
- Was it fun to play? Too hard? Too Fast?
- Did you notice the back in time changes in graphics?
- General overview; any bugs you noticed?

My high score on BRUTAL mode is about 4000 - but I'm not much of a game player.

Sopwith - Video Modes

With just a week left to go in js13kgames my game is mostly working and playable (and kind if fun) like the original game.

I've made a little video showing how the appearance can move smoothly from a circa 1990 256 VGA colour look to the most basic 1984 4 colour CGA display modes.

Watch this video which demonstrates the overlay, terrain and objects shifting between modes.

Got a few more tasks especially intro, tutorial and finishing screens still to do - then to concentrate on the appearance a bit more.

Sopwith - A playable demo of Day 17

Today the js13k contest is half way through of so - My Sopwith game is just about playable.
 I've mostly been checking off the basic game play features:

• The player's plane is full featured allowing a flip, guns and bombs.
• The world has smoke billows to show when planes go down.
•  The AI can fly a bi-plane (not well, but aggressively and fearlessly) and shoots me down often enough. 

A new playable demo is available here 

Use , (comma) and / (forward slash key) to fly up and down.

Use Z and X to control the throttle.

Use Space to Fire

Use B to drop a bomb

Use . (period) to flip the plane

Sopwith - Day 15 - Progress

I've been working on the Sopwith game for js13k for a week and am making some progress. I have not been able to allocate the all the time I would like but I have scrolling graphics; a few game objects and a pilotable bi-plane. It has a working keyboard interface and collision detection is working (although I'm not using it currently).

The system is rendering in pure SVG which seems to be working very nicely even when full screen scrolling chrome seem to be hitting 50+ fps.This is the first project I have seriously tried to use SVG and am pleasantly surprised by its flexibility, rendering speed and the general way it can interact with CSS.

Why SVG? I need two different teams using the same graphics with different colour schemes. Additionally I have several requirements to slowly change the appearance of objects to style them in different ways to replicate different era's of computer graphics. The ability to animate line widths, filters and gradients and modify line joins and line endings will all be required to smoothly switch the graphics during game play.

Currently my compressed file size is 3.4kb which I think is okay given that I have the terrain and most of the graphic objects encoded.

Here is a demo version - you can control the cyan plane using the , and . keys to go up and down and the z and x keys to control the speed.

JS13k Again - Sopwith calls me back to 1984

Its js13k time again and for 2019 the theme is 'Back'.

For the uninitiated js13k is a game contest which requires that you create a game in 30 days that runs in a browser and all told is less than 13kb of code - a very small amount.

This year I would like to do a homage to a video game first released in 1984 - BMB released the incredible, immortal 'SOPWITH'. I was 11 years old at the time and 4 (yes four) colour 320x200 CGA monitors were cutting edge technology.

The game looked exactly like this:

I played it a lot. (here are a whole lot of videos if you want to see or remember)

So this year I would like to make a cover-version of Sopwith in 13kb showcasing the original brilliant game play and expressing the amazing changes in video and audio between 1984 and 2019.

That's the inspiration; I think the theme of 'back' is going work nicely with some of the ideas I have in mind. The game has quite a few different moving parts: lots of sprites side scrolling terrain; some physics for the planes; collision detection; sound and chiptunes and an AI player capable of fighting tactically. So every byte is going to count as I go.