Guide – Mettre un personnage sur le côté dans la boite de dialogue

Vous pouvez, si vous le souhaitez, faire apparaître votre personnage dans votre boîte de dialogue, comme ceci :

Exemple_eside

 

 

1. Préparer votre image

Rogner et redimensionner votre image pour qu’elle ne soit pas trop grosse (dans l’exemple ci-dessus, elle est en 200 x 189 px).

Mettre ensuite votre image dans votre dossier game.

2. Déclarer l’image

Le code pour une image sur le côté est eside. Voici quoi mettre, dans votre script, avant label start :

code_eside

 

 

init:
$ eside = Character(‘Anna’,
color= »#c8ffc8",
window_left_padding=160,
show_side_image=Image(« Anna_e.png », xalign=0.0, yalign=0.99), show_two_window=False )

 

 

 

Anna est ici le nom du personnage que vous pouvez bien sûr changer. Les lettres et chiffres après color indiquent en quelle couleur va apparaître son nom. Après Image, mettre le nom de votre propre image (ici, c’est Anna_e.png).

Si vous voulez que son nom apparaisse au-dessus de la boîte de dialogue plutôt que dedans, remplacer, après show_two_window, false par true.

fenetre_eside

Si vous voulez mettre votre propre boîte de dialogue, vous le pouvez (par exemple, ci-dessous, c’est BrownBox.png) :

frame_eside

 

 

3. Faire parler le personnage

 

Pour faire parler votre personnage, il suffit d’utiliser eside :

parle_eside

Advertisements

Guide – Intégrer le nom du joueur au jeu

Si vous voulez demander et exploiter le nom du joueur, voici comment faire.

1. Déclarer ce personnage

Avant le label start, écrire ce code :

povname1

init:
$ povname = «  »

$ pov = DynamicCharacter(« povname », color=(192, 64, 64, 255),show_two_window=True )

Ici, vous pouvez changer la couleur dans laquelle apparaîtra le nom en changeant les chiffres après color, mettre False si vous voulez que le nom du joueur soit intégré dans la boîte de dialogue et non au-dessus.

2. Demander le nom du joueur

Voici comment demander le nom au joueur :

povname2
if not renpy.variant(‘touch’):

$ povname = renpy.input(« Et toi? Comment t’appelles-tu? Mon nom est : « )

Vous pouvez bien sûr changer le texte entre parenthèses.

3. Utiliser le nom du joueur

Utiliser pov pour mettre le nom du joueur comme s’il parlait et  %(povname)s pour utiliser le nom du joueur à l’intérieur d’un dialogue. Par exemple :

povname3

pov « Je m’appelle %(povname)s. »

Cours 3 : Mettre des images dans Ren’Py

Dans cet article, nous allons apprendre comment mettre des images dans le jeu (images de fond et de personnages). Pour trouver des images sur internet, voir notre article : Trouver des images.

1. Bases

Les images sont comptées en pixels (px) plutôt qu’en cm ou autre système de mesure. Un pixel est un carré de couleur comme on peut le voir ici :

Image où les pixels sont importantes (Source : Wikimedia commons, de Nickpick910)

Image où les pixels sont importantes (Source : Wikimedia commons, de Nickpick910)

Par défaut l’écran de Ren’Py est de 800×600 px. Si vous mettez une image trop grande vous ne la verrez pas en entier, si vous mettez une image trop petite, elle ne remplira pas tout l’écran :

Image trop petite pour Ren'Py

Image trop petite pour Ren’Py

Vos images de fond doivent donc faire 800 x 600 px (pixels) et les personnages environ 250 à 400 px de largeur et 250 à 500 px de hauteur suivant la corpulence de votre personnage.

Important : Les images peuvent avoir différents formats (un format, c’est ce que vous trouvez après le nom de votre image ou de votre fichier, par exemple le format de Power Point est ppt ou pptx). Seules les images en format png et jpg sont acceptées dans Ren’Py !

De plus, quand vous nommez votre image, je vous conseille de mettre ni d’espace, ni de signe de ponctuation, ni d’accent dans son nom. Par exemple  ne nommez pas votre image Joséphine contente ! mais josephine_contente

