Tag: clinamen

Clinamen #16 : combiner ImageMap et ConditionSwitch

Wouh, ça faisait longtemps qu’il n’y avait pas eu de news sur Clinamen ! Et pour cause, un projet secret me prend du temps (en plus de mon taf’, mais ça, c’est accessoire).

Et pour le retour du blog, le titre vend la mèche : on est partis pour un billet plus technique que d’habitude.

La dernière fois, je vous disais donc avoir découvert les ImageMaps, une image avec plusieurs zones interactives. J’avais utilisé cet outil pour créer des scènes où le joueur pouvait choisir d’examiner telle ou telle chose en cliquant dessus (plutôt qu’avec un menu constitué d’options telles que “Examiner le lit”, “Examiner l’ordinateur”… comme c’était le cas avant)

J’avais d’autres scènes du genre à créer et du coup je me disais que ça allait être du gâteau ! Je connaissais l’outil, ne restait plus qu’à “exécuter”.

 Et en une heure de travail cet écran sera prêt !” (me disais-je naïvement en début de soirée)

Bon, vous vous doutez, ça ne s’est pas exactement déroulé comme ça.

Mon but était de créer une image avec 3 boutons. Chaque bouton devait permettre de déclencher une action. Nickel, l’ImageMap est parfaite pour ça. Sauf que je voulais aussi que le visuel du bouton change en fonction de si le joueur a activé ou non ce bouton. J’ai vu passer des options “selected” dans l’imagemap qui auraient pu correspondre à ce que je souhaitais, sauf que je voulais que cet état soit mémorisé d’une scène à l’autre (ex : le joueur appuie sur un bouton, part dans une autre salle, revient sur les boutons), et que je ne pensais pas que cette option permettait de le faire (je me trompe peut-être ?)

 

Du coup j’ai fait appel à des ConditionSwitch, autrement dit des “interrupteurs conditionnels”, autrement dit (dans mon cas) une image qui change en fonction d’une variable enregistrée dans le jeu (la variable dans le cas présent est de savoir si oui ou non le bouton 1, 2 ou 3… est activé)

Je me suis donc attelée à une formidable bidouille qui ferait sûrement saigner les yeux de tout codeur qui se respecte. J’ai superposé deux choses :

– une ImageMap : elle permet au joueur de cliquer sur les boutons et d’être envoyé sur une autre scène. Elle permet aussi aux boutons de “briller” quand le joueur passe la souris dessus.

Voic l’image qui sert de “base” à l’ImageMap (ground)

Et l’image qui s’active lorsque le joueur passe sa souris sur un bouton

– les ConditionSwitch : ils sont au nombre de 3 sur l’image, un pour chaque bouton. Si le bouton est activé alors c’est la face A du bouton qui est montrée, si le bouton n’est pas activé alors c’est la face B qui s’affiche.

Les images A et B pour chaque ConditionSwitch

 

Donc au final dans le jeu je configure une ImageMap, à laquelle je rajoute les 3 conditionswitch, un pour chaque bouton :

Le code de l’ImageMap…

… et le code des 3 boutons.

Et on arrive à ce résultat final fortement bricolé.

 

J’ai utilisé le même principe pour cet autre écran :

 

Prochain objectif : m’initier à un semblant d’animation (emphase sur le “semblant”) pour l’écran de game over et pour améliorer l’introduction du jeu ! Même si le projet secret dont je parlais en début de post aura la priorité sur mon temps, j’espère bien trouver quelques moments pour avancer.

 

 

 

Clinamen #15 : à la découverte des imagemaps

J’ai pu faire tester Clinamen à de nouveaux cobayes cette semaine et une chose qui m’a frappée a été le réflexe des joueurs à aller fouiner partout avec leur souris sur le décor, comme s’ils pouvaient aller sélectionner des zones, à la manière d’un point-and-click. A la base j’avais forcément prévu de faire ça comme ça (ça prend plus de temps que de coder 5 choix dans un menu…), mais c’était pas une mauvaise idée, surtout que ma navigation est lourdingue par moments (qui a envie de se taper un menu avec 5 choix dont 4 choix sont des “Examiner tel objet” ?). Et puis bon, je suis là pour découvrir, alors j’étais curieuse de mettre la main à la pâte, et d’améliorer la fluidité de l’expérience de jeu en même temps.

La découverte de la semaine a donc été de paramétrer ce qui s’appelle apparemment des imagemaps (ça réveille quelques souvenirs de html effectivement). Une imagemap, c’est quand on paramètre plusieurs zones au sein d’une image et que ces zones deviennent interactives (changement de visuel quand on passe la souris dessus, action particulière quand on clique dessus, etc).

