Auteur/autrice : Patrick Gelinaud

Qu’est-ce qu’un fond d’écran répété ?

Imaginez que vous avez une petite image carrée ou rectangulaire. Au lieu de créer une grande image pour couvrir tout l’écran, tu peux simplement répéter cette petite image plusieurs fois pour remplir l’espace. C’est ce qu’on appelle un fond d’écran répété.

Positionne sur le Calque Fond :

Sur la scène clic avec le bouton droit et demande « Insérer un nouvel objet » puis choisir Arrière plan répété.

Choisir par la croix sur le coin gauche haut de la grille :

Dans l’éditeur de dessin choisir la taille de l’image :

Puis choisis une couleur puis dessine le fond répété avec l’outil Rectangle:

Quitte l’éditeur de dessin par la croix de la fenêtre Windows :

Utilise les ancres de la figure pour étendre l’écran répété sur toute ta scène :

Vérifie les propriétés du fond répété dans la partie gauche de l’écran :

• modifie le nom éventuellement
• vérifie l’emplacement 0x0
• vérifie qu’il appartient bien au calque Fond
• joue sur l’opacité

Dans le prochain TUTO, tu apprends à dessiner les plateformes.

Sélectionne le calque joueur :

Puis rend transparent ce calque :

Puis sélectionne le calque Fond du niveau 1

Puis demande sur l’onglet Niveau 1 par le clic droit de ta souris d’Insérer un nouvel objet :

Puis clic sur l’objet « Tuilage »

Choisis l’emplacement par la croix, dans l’éditeur grahique tu demandes à charger ton image par cette icone haut de l’écran :

Quitte l’éditeur par la croix de la fenêtre Windows :

Clic sur l’onglet Tuilage pour obtenir l’outil de dessin de tes plateformes :

Dans les propriétés de l’objet Tuilage, partie gauche de l’écran, modifie le nom, vérifie l’emplacement à 0 x0, qu’il appartient bien au calque Fond et modifie l’élévation Z pour être au dessus du fond répété :

Maintenant avec l’outil de dessin tu dessines tes plateformes :

Utilise ces outils pour sélectionner, dessiner, gommer, peindre des parties entières :

Puis donne un comportement à tes plateformes qui devront recevoir ton joueur :

Choisis le comportement Saut-à-travers:

Ajout du joueur

Avant tu vas bloquer le calque de Fond avec le cadenas pour éviter de le modifier puis tu sélectionnes le calque Joueur.

Sur la scène, clic le bouton droit de la souris et choisis Insérer un nouvel objet :

Choisis Sprite puis choisis l’endroit où tu souhaites que le joueur apparaisse avec la croix.

Dessine un personnage simple :

Zones de collision et point d’image

Vérifie les zones de collision de chaque image :

Puis fixe le point d’image en bas au milieu de ton personnage :

Maintenant, tu peux quitter l’éditeur graphique.

Comportement du joueur

Tu vas définir la position de ton joueur, sa taille et son comportement :

Si tu lances ton jeu, tu constates que ton joueur ne bouge pas

Rajoute un comportement à ton joueur pour qu’il puisse sauter de plateforme en plateforme :

Lance de nouveau le jeu et ton joueur a la capacité de sauté de plateforme en plateforme :

Par contre, tu constates que ton joueur sort de l’écran, tu vas rajouter un nouveau comportement pour que la caméra suive ton joueur :

Maintenant tu as ces deux comportements pour ton joueur :

Une dernière action, tu vas renommer ton Sprite en Joueur :

Puis vérifie que Joueur est bien sure le Calque Joueur :

N’oublie pas de sauvegarder ton jeu par Menu Projet Sauver ou par :

Pour définir les mouvements de ton joueur, tu dois être sur le calque joueur :

Ton joueur se déplace à droite, à gauche, saute ou chute. Mais tu constates que l’image de ton joueur ne se retourne quand il va vers la gauche de l’écran.

Tu vas récupérer les touches du clavier pour indiquer le sens de la marche.

Puis pour la première fois utilise la table de décision :

Ajoute un nouvel événement sur le clavier :

Puis choisis Lors de la pression d’une touche :

Puis appuie sur la touche de ton clavier pour indiquer la direction gauche :

Dans action tu vas inverser l’image :

Dans la paragraphe Apparence, tu choisis de Définir la symétrie horizontale :

Lance ton jeu, le joueur se retourne quand il va vers la gauche mais ne revient pas vers la droite quand il va à droite. Rajoute cette instruction :

Maintenant, tu vas traiter le cas du Joueur qui tombe en dehors de la scène vers le bas. tu rajoutes une nouvelle condition sur le joueur :

