Back to Home

Pebble Kombat. Javascript Watch Game Development History

Hello · my name is Alexander and I am an anonymous pythogolic. But a year ago I was lucky to write one game exclusively in JavaScript for Pebble smart watches ... Concept The idea of ​​the game was ...

Pebble Kombat. Javascript Watch Game Development History

Hello, my name is Alexander and I am an anonymous pythogolic. But a year ago I was lucky to write one game exclusively in JavaScript for Pebble smart watches ...


Concept


The idea of ​​the game was born by chance, in agony and attempts to explain the basics of OOP to schoolchildren. The fighter class was matched with the computer and the player with three sets of hit points for the head, body and legs. In turn, the player chose that he would attack or block. The computer solved this randomly. It was interesting to write a step-by-step fighting game for everyone, both schoolchildren and me. But then I was struck by the thought, why not develop the game from teaching to full (relatively). In addition, the other day I received my first Pebble Steel, whose three wonderful side buttons perfectly suited the format of the game.



Well, the process has begun. As a result of creative impulses at the exit to version 1.0, I came up with 8 characters, each with their own unique skill, which was activated every phase of the game during an attack or block. For example, Berserk under certain conditions began to break through the block, and the Necromancer completely reflected all the blocked damage back to the attacker. It was planned and two game modes: Tournament and Survival.

The name for my first pet project I wanted to come up with spectacular and meaningful. This is how the hybrid of the notorious fighting game Mortal Kombat and the brand of Pebble Smartwatch themselves turned out.

Graphics


Logic was logic, but the characters and interface needed to be drawn. Then freelancers came to my aid. More precisely one. More precisely, one . More precisely, I found it myself. We worked quickly. After giving her all the available information, including the technical specifications of the screen, she drew excellent characters and backgrounds for them.



An interesting point was to come up with what the characters would stand on. At first we tried to place both fighters on the same platform, but it looked pretty simple and limited us in the future.

A separate story was the development of the start screen, which I could not accept until the last option. (By the way, the idea of ​​the “Tournament” mode icon was spied from the Guild Wars 2 game, in which the Quickness ability was depicted in a similar way, but I hope no one will beat me.)



After a couple of weeks, I got the whole set of graphics and now I could easily get to work .

Development


Turning to the developer portal, I found that, alas, I can not use my beloved python. After not looking at the examples in C and JavaScript, I turned to the documentation of the Pebble.JS library. The game turned out to be quite voluminous (more than 800 lines of code). In addition, in a new language for me. In addition, the game wanted to be finalized and finalized.

Everything turned out to be simpler than I thought. We create an instance of the window, add the necessary graphics to it (loaded into the _items list) and run the show () method to display.

var main_wnd = new UI.Window();
functionmain_wnd_gen(){
  var main_menu = new UI.Image({
    position: new Vector2(0, 0),
    size: new Vector2(144, 168),
    image: 'MENU',
    compositing: 'set'
  });
  main_wnd.add(main_menu);
}
main_wnd_gen();
main_wnd.show();

True, some nuances appeared during the development process. It turned out that it was not entirely wise to let the computer randomly select a block, otherwise the game came down to beating one place. I had to intervene, increasing the chance of blocking a critical zone with the least number of hit points.

this.blocking = function (block) {
    if (this.ai == 'Enemy'){
      this.save = ['h', 'b', 'f'];
      for (var i = 0; i < 3; i++){
        if (this.hp[parts[i]] < 10){
          this.save.push(parts[i], parts[i], parts[i]);
        }
        if (this.hp[parts[i]] < 20){
          this.save.push(parts[i]);
        }
      }
      this.block = this.save[Math.floor(Math.random() * this.save.length)];
    } else {
      this.block = block;
    }
  };

There were other incidents. I don’t know why, but I couldn’t change the objects by their names - I had to directly access the _items array of the window object and change the elements

var game_wnd = new UI.Window();
...
function game_wnd_gen(){
  game_wnd._items = [];
...
  var attack = new UI.Image({
    position: new Vector2(0, 0),
    size: new Vector2(30, 30),
    image: '',
    compositing: 'set'
  });
  game_wnd.add(attack);
...
};
functiongame_wnd_update(){
  game_wnd._items[9].image('images/attack/' + heroes[1].name + side[1] + '.png');

In the end I was disappointed. On the Aplite platform (this is just the first Pebble and Pebble Steel), some pictures refused to load, which led to complete unplayability. There was only Basalt.



September 5, 2016


So in September, the game saw the world. No advertising, no articles, just satisfaction that the project is completed. And what was my surprise that after a few days one little boy wrote a video review . This sweetness warmed my heart.

And a few days later, Jon Barlow himself (I really don’t know who it is, but “Jon Barlow himself” was supposed to raise my FAC), while a member of the Pebble team and the store moderator added the game to the Fresh Picks category (now he, Of course, no, not fresh)



May 2017


I abandoned futile attempts to launch the game normally on Aplite. At this point, the game was present, but no additional damage was displayed, which caused a little confusion.

But Pebble 2 appeared. Transferring the game to another platform was not difficult, it was enough to add Diorite support to the appinfo.json file. In addition, the entire set of black and white graphics remained with Aplite, which on the new SDK 4.x completely refused to start.



October 2017


A year has already passed since the publication of the game. In statistics, there were about 360 downloads and 47 honest likes of players (okay, 46. One of mine). I still had an unresolved issue with the display of additional damage for some characters and a couple of sprites of female characters.



Yes, yes, all 8 fighters turned out to be men as a result. But no sexism. Taking my will into a fist, I myself finished drafting the missing sprites, added the code, plus added a female character, an archer (though I left him unplayable) and came up with another game mode, “Madcap”, in which defending itself was not so easy. This could already be called a full complement.

PS


What's next? Yes, it seems, and nothing. One could pervert and write multi-user mode. But that seems redundant to me, at least for the watch.

In fact, many ideas remain, such as the storyline, active abilities, ammunition and artifacts. But if that be the case, and the project will grow into Pebble Kombat 2, then it will already be for mobile. At the same time there will be an occasion to learn another language. ;)

Owners of Pebble Time and Pebble 2 watches can indulge and “check out” the project personally .
But for those interested in digging deeper, I posted the source on Github .

Read Next