Tutoriel Pas à Pas pour Game Develop

Galaxies War

Avant propos

Ce tutoriel va vous guider le long de la création du début d'un jeu, Galaxies War, avec le logiciel Game Develop (www.compilgames.net).

Ce mini jeu constituera en un vaisseau dirigé par le joueur, et qui devra tirer sur des méchants apparaissant en haut de l'écran et se dirigeant vers lui.

Vous pouvez, si vous ne l'avez déjà fait, lire le guide de mise en route inclus dans l'aide de Game Develop. N'hésitez pas aussi à parcourir les exemples livrés avec le logiciel.

La lecture de ce tutoriel en sera ainsi facilitée.

A la fin, ou même avant, n'hésitez pas à expérimenter et à améliorer le mini jeu, qui est loin d'être terminé.

En cas de problème, reportez vous à l'aide de Game Develop et, si vous ne trouvez pas de réponse, rendez vous sur notre forum : www.forum.compilgames.net

Enfin, si vous trouvez des erreurs ou si vous pensez qu'une partie du tutoriel peut être améliorée ou réécrite, postez aussi un message sur notre forum, ou envoyez nous un mail ( CompilGames@gmail.com )

Insertion des images

Nous allons commencer par l'insertion des images. Démarrez Game Develop ou créez un nouveau jeu, et dans l'éditeur d'image, survolez « Toutes les images » avec votre souris, et faites un clic droit. Choisissez ensuite « Ajouter une image »

Ajoutez des images avec le menu contextuel

Nous allons insérer plusieurs images d'un coup. Naviguez jusqu'au dossier contenant les images de ce tutoriel, et insérez « Vaisseau.png », «VaisseauMechant.png », « Viseur.png » et « MiniTir.png ».

Les images insérées

Nous allons laisser le nom de ces images tels qu'ils sont (par défaut, Game Develop nomme les images comme leur fichier).

Paramétrage de la scène

Nous allons maintenant créer une scène, un simple niveau.

Dans l'éditeur de jeu, faites un clic droit sur « Toutes les scènes du jeu », et choisissez « Ajouter une scène ».

Survolez ensuite cette scène, faites un clic droit et choisissez « Modifier le nom » et saisissez « Niveau » :

Une scène nommée Niveau

Continuons le paramétrage de cette scène. Toujours par l'intermédiaire du clic droit sur la scène, choisissez « Modifier les propriétés ». Dans la fenêtre, changez la couleur de fond en noir et saisissez «Galaxies War» en titre :

La fenêtre de paramétrage de la scène

Cliquez sur Ok pour fermer cette fenêtre.

Nous allons éditer cette scène. Sélectionnez la dans la liste et choisissez « Éditer cette scène »

Éditons maintenant la scène

Après avoir cliqué sur ce bouton, vous vous retrouvez devant l'éditeur de scène.

Création et positionnement des objets

Notre scène ne contient encore aucun objet. Nous allons donc créer 4 objets :

Un vaisseau, un viseur, un rocher et un tir.

Dans l'éditeur des objets, faites un clic droit sur « Tous les objets de la scène » et choisissez « Ajouter un objet ».

Un « Nouvel objet » apparaît dans la liste. Selectionnez le, faites un clic droit, choisissez « Modifier le nom de l'objet » et renommez le « Vaisseau ».

Ensuite, éditez le en faisant un clic droit dessus, mais en choisissant cette fois « Modifier les propriétés de l'objet ». L'éditeur d'objet apparaît :

L'éditeur d'objet à son ouverture

Comme vous le conseille Game Develop, insérez une animation en cliquant sur « Ajouter une animation ».

Puis, insérez l'image « Vaisseau.png » en écrivant « Vaisseau.png » dans la liste d'image à droite, et en cliquant sur Ajouter.

Enfin, notre vaisseau devra tourner sur lui-même, choisissez donc le mode de rotation « Rotation automatique » :

Notre objet Vaisseau est terminé

Répétez les mêmes opérations afin d'obtenir ces 3 autres objets :

Nous obtenons alors ceci dans l'éditeur des objets :