Dans le paragraphe Taille et position du Joueur, tu sélectionnes Est à l’extérieur de la scène :

Tu vas rajouter à la condition d’être en dehors de la scène le fait de sortir vers le bas de la scène : par le clic droit puis Ajouter puis Ajouter une autre condition :

Puis tu compares la position du joueur en y par rapport à la hauteur de la scène :

Si la position en y du joueur est plus grand que celle de la scène :

Pour trouver la valeur de la hauteur de la scène clic sur Trouver des expressions et cherche système puis HauteurScène :

On va rajouter une action pour redémarrer la scène :

Teste à nouveau ton programme :

Assure toi que sur ton joueur le paramètre global n’est pas coché :

Contrôle les mouvements de ton joueur par les propriétés des comportements plateforme :

Tu peux par exemple gérer la force du saut :

A toi de tester les différents comportements de ton joueur.

Création de l’image de la barre de vie

Sur la scène demande à insérer un nouvel Sprite :

Positionne la croix du sprite en bas de ta scène, puis dans l’éditeur crée un carré vert pour le fond de la barre d’énergie :

Puis redemande sur la scène à insérer un nouvel Sprite :

Quitte l’éditeur graphique et positionne la barre de vie sur ta scène :

Puis par le clic droit renomme les trois sprites de ta barre de vie :

Si tu lances ton jeu, ta barre de vie est bien en bas à gauche. Mais lorsque le joueur se déplace, elle ne reste pas visible à l’écran. Tu vas modifier son comportement pour qu’elle reste fixe à l’écran.

Pour chaque image, tu vas modifier leur comportement :

et choisir un comportement Ancre :

Si tu relances ton jeu, tu constates que la barre de vie reste fixe à l’écran.

Maintenant tu vas faire varier ta barre d’énergie en fonction des circonstances. Si le joueur touche des dangers, il perd de l’énergie, si il touche des bonus, il gagne de l’énergie :

Utilise le clic droit de ta souris sur la feuille d’événements niveau pour demander l’ajout d’une variable globale :

Crée la variable NbrVies avec une valeur de départ à 5 vies par exemple :

Maintenant chaque fois que le joueur tombe en dehors de la scène il perd une vie. Rajoute une action lorsque le joueur est à l’extérieur de la scène :

Choisis system puis suivant :

Puis descend dans l’arborescence jusqu’à Variables globales et choisis soustraire de :

Demande à soustraire 1 à NbrVies :

Tu obtiens ce résultat :

Puis sur ta scène insère un nouvel objet de type Texte :

Modifie les caractéristiques de la zone texte :

Puis modifie la table des événement pour la zone texte soit modifiée par le nombre de vies restantes :

Fait suivre le nombre de vies restantes au dessus du joueur :

Atténue le nombre de vies en réduisant l’opacité :

Si tu fais tomber ton joueur, tu remarqueras que ta variable NbrVies change :

Maintenant on va associer la variable NbrVies à la barre de vie, ajoute un nouvel événement Système

Choisis ta barre pour modifier son aspect en fonction de NbrVies :

Tu vas modifier la largeur de la barre en fonction du nombre de vies :

Si on décide que l’on peut avoir 5 vies au maximum, utilise ce calcul pour gérer la jauge de tes vies :

Tu obtiens ce résultat :

Lance ton jeu et contrôle :

Textcraft est un site web en ligne qui permet de créer des logos et des éléments graphiques avec du texte. Il offre une variété d’options pour personnaliser l’apparence du texte, telles que des polices de caractères, des couleurs, des ombres, des textures, etc.
L’utilisation de Textcraft est simple et accessible, avec une interface en ligne intuitive. Il n’y a pas besoin de télécharger de logiciel ou de se rappeler de sauvegarder le travail, car tout est géré en ligne. Les utilisateurs peuvent télécharger leur création en plusieurs formats différents, y compris PNG, JPG et GIF, pour une utilisation dans des projets en ligne ou hors ligne.
Textcraft est gratuit et facile à utiliser, avec des options pour la personnalisation et l’exportation de la création finie.

Pour utiliser TEXTCRAFT : https://textcraft.net/

Saisie un texte puis appuie sur le bouton create :

Ton texte est affiché.

Tu peux modifier la police de caractères et les propriétés :

A toi de jouer avec l’outil pour trouver le meilleur écran Game Over !!!

Quand tu as terminé la conception de ton écran, tu vas le télécharger pour l’utiliser dans ton jeu :

Dans construct, demande la création d’une nouvelle scène par un clic droit sur Scènes dans la fenêtre Projet :

Nomme la nouvelle scène GAME OVER et la feuille d’événements :

