Comment faire un jeu flash

Flash est un format très répandu pour les jeux vidéos via navigateur internet, sur des sites dédiés tels que Newgrounds et Kongregate. Flash est de moins en moins utilisé par rapport aux formats des nouvelles applications mobiles, mais il est encore répandu pour de nombreux jeux de qualité. Flash est basé sur ActionScript, un langage de programmation simple qui vous permet de contrôler les objets affichés à l'écran.

Partie 1

Partie 1 sur 3:

Pour démarrer

Télécharger l'article

1
Réalisez le design de votre jeu. Avant de commencer à coder, il sera utile de vous faire une idée de ce que vous souhaitez comme jeu. Flash est adapté à des jeux simples. Essayez de créer un jeu dans lequel le joueur n'a que quelques actions différentes à réaliser. Basez-vous sur un genre de jeu basique et gardez en tête les quelques mécanismes simples qui le sous-tendent. Consultez ce guide pour obtenir plus de détails sur la planification du développement d'un jeu vidéo. Les jeux en flash les plus communs sont :
- « Endless runners » : dans ces jeux, le personnage se déplace automatiquement et le joueur doit le faire sauter par dessus des obstacles ou interagir avec le jeu d'une manière comparable. Le joueur n'a en général qu'une ou deux actions différentes à sa disposition.
- « Brawlers » : ces jeux incluent généralement un défilement latéral de l'environnement de jeu. Le joueur doit battre les ennemis qui se présentent afin de progresser. Il a souvent plusieurs mouvements à sa disposition pour se défaire des ennemis.
- « Puzzles » : ces jeux proposent au joueur de résoudre des énigmes ou des puzzles pour passer au niveau suivant. Ceux-ci peuvent varier de ceux du type Match-3, tels que Bejeweled, jusqu'à des puzzles plus complexes, rencontrés généralement dans les jeux d'aventure.
- « RPGs» ou jeux de rôles : ces jeux mettent l'accent sur le développement et la progression d'un personnage. Le joueur se déplace à travers divers environnements comportant une variété d'ennemis. Les combats diffèrent d'un RPG à l'autre, mais la plupart se déroulent au tour par tour. Les RPGs peuvent être sensiblement plus complexes à coder que les jeux d'action simple.
2
Apprenez ce pour quoi Flash est adapté. Flash est bien adapté aux jeux en 2D. Il est possible de faire de la 3D en Flash, mais cela nécessite une connaissance approfondie du langage de programmation. La plupart des jeux en Flash à succès sont en 2D.
- Flash est plus adapté pour les jeux courts ou jouables par petites sessions.On y joue généralement quand on a un peu de temps libre, pour faire une pause, ce qui limite le temps de jeu à une quinzaine de minutes environ.
3
Familiarisez-vous avec le langage de programmation ActionScript3 (AS3). Les jeux en Flash sont programmés en AS3. Vous aurez besoin de comprendre les bases de son fonctionnement pour réussir à créer un jeu. Si vous savez comment coder en AS3, vous pourrez créer un jeu simple.
- Plusieurs livres traitant d'ActionScript sont disponibles sur Amazon ou d'autres boutiques, ainsi que de nombreux exemples et tutoriels sur internet.
4
Téléchargez Flash Professional. Ce programme est payant, mais il est le meilleur moyen de créer des programmes Flash rapidement. D'autres options sont disponibles, certaines en logiciel libre, mais la compatibilité laisse souvent à désirer et pour une même tâche, ils nécessitent plus de temps.
- Flash Professional est le seul programme dont vous aurez besoin pour commencer à créer un jeu.
Publicité

Partie 2

Partie 2 sur 3:

Écrire un jeu de base

Télécharger l'article

1
Comprenez les bases de la construction de blocs en code AS3. Lorsque vous créerez un jeu simple, il vous faudra utiliser plusieurs structures de code différentes. Il existe 3 parties principales dans un code AS3:
- Variables - Elles servent à stocker des données. Ces données peuvent être des nombres, des mots (strings), des objets ou autres. Les variables sont définies par le code var et leur nom doit être composé d'un seul mot.
  var playerHealth:Number = 100;// "var" spécifie que vous êtes en train de définir une variable.// "playerHealth" est le nom de la variable.// "Number" est le type de donnée.// "100" est la valeur assignée à la variable. // Chaque ligne de code ActionScript se termine par ";"
- Event Handlers – Les Event handlers vérifient l’occurrence de certains événements et le communiquent au reste du programme. C'est un point essentiel pour mettre en place des commandes du joueur et répéter le code. Les Event handlers font généralement appel à des fonctions.
  addEventListener(MouseEvent.CLICK, swingSword);// "addEventListener()" définit le event handler.// "MouseEvent" est la catégorie de commande qui doit être vérifiée. // ".CLICK" est l'action particulière comprise dans la catégorie MouseEvent.// "swingSword" est la fonction appelée lorsque l'action se produit.