Il est important que les personnages que vous mettez dans le jeu soient dégagés de leur fond originel. Par exemple, dans l’image ci-dessous, le personnage de gauche a été bien préparé, bien découpé, alors que celui de droite a encore son fond blanc originel.

Source : Images de Wikimedia Commons
Source : Images de Wikimedia Commons

Dans un jeu Ren’py, il peut être très pertinent d’avoir un même personnage avec différentes expressions. Par exemple, si le joueur réussit une épreuve le personnage affichera un sourire et si le joueur échoue, le personnage semblera triste :

Vous pouvez utiliser ce personnage ainsi que celle de Mathieu directement dans votre jeu Ren’Py (ces images sont prêtes, bien découpées et aux bonnes dimensions), elles sont disponibles pour vous  dans cet article et d’autres se trouve également dans celui-ci.

Pour vos jeux, vous pouvez utiliser des dessins papiers que vous scannerez ensuite (ou photographierez) , faire des photos ou faire des dessins à l’ordinateur ou sur votre tablette, ou bien encore choisir des images sur internet libres de droits.

Pour savoir comment créer vos propres images ou les modifier (comme redimensionner, enlever le fond blanc ou changer l’expression d’un personnage), vous pouvez consulter notre article : Créer et modifier des images.

Vous trouverez beaucoup d’images utilisables (gratuitement et légalement) sur Wikimedia Commons.

2. Mettre vos images dans le jeu

La première chose à faire, une fois vos images prêtes et aux bonnes dimensions, est de les mettre dans votre dossier de jeu. Pour cela, ouvrez Ren’Py, sélectionnez votre jeu et cliquez sur game (dans Open Directory) :

Cliquer sur game permet de tomber directement dans le dossier du jeu.

Cliquer sur game permet de tomber directement dans le dossier où mettre les images.

Cela vous permettra de tomber directement dans le dossier du jeu où mettre les images, mais vous pouvez aussi y accéder de manière conventionnelle en cliquant sur celui-ci, puis cliquez dans game.

Vous pouvez ensuite y mettre toutes les images que vous voulez utiliser (copier-coller). Certains préfèrent, avant cela, créer un dossier « Images » à cet endroit (puis mettre les images dans le dossier). Vous pouvez faire l’un ou l’autre.

Une fois vos images mises dans le dossier du jeu, vous pouvez les utiliser.

3. Indiquer les images à utiliser dans le jeu

Entrez dans le script (script.rpy) de votre jeu. De la même manière dont vous avez défini vos personnages, il va falloir définir vos images.

Par défaut, un exemple est donné dans votre script aux lignes 3 et 4 :

ligne4

Ce symbole # fait en sorte que la ligne de code ne soit pas prise en compte par le jeu, on s’en sert souvent pour faire des commentaires ou montrer des exemples.

Que signifie cette ligne ? image eileen happy = « eileen_happy.png »

image pour dire que l’on parle d’une image, eileen happy est le nom choisi pour son utilisation dans le jeu et eileen_happy.png est son nom de fichier.

Admettons que vous avez fait une image de personnage qui a pour nom sophie_contente.png (attention ne mettez ni d’accent, ni d’espace, ni de signe de ponctuation dans vos noms d’images; vérifiez aussi qu’elles sont bien en png ou jpg), vous pourriez écrire la ligne de code suivante:

image sophie contente = « sophie_contente.png »

Vous n’êtes pas obligée que ce soit le même nom d’un côté du signe égal que de l’autre, mais il faut que le nom de l’image donné à gauche soit le plus simple et précis possible pour ensuite vous y retrouver. Si par exemple, vous avez une image qui s’appelle classroom_68867999.png, vous pourriez écrire :

image salle classe = « classroom_68867999.png »

Définissez toutes vos images de la même manière (que ce soit des images de fond ou de personnages n’a pas ici d’importance).

Par exemple, images utilisées dans le jeu The Question :

images_question

Si vous avez mis vos images dans un dossier, il faut indiquer au programme d’aller chercher l’image dans le dossier voulu. Par exemple, si le nom de ce dossier est images et que vous avez mis l’image « sylvie_normale.png » dans ce dossier, la ligne de code sera :

image sylvie normale = « images/sylvie_normale.png »