Sur la nouvelle scène, demande à Insérer un nouvel objet par le clic droit de ta souris :

Choisis l’objet Sprite :

Positionne en utilisant la croix, puis charge ton image dans l’éditeur graphique :

Puis agrandis et positionne ton image dans la scène en tenant compte des dimensions de l’écran, représentées par les pointillés.

Pour la scène GAME OVER choisis la feuille d’événement de ton projet :

Et pour ton projet choisis la scène initiale :

Puis rajoute dans ta table d’évènements cette condition :

Tu vas rajouter un bouton sur ton écran GAME OVER pour proposer à rejouer :

Dans TEXTCRAFT dessine deux boutons REJOUER un bouton en attente d’un appui et un autre appuyer :

Sur la nouvelle scène, demande à Insérer un nouveau sprite par le clic droit de ta souris :

Crée deux animations sur ton image.

Une animation attendre

Une animation appuyer

Renomme le bouton et change le texte du bouton :

Puis dans la table d’événements Game Over programme le fonctionnement du bouton :

Sur l’onglet calques sélectionne Claque Joueur :

Puis sur ton niveau demande par le clic droit de ta souris à Insérer un nouvel objet Sprite :

Choisis avec la croix l’endroit où tu souhaites positionner la plateforme, puis dans l’éditeur graphique dessine ta plateforme. Utilise l’outil rectangle, la palette des couleurs et ajuster la taille de l’image :

Quand tu as terminé ton dessin, redimensionne l’image avec cet outil :

Vérifie le point d’image et le pourtour de collision :

Le point d’image doit être au milieu de l’image.

Les points de collision doivent entourer la plateforme.

Tu peux régler la taille de la plateforme dans ton jeu :

Renomme le nom du Sprite :

Choisis un comportement Saut à travers pour ta plateforme mobile !

Si tu testes ton jeu, ton joueur peut sauter sur ta plateforme :

Maintenant, tu vas rajouter un nouveau comportement Sinus pour que ta plateforme devienne mobile :

Tu peux jouer avec tous les paramètres du comportement sinus pour rajouter des plateformes mobiles avec des comportements différents :

Avec le clic droit demande à cloner ta plateforme mobile :

Sélectionne l’objet PlateFormeMobile puis tire avec la souris pour le positionner à nouveau sur ton niveau de jeu. Puis choisis pour cette nouvelle plateforme des paramètres différents pour son comportement sinus.

Comment créer des jetons à récupérer par le joueur. L’objectif est de créer des jetons à des emplacements aléatoires que le joueur tentera de récupérer.

Pour commencer, sélectionne le Calque joueur :

Sur la scène demande à Insérer un nouvel objet :

Puis choisir l’objet SPRITE :

Insère par la croix en dehors de la scène ton jeton, puis recherche des images pour ton jeton, par exemple :

Ton jeton est créé mais il est unique et non visible du joueur. Maintenant par la feuille d’événements, tu vas créer aléatoirement sur la scène plusieurs jetons à attraper :

Tu déclenches une fois 10 fois la création d’un jeton :

Tu peux également choisir de déclencher la création des jetons au bout d’un certain temps :

Maintenant tu vas générer la création des 10 jetons à des emplacements aléatoires :

Tu peux fixer l’espace dans lequel les jetons vont se générer par l’instruction random sur x et y :

Tu peux également fixer l’espace de génération en fonction de la taille de la scène :

Maintenant tu peux gérer la collision entre le jeton et le joueur :

A l’approche du joueur la porte s’ouvre et se referme dès que le joueur s’éloigne :

Tu te positionnes sur le calque Joueur :

Clic droit sur la souris pour demander Insérer un nouvel objet :

Crée des images de portes fermées et ouvertes, où choisis dans :

Sur ce sprite, crée deux animations : open et close :

Tu vas redéfinir la zone de collision pour quelle soit la plus grande que possible et même dépasse la largeur de la porte. La largeur de la zone de collision permet le déclenchement automatique de l’ouverture de la porte.

Puis applique ta nouvelle boite de collision à toutes les animations de la porte.

Tu peux agrandir la zone de collision en agrandissant la taille de ton image :

Redemande à redéfinir la zone de collision en fonction de la nouvelle taille de ton image :

Pense à renommer ton sprite :

Maintenant dans ta feuille d’événements rajoute les instructions suivantes pour gérer l’ouverture de la porte en fonction de la proximité du joueur :

Sur ta scène rajoute l’objet AUDIO :

L’objet Audio est rajouté dans ton projet :

Rajoute un son dans ton projet par exemple un son de saut :

Par le clic droit demande à importer un son

Rajoute le son lorsque le joueur saute dans la table d’évènements des niveaux :