Create an HTML5 game like The Next Arrow using Phaser

Did you play The Next Arrow by Kevin Choteau?

It’s a fun puzzle/strategy game, probably too much luck-driven but I found the concept behind it quite interesting.

When I saw the game, I said “ok, here’s another game I can make in less than 100 lines, just like I made Boom Dots and 1+2=3“.

The plan was to make the game in less than 100 lines then explain it, but it turned to be more complex than I supposed and eventually it took me more then 200 lines to create the entire game.

I will need more than a single post to explain all the concepts behind it, so at the moment I am giving you the source code, and explain it later.

Before we start, that’s what you are going to build:

Click on a white arrow to make the longest chain possible, the game ends when there aren’t possible moves.

And this is the full, uncommented source code, but you can ask everything you want by leaving a comment:

As usual, you can download the full source code, and I am waiting for your best scores, mine is 45 at the moment.

  • Kevin Choteau

    Hey ! Glad you didn’t succeed in 100 lines ! The generation system and repop mechanism are pretty close from what i’ve done in the game (but there’s still some rules buried into it).

    Kevin

    • Emanuele Feronato

      Hello Kevin,

      what a nice game you made!! Proud to make a prototype which works close to your game.

      Hope the post helped to let people know your game.

      Emanuele

  • Very clever game. Simple and engaging. Thank you both. I think this game is an ideal subject for a tutorial. It is neither so big that it would overwhelm a beginner nor so small that it doesn’t demonstrate multiple, useful concepts. Many thanks for sharing this.