La création d'un inventaire, par l'Atelier Sentô

L'inventaire, par l'Atelier Sentô

 Atelier Sentô
Rédigé par Atelier Sentô
Publié le 03/03/2016

Créer un inventaire, c'est surement facile. On en voit dans énormément de jeux et leur création semble être l'évidence même. Et pourtant, une fois devant l'écran et un morceau de son jeu, il faut bien se l'avouer : en fait, ce n'est pas si simple et des besoins ergonomiques et d'intégrations viennent bouleverser et interroger. Voici un nouvel article de l'Atelier Sentô qui présente une étape de développement de leur jeu The Coral Cave :

Un inventaire taillé sur mesure

Assurément pour les joueurs, l'inventaire revêt une importance capitale. C'est l'endroit où l'on range avec soin les objets durement gagnés qui nous accompagneront tout au long de l'aventure. Il est donc important d'en soigner le design. En étudiant quelques point & click récents, on peut distinguer deux extrêmes :

A gauche : dans Machinarium, l'inventaire est une simple barre horizontale, sans décoration, qui apparaît en haut de l'écran quand on approche le curseur de la souris. Ce dénuement, qui peut surprendre dans un jeu aussi visuellement fouillé, s'explique car le petit robot avale tout ce qu'il ramasse. Il est son propre inventaire. Difficile de faire plus mignon !

