Passer au contenu

Créez vos propres jeux sans programmation!

PopFly n’est certainement pas le service Web de Microsoft le plus connu. Mais c’est, sans conteste, le plus novateur et le plus original. Il permettait déjà à tout un chacun de fabriquer des gadgets pour ses pages Web et pour le Volet Vista. Il vous permet désormais de créer sans la moindre programmation vos propres jeux, à publier ensuite sur votre site…

Etape 1/8 : Accédez à PopFly Game Creator

Au mois de Mai 2008, Microsoft a mis en ligne la version “alpha” (version archi-préliminaire, donc) de son “Microsoft PopFly Game Creator”, un site qui utilise les concepts de Mesh et la puissance de Silverlight pour créer des jeux vidéo facilement partageables.

Même si vous n’avez aucune envie de créer votre propre jeu, le site vous donne accès à plusieurs dizaines de jeux créés par d’autres internautes… l’idéal pour un moment de détente.

Pour accéder à cet outil étonnant, il suffit d’un navigateur Web (à priori Internet Explorer est préférable dans cette version Alpha), de l’extension Silverlight (qui se téléchargera à la première connexion si vous n’en disposez pas déjà) et d’un compte LiveID (comme votre compte Hotmail ou votre compte MSN/Live Messenger).

– Connectez-vous au site www.popfly.com/gamecreator

– Utilisez votre login LiveID pour vous identifier

– Le premier écran vous permet de choisir entre deux modes de fonctionnement:
* concevoir un jeu à partir d’une base existante (Start with a template)
* ou concevoir un jeu en partant de zéro (Start from scratch)

– Cliquez sur la dernière option: Start from scratch

Passons à la première étape: la définition des “personnages”

 

Etape 2/8 : Définition des “acteurs”

La construction d’un jeu sous PopFly se compose de trois étapes principales:
– la définition des acteurs
– la définition de la scène
– la définition des règles du jeu

La définition des acteurs est donc la première phase dans la création de votre jeu. On entend par “acteur” tout élément en mouvement, et notamment le héros et ses ennemis, ces derniers pouvant être des vaisseaux spaciaux, des animaux, des hamburgers, des portes, des cartes de jeu, des dés ou n’importe quel autre élément actif dans votre jeu.

– Dans le champ de recherche, saisissez “Duck” (canard)

– Sélectionnez le premier canard (le jaune). Un bip retentit et le canard apparaît dans la barre d’outils en haut, prouvant qu’il a bien été pris en compte.

– Dans le menu sur la gauche, sélectionnez “Vehicles” (véhicules) et cliquez sur “Cartoon Spaceship” (vaisseau de l’espace, façon dessin animé). Il s’ajoute alors à la barre d’outils.

Voilà, nous avons nos protagonistes: le joueur contrôlera le vaisseau spatial et devra détruire le canard, ou plutôt les canards, car bien que nous n’en ayons sélectionné qu’un, nous allons les multiplier dans l’étape suivante lors de la définition de la scène.

Passons donc à la deuxième étape…

 

Etape 3/8 : Définition du décor et de l’espace de jeu

Nous allons maintenant définir l’espace de jeu et la façon dont les éléments s’agencent dans cet espace.

– Cliquez sur Scenes dans la barre d’outils

– Dans le champ “Width”, fixez à 640 la largeur de la zone de jeu

– Dans le champ “Height”, fixez à 480 la hauteur de la zone de jeu

– Cliquez sur Background (fond d’écran) et choisissez le ciel étoilé (A Starry Background)

– Fermez la sélection des fonds d’écran à l’aide de l’icône “Rond avec croix” en haut à droite, pour revenir à l’écran prinicpal de définition de la scène.

– Cliquez sur Cartoon Spaceship (le vaisseau) dans le volet de gauche pour l’ajouter dans la scène et appuyez sur la touche [ESC] pour sortir du mode d’ajout.

– Cliquez ensuite sur le vaisseau ajouté pour le placer en bas de l’écran de jeu et au centre (jouez avec le zoom si nécessaire pour voir tout l’espace de jeu)

– Cliquez maintenant sur le Duckie (le Canard), et placez le premier exemplaire sur l’espace de jeu. Notez que le mode Ajout (ADD) reste actif, ce qui permet d’ajouter immédiatement un autre canard. Créez ainsi deux rangées de 5 canards en haut de la surface de jeu.

– Dernier détail, il faut ajouter de la musique. Cliquez sur l’icône Music sur la gauche et choisissez un air. Quittez l’écran à l’aide de l’icône ronde en X en haut à droite.

– Cliquez maintenant sur Save en haut de l’écran: donnez alors un nom au projet et une description.

– Cliquez sur Accept & Save.

Passons maintenant à l’étape suivante: la définition des règles et comportements.

 

 

Etape 4/8: Contrôle du vaisseau

Dans un premier temps, nous allons définir le comportement du héros, autrement dit comment le joueur contrôle le vaisseau.

1- Retournez dans l’écran Actors

2- Dans la barre d’outils, cliquez sur le vaisseau

3- Cliquez ensuite sur Behaviors (Comportements)

4- Vous pouvez utiliser des comportements prédéfinis (à l’aide du menu déroulant “Shortcuts”) ou définir un nouveau comportement (ce que nous allons faire ici).

5- Cliquez sur Motion

6- Cliquez sur Event

7- Cliquez sur Keyboard

8- Cliquez sur la touche “Curseur vers la gauche”, puis fermez la fenêtre à l’aide de l’icône ronde en X

9- Cliquez sur l’icône Motion à droite de “Filter”

