Ajouter un personnage custom !

Notre jeu donne la possibilité aux joueurs d'ajouter leurs propres personnages customs au jeu par le biais d'un fichier de configuration.

Étape 1: Création du fichier de config

{
    "texture": {
      "hframes": 0,
      "vframes": 0,
      "scaleX": 0,
      "scaleY": 0,
      "offsetX": 0,
      "offsetY": 0
    },
    "animations": {
      "Idle": {
        "name": "Idle",
        "StartFrame": 0,
        "EndFrame": 0,
        "Loop": (true/false)
      },
      "Run": {
        "name": "Run",
        "StartFrame": 8,
        "EndFrame": 13,
        "Loop": true
      },
      "Hit": {
        "name": "Hit",
        "StartFrame": 144,
        "EndFrame": 148,
        "Loop": false
      },
      "Attack1": {
        "name": "Attack1",
        "StartFrame": 40,
        "EndFrame": 44,
        "damage": 2,
        "direction": "none",
        "Loop": false,
        "collision": {
          "position": [
            {
              "x": 0,
              "y": 0
            },
          ],
          "activeFrames": 2,
          "disabledFrames": 3
        }
      },
      
      "AirAttack1": {
        "name": "AirAttack1",
        "StartFrame": 64,
        "EndFrame": 68,
        "damage": 2,
        "direction": "down",
        "Loop": false,
        "collision": {
          "position": [
            {
              "x": 0,
              "y": 0
            },
          ],
          "activeFrames": 2,
          "disabledFrames": 4
        }
      }

  • Commencer par créer un dossier "characters" dans le même dossier ou se trouve votre exécutable.

  • Dans le dossier characters créer un sous-dossier avec le nom de votre personnage

  • Dans ce dossier creer un sous-dossier nommé assets.

  • Créer un fichier config.json et placer le dans le dossier que vous venez de créer et Récupérer le modèle de fichier de configuration ci-dessus.

  • Placer dans le dossier 'assets' l'icon qui apparaitera lors de la sélection de personnage. Nommez le icon.png.

Étape 2: Configurer la texture de votre personnage

 "texture": {
      "hframes": 0,
      "vframes": 0,
      "scaleX": 0,
      "scaleY": 0,
      "offsetX": 0,
      "offsetY": 0
    },

  • Placer dans le dossier assets votre fichier png correspondant aux textures de votre personnage.

  • Ce fichier devra être nommé sheet.png

  • Compléter ensuite les valeurs de hframe (nombre d'animations en horizontale) et vframe (nombre d'animation en verticale).

  • Ajouter une scale à votre personnage.

  • Ajouter un offset à votre personnage.

  • Pour que votre sheet.png soit correct il faut que toutes les frames ont une même taille.

Étape 3: Gérer les animations

 "animations": {
      "Idle": {
        "name": "Idle",
        "StartFrame": 0,
        "EndFrame": 0,
        "Loop": (true/false)
      },
      "Run": {
        "name": "Run",
        "StartFrame": 8,
        "EndFrame": 13,
        "Loop": true
      },
      "Hit": {
        "name": "Hit",
        "StartFrame": 144,
        "EndFrame": 148,
        "Loop": false
      },
      "Attack1": {
        "name": "Attack1",
        "StartFrame": 40,
        "EndFrame": 44,
        "damage": 2,
        "direction": "none",
        "Loop": false,
        "collision": {
          "position": [
            {
              "x": 0,
              "y": 0
            },
          ],
          "activeFrames": 2,
          "disabledFrames": 3
        }
      },      
      "AirAttack1": {
        "name": "AirAttack1",
        "StartFrame": 64,
        "EndFrame": 68,
        "damage": 2,
        "direction": "down",
        "Loop": false,
        "collision": {
          "position": [
            {
              "x": 0,
              "y": 0
            },
          ],
          "activeFrames": 2,
          "disabledFrames": 4
        }
      }

  • Votre sheet.png devra contenir 10 animations:

    1. Hit

    2. Idle

    3. Jump

    4. Run

    5. Attack1, Attack2, Attack3

    6. AirAttack1, AirAttack2, AirAttack3

  • Si vous ne mettez pas toute ce animations rien ne se passera lorque vous appuyerez sur le boutton correspondant.

  • Il ya deux types d'animations, simples (Hit, Jump, Run, Idle) et les attaques.

    1. Voici un Exemple d'animations simple.

  "Idle": {
    "name": "Idle",
    "StartFrame": 0, #Frame de début de l'animation
    "EndFrame": 0, #Frame de fin de l'animation
    "Loop": (true/false) #true si l'animation doit se jouer en boucle sinon false
  },

    2. Voici un exemple d'attaque

"attack1": {
  "name": "Attack1",
  "StartFrame": ,
  "EndFrame": ,
  "damage": , (Dégat de l'attaque)
  "direction": "none", #Direction dans laquelle l'adeversaire sera
                        projeté s'il est touché (none, right, left, up, down)
  "Loop": false,
  "collision": {
    "position": [ 
      { #Position en x, y de la hitbox d'une frame
        "x": 0,
        "y": 0
      },
      #Rajouter Les position de la hitbox pour chaque frames de l'animation.
    ],
    "activeFrames": 1, Frame à laquelle la hitbox est active
    "disabledFrames": 2 Frame à laquelle la hitbox se désactive
}

  • Pour le bon fonctionnement de l'animations "Hit" (animations qui est joué lorsque le joueur est touché), elle devra contenir 5 frames et ne pas être joué en boucle ('loop': false).

  • Le "name" de vos animations doit correspondre à la liste ci-dessus.

DEBUG: Mode Training

Notre jeu propose un mode training qui permet aux joueurs de tester les différentes fonctionnalités du jeu et tester également leurs personnages.

Pour pouvoir y accédez-vous devez nommer votre personnage "debug" (Renommé le dossier de votre personnage en "debug")

Le mode training vous permettra:

  • de tester la hitbox des animations de votre personnage.

  • de ralentir le jeu afin d'avoir un meilleur aperçu des différentes hitbox.

Last updated