A droite : dans Deponia, au contraire l'inventaire occupe la totalité de l'écran et il est entièrement dessiné. On l'active en faisant rouler la molette de la souris et il apparaît au terme d'une animation (qui peut faire planter le jeu si votre ordinateur n'est pas assez puissant).

Pour The Coral Cave, on avait en tête de limiter les menus pour donner un maximum de place aux personnages et décors. Nous sommes donc partis sur l'idée d'un inventaire en barre horizontale à la Machinarium. Mais on souhaitait quand même le travailler pour qu'il évoque l'univers du jeu

Deux problèmes se sont présentés à nous :

  • on avait du mal à dessiner un élément abstrait qui ne correspondait à rien de réel. Le résultat nous paraissait toujours forcé, comme une convention acceptée à contrecœur.
  • on voulait faire tenir tous les menus dans cette barre, ce qui n'était pas si facile compte tenu de sa forme très allongée. L'ergonomie n'était pas au point.

Au final, nous nous sommes rabattus sur une autre solution : un inventaire en forme de console portable.

Ce choix nous a conquis car ce n'est pas un design abstrait. Mizuka emporte sa console avec elle dans ses aventures et le joueur l'utilise pour sauvegarder sa progression. L'écran à cristaux liquides offre l'espace voulu pour afficher les menus et le contenu du sac de Mizuka. Et comme le joueur a l'habitude d'utiliser ce type d'appareil, la navigation est simplifiée.

De même, pour faire apparaître l'inventaire, on a choisi d'utiliser le clic droit de la souris (le gauche étant dévolu aux interactions avec le décor et les personnages). Là encore, l'idée est de faire aussi simple et intuitif que possible pour immerger le joueur dans l'univers du jeu.

Éloge de la cleptomanie

Maintenant que nous avons un inventaire, il va falloir le remplir. Combien de fois avons-nous sursauté devant des héros de point & click célèbres stockant sans vergogne des échelles dans la poche arrière de leur pantalon ? Pour The Coral Cave, nous nous sommes donné pour règle que le contenu de l'inventaire doit entrer sans problème dans le sac de notre héroïne. Le fait qu'il s'agisse d'une petite fille nous pousse à être doublement prudents. On ne va pas lui faire ramasser quelque chose qu'elle ne pourrait pas soulever.

Mais c'est aussi un avantage certain : quand le héros est adulte, il y a toujours un moment où ça coince de le voir ramasser tout ce qu'il trouve. Il est pas un peu clodo, celui-là ? Je ne sais pas vous, mais nous, on évite de toucher ce qui traîne par terre. A l'opposé, les enfants passent leur temps à faire ça, au grand dam de leurs parents. Et ça nous arrange !

A nous de concevoir des objets colorés qui attireront l'attention de Mizuka. Comme le reste du jeu, les items sont peints à l'aquarelle sur papier et on s'amuse vraiment à les dessiner :

Ce sont de tout petits dessins. On prend soin à faire un contour épais et à bien faire dépasser la couleur de sorte à avoir de la marge pour les découper sur l'ordinateur et créer un fond transparent autour. Pour chaque item, nous allons ensuite enregistrer deux images comme ceci :

A gauche, l'item tel qu'il apparaît dans l'inventaire (avec le petit carré sur lequel il sera posé).

A droite, tel qu'il apparaîtra à côté du curseur, une fois sélectionné. Le fond autour de l'objet est forcément transparent et il faut tenir compte de la position du curseur en laissant vide le coin supérieur gauche. Et voici le résultat avec quelques items rangés dans l'inventaire et l'un d'eux sélectionné par la souris :

Vie et mort d'un item

Pour créer un item dans Wintermute, le logiciel que nous utilisons, il faut entrer sa fiche d'identité, c'est-à-dire ce petit bout de code :

ITEM
{
       CURSOR_COMBINED = TRUE
       CAPTION = "Clé"
       NAME = "Item_Key"
       IMAGE = "items\key.jpg"
       CURSOR = "items\key_cursor.png"
       CURSOR_HOVER = "items\key_cursor .png"
       SCRIPT = "items\key.script"
}

En gros, il s'agit de donner à l'item un nom, d'indiquer les images à utiliser quand il apparaît dans l'inventaire ou combiné avec le curseur. On peut même ajouter une feuille de script si on veut le doter d'un comportement spécifique (par exemple un effet sonore quand on le sélectionne).

Ensuite pour l'utiliser dans le jeu, on écrira :

Game.TakeItem ("Item_Key") ;
Game.SelectedItem ("Item_Key") ;
Game.DropItem ("Item_Key") ;

Ces codes permettent de mettre un objet dans l'inventaire, le sélectionner pour l'utiliser sur le décor puis, une fois inutile, s'en débarrasser.

On le voit, c'est très simple de créer et d'utiliser un item avec Wintermute. Logique, ce logiciel est spécialement prévu pour les point & click et les items sont l'ossature de ces jeux. Si, une fois que vous aurez joué à The Coral Cave, vous ne vous mettez pas à ramasser plein de cochonneries par terre, ce sera à n'y rien comprendre !

PS : Trois special guests se sont glissés dans la BD. Les reconnaîtrez-vous ?

The Coral Cave - Teaser français

vignette pour les réseaux
23 commentaires

Comments

 Sidexal

Ha oui la traduction c'est vrai, un problème à part entière.
Et un livre pour les menus, vous y aviez pas pensé à un livre pour les menus hein ? Ravi
Héhé, non elle est vraiment jolie cette console ! En plus vous pourrez sortir un objet dérivé et collector comme ça ! Money money Tire la langue

 DorianSRed

<3
C'est clairement un élément qui n'est pas si simple à intégrer. L'idée de la console c'est quelque chose que je n'aurais pas forcément imaginer pour cet univers, et pourtant ça fonctionne très très bien :).

 Atelier Sentô

On n'y avait pas pensé au début non plus. Mais comme on voulait aussi mettre les menus dans l'inventaire, on a eu cette idée.
Les stickers enfantins et l'aspect vieillot de la console (c'est davantage une Game & Watch qu'un 3DS) nous ont permis de l'intégrer à l'univers du jeu... du moins, on espère !

 MonsieurFg

Merci.

 Atelier Sentô

Merci à toi !

 Vrett
Vrett 03 March 2016 à 13h26

Est-ce à dire que l'on pourra ramasser tout et n'importe quoi même si l'on en a pas l'utilité ? J'aime assez cette idée.

Au fait, vous évoquez ici le sac de la petite héroïne, mais il me semble que l'on ne l'aperçoit aucunement ?

Bonne continuation pour ce chouette boulot ! Content

 Atelier Sentô

L'idée de tout pouvoir ramasser est séduisante mais comme il faut qu'on dessine les items 1 à 1, ce serait un sacré travail pour, au final, peut-être, rendre confus l'inventaire surchargé. Du moins il aurait sûrement fallu le penser autrement, probablement avec un inventaire en plein écran.

Dans The Coral Cave, Mizuka pourra ramasser seulement quelques objets. On travaille beaucoup sur la manière de mettre en scène ces objets dans le décor pour rendre logique qu'on prenne ceux-ci et pas d'autres.
Il y a beaucoup de point&click qui dissimulent les items (parfois de la taille de quelques pixels) afin d'augmenter la difficulté (et donc la durée de vie). Mais on trouve que ça génère de la frustration plus que de la réflexion : les joueurs se retrouvent en pilotage automatique à balayer chaque écran avec la souris.

Notre idée, c'est que le joueur trouve facilement les items dont il a besoin mais qu'il doive réfléchir à comment les utiliser.

Concernant le sac de Mizuka, oups, oui : on a mis une capture du début du jeu. C'est un rêve qu'elle fait donc elle est en pyjama. Elle prend son sac dès son réveil comme on le voit sur les captures de notre précédent article :
http://www.indiemag.fr/articles/chat-pas-autres-latelier-sento

Merci pour ton message !

 oursique

L'article n'explique pas comment on arrive à combiner les objets sans les sortir de l'inventaire. Tire la langue

 Atelier Sentô

Ça se fait dans la feuille de script (à la fin de la fiche d'identité de l'item) très simplement. Imaginons qu'on ait un item Riz et un item Nori et qu'on veuille les combiner pour obtenir un item Onigiri, il faut écrire dans le script du Riz:

on "Nori"
{
Game.DropItem("Riz");
Game.DropItem("Nori");
Game.TakeItem("Onigiri");
}

Et dans le script du Nori:

on "Riz"
{
Game.DropItem("Riz");
Game.DropItem("Nori");
Game.TakeItem("Onigiri");
}

Et voilà : quand le joueur utilisera le riz sur le nori (ou vice-versa), ça éliminera ces deux items pour créer un item Onigiri.
Ceci dit, si on n'en a pas parlé dans l'article ce qu'il n'y a pas de combinaison d'items dans notre inventaire pour l'instant. Peut-être qu'il n'y en aura pas au final dans le jeu. A suivre !

 The_Icehouse

Très amusant, la meilleure planche en ce qui me concerne Clin d'oeil Je vais l'imprimer hihi
Et de très bonnes explications sur votre façon de procéder.
Sur ce, je vais aller me préparer un peu de matière bleue, j'ai faim !

Pages