Les 4 objets de notre niveau

Positionnons maintenant nos objets sur la scène : Un vaisseau et un viseur. Vérifiez d'abord que vous êtes en mode « édition » :

Passez d'un mode à l'autre grâce à ces deux boutons

Dans l'éditeur de scène, appuyez sur le bouton « Choisir un objet » :

Le bouton « Choisir un objet » permet de choisir l'objet à insérer sur la scène

Dans la fenêtre qui s'ouvre, choisissez d'abord le Vaisseau :

Sélectionnez l'objet à insérer

Puis insérez le sur la scène en double cliquant.

Insérez un viseur en répétant ces étapes : Choisir un objet > Viseur > Double clic sur la scène.

Nos deux objets placés sur la scène

Nous avons terminé avec la création et le placement des objets. Voyons maintenant comment animer notre scène grâce aux évènements.

Création des évènements

La création des évènements est l'étape la moins facile à aborder, mais aussi la plus puissante car c'est elle qui définit entièrement comment votre scène va se comporter.

Nous allons remplir plusieurs objectifs ici :

• Déplacer le viseur à l'aide de la souris

• Tourner le vaisseau vers le viseur

• Faire avancer le vaisseau avec la touche « z »

• Faire tirer le vaisseau avec le bouton « gauche » de la souris

• Faire apparaître les méchants et gérer les collisions

Déplacer le viseur à l'aide de la souris et Tourner le vaisseau vers le viseur

Il faut d'abord que notre vaisseau se tourne vers notre viseur, et que notre viseur soit au même endroit que la souris.

Dans l'éditeur d'évènements, double cliquez sur la dernière case pour insérer un événement.

Commençons par les conditions.

Après avoir double cliqué sur la dernière ligne de la colonne « Conditions », la fenêtre d'édition des conditions s'affiche.

La fenêtre d'ajout de conditions

Notre première condition sera simple, ce sera une condition « toujours ». Ainsi, cette condition sera toujours vrai, et les actions que nous insérerons ensuite se répèterons toujours.

Pour insérer notre condition, faites un clic droit sur « Clic droit pour ajouter une condition », et choisissez « Insérer une condition »

Ajouter une condition grâce au clic droit

Dans la fenêtre qui s'ouvre, choisissez dans la liste de gauche le thème « Autre » puis « Toujours ».

Les conditions, tous comme les actions sont en effet rangées par thèmes.

Il n'y a pas de paramétrage à effectuer, cliquez ensuite simplement sur Ok. Puis fermez la fenêtre d'édition des conditions.

Une condition très simple : Toujours

Nous avons notre condition « toujours ». Ajoutons maintenant nos actions. Pour cela, éditez les actions de notre événement en double cliquant sur la colonne « Action » de l'évènement.

La fenêtre d'édition des actions est similaire à celle des conditions

La fenêtre d'édition des actions s'ouvre. Procédez de la même manière pour insérer une action (Clic droit > Ajouter une action).

Ajouter une action grâce au clic droit

Nous allons d'abord ajouter deux actions permettant de coller le viseur à la souris. Pour faire ceci, il faut mettre les coordonnées X et Y de l'objet viseur aux coordonnées X et Y de la souris.

Commençons par les X. Choisissez dans la liste de gauche le thème « Position » puis « Position X ». Paramétrez ensuite l'action comme ceci :

Une action permettant de placer la position X du viseur en fonction de la souris

Le premier paramètre est le nom de l'objet. Nous voulons déplacer le viseur, écrivez dans le nom « Viseur ».

Le deuxième paramètre est l'emplacement. Nous voulons la position X de la souris. Pour cela, vous pouvez utiliser l'éditeur d'expression. Cliquez sur « Expression » à coté du paramètre. Dans la fenêtre d'édition d'expression, déroulez la liste des valeurs spéciales, et choisissez « Position X de la souris ». Cliquez sur Insérer, puis fermez la fenêtre d'expression en cliquant sur Ok. L'éditeur d'expression a écrit pour vous « VAL(SourisX[]) » ce qui signifie : « Insére ici la position X de la souris ».

