Le 28 octobre 2017, « CEDEC+KYUSHU 2017 », une conférence destinée aux développeurs de divertissement informatique, s'est tenue à l'Université Kyushu Sangyo, dans la préfecture de Fukuoka. Dans cet article, nous rendrons compte de la session « Méthodes de création d'interface utilisateur dans la série Persona - Exemple d'interface utilisateur pour Persona 5 » qui s'est tenue lors de la conférence.
Les intervenants de cette session étaient Kazuhisa Wada et Masaki Sudo d'Atlas. Après avoir rejoint l'entreprise en tant que designer, M. Wada a participé à divers travaux et travaille actuellement sur «personnage« Tout en supervisant l'équipe, »Persona 3 Nuit de lune dansante』、『Soirée des étoiles dansantes de Persona 5Il est en charge du producteur de ``. M. Sudo est le premier concepteur d'interface utilisateur (interface utilisateur) exclusif d'Atlas.personnage 5» a simultanément occupé le poste de directeur artistique et de responsable de la conception de l'interface utilisateur. Nous supervisons également la conception et la promotion de divers événements, ainsi que la conception des droits.
M. Kazuhisa Wada
M. Masaki Sudo
Derrière la naissance de cette interface utilisateur unique se trouvait le sentiment de crise d'Atlas.
En parlant de l'interface utilisateur de Persona 5, ceux qui y ont joué savent déjà qu'elle est élégante, dynamique et unique. Dans cette session expliquant l'interface utilisateur, M. Wada a d'abord présenté le premier PV de Persona 5. Une interface utilisateur unique peut être vue après 1 minute et 30 secondes.
Il est rare d’inclure beaucoup de réductions d’assurance-chômage dans un PV. On peut dire que l’interface utilisateur est une fonctionnalité majeure du jeu. Lorsque ce clip a été publié, M. Wada aurait reçu de nombreux commentaires surpris tels que : « C'est quoi cette interface utilisateur ?! »
Comment est née cette interface utilisateur unique ? M. Wada a déclaré que le tournant de la série était «personnage 3» a été d’une grande aide.
"personnage 2 punition» est sorti en 2000. Lorsque Persona 3 est sorti six ans plus tard, sa mission de conception était d'innover son image et d'attirer les utilisateurs légers (le tout avec un petit budget). Ce n’était pas un objectif, c’était quelque chose qu’il fallait atteindre.
À l'époque, le département du développement de la consommation était en crise, les jeux d'Atlus étant intéressants mais ne se vendant pas bien, a déclaré Wada. Afin de surmonter cette situation, « Persona 3 » devait être un succès même avec des coûts de développement limités, nous l'avons donc développé dans un souci de marketing, ce que nous n'avions jamais fait auparavant.
L'une des politiques que nous avons proposées consistait à renforcer complètement l'assurance-chômage. Transformer l'UI, qui avait été un "héros méconnu", en un "protagoniste à la voix forte" était la méthode qu'Atlus a inévitablement choisie lorsqu'il était dans une situation difficile.
Afin d’équilibrer le rôle du design porteur de l’image de l’œuvre et le rôle de transmission de l’information
À ce stade, le narrateur passe le relais de M. Wada à M. Sudo. Plus précisément, j'ai expliqué comment créer l'interface utilisateur. M. Sudo a rejoint Atlas il y a 18 ans, mais le processus de travail de l'interface utilisateur est presque le même aujourd'hui que lorsqu'il a rejoint l'entreprise, et les outils qu'il utilise sont les mêmes (Photoshop, Illustrator, After Effects).
L'interface utilisateur de la série "Persona" équilibre le rôle de création d'une conception graphique qui dirige le travail et le rôle original de l'interface utilisateur de transmission d'informations, et remplit la mission importante de "conditionner (le titre) comme un jeu précieux". » dit Sudo. La première chose importante lors de la création d’une telle interface utilisateur est la couleur. La couleur laisse une forte impression sur les gens, alors décidez d’abord de la couleur principale. Au moment où la couleur principale a été décidée, le logo du titre a également été créé et la police clé a également été décidée.
"Persona 3" est bleu, "personnage 4" est jaune, " Persona 5 " est rouge, "CatherineLa couleur principale est le rose choquant. En combinant des couleurs et des formes que l’on voit couramment dans la vie quotidienne, ils ont facilité le démarrage et ont une faible barrière à l’entrée.
La prochaine chose à décider est la couleur secondaire. Dans "Persona 3", le jaune, qui représente la "phase de lune" qui est un élément important du jeu, est utilisé comme couleur secondaire pour faciliter la compréhension des informations importantes. "Persona 4" utilise des rayures multicolores (inspirées de la "télévision" qui détient la clé de l'histoire) et la couleur noire, aussi flashy que les rayures.
Cependant, dans Persona 5, afin de faire ressortir le rouge passionné, ils ont décidé de ne pas inclure autant que possible de couleurs secondaires. Alors, comment ont-ils assuré la convivialité dans des domaines autres que la couleur ?
L'une des choses que M. Sudo a utilisées pour créer un design dynamique sans interférer avec la reconnaissance des informations ou le guidage visuel était la « nature de la ligne de vue ». Les gens ont tendance à suivre les lignes et à déplacer leur regard. Par conséquent, lorsque l’écran du menu est ouvert, une ligne blanche est tracée au centre pour guider l’œil.
De plus, lorsque vous passez à un niveau inférieur, modifiez la disposition et l’angle pour faciliter la reconnaissance de la hiérarchie. De plus, la luminosité est ajustée pour changer de manière fluide afin de faciliter la compréhension des informations importantes. Les espaces contenant des informations hautement prioritaires ont une luminosité élevée, tandis que les espaces contenant des informations non prioritaires ont une faible luminosité.
De plus, l'interface utilisateur de Persona 5 se caractérise par un modèle 3D qui se déplace lorsque vous interagissez avec lui. Afin de mettre en œuvre ce modèle 3D, il semble qu'ils aient préparé un outil spécial. Tout d'abord, une mise en page est créée dans Photoshop, puis un motion designer crée des poses et les arrange à l'aide d'outils spéciaux. Une fois le mouvement du modèle 3D déterminé, le processus consistait à créer une illustration 2D de la texture découpée afin qu'elle ne s'écarte pas autant que possible de la pose finale.
Une fois la conception et la mise en page décidées, l’étape suivante est la mise en œuvre des données. Dans Persona 5, il y avait un programmeur dédié à l'interface utilisateur pour chaque partie, comme les batailles et les scénarios, et le concepteur transmettait les spécifications des coordonnées au programmeur et lui faisait implémenter les données. À ce moment-là, le concepteur vérifiait aux côtés du programmeur et effectuait des ajustements pour chaque point et cadre.
M. Sudo dit que préparer des spécifications sur papier (plus de 1 000) et leur faire mettre en œuvre les données est peut-être une méthode ancienne... Cependant, si le concepteur détermine seul le comportement de l’interface utilisateur, celle-ci finira par être ce qu’il considère comme bon. Il a déclaré que laisser la place aux idées des programmeurs pour passer par les mains des programmeurs entraînerait une amélioration de la qualité de l'interface utilisateur.
Enfin, M. Sudo parle de ses aspirations à continuer de créer des interfaces utilisateur qui « guident les utilisateurs de manière intuitive et subtile ». Il a conclu la session en disant qu'il espère incorporer un sentiment de « ludique » ou de « surprise » dans cette « décontraction » et pousser l'interface utilisateur vers le divertissement graphique en incorporant de telles significations.