De manière logique si vous avez fait des sous-dossiers (par exemple mis l’image dans un dossier personnages dans le dossier images), cela donnerait :

image sylvie normale = « images/personnages/sylvie_normale.png »

et ainsi de suite…

4. Utiliser vos images dans le jeu

Dans la programmation vous ne ferez pas appel, de la même manière, à des images de fond et des images de personnages.

Pour faire apparaître une image de fond la commande est scene et pour un personnage, c’est show.

Admettons que vous ayez deux images de fond : salle classe et cour recreation (que vous avez défini come indiqué dans la section précédente). Pour faire appel à la première image de fond, écrivez scene classe puis continuez votre histoire. Ensuite quand vous voulez changer votre image de fond pour l’autre, il suffit d’appeler la nouvelle image de fond donc scene recreation qui remplacera automatiquement la première.

scene

Comme d’habitude, faîtes attention que tout soit bien aligné (si vos couleurs de mots ne sont pas les mêmes que dans l’exemple, c’est qu’il y a une erreur).

Admettons que vous avez deux images de  personnages : sophie contente et mathieu content.

Pour faire appel à la première image, ce sera : show sophie contente

La différence ici avec une image de fond, c’est que vous devez enlever ensuite cette image pour en mettre une nouvelle, sinon elles vont se superposer comme ceci :

superposition

Pour éviter cela, il faut cacher le premier personnage avec la commande hide avant de mettre la deuxième.  Par exemple :

hide

5. Mettre les personnages à droite ou à gauche

Pour mettre un personnage à droite il suffit de mettre at right après le show de l’image, pour la mettre à gauche c’est at left. Par exemple :

code_deux_personnages

Ce qui donnera :

deux_personnages

Voilà, vous savez maintenant mettre des images dans votre jeu !

Pour savoir comment mettre des images dans vos choix, voir l’article : Cours 2 – Proposer des choix au joueur.

Images – Images de personnages pour vos essais ou vos histoires (2)

Voici des personnages de JNavigue de la Cour d’école (jnavigue.org) que vous pouvez utiliser dans vos jeux Ren’Py. Dessins de Laurent Cloiseau.

Si vous utilisez ces images telles quelles ou de manière modifiée, merci d’indiquer « Images de JNavigue (jnavigue.org) dans votre générique de jeu ».

Anna (images prêtes pour Ren’Py)

Capitaine Atlas (à redimensionner)

Flo (à redimensionner)

Hardi (à redimensionner)

Images – Images de personnages pour vos essais ou vos histoires

Catherine Digras-Dunberry nous offre ses dessins de personnages que vous pouvez utiliser dans Ren’Py que ce soit pour faire des essais ou pour illuster vos histoires. Ces personnages sont déjà à la bonne taille et directement utilisables dans le logiciel. Il s’agit d’une fille (Sophie) et d’un garçon (Mathieu), tous deux arborant différentes expressions.

Vous retrouverez une vidéo avec le jeu d’origine qui utilisait ces images dans l’article de présentation du blogue.

Pour enregistrer une image à la bonne taille cliquez dessus (pour l’ouvrir) puis sur Enregistrer l’image sous…  Vous pouvez aussi l’enregistrer directement à partir de cette page en utilisant Enregistrer le lien sous… 

Sophie

Sophie et sa fleur

Fleur seule

Mathieu

Guide – Créer et modifier des images

Avant de voir comment mettre des images dans Ren’Py, il peut être intéressant de savoir comment créer et modifier des images.

Vous pouvez aussi utiliser des images de personnages mises sur ce blogue :  Images – Images de personnages pour vos essais ou vos histoiresImages – Images de personnages pour vos essais ou vos histoires (2) ou en trouver sur internet.

Pour créer des images vous pouvez soit 1. scanner des dessins ou faire des photos, 2. dessiner sur votre ordinateur (par exemple avec Gimp). Vous pouvez aussi modifier des images que vous trouvez ou corriger les vôtres avec Gimp.

Ces guides peuvent être imprimés et utilisés légalement. ils ont été écrits par deux de mes étudiantes en 2012.