10- Cliquez sur W (West), après avoir vérifié que Move (Déplacement) est sélectionné

11- Cliquez sur While Receiving Event (Pendant la réception de l’événement) pour indiquer que le déplacement du vaisseau ne se fait que lorsque la touche est appuyée

12- Fermez la fenêtre à l’aide de l’icône ronde en X

13- Répétez les opérations 5 à 12 pour programmer cette fois le déplacement vers la droite en choisissant la touche “Curseur vers la droite” à l’étape 8 et la direction E à l’étape 10.

Le pilotage du vaisseau est maintenant terminé. On peut passer aux ennemis…

Etape 5/6: Animation des ennemis

Attaquons maintenant l’animation des ennemis. Nous allons les faire aller de droite à gauche puis de gauche à droite et ainsi de suite.

– Retournez dans l’écran Actors

– Sélectionnez Duckie dans la barre d’outils

– Cliquez sur Behaviors

– Cliquez sur Motion

– Cliquez directement sur l’icône “Motion” dans la liste de comportement

– Sélectionnez la direction E

– Sélectionnez For Distance et saisissez le nombre de pixels de déplacement, ici 60 (mais vous pouvez utiliser une valeur plus grande qui fera alors sortir les canards de l’écran)

– Cochez la case “Reverse When Down” pour inverser l’animation à la fin de la première séquence

– Cochez “Repeat Forever” pour répéter l’animation indéfiniment

– Cliquez sur Preview pour vérifier l’animation

– Validez en fermant l’écran à l’aide de l’icône ronde X en haut à droite.

 

 

Etape 6/8: Gestion du tir

Il ne reste plus qu’à équiper notre vaisseau d’une arme laser…

– Revenez sur l’écran Actors

– Sélectionnez Cartoon Spaceship

– Cliquez sur Behaviors

– Cliquez sur Shoot

– Cliquez sur Event

– Cliquez sur Keyboard

– Cliquez sur l’icône Press (pour éviter les répétitions si la touche est maintenue enfoncée)

– Sélectionnez la Barre d’espace, puis cliquez sur l’icône de fermeture (X)

– Cliquez sur l’icône Projectile dans la séquence d’évènements

– Sélectionnez la balle de Baseball et validez en cliquant sur l’icône de fermeture (X)

– Cliquez sur Motion dans la séquence d’évènements

– Sélectionnez Move puis sélectionnez la direction Forward

– Dans la section “Relative To” cliquez sur Scene

– Validez en cliquant sur l’icône de fermeture (X)

– Cliquez sur Sound, saisissez Laser dans le champ de saisie, sélectionnez le premier son et fermez à l’aide de l’icône (X)

Remarque:
Dans notre exemple, il n’y a pas à programmer la suppression de l’ennemi touché, car le mode “Shoot” utilise des objets “Projectiles” qui sont déjà pré-programmés pour entraîner la suppression de l’objet touché. Mais PopFly permet aussi d’utiliser d’autres objets et de définir – au travers des multiples Behaviors – s’ils doivent ou non disparaître.

 

 

Etape 7/8 : Fin du jeu

Nous allons faire en sorte que, lorsque tous les ennemis sont détruits, un nouvel écran s’affiche. Cela nous permettra de vous montrer comment enchaîner les scènes, une fonction essentielle pour un jeu à multiples niveaux ou un jeu d’aventure par exemple.

– Cliquez sur Scenes dans la barre d’outils

– Sélectionnez Main dans la barre d’outils

– Sélectionnez Behaviors (comme vous le constatez, il n’y a pas que les acteurs sur lesquels on peut appliquer des comportements)

– Cliquez sur Scene

– Cliquez sur Event

– Cliquez sur Property Change

– Cliquez sur l’icône Game

– Sélectionnez “A Scene” puis sélectionnez Main. Validez votre choix en fermant l’écran par l’icône (X)

– Vérifiez que le menu Property est bien sur “# of Duckies” (nombre de canards) puis remplacez “change to any value” par “=” et saisissez 0 (zéro). Ce qui revient à expliquer à PopFly que l’événement doit être déclenché quand le nombre de canards passe à zéro (il n’y a alors plus d’ennemis).

– Validez votre choix en fermant l’écran par l’icône (X)

– Cliquez sur Scene et sélectionnez “WON” (Victoire!)

Voilà. A ce stade, nous avons fini le squelette de notre jeu… L’étape suivante discute de points d’améliorations à envisager.

 

Etape 8/8 : Améliorations et finalisation

Il n’y a plus qu’à sauvegarder votre jeu en cliquant sur le bouton Save puis à l’essayer en cliquant sur le bouton PLAY.

Il y a peu de chances que le résultat soit satisfaisant du premier coup. .. Vous devrez probablement ajuster les paramètres de vélocité et d’accélération du vaisseau et des projectiles.

Et vous aurez sans doute envie d’améliorer le jeu sur différents points:

– Empêcher le vaisseau de quitter l’écran
– Gérer les contre-attaques ennemies en permettant aux ennemis de lancer des projectiles
– Gérer le nombre de vies de votre vaisseau
– Gérer le changement de scène vers “LOST” lorsque vous perdez
– Gérer les scores
– Ajouter des sons d’explosion
– Créer de multiples niveaux
– Rajouter des bonus apparaissant aléatoirement à l’écran…

Une fois le jeu finalisé, utilisez le bouton SHARE pour le diffuser au plus grand nombre!

 

🔴 Pour ne manquer aucune actualité de 01net, suivez-nous sur Google Actualités et WhatsApp.


Duval Loic