- Fonction - Des sections de code assignées à un mot clé qui peuvent être appelées par la suite. Les fonctions gèrent le contenu du programme de votre jeu. Les jeux complexes peuvent comporter des centaines de fonctions alors que les jeux simples n'ont besoin que de quelques-unes. Vous pouvez les écrire dans n'importe quel ordre étant donné qu'elles ne fonctionnent que lorsqu'elles sont appelées.
  function swingSword (e:MouseEvent):void;{//tapez votre code ici}// "function" est le mot clé qui apparaît au début de chaque fonction.// "swingSword" est le nom de la fonction.// "e:MouseEvent" est un paramètre ajouté, spécifiant que la fonction est appelée à partir d'un //Event Handler. // ":void" est la valeur renvoyée par la fonction. Si celle-ci ne renvoie aucune valeur utilisez :void
2
Créez un objet. ActionScript est utilisé pour affecter et modifier les objets dans Flash. Pour faire un jeu, vous devrez créer des objets puis permettre au joueur d'interagir avec. Suivant les guides que vous lirez, les objets seront dénommés « sprites », « actors » ou « movie clips ». Pour le jeu en exemple, vous créerez un rectangle.
- Ouvrez Flash Professional si vous ne l'avez pas déjà fait. Créez un nouveau projet ActionScript 3.
- Cliquez sur l'outil de dessin de rectangle depuis le panneau d'outils. La localisation de ce panneau peut différer d'une configuration de Flash Professional à une autre. Dessinez un rectangle dans la fenêtre Scène.
- Sélectionnez le rectangle en utilisant l'outil de sélection.
3
Assignez des propriétés à votre objet. Une fois votre nouveau rectangle sélectionné, ouvrez le menu modifier et sélectionnez « convert to symbol ». Vous pouvez également appuyer sur la touche F8. Dans la fenêtre qui s'ouvre, donnez un nom facilement reconnaissable à votre objet, par exemple « ennemi ».
- Ouvrez la fenêtre « Properties ». En haut de la fenêtre, vous trouverez une boîte de texte vide étiquetée « Instance name » lorsque vous la survolez avec la souris. Donnez-lui le même nom que lorsque vous avez converti votre objet en symbole (« ennemi »). Cette action crée un nom unique qui vous permettra des interactions via le code AS3.
- Chaque « instance » est un objet à part entière qui peut être affecté par du code. Vous pouvez dupliquer une instance déjà créée en cliquant sur l'onglet « Library » et en faisant glisser l'instance sur la scène. À chaque ajout, le nom sera modifié pour signifier qu'il s'agit d'un objet indépendant des autres (« ennemi1 », « ennemi2 », etc.)
- Lorsque vous vous référez à un objet dans le code, il vous suffit d'utiliser le nom de l'instance, en l’occurrence « ennemi ».
4
Modifiez les propriétés d'une instance. Lorsqu'une instance est créée, vous pouvez ajuster ses propriétés via AS3. Ceci peut vous permettre de déplacer l'objet sur l'écran, modifier sa taille et ainsi de suite. Vous pouvez ajuster les propriétés en tapant le nom de l'instance, suivi d'un point « . », suivi de la propriété, suivie de la valeur :
- enemy.x = 150; Ceci modifie la position de l'objet ennemi sur l'axe des abscisses.
- enemy.y = 150; Ceci modifie la position de l'objet ennemi sur l'axe des ordonnées. L'origine de cet axe est située en haut de l'écran.
- enemy.rotation = 45; Fait tourner l'objet ennemi de 45° dans le sens horaire.
- enemy.scaleX = 3; Étire la taille (selon l'axe des abscisses) de l'objet ennemi par un facteur 3. Un nombre négatif va retourner l'objet façon miroir.
- enemy.scaleY = 0.5; Contracte l'objet à la moitié de sa hauteur.
Cette commande renvoie les valeurs en cours pour des objets spécifiques. Elle est utile pour déterminer si tout se passe comme prévu. Cette commande ne fera sans doute pas partie de votre code final, mais elle peut être utile pour débugger votre programme.

How.com.vn Français: Step 6 Construisez un jeu basique en utilisant les informations précédentes.

Maintenant que vous comprenez fonctions de base, vous pouvez créer un jeu dans lequel les ennemis changent de taille à chaque fois que vous cliquez dessus, jusqu'à ce qu'ils n'aient plus de vie. ^{[2]XSource de recherche}

var enemyHP:Number = 100; // Définit la vie de départ des ennemis à 100 PV ; var playerAttack:Number = 10; // Définit la puissance d'attaque du joueur lorsqu'il clique. enemy.addEventListener(MouseEvent.CLICK, attackEnemy); //  En ajoutant cette fonction directement à l'objet ennemi,//  la fonction est appelée uniquement quand on clique sur l'objet// et pas quand on clique ailleurs sur l'écran. setEnemyLocation(); // Ceci appelle la fonction qui place l'ennemi// sur l'écran. Cela se produit lorsque le jeu commence. function setEnemyLocation ():void{ enemy.x = 200;  // Déplace l'ennemi de 200 pixels depuis la gauche de l'écran.  enemy.y = 150;  // Déplace l'ennemi vers le bas de 150 pixels, à partie du haut de l'écran.  enemy.rotation = 45;  // Fait pivoter l'ennemi de 45° dans le sens horaire  trace("enemy's x-value is", enemy.x, "and enemy's y-value is", enemy.y);  // Affiche la position actuelle de l'ennemi pour debugger.} function attackEnemy (e:MouseEvent):void // Ceci crée la fonction d'attaque qui est appelée lorsqu'on clique sur l'ennemi. { enemyHP = enemyHP - playerAttack;  // Retranche la valeur de l'attaque aux points de vie de l'ennemi //donnant ainsi une nouvelle valeur aux points de vie.  enemy.scaleX = enemyHP / 100;  // Modifie la largeur de l'ennemi en fonction de son nouveau total de points de vie. // Ce total est divisé par 100 pour obtenir un chiffre décimal compris entre 0 et 1. enemy.scaleY = enemyHP / 100;  // Modifie la hauteur de l'ennemi en fonction du nouveau total de points de vie.  trace("The enemy has", enemyHP, "HP left");  //Affiche le nouveau total de points de vie restants.}

Une fois le code créé, vous pouvez tester votre jeu. Cliquez sur le menu « Control » et sélectionnez « Test Movie ». Votre jeu va alors se lancer, et vous pourrez cliquer sur les ennemis pour modifier leur taille. Les résultats des fonctions Trace seront affichés dans la fenêtre « Output ».
Publicité

Partie 3

Partie 3 sur 3:

Apprendre des techniques avancées

Télécharger l'article

1
Apprenez à utiliser des packages. ActionScript est basé sur le langage Java. Il utilise un système de package comparable à ce dernier. Ces packages vous permettent de stocker des variables, constantes, fonctions et autres informations dans des fichiers séparés pour ensuite importer ces fichiers dans votre programme. Ceci est particulièrement utile si vous souhaitez utiliser un package développé par quelqu'un d'autre afin de faciliter la création de votre jeu.
- Consultez ce guide pour plus de détails concernant le fonctionnement des packages Java.
2
Construisez vos dossiers de projet. Si vous créez un jeu avec de nombreuses images et fichiers de son, il vous sera utile de créer une arborescence de dossiers. Elle vous permettra de stocker facilement les différents éléments ainsi que les différents packages à utiliser.
- Créez un dossier de base pour votre projet. Dans ce dossier de base, vous créerez un dossier « img » contenant tous les dessins nécessaires à votre jeu, un dossier « snd » pour tous les sons et un dossier « src » pour les packages et le code.
- Créez un dossier « game » dans votre dossier « src » afin de stocker vos fichiers de Constantes
- Cette structure n'est pas nécessaire, mais c'est un moyen pratique d'organiser votre travail et les éléments qui le composent, en particulier pour les grands projets. Pour le jeu simple décrit ci-dessus, pas besoin de créer le moindre répertoire.
Un jeu sans son ou musique peut vite devenir ennuyeux pour le joueur. Vous pouvez ajouter du son à Flash en utilisant l'outil « Layers ». Consultez ce guide pour plus de détails.
4
Créez un fichier de constantes. Si votre jeu nécessite de garder en mémoire de nombreuses valeurs qui resteront les mêmes tout au long du jeu, vous pouvez créer un fichier de constantes. Cela vous permettra de garder toutes ces valeurs à un seul endroit pour pouvoir aller les chercher facilement. Les constantes peuvent englober des valeurs telles que la gravité, la vitesse du joueur ou toute autre valeur dont vous pouvez avoir besoin de manière répétée. ^{[3]XSource de recherche}
- Si vous créez un fichier de constantes, vous devrez le placer dans un dossier puis l'importer comme un package. Par exemple, disons qu'un fichier de constantes est créé et sauvegardé dans votre dossier « Game »:
  package{import Game.*;}
De nombreux développeurs ne vous donneront pas leur code, mais il existe de beaucoup de tutoriels ou autres projets dont le code est libre. Ces derniers vous permettront de voir comment le code interagit avec des objets. C'est un très bon moyen pour apprendre des techniques qui permettront à votre jeu de se démarquer.
Publicité