1. Scanner des dessins ou utiliser des photos numériques
  • Scanner des dessins : tutoriel_scanneur (de Catherine Bigras-Dunberry)
  • Prendre des dessins en photos et/ou importer des photos d’un appareil photo numérique à l’ordinateur : tutoriel_appareil_photo (de Catherine Bigras-Dunberry)
2. Créer des images sur votre ordinateur

Pour cela, nous utilisons Gimp qui est un logiciel libre et gratuit que l’on peut télécharger légalement sur le site de clubic.

3. Modifier des images avec Gimp
  • Modifier des images avec Gimp (guide pour les enfants) : Guide- Enfants (de Martine Bélanger)
  • Modifier des images avec Gimp (guide pour les adultes) : Guide- Adultes (de Martine Bélanger)

Cours 1 – Créer un jeu, des personnages, mettre du texte

Voici comment : 1. Créer votre premier jeu, 2. y mettre vos personnages et 3. du texte.

1. Créer votre premier jeu

Une fois Ren’Py installé (voir Guide -Installation de Ren’Py si ce n’est pas encore fait), vous pouvez créer votre premier jeu.

Pour cela, ouvrez Ren’Py (double-clique sur le dossier jaune renpy-6.14.1-sdk, puis sur renpy avec l’icône de la fillette renpy4).

Cliquez ensuite sur Create New Project, choisissez où vous voulez mettre votre jeu. Si Ren’Py est sur votre bureau, cliquez sur le dossier renpy-6.14.1-sdk, puis sur OK. S’il est sur votre clé USB, cliquez sur votre clé USB, puis sur le dossier  renpy-6.14.1-sdk,puis  sur OK. Il est important que votre jeu soit bien dans le dossier renpy-6.14.1-sdk pour qu’il fonctionne. Écrivez ensuite le titre de votre jeu.

Create_New_Project____________________________________________________________________________

Erreur possible

Si vous vous trompez, il faudra déplacer le dossier intitulé comme votre jeu dans le dossier renpy-6.14.1-sdk et aussi changer les préférence de votre jeu (en bas, à droite) :

preference1

Puis ensuite, changer le dossier où mettre votre jeu pour le mettre dans  renpy-6.14.1-sdk :

preference2____________________________________________________________________________

Vous pouvez ensuite choisir votre thème et les couleurs de votre jeu. Choisissez ce qui vous plaît, puis cliquez sur Continue.

Theme

Vous allez alors voir apparaître votre titre de jeu dans les projets. Deux liens sont alors importants dans cette interface : script.rpy (dans Edit File) qui va vous permettre de modifier votre jeu et Launch Project qui va vous permettre de voir votre jeu an même titre qu’un joueur.

Lançons le jeu avec Launch Project pour voir ce que cela donne.

____________________________________________________________________________

Erreur possible

Si vous voyez apparaître une fenêtre d’erreur où est indiqué Exception: DirectSoundCreate: No audio device Found, c’est que tout simplement le logiciel n’a pas détecté de système de sons sur votre ordinateur, il suffit alors de brancher des enceintes ou des écouteurs sur votre ordinateur.

Pas_sons____________________________________________________________________________

Pour démarrer votre jeu, il suffit de cliquer sur Start Game. Vous voyez qu’il y a déjà des choses écrites, nous allons par la suite l’enlever. Pour quitter votre jeu, cliquer sur Quit.

Si vous voulez changer l’apparence de votre thème vous le pouvez toujours en cliquant sur Change Theme dans Navigate Script.

change_theme

Nous allons maintenant modifier votre jeu pour y mettre vos personnages.

2. Mettre vos personnages

Dans Edit File, cliquez sur script.rpy, puis sur Editra. Laissez le logiciel se mettre à jour (Downloading the update) s’il se met en route puis cliquez sur Proceed, en bas, à droite.

Editra UpdateProceed

script.rpy

Vous voici devant la page de programmation (script). Par défaut un personnage est créé : Eileen. Nous allons remplacer ce personnage pour mettre les vôtres.

Voici ce qu’il faut comprendre. Au début du script, on indique nos personnages, en gros, de cette façon lettre du personnage = nom du personnage, par exemple j = Julie. Ainsi, à chaque fois que je voudrais utiliser Julie dans le jeu, je n’aurai pas à écrire tout son prénom mais juste la lettre j.

Regardez à la ligne 7 :

ligne_7

Que signifie cette ligne ? define que l’on est en train de définir un personnage. e, c’est la lettre de ce personnage (Eileen). Character veut dire personnage en anglais. Eileen est le prénom du personnage et color= »#c8ffc8" est la couleur utilisée pour le nom du personnage. Vous pouvez changer cette couleur si vous voulez (changer alors c8ffc8 par le code couleur de votre choix. Vous pouvez trouver ici une liste de code couleurs.), mais ce n’est pas obligatoire.

Donc pour mettre votre personnage, écrire son nom à la place d’Eileen et la lettre le représentant (je vous conseille la première lettre de son nom) à la place du e. Utilisez pour cela toujours une lettre minuscule. Par exemple, si votre personnage s’appelle Julie :

julie

Remarquez les couleurs, define est marron-orange, le prénom est en vert, color est en bleu. Dans tous les codes donnés, si vos couleurs sont différentes de celles montrées, c’est qu’il y a une erreur à corriger quelque part. Par exemple, vous avez effacé un apostrophe (dans ce cas remettez-le), les espaces doivent toujours également être respectés.

Pour ajouter un nouveau personnage, il suffit de copier-coller la ligne 7, de la mettre en ligne 8 et de modifier. Par exemple, si on crée un personnage narrateur cela donnerait :

narrateur

Évitez d’utiliser une même lettre pour deux personnages différents. Si par exemple, vous avez une Julie et une Jasmine, prenez  j pour Julie et ja pour Jasmine. S’il vous manque de la place pour faire tous vos personnages, il suffit de taper sur Entrée (Return) pour créer une nouvelle ligne de code.

Créez tous vos personnages, puis sauvegardez. Pour cela cliquez sur le sorte de disque dur avec une flèche en haut à gauche : sauvegarder

3. Écrire votre histoire

À présent que tous vos personnages sont créés vous allez les faire parler et vous allez voir que c’est extrêmement simple !

Le jeu vous en donne un exemple par défaut, toujours avec Eileen (représentée par un e) :

texte_Eileen

Qu’est-ce que cela signifie ? La lettre en noir représente le personnage qui parle. Ce qu’il y a entre guillemets, c’est ce que dit le personnage. Et c’est tout ! C’est aussi simple que cela !

label start, c’était juste pour dire que le jeu commence ici, n’y touchez pas et vous n’aurez plus besoin de le réécrire. Respectez bien les espaces, toutes les lignes de texte doivent être alignées.

Remplacez le texte par le vôtre. Par exemple, en gardant le personnage de Julie (j) :

texte_julie

Si votre texte n’est pas en vert, c’est que vous avez dû effacer des guillemets quelque part…

Si vous voulez créer un personnage sans y mettre son nom, par exemple pour le narrateur ou pour un personnage dont le héros ignore le nom, il suffit de ne pas mettre de lettre devant les guillemets, par exemple :

narrateur2

Après avoir tapé quelques lignes, faîtes un test de votre jeu. Pour cela :

1. Sauvegarder avec sauvegarder

2. Fermer votre script ou réduisez-le. Puis cliquez sur Launch Project. Votre jeu fonctionne ? Félicitations !

____________________________________________________________________________

Erreur possible

Votre jeu indique une erreur ? Regardez à quelle ligne est cette erreur (par exemple ici, c’est à la ligne 16) :

line_16

Vérifier alors la ligne indiquée (ici 16) ou celle juste avant. Ici, par exemple, j’avais mis un espace de trop. Ce qui était indiqué dans ce rapport d’erreur par une flèche rouge. Donc non seulement le logiciel vous indique où se trouve l’erreur, mais aussi quel type d’erreur est-ce. Corriger votre erreur (s’il y en a et sauvegarder, puis lancer votre jeu).

____________________________________________________________________________

Bravo, vous avez complètement créé le texte de votre jeu. ! Mais peut-être que vous aimeriez ajouter dans ce texte la possibilité, pour le joueur, de faire des choix pour créer des suites, des fins alternatives ou simplement des quiz, ce qui est la plus belle possibilité de Ren’Py. ? Nous vous expliquons dans le cours 2 comment faire.