Enfin, le dernier paramètre est que faire avec ce nombre. Nous voulons que la position du viseur soit égale à la position de la souris, écrivez donc « = ».

Fermez la fenêtre de paramétrage de l'action. Dans la liste, vous voyez maintenant une action qui affecte la position X du viseur à la position X de la souris.

Faites de même avec la position Y du viseur. N'oubliez pas de remplacer dans le deuxième paramètre « VAL(SourisX[]) » par « VAL(SourisY[]) ».

La dernière action consiste à tourner le vaisseau vers la souris. Insérez une action, puis choisissez le thème « Direction » puis « Tourner un objet vers un autre ». Entrez en premier paramètre le nom de l'objet « Vaisseau » puis en second « Viseur ».

Les actions permettant de positionner le viseur et de tourner le vaisseau

Fermez ensuite pour de bon la fenêtre d'édition des actions avec le bouton Ok. Le premier événement est terminé.

Si vous voulez essayer la scène, passez en mode « aperçu » puis cliquez sur le bouton « Jouer ».

Votre vaisseau se tourne vers le viseur.

Faire avancer le vaisseau avec la touche « z »

Nous voulons maintenant créer un événement pour que le vaisseau avance quand nous appuyons sur la touche « z ».

Insérez un nouvel événement en double cliquant en bas de la liste des évènements, sur la case appropriée. Commençons par les conditions.

Dans la fenêtre d'édition des conditions, insérez une condition. Choisissez ensuite le thème « Clavier » puis « Touche appuiée ». Paramétrez cette condition en mettant « z » comme touche.

Fermez la fenêtre de paramétrage et d'éditions des conditions, puis éditez les actions.

Insérez une action, et paramétrez la. Choisissez le thème « Déplacement » puis « Ajouter une force (Par angle) ».

En premier paramètre, entrez le nom « Vaisseau », car nous voulons faire bouger le vaisseau.

En second paramètre, entrez l'angle voulu pour faire bouger le vaisseau. Nous voulons que le vaisseau avance en fonction de vers où il est tourné, nous devons donc récupérer sa direction. Cliquez sur « Expression » puis déroulez la liste des propriétés des objets. Choisissez « Numéro de direction d'un objet », puis cliquez sur Insérer. Entrez « Vaisseau » en nom d'objet. Fermez la fenêtre d'édition d'expression.

En troisième paramètre, entrez par exemple 150. Le vaisseau se déplacera ainsi de 150 pixels par secondes.

Enfin, entrez « 0 » dans le dernier paramètre. Ceci signifie que la force sera multipliée par 0 à la fin du traitement des évènements, en un mot : elle disparaitra si le joueur n'appuie pas sur « z ». Il est en effet normal que le vaisseau s'arrête si nous n'appuyons plus sur « z ».

L'évènement permettant de se déplacer

Vous pouvez tester la scène pour voir que le vaisseau avance bien quand vous appuiez sur « z ».

Faire tirer le vaisseau avec le bouton « gauche » de la souris

Insérons maintenant un événement pour pouvoir tirer. Il faut que le vaisseau tire quand nous appuyons sur le bouton gauche de la souris, et ce tous les 0,25 secondes.

Créez une première condition, et choisissez « Souris » puis « Un bouton est appuié ». Entrez « Left » (gauche en français) ou cliquez sur le bouton « Choisir un bouton », puis choisissez « Bouton gauche ». Fermez cette première condition.

Ensuite, et pour éviter de tirer trop vite, insérez une autre condition et choisissez « Chronomètre et temps » puis « Toutes les x secondes ». Paramétrez cette condition en mettant « Tir » en nom de chronomètre et « 0.25 » en secondes (Notez le point et non pas la virgule pour entrer un nombre à décimal !).

Les conditions pour pouvoir tirer

Passons maintenant aux actions. Insérez dans notre événement une première action. Choisissez dans les thèmes « Objets » puis « Créer un objet ». Entrez « Tir » en nom d'objet à créer (nous voulons créer un tir), puis paramétrez l'action pour que le tir soit créé à l'emplacement X et Y du vaisseau. Pour cela, utilisez l'éditeur d'expression comme nous l'avons fait auparavant, mais en choisissant « Position X d'un objet » ou « Position Y d'un objet », et en renseignant « Vaisseau » comme nom d'objet. Nous obtenons ceci, après quoi vous pouvez fermer cette action :

