Avez-vous déjà joué à un jeu en ligne et pensé: « J'aimerais pouvoir en faire un, j'ai de bonnes idées » ? Dans le passé, il était nécessaire d'avoir appris à coder en ActionScript 3, le langage qui alimente Flash. Grâce à certains programmes de création de jeux, cependant, l'expérience du codage est une exigence du passé. Vous pouvez créer des jeux amusants et profonds en manipulant des objets et une logique, sans jamais toucher à une ligne de code.
Pas
Partie 1 sur 4: Concevoir le jeu
Étape 1. Rédigez une description de base
Incluez des fonctionnalités et ce que vous voulez que le joueur accomplisse. Il est bon d'avoir un aperçu de base de ce que vous voulez faire avec votre jeu afin que vous puissiez vous y référer pendant que vous y travaillez.
Consultez ce guide pour plus de détails sur la rédaction d'un document de conception de jeu
Étape 2. Dessinez des croquis
Dessinez une disposition de base de ce à quoi vous voulez que les écrans ressemblent. Ceux-ci n'ont pas besoin d'être très détaillés, mais vous devriez au moins avoir une idée de l'endroit où les différents éléments seront placés à l'écran. Ceux-ci seront incroyablement utiles plus tard lorsque vous commencerez à créer l'interface de votre jeu.
Étape 3. Choisissez une méthode pour créer votre jeu
Traditionnellement, vous devez apprendre à coder en ActionScript 3 pour créer des jeux Flash. Bien que vous puissiez toujours le faire, il existe des programmes disponibles qui peuvent rendre la création de jeux beaucoup plus facile à apprendre et qui ne nécessitent aucune expérience de codage. Certaines des options les plus populaires pour créer des jeux incluent:
- Stencyl - Il s'agit d'un outil plus récent qui vous permet de créer des jeux à l'aide d'objets et de scripts logiques. Ces jeux peuvent ensuite être convertis en projets Flash et téléchargés sur n'importe quel site Web prenant en charge les jeux Flash.
- Construct 2 - Au fur et à mesure que Flash vieillit, il a commencé à être remplacé par d'autres moyens de créer des jeux. L'un des moyens les plus récents de créer un jeu en ligne consiste à utiliser HTML5. Normalement, cela nécessite beaucoup de connaissances en codage, mais Construct 2 vous permet de créer des jeux en utilisant des objets et des scripts, un peu comme Stencyl.
- Flash Builder - C'est la méthode traditionnelle de création de jeux Flash. Cela nécessite une bonne connaissance d'ActionScript, mais c'est l'un des langages les plus faciles à maîtriser. Flash Builder coûte de l'argent, mais vous pouvez utiliser le programme open source FlashDevelop pour obtenir la plupart des mêmes fonctionnalités.
Partie 2 sur 4: Utilisation de Stencyl
Étape 1. Téléchargez et installez Stencyl
Stencyl est un programme de création de jeux qui ne nécessite aucune connaissance en codage. Au lieu de cela, vous pouvez utiliser une variété d'outils logiques pour manipuler des objets dans le jeu.
Stencyl peut être utilisé gratuitement si vous souhaitez uniquement publier votre jeu en ligne. La version gratuite aura un logo Stencyl au début. Si vous obtenez la version payante, vous pouvez publier sur d'autres plateformes
Étape 2. Créez votre nouveau jeu
Lorsque vous démarrez Stencyl, une liste de vos jeux s'affiche. Il y aura plusieurs exemples de jeux sur la liste que vous pourrez consulter pour voir comment ils fonctionnent. Pour commencer à travailler sur votre propre jeu, cliquez sur la case avec la ligne pointillée intitulée "Cliquez ici pour créer un nouveau jeu".
Étape 3. Sélectionnez un kit
Il existe plusieurs kits contenant des ressources et des objets prédéfinis qui peuvent vous aider à démarrer rapidement votre jeu. Sélectionnez un kit si vous le souhaitez, ou sélectionnez "Jeu vierge" si vous envisagez de créer le vôtre.
Vous pouvez télécharger des kits que d'autres utilisateurs ont créés en ligne
Étape 4. Entrez vos informations de jeu
Avant de commencer à créer votre jeu, vous devrez saisir quelques informations.
- Nom - C'est le nom de votre jeu. Vous pouvez changer cela plus tard en ce que vous voulez.
- Taille de l'écran - Il s'agit de la taille de votre écran de jeu et elle est très importante car elle affectera l'art que vous utilisez. Étant donné que les gens joueront probablement à votre jeu dans leur navigateur Web, la taille de l'écran n'a pas besoin d'être très grande. Essayez Largeur: 640 px Hauteur: 480 px. C'est une bonne taille pour commencer.
Étape 5. Familiarisez-vous avec la mise en page
Lorsque vous chargez votre nouveau jeu pour la première fois, vous serez redirigé vers le tableau de bord. C'est là que vous pouvez voir toutes les scènes de votre jeu et accéder à toutes les ressources. Vous pouvez également modifier vos paramètres de jeu à partir d'ici. Vous passerez la plupart de votre temps à travailler dans le tableau de bord.
- Scènes - C'est la fenêtre principale du tableau de bord, et montre le jeu réel et tous les éléments. Votre jeu sera une collection de scènes.
- Ressources - Il s'agit de la liste de tous les objets et ressources de votre jeu. il comprend des acteurs, des arrière-plans, des polices, des scènes, une logique, des sons et des ensembles de tuiles. Les ressources sont organisées dans une arborescence sur le côté gauche de l'écran.
- Paramètres - Les options Jeu et Paramètres vous permettent d'ajuster le fonctionnement des mécanismes de votre jeu, y compris les commandes, la gravité, les collisions, les écrans de chargement, etc.
Étape 6. Personnalisez un acteur
Un acteur est tout objet qui bouge ou avec lequel on peut interagir dans le jeu (joueur, ennemi, portes, etc.). Vous devrez créer un acteur pour chaque objet de votre jeu. Pour créer un acteur, cliquez sur l'option "Types d'acteurs" dans le menu Ressources. Sélectionnez l'acteur que vous voulez dans la liste (la liste est déterminée par le kit que vous avez choisi).
- Affectez l'acteur à un groupe (joueur, ennemi). Cela aidera à déterminer les propriétés de collision de l'acteur. Sélectionnez votre acteur pour ouvrir l'éditeur d'acteur. Cliquez sur l'onglet Propriétés, puis choisissez le groupe approprié dans le menu déroulant.
- Ajoutez des comportements (sauter, piétiner, marcher). Les comportements sont ce qui permet à votre acteur d'effectuer des actions. Cliquez sur l'onglet Comportements, puis sur le bouton "+ Ajouter un comportement" dans le coin inférieur gauche. Sélectionnez un comportement (comme « Marcher ») dans la liste, puis cliquez sur « Choisir ».
- Réglez les commandes. Si vous créez un personnage joueur, vous voudrez probablement permettre au joueur de le déplacer. Lorsque vous ajoutez le comportement Marcher, vous serez redirigé vers l'écran Attributs de marche. Vous pouvez utiliser les menus déroulants pour choisir les touches qui déplaceront l'acteur vers la gauche et la droite. Vous pouvez également affecter des animations si le kit que vous utilisez en contient.
- Vous pouvez ajouter plusieurs comportements pour personnaliser ce qu'un acteur peut faire.
Étape 7. Créez une scène
La scène est ce que le joueur voit lorsqu'il joue. C'est l'arrière-plan, ainsi que tous les objets et acteurs qui sont visibles. Pour créer une nouvelle scène, cliquez sur l'option Scènes dans l'arborescence des ressources, puis cliquez sur la case en pointillés. Donnez un nom à votre nouvelle scène pour continuer.
- Arrière-plan - Votre scène sera redimensionnée automatiquement, vous n'avez donc pas à vous en soucier pour le moment. Vous pouvez choisir d'utiliser une couleur comme arrière-plan, sur laquelle seront placées des tuiles. Vous pouvez choisir entre une couleur unie ou un dégradé. Cliquez sur "Créer" lorsque vous avez terminé. Cela ouvrira le concepteur de scène.
- Placer les tuiles - L'ensemble de tuiles inclus dans votre kit sera chargé sur le côté droit de la fenêtre. Cliquez sur l'outil Crayon dans le menu de gauche, puis cliquez sur la vignette que vous souhaitez utiliser. Vous pouvez ensuite placer la tuile sur votre scène. Cliquez et faites glisser avec la souris pour placer plusieurs tuiles.
- Placement des acteurs - Cliquez sur l'onglet Acteurs au-dessus de votre jeu de tuiles pour basculer vers vos acteurs disponibles. Vous devez les avoir créés au préalable pour qu'ils apparaissent dans cette liste. Cliquez sur l'acteur que vous souhaitez placer, puis cliquez à l'endroit de la scène où vous souhaitez qu'il apparaisse. Si vous maintenez la touche Maj enfoncée, l'acteur s'alignera sur la grille.
- Ajout de gravité - Cliquez sur l'onglet "Physique" en haut de la fenêtre, puis entrez une valeur dans le champ "Gravité (verticale)". Entrer 85 simulera la gravité du monde réel.
Étape 8. Testez le jeu
Après avoir créé une scène et placé quelques acteurs, vous pouvez tester le jeu. Cliquez sur le bouton « Tester le jeu » en haut de l'écran pour jouer à ce que vous avez jusqu'à présent. Vous pouvez utiliser les clés que vous avez définies lors de la création de vos acteurs pour contrôler votre personnage de joueur.
Trouvez tous les aspects qui ne fonctionnent pas et essayez de les corriger. Par exemple, les ennemis se comportent-ils correctement ? Pouvez-vous vaincre vos ennemis? Y a-t-il des plates-formes inaccessibles ou des gouffres impossibles à franchir ? Revenez à la zone appropriée de votre éditeur de jeu pour résoudre les problèmes que vous rencontrez. Cela peut prendre un peu de temps, mais le résultat final sera un jeu beaucoup plus amusant et jouable
Étape 9. Ajoutez plus
Maintenant que vous avez une première scène fonctionnelle et jouable, il est temps de commencer à construire l'ensemble du jeu. Ajoutez plus de niveaux et de défis, et continuez à tester vos ajouts pour vous assurer qu'ils sont amusants et fonctionnent correctement.
Étape 10. Site Verrouillez votre jeu
Si vous allez télécharger le jeu sur un site qui héberge des jeux Flash, ou le télécharger sur votre propre site, vous voudrez probablement activer le "Verrouillage du site". Cela empêchera votre jeu d'être joué s'il ne figure pas sur la liste des sites autorisés.
- Ouvrez "Paramètres du jeu" depuis votre arborescence "Ressources". Sélectionnez la section "Chargeur". Entrez les sites que vous souhaitez autoriser dans le champ "Site Lock", séparés par une virgule sans espace. Par exemple, newgrounds.com, kongregate.com.
- Sur cet écran, entrez votre page d'accueil dans le champ « Votre page d'accueil », si vous en avez un. Cela permettra aux joueurs qui jouent à votre jeu d'être liés à votre site.
Étape 11. Exportez le jeu en Flash
Une fois que vous êtes satisfait de votre jeu, vous pouvez l'exporter au format Flash. Cela vous permettra de télécharger le jeu sur un site qui héberge des jeux Flash, ou sur votre propre site Web. Cliquez sur Publier sélectionnez Web, puis cliquez sur Flash. Enregistrez le fichier dans un emplacement facile à trouver sur votre ordinateur.
Étape 12. Publiez le jeu
Une fois que vous avez votre fichier Flash (. SWF), vous pouvez le télécharger sur l'hôte de votre choix. Il existe une variété de sites en ligne qui hébergent des jeux Flash, et certains peuvent même vous permettre de gagner de l'argent grâce aux revenus publicitaires de votre jeu. Vous pouvez également télécharger votre jeu sur votre propre site Web, mais vous voudrez vous assurer que vous disposez de la bande passante nécessaire pour répondre aux besoins des joueurs si le jeu devient populaire.
- Consultez ce guide pour télécharger votre jeu sur votre propre site Web.
- Si vous souhaitez télécharger votre jeu sur un site comme Newgrounds ou Kongregate, vous devrez créer un compte, puis suivre le processus de téléchargement pour le site. Les termes et conditions varient d'un site à l'autre.
- Si vous souhaitez publier votre jeu sur Stencyl Arcade, vous pouvez le faire depuis le programme Stencyl. Cliquez sur Publier sélectionnez Stencyl, puis cliquez sur Arcade. Le jeu sera automatiquement téléchargé, alors assurez-vous que vous êtes satisfait du nom avant de le faire. Stencyl Arcade a une limite de taille de fichier de 8 Mo.
Partie 3 sur 4: Utilisation de Construct 2
Étape 1. Téléchargez et installez Construct 2
Ce programme vous permet de créer des jeux HTML5 avec très peu de codage. Vous devrez affecter certaines variables, mais tout cela se fait via des menus sans codage réel requis.
Construct 2 est gratuit, bien que certaines fonctionnalités soient limitées, sauf si vous effectuez une mise à niveau. La version gratuite ne peut pas être publiée sur d'autres plateformes que HTML5
Étape 2. Créez un nouveau projet
Lorsque vous démarrez Construct 2 pour la première fois, vous serez accueilli par un menu de bienvenue. Cliquez sur le lien "Nouveau projet" pour commencer une nouvelle partie. Il existe également quelques exemples inclus que vous pouvez utiliser pour voir comment les jeux de base sont créés.
Lors de la création d'un nouveau projet, vous recevrez une liste de modèles. Pour votre premier projet, vous voudrez probablement commencer avec un projet vide. Cela vous permettra de vous familiariser avec les bases sans que les modèles ne vous gênent
Étape 3. Ajustez les paramètres de votre projet
Dans le cadre de gauche de la fenêtre du projet, vous verrez une série d'éléments dans le cadre Propriétés. Vous pouvez l'utiliser pour définir la taille de votre écran et saisir les informations de votre jeu et de votre entreprise.
Étape 4. Insérez un arrière-plan
Double-cliquez sur la mise en page. Sélectionnez "Arrière-plan en mosaïque" dans la section Général. Cliquez sur votre mise en page pour placer l'arrière-plan. Cela ouvrira l'éditeur d'arrière-plan. Vous devrez créer les vôtres à l'aide d'un logiciel de retouche d'images ou télécharger des textures à partir de divers emplacements en ligne.
- Définissez l'arrière-plan à la taille de la mise en page. Pour ce faire, sélectionnez l'objet d'arrière-plan et modifiez la taille dans le cadre Propriétés.
- Changez le nom du calque et verrouillez-le. Vous voudrez verrouiller le calque pour éviter de le déplacer accidentellement lors du placement d'autres objets. Cliquez sur l'onglet "Calques" sur le côté droit de l'écran. Sélectionnez le calque et cliquez sur l'icône Crayon. Nommez le calque « Arrière-plan », puis cliquez sur le bouton « Cadenas » pour verrouiller l'arrière-plan.
Étape 5. Créez un nouveau calque
Dans l'onglet Calques, cliquez sur le bouton "+" pour créer un nouveau calque. Renommez-le en "Principal". Ce sera la couche sur laquelle résident la plupart de vos objets de jeu. Assurez-vous que la couche principale est sélectionnée avant de continuer.
Étape 6. Ajoutez des entrées pour votre jeu
Dans Construct 2, vos entrées devront être ajoutées en tant qu'objets à votre jeu. Ils sont invisibles et permettront l'utilisation du clavier et de la souris tout au long du projet.
Double-cliquez sur votre mise en page et sélectionnez "Souris" dans la section Entrée. Faites de même pour insérer l'objet "Clavier"
Étape 7. Ajoutez des objets
Il est temps de commencer à ajouter des objets de jeu à votre mise en page. Double-cliquez sur la mise en page et sélectionnez "Sprite" dans la section Général. Utilisez le réticule pour choisir où vous voulez placer le sprite. L'éditeur d'images s'ouvrira, vous permettant soit de charger un sprite existant, soit d'en créer un nouveau.
Lorsque vous sélectionnez les sprites sur votre mise en page, les propriétés du sprite se chargeront dans le cadre de gauche. Changez le nom du sprite pour pouvoir l'identifier et vous y référer plus facilement
Étape 8. Ajoutez des comportements à vos objets
Pour ajouter un comportement, cliquez sur l'objet auquel vous souhaitez ajouter un comportement complet pour le sélectionner. Cliquez sur le lien "Ajouter/Modifier" dans la section Comportements du cadre Propriétés. Une liste des comportements disponibles apparaîtra.
Les comportements sont des éléments logiques préconfigurés qui vous permettent d'ajouter rapidement des fonctionnalités à vos objets. Vous pouvez choisir parmi une grande variété de comportements prédéfinis pouvant exécuter un large éventail de fonctions. Par exemple, pour rendre le sol solide, attribuez-lui le comportement "Solide". Pour déplacer le personnage-joueur dans huit directions, donnez-lui le comportement "mouvement dans 8 directions"
Étape 9. Modifiez les propriétés de comportement
Vous pouvez modifier les comportements existants pour personnaliser le fonctionnement de vos objets. Vous pouvez modifier les valeurs pour modifier la vitesse, la direction et d'autres propriétés.
Étape 10. Comprendre comment fonctionnent les événements
Les événements sont une liste de conditions, et c'est ce qui motive le jeu. Si les conditions sont remplies, l'événement se produit. Si les conditions ne sont pas remplies, l'événement ne se produit pas. La feuille d'événement est généralement exécutée environ 60 fois par seconde. Chaque fois qu'il s'exécute est appelé un "tick".
Étape 11. Créez un événement
Double-cliquez dans la feuille d'événement vierge. Une liste des objets disponibles apparaîtra. Sélectionnez l'objet pour lequel vous souhaitez créer un événement ou vous pouvez créer un événement système.
- Sélectionnez le moment où l'action se produit. Après avoir sélectionné l'objet, il vous sera demandé de sélectionner le moment où l'événement doit se produire. Cela peut être basé sur d'autres événements ou à certains moments. "Chaque tick" est toujours.
- Ajouter une action. Il vous sera demandé de sélectionner un de vos objets. Choisissez parmi une liste d'actions. Par exemple, si vous créez un jeu de tir de haut en bas et que vous souhaitez que le personnage du joueur regarde toujours la souris, vous devez créer une action "Définir l'angle vers la position" à chaque tick défini sur l'objet Joueur. Lorsqu'on lui a demandé les coordonnées, entrez "Mouse. X" pour X et "Mouse. Y" pour Y. Cela gardera le vaisseau du joueur toujours pointé vers le curseur.
Étape 12. Ajoutez plus d'événements et de comportements
Ce sont les piliers de votre jeu. L'ajout et la modification de comportements et d'événements vous aideront à créer un jeu unique et amusant auquel les gens réclameront de jouer. Expérimentez avec différents événements pour essayer d'obtenir le jeu exact que vous voulez.
Étape 13. Ajoutez des variables
Il existe deux types de variables dans Construct 2: les variables d'instance et les variables globales. Ceux-ci vous permettent de définir des valeurs personnalisées pour vos objets et votre jeu, telles que la santé, les limites de temps, les scores, etc.
- Variables d'instance - Les variables d'instance sont des variables affectées à des objets uniques. Ils sont utilisés pour des choses telles que la santé des ennemis et des joueurs. Vous pouvez ajouter des variables d'instance après avoir sélectionné un objet en cliquant sur le lien "Ajouter / modifier" dans la section Variables du cadre Propriétés. Donnez à la variable un nom auquel on peut faire référence dans un événement, ainsi qu'une valeur initiale.
- Variables globales - Les variables globales sont des variables affectées à l'ensemble du jeu. Ils sont utilisés pour des choses telles que le score du joueur. Pour créer une variable globale, ouvrez la feuille d'événement et faites un clic droit sur un espace vide. Cliquez sur "Ajouter une variable globale", donnez-lui un nom auquel on peut faire référence dans un événement, puis saisissez une valeur initiale.
Étape 14. Créez une interface
Lors de la création d'une interface, il est généralement préférable de le faire sur un nouveau calque. C'est parce que l'interface bouge ou change rarement, il est donc bon de l'avoir sur un calque verrouillé. Dans le cadre Propriétés du nouveau calque, définissez "Parallaxe" sur 0. Cela empêchera le calque de défiler lorsque l'écran le fera.
Utilisez des zones de texte et des variables pour créer votre interface. Vous pouvez configurer vos zones de texte pour afficher la santé restante, le score, les munitions ou tout autre élément que le joueur aurait besoin de voir régulièrement
Étape 15. Testez et révisez votre jeu
Maintenant que vous avez des objets à l'écran avec des événements et des comportements, vous pouvez commencer à tester et ajouter du contenu. Cliquez sur le bouton "Jouer" en haut de l'écran pour créer et tester le jeu. Notez tout ce qui n'a pas fonctionné et essayez de le réparer afin que votre jeu soit jouable et amusant.
Étape 16. Exportez le jeu
Si vous êtes satisfait de votre jeu, vous pouvez l'exporter afin qu'il puisse être téléchargé sur un site Web et joué par n'importe qui. Pour exporter le jeu, cliquez sur le Déposer menu et sélectionnez Exporter. Enregistrez le projet dans un emplacement que vous pouvez facilement localiser.
Étape 17. Publiez le jeu
Il existe plusieurs sites qui vous permettent de télécharger des jeux HTML5 pour que d'autres puissent y jouer. Vous pouvez également ajouter le jeu à votre propre site Web. Consultez ce guide pour plus de détails sur le téléchargement du jeu sur votre propre site Web.
Partie 4 sur 4: Codage à partir de zéro
Étape 1. Téléchargez un IDE de programmation (environnement de développement intégré) qui prend en charge HTML tel que Game Maker Studio
Certains sont disponibles gratuitement, bien que la plupart des meilleurs IDE coûtent des centaines de dollars.
Étape 2. Apprenez à utiliser l'IDE
Apprendre à programmer dans votre environnement est extrêmement important. Mémoriser la plupart du code commun et apprendre à implémenter les choses correctement peut prendre des semaines, voire des mois. Soyez patient et tout sera payant !
Étape 3. Créez votre jeu une fois que vous pensez être prêt
Faire un document de conception ou noter quelques idées est un bon début. La programmation d'un jeu peut prendre des mois ou si vous êtes vraiment sérieux au sujet de faire un succès, même un an ou deux.
Étape 4. Testez le jeu
Assurez-vous d'essayer de faire des choses folles ou inattendues et d'éliminer autant de bogues que possible. Essayez également de déterminer si le gameplay est comme vous le vouliez, ou si vous devez revenir en arrière et apporter des modifications.
Étape 5. Publiez-le
Publiez votre jeu en ligne sur un site tel que Kongregate. Vous devez être prêt à recevoir des critiques constructives et vous souhaiterez peut-être mettre à jour votre jeu pour répondre aux souhaits de votre base de joueurs.
Des astuces
- Si vous êtes plus intéressé par l'apprentissage du code derrière les jeux Flash, vous pouvez utiliser Flash Builder et le code ActionScript 3 pour créer des jeux personnalisés. Cela prendra plus de temps mais pourrait donner lieu à une expérience plus unique. Consultez ce guide pour plus de détails sur la programmation dans Actions Script 3.
- Donnez du crédit à toutes les sources dont vous avez tiré des idées ou du contenu, et à tous ceux qui ont aidé à créer le jeu.
