Orbit Strike: the alien formation dives at you

The task

The solution

• A dive is defined by heading and turn rate rather than a curve: every frame the heading turns a little and the enemy moves along it. This integrator gives smooth arcs, yields the sprite tilt for free and is tested without a browser.
• Three dive shapes are mirrored both ways; an arc usually bends toward the player, but a quarter of sorties swing the other way so the direction cannot be memorized. An attack director decides who dives and when: higher levels bring more frequent, faster and larger dives.
• The starry sky is procedural: three parallax layers with different speed, density and star size. Four-pointed stars are generated into a 1280 px wide SVG tile used as a background — three elements instead of two hundred and fifty — and the twinkle comes from layers in antiphase.
• Planets are built in code too: four kinds of worlds (bands, craters, blotches, a bitten disc), a four-step pixel palette and light from the top left. A single value sets size, speed and brightness at once, so the difference reads as distance.

Details

• The backdrop spans the whole stage, not just the field: on a wide screen space does not end at the edge and scales together with the field.
• The formation sways and never descends; the flagship attacks with two escorts and is worth 150 to 800 points depending on the order you shoot them in.
• Background drifters come from a pool of reused elements and are translucent so the eye reads them as background, and a rare piece of debris appears only from level three.

Technologies

• TypeScript
• DHTML sprites
• Procedural generation
• SVG
• Web Audio
• Pointer Events
• Yandex Games SDK

• Web games and interactive promos →
• 2D graphics and Canvas development →