L'action permettant de créer le tir à l'emplacement du Vaisseau

Il faut ensuite créer une force pour déplacer ce tir. Insérez une action « Ajouter une force (Par angle) » (Dans le thème « Déplacement »), puis renseignez les paramètres de façon à déplacer l'objet « Tir », d'utiliser comme angle la direction du vaisseau (« VAL(Vaisseau[direc]) »), de longueur 300 pixels par secondes, et enfin, entrez 1 dans le dernier paramètre. En effet, le tir ne s'arrêtera jamais, et grâce au 1, la force restera la même ( elle sera multipliée par 1) tout au long du jeu. Pour ce dernier paramètre, retenez que « 0 » permet d'arrêter directement une force, que « 1 » la fera continuer à jamais et que des valeurs intermédiaires permettent de la faire s'arrêter progressivement !

Insérons une dernière action : « Remettre à zéro un chronomètre » dans le thème « Chronomètre et temps ». Entrez « Tir » en nom de chronomètre.

Les actions pour tirer

Si vous testez la scène, vous remarquerez que les tirs n'apparaissent non seulement pas à l'emplacement du vaisseau, mais aussi qu'ils ne suivent pas sa direction !

Pour remédier à cela, il faut bien savoir que, quand vous entrez « VAL(Vaisseau[direc]) » ou encore « VAL(Vaisseau[x]) », Game Develop essaye de trouver un « Vaisseau » concerné par les précédentes conditions (ou actions), mais n'en trouve pas.

Il nous faut ajouter une action. Double cliquez sur les actions de notre dernier événement, puis ajoutez une nouvelle action. Choisissez le thème « Objets » puis « Prendre un compte des objets ». Entrez « Vaisseau » en paramètre. Ainsi, Game Develop saura qu'il faut qu'il utilise tous les objets « Vaisseau » de la scène pour les prochaines actions.

Et justement, l'action se place en dernière position quand vous cliquez sur « Ok » pour fermer la fenêtre de paramétrage des actions. Faites donc un clic droit dessus, et choisissez « Couper ». Faites ensuite un clic droit sur la première action, et choisissez « Coller ». Notre action se place en début de liste.

Les véritables actions permettant de tirer.

Vous pouvez tester la scène, et voir que les tirs apparaissent et se dirige conformément au vaisseau !

Apparition des mechants et collisions

Nous allons ensuite insérer un événement plus ou moins similaire au précédent, consistant à créer des objets «Mechant» en haut de la scène, et à les faire se diriger vers notre vaisseau. Voici une copie d'écran de ce que vous devez créer afin d'obtenir le résultat voulu :

L'évènement créant des méchants se précipitant sur le Vaisseau.

Si vous butez sur la création, revenez quelques pages en arrière pour consulter comment les évènements ont été créés.

Enfin, deux évènements simples vont nous permettre de faire disparaître les méchants pour le joueur :

Les évènements pour supprimer le joueur ou les méchants

Si le joueur rencontre un méchant, il disparaît. Si par contre un tir rencontre un méchant, ce dernier disparaît.

Améliorations à apporter

Le jeu est évidemment loin d'être terminé. La disparition du joueur et des méchants est pour le moins spartiate. Il peut être donc approprié de faire apparaître un objet explosion à l'emplacement d'un vaisseau en collision avec un tir, puis de supprimer l'explosion quand son animation est terminée.

De même, vous pouvez créer une scène « Game Over », ou afficher un texte si le joueur est mort. Ainsi que créer une scène « Menu » pour permettre au joueur de choisir un niveau, quitter le jeu...

De nouvelles conditions et actions vous seront alors nécessaires. N'hésitez donc pas à les parcourir pour découvrir l'étendue des possibilités, et à vous référer à l'aide si vous avez besoin de plus d'informations.

Bonne création avec Game Develop !