Arborescence et animations

(Steady Guard Devblog #4)

J’arrive à un moment du projet où il est important pour moi de connecter les éléments mis en place. Je mets en pause la partie jouable le temps d’un épisode pour prendre un peu de recul sur l’arborescence : comment va s'organiser l'ensemble des menus, est-ce qu'il y aura une boutique, un profil...

Dans un jeu comme celui là, les niveaux sont une chose mais ils ne vont représenter qu'une petite partie des éléments que je vais devoir créer.

Designer l’ensemble des menus n’est évidemment pas une priorité pour que le jeu voit le jour, ni même pour une alpha mais il est important pour moi d’avoir un aperçu de l’objectif final, de l’ampleur du projet. Inutile de s'embarque dans un truc démesuré et concentrer les efforts sur les pages les plus importantes.

J’ai cherché quelque temps avant de trouver l’outil idéal pour créer cette arborescence et l'application web Miro s’est avéré être terriblement efficace !

MIRO

Chaque page est représentée par un post-it noir et les boutons par les post-it colorés. Les flèches représentent la navigation entre les pages :

- Les flèches pleines une transition bouton/page

- Les flèches en pointillés un retour possible via un bouton

- Les flèches en traits discontinus une navigation horizontale par balayage entre les pages.

Humble TIP #5
Pensez à tous les sens de navigation

Dans une arborescence de pages de menus on pense toujours aux boutons pour aller vers les pages mais il est facile d'oublier les cheminements inverses. Vérifiez bien que le parcours utilisateur est complet, que tous les retours vers les pages précédentes et principales sont possibles. En général, on détecte facilement ce genre d'erreur en faisant tester le jeu par un tiers mais y penser en amont gagne du temps.

Les pages qu’il va falloir réaliser vont se décomposer en 3 parties :

- Les menus principaux (1 par Guard, 3 au total)

- Les menus de sélection de niveaux (1 par monde, 5 au total)

- Les menus d’améliorations de compétences (1 par Guard, 3 au total)

Progression

La progression entre les niveaux se fera sûrement de manière relativement classique avec 1 à 3 étoiles ou médailles à récupérer en fonction du score réalisé dans le niveau. Un système de palier permet d’accéder aux niveaux suivants mais sans forcément réussir tous les niveaux. Je sais comme il peut être frustrant de se retrouver bloqué dans un jeu multi niveau juste parce qu’un niveau n’est pas bien compris ou est simplement trop dur à réaliser (et dans certains cas ça peut même être dû une erreur côté conception)

Pour éviter ça je pense que je fixerai un pourcentage de réussite à dépasser pour pouvoir progresser et que les niveaux se débloqueront 3 par 3 pour permettre encore une fois de laisser des options et de limiter les blocages. Par exemple, il faudra avoir récolté entre les niveaux 1, 2 et 3 au moins 6 étoiles sur 9 pour débloquer les niveaux 4 à 6.

Les étoiles acquis entre les niveaux ainsi que les pièces récupérées en jeu permettront aussi d’améliorer les différentes compétences des personnages, qu’elles soient actives (sorts utilisables avec du mana) ou passives (bonus permanents).

Humble TIP #6
Choisissez comment les joueurs progressent

Dans les jeux décomposés en niveau il y a plusieurs choix possible sur la progression. La plus commune étant sûrement qu'il faut réussir un niveau pour passer au suivant. Dans un jeu gratuit ou un roguelite ce système fait sens car le joueur pourra via des améliorations ou des achats finir par éventuellement y arriver. Dans le cas d'un jeu payant, si le joueur a envie d'aller au bout et se retrouve bloqué il sera très frustré. D'où le système de médailles (ou étoiles) qui permet de réussir suffisamment les niveaux précédents mais pas parfaitement pour continuer. Trouvez la méthode qui correspond le mieux à votre jeu !

Animations

Aseprite est très efficace pour faire des sprites (comme son nom l'indique) mais aussi pour faire des animations courtes en quelques frames. J’en avais jamais fait auparavant mais c’est assez facile à prendre en main et les résultats sont très satisfaisants. Je vais donc réaliser une animation pour chaque interactions entre le Guard et les différentes tuiles qui lui arrivent dessus, de sorte que le joueur comprenne rapidement les effets de l’action qu’il vient de réaliser.

Interface complète d'Aseprite

J’ai gardé l’idée de niveau décomposé en un certain nombre de tours/actions. Cette quantité pourra être revue mais pour l’instant je pars sur 50 coups par niveau. J’ai donc créé des animations en 25 frames, d’un décor allant du soleil levant au soleil couchant. Un niveau correspondra donc à une « journée de garde », à moins que le Guard ne succombe prématurément à ses blessures.

Les 25 frames composant l'animation du monde vert

Au fur et à mesure qu’il fait des actions le joueur voit donc la progression de l’animation frame par frame et peut anticiper la fin du niveau pour optimiser ses points.

Parce que le diable est dans le détails, j’ai décliné cette animation pour les 5 mondes en changeant les couleurs du décor pour qu’il corresponde au terrain. Est-ce qu’avoir 5 animations différentes était une priorité ? Sûrement pas. Mais au moins c’est fait !