Voilà à quoi ça ressemble mais c’est pas très intéressant, et un connaisseur de RenPy/Python criera probablement en voyant mon bricolage et mes redites inutiles

Comme un gif vaut mieux qu’un grand discours, voici les résultats :

 

Au passage, j’aurai aussi appris comment faire des .gif

Inconvénient de la chose qui m’a obligée à retoucher mes visuels / truander de manière peu subtile, c’est que les hotspots (les zones sensibles définies au sein de l’image) sont forcément rectangulaires. Du coup j’ai du changer le visuel de l’ordinateur d’Ester pour que les boutons puissent se caser dans des zones rectangulaires. Et étrangement, dans la cabine à explorer, seuls une partie du bureau et de l’ordinateur s’illuminent au passage de la souris… car sinon les hotspots s’entrecroisent, ce qui n’est pas jouable non plus.

Je ne sais pas si c’est une limitation inhérente à  Ren’Py ou si c’est juste moi qui suis une quiche qui ne va pas plus loin que les imagemaps, mais j’en reste là pour l’instant. Et j’en suis pas mécontente, c’est clair que ça rend le tout plus intuitif / fluide :

Sinon, sur le front de la productivité, j’ai clairement un gain ces derniers temps. Le fait d’avoir (quasi) fini les visuels du jour 1 me permet de voir l’horizon de la fin de la première partie du jeu et ça booste. J’ai encore de gros aspects à pondre (j’aimerais animer la cinématique d’intro, y’a l’interface et le sound design auxquels je n’ai pas encore touchés…) mais la majeure partie du boulot consiste à tester, affiner, tester, affiner… Ce que j’aime faire ! Je trouve ça jouissif de jouer, de rencontrer un élément qui vous fait grincer des dents, passer sur le script, modifier, retour au jeu et… magie, l’amélioration est là et peut être vécue.

Enregistrer

Enregistrer

Enregistrer

Clinamen #14 : l’ordinateur d’Ester

Ces derniers temps, je me suis attelée à finir tous les visuels dont j’ai besoin pour boucler la première journée dans Clinamen (sur trois). J’ai pas mal avancé, et j’ai donc la satisfaction de cocher pas mal d’items de la todolist que j’avais notée précédemment.

Todolist “jour 1”

décor : porte
décor : ordinateur
décor : application “caméras”
décor : application “carte”
décor : application mystère
  décor : game over

  implémenter les modifications suite aux feedbacks des joueurs à Japan Expo
  réactiver la fin alternative que j’avais désactivée pour la démo
  implémenter les expressions des personnages dans le code
  affiner l’implémentation de la musique
  sound effects
  interface (j’adore comment j’écris ça sur une seule ligne alors que ça va me prendre des plombes parce que je n’y connais rien)
  faire améliorer les textes par mon pôpa

Concrètement, j’ai fait tous les visuels qui se rapportent à l’ordinateur d’Ester, qui constitue une partie importante du jeu. On peut faire sans, mais si vous faites sans, c’est que vous êtes passé à côté de quelque chose qui va probablement vous manquer.

Sans trop spoiler, chaque journée dans Clinamen vous présente un « problème » à résoudre, mais ces situations sont aussi l’occasion de trouver la réponse à un problème plus grand, une question plus large… dont il faudra avoir trouvé la réponse à temps si vous voulez avoir toutes les cartes en main lors de la dernière phase du jeu.

Et si vous trouvez cette réponse, alors l’ordinateur sera un allié précieux pour cette dernière phase.

Bref, cela étant fait, je vais donc maintenant pouvoir attaquer la dernière ligne droite pour boucler la première journée du jeu. J’ai hâte de voir ce que ça va donner !

Sur d’autres fronts :

  • Je suis allée au premier café débat de la troisième saison des Café Débat JV Rennes, sur le thème « Jeu vidéo et discours politique », et c’était très très chouette. J’ai pas beaucoup l’occasion de côtoyer des personnes intéressées par le JV, encore moins IRL, donc pouvoir en discuter de vive voix, et décrasser son cerveau, ça fait du bien. J’irai probablement au second donc, et j’aimerais bien faire un compte-rendu cette fois.
  • L’Inktober a pris un coup dans l’aile parce que je n’en pouvais plus de ne pas avancer sur Clinamen, qui a donc repris la priorité (à juste titre). Cela dit je veux faire cet Intkober, les thèmes m’inspirent vraiment, donc je garde mon carnet dans mon sac et je le ressors quand je peux pour rattraper.