Créer une interface utilisateur plus performante pour la VR dans « Beat the Beats »

Quand nous avons commencé à travailler sur Battre les rythmesnous avions une mission claire : nous voulions une expérience super cohérente dès le démarrage du jeu. Cela implique de traiter l’interface utilisateur et le temps des menus aussi sérieusement que le gameplay lui-même.

Article invité de Lucas González Hernanz

Lucas González Hernanz est un développeur de jeux espagnol avec plus de 15 ans d’expérience, ayant travaillé sur des titres tels que La saga Lego Star Wars, Lego Marvel, Petite grande planèteet Limbo. En 2016, il a cofondé Parallel Circles, un très petit studio indépendant axé sur la création d’expériences de jeu très soignées avec un fort accent sur l’interactivité et la sensation. Le dernier titre du studio, Beat the Beats, est disponible sur Meta Quest et PSVR 2.

Passer du temps dans les menus n’est peut-être pas le moment le plus amusant, mais c’est fondamental pour créer une expérience immersive solide et donner le ton. Le temps d’interface utilisateur est le prélude au match et vous aide à vous mettre dans l’ambiance pour vous lancer dans l’action de boxe.

Voici un aperçu des points les plus pertinents que nous avons suivis pour intégrer notre interface utilisateur et tirer le meilleur parti des qualités particulières de la réalité virtuelle, de la création d’éléments que vous pouvez perforer à l’évitement de toutes sortes d’écrans de transition noirs.

Profondeur

La réalité virtuelle offre quelque chose qu’aucun autre média n’offre : une véritable sensation de profondeur.

Cependant, la plupart des interfaces VR ne l’utilisent pas au-delà de la mise en œuvre de menus 2D incurvés. Cela est logique, car la plupart d’entre eux proviennent de systèmes 2D, mais nous voulions intégrer autant que possible notre interface utilisateur dans le support pour créer une expérience très différente. Nous utilisons la profondeur des menus dans le cadre de notre langage de conception principal. Voici quelques exemples de ses principales utilisations :

  • Éléments marquants : Les animations de profondeur aident à attirer l’attention du joueur sans chevaucher d’autres éléments ni nécessiter de shaders supplémentaires.
  • Survolez les éléments : Avancer légèrement l’élément sélectionné est à la fois intuitif et efficace.
  • Couches de menu : Lorsque plusieurs calques sont présents, le calque actif avance tandis que les calques d’arrière-plan sont repoussés. Rendre le contexte plus lisible.
  • Positionnement : Les éléments entrent et sortent avec des animations basées sur la profondeur. La direction reflète leur couche, aidant les joueurs à construire une structure cohérente de leur position dans le menu.
  • Mouvement sans chevauchement : Un problème courant de l’interface utilisateur consiste à déplacer des éléments dans une liste sans en chevaucher d’autres. Ce problème est souvent résolu avec les transitions masquer/afficher. Dans notre cas, les éléments avancent simplement en profondeur, permettant un repositionnement fluide et sans conflits.

Pour les développeurs, les implications de l’utilisation de la position Z (profondeur) dans l’interface utilisateur dépendent fortement de l’interface utilisateur du moteur. La plupart des systèmes d’interface utilisateur ont été initialement conçus pour les écrans plats et fonctionnent uniquement en 2D. Pour introduire de la profondeur, il existe plusieurs approches : réécrire le système d’interface utilisateur, combiner des éléments d’interface utilisateur traditionnels avec des objets 3D ou (comme nous l’avons fait) créer l’intégralité de l’interface utilisateur à l’aide d’objets 3D standard.

Cela peut représenter une quantité de travail importante selon le projet. Si vous choisissez cette voie, il est important de bien comprendre tous les éléments dont vous aurez besoin dès le départ. Je recommanderais de commencer par le prototypage sur le système d’interface utilisateur du moteur et de ne s’engager dans cette approche qu’une fois que la structure et le flux du menu sont bien définis et stables.

Notre choix d’utiliser des objets 3D standards comme interface utilisateur nous a aidés sur le point suivant.

Interaction physique

La réalité virtuelle permet des interactions plus riches et plus diversifiées que les écrans plats ne le pourraient jamais. Cela ouvre un vaste champ à explorer, notamment dans un milieu ludique comme le jeu. Dans cet aspect, certains titres ont fait un excellent travail, comme VR super chaudemais il existe encore de nombreux jeux qui pourraient bénéficier de l’intégration de davantage d’interactions physiques.

Dans notre cas, puisque nous développions un jeu de boxe, il nous semblait naturel d’incorporer ce type d’interaction physique dans l’interface. L’occasion idéale s’est présentée avec le moment Album Unlocking. Au lieu d’appuyer sur un bouton flottant, vous frappez pour le déverrouiller, vous le brisez, vous le détruisez comme un ennemi. L’interface utilisateur devient quelque chose dans lequel vous interagissez physiquement, et non via une abstraction.

Une fois l’idée claire, il a fallu moins d’une semaine pour l’implémenter dans le jeu et nous avons reçu beaucoup de retours positifs, donc je pense vraiment que l’effort en valait la peine.

Fluidité

Le flux de l’interface utilisateur est extrêmement important pour créer une expérience agréable dès le moment où le joueur démarre une partie. Cela nécessite d’offrir une interface fluide, réactive et juteuse. C’est quelque chose que nous avons fait dans le passé, nous aimons rendre chaque transition fluide et vivante.

Mais au-delà de ça, pour plus de fluidité, il est également important de prendre en compte les temps de chargement. Les temps de chargement ont toujours tendance à déranger les joueurs, mais cela est encore plus critique en VR pour deux raisons :

  • Ils brisent la présence physique et donc la magie de la VR
  • Le joueur a effectivement les yeux bandés et n’a donc rien pour combler le temps d’arrêt (comme un téléphone ou une boisson)

Pour permettre un écoulement totalement non perturbé, nous avons pris cela très au sérieux Battre les rythmes. Nous avons décidé d’éviter complètement les écrans de chargement et d’effectuer plutôt une transition transparente vers le monde de chaque album, en nous inspirant des transitions de magasin dans Splatoon.

Cela a nécessité un peu de planification et de développement technique supplémentaire. Notre style minimal s’est avéré parfaitement adapté, car nous ne dépendons pas de maillages complexes ni de tonnes de textures pour créer l’atmosphère que nous recherchons. D’une certaine manière, c’est comme les techniques des scènes de démonstration. Nous nous appuyons fortement sur des algorithmes spécifiques (principalement des shaders) et réutilisons les mêmes ressources pour créer l’ambiance tout en gardant un faible budget de ressources. Cela a demandé un effort supplémentaire, mais le résultat est une expérience extrêmement fluide et solide.

Pensées finales

Concevoir pour la réalité virtuelle signifie repenser les hypothèses. Cela a été un voyage intéressant, et il a certainement fallu plus de travail et de planification pour créer une interface distinctive, mais je pense que le résultat en vaut vraiment la peine.

Il ne s’agit pas de traduire des interfaces plates en espace 3D. En traitant les éléments de l’interface utilisateur comme des composants physiques, spatiaux et dynamiques du monde, nous garantissons que l’immersion ne commence pas au début du jeu. Il démarre dès la seconde où vous mettez le casque. Je pense sincèrement que l’interface utilisateur a beaucoup de potentiel pour se développer dans les médias VR. Le large éventail de possibilités d’interaction crée un paysage brillant à explorer. Chaque jeu pourrait apporter son propre style et sa propre personnalité à ce domaine. De notre point de vue, l’interface n’est pas une couche au-dessus du jeu. Cela fait partie du jeu lui-même.