Les bonnes pratiques de conception suivantes permettent de garantir une expérience optimale aux utilisateurs qui jouent à votre jeu sur YouTube sur différents appareils et plates-formes.
Outre les composants du système d'exploitation, l'expérience Jeux intégrés se compose principalement de trois éléments:
- Actions Jeux intégrés
- Canevas de jeu
- Menus et boîtes de dialogue
Ces bonnes pratiques de conception de jeux fournissent des recommandations sur la façon de créer votre jeu pour le canevas de jeu.
Redimensionnement du jeu
Assurez-vous que les jeux s'adaptent de manière appropriée aux différentes tailles et orientations d'écran en tenant compte de ces pratiques.
Redimensionnez le jeu, et adaptez l'interface utilisateur à la taille et au format du canevas.
Utilisez le format pillarbox ou letterbox si le jeu ne peut pas être entièrement réactif à la taille et au format du canevas de jeu.
Évitez de déclencher des barres de défilement. Les barres de défilement ont un impact négatif sur le gameplay et la navigation générale. Remplir le canevas sans qu'il soit possible de faire défiler le jeu. Les barres de défilement sont adaptées au défilement intentionnel, par exemple lors du défilement d'une longue liste verticale dans l'interface utilisateur du jeu. Idéalement, les jeux sont entièrement responsables de la fenêtre d'affichage.
Mise à l'échelle du jeu
Rendu net (sans flou, pixelisé ni étiré) sur différentes résolutions d'écran.
Assurez-vous que l'UI du jeu (texte, icônes) s'adapte correctement lorsqu'elle est affichée sur des écrans de résolution inférieure (tels que les appareils mobiles 360 x 800) et des écrans de résolution supérieure (tels que les écrans d'ordinateur de bureau 3 840 x 2 560).
Évitez les assets rastérisés à basse résolution qui sont flous lorsqu'ils sont adaptés aux grands écrans.
Typographie
Assurez la lisibilité sur tous les appareils et toutes les tailles d'écran.
Les textes qui apparaissent dans le jeu (boutons, menus et bulles de texte) doivent être lisibles sur différents appareils et tailles d'écran. Pour ce faire, vous pouvez mettre à l'échelle et adapter le texte automatiquement, ou proposer aux utilisateurs un paramètre permettant d'ajuster la taille de la police.
Si le texte est inférieur à 18 pt, ou s'il est en gras et inférieur à 14 pt, le rapport de contraste des couleurs doit être au moins égal à 4.5:1.
Pour tout autre texte, le rapport de contraste des couleurs doit être d'au moins 3:1.
Pour référence générale, consultez WCAG2.1.
 |
 |
| Utilisez de grandes tailles de police avec une épaisseur et un contraste suffisants pour une meilleure lisibilité. Dans cet exemple, le rapport de contraste est de 4.48:1. | Évitez les petites tailles de police et les couleurs à faible contraste. Dans cet exemple, le rapport de contraste est de 3,07:1. |
Interactions
Cette section traite des bonnes pratiques concernant les interactions utilisateur et les éléments associés.
Cibles tactiles
Faites en sorte que les zones cibles tactiles soient suffisamment grandes pour faciliter les interactions.
Assurez-vous que les zones cibles tactiles font au moins 48 × 48 dp avec un espace d'au moins 8 dp entre les cibles (consultez les consignes Material Design) pour faciliter les interactions.
Dans cet exemple, la taille du bouton affiché visuellement a une taille de 24 dp, tandis que la cible tactile invisible inclut 12 dp autour de l'icône pour atteindre la cible tactile de 48 x 48 dp.
Ajoutez une marge intérieure autour des icônes et des boutons pour augmenter la taille des zones cibles tactiles.
Boutons
Utilisez des styles uniques pour chaque état du bouton:
- Activées
- Désactivé
- Pointer avec la souris (pour les périphériques d'entrée non tactiles)
- Allez à l'essentiel
- Pressé
Essayez également de différencier les boutons selon leur hiérarchie. Par exemple, les boutons d'action principaux et secondaires dans un menu Démarrer (consultez les Consignes de conception des boutons Google Material 2).
Styles uniques qui distinguent chaque état du bouton
Saisie au clavier
Pour améliorer l'accessibilité du jeu sur tous les appareils et utilisateurs, activez la saisie au clavier pour toutes les commandes de jeu et la navigation à l'écran, en plus de la saisie tactile et à la souris.
Pour les jeux compatibles avec la saisie au clavier, autorisez les utilisateurs à fermer tous les menus et boîtes de dialogue à l'aide de la touche Esc. En plus d'un bouton de fermeture visuel (par exemple, une icône X dans le coin supérieur). Parmi les exemples courants de fenêtres ou de boîtes de dialogue, citons le menu Settings (Paramètres), le menu Pause (Mettre en pause), les messages d'erreur et les pop-ups d'Aide.
Évitez de mapper des actions à l'appui prolongé sur la touche Esc, car cette action permet de quitter le mode plein écran dans les navigateurs Web pour ordinateur.
Pour les jeux pour lesquels des écouteurs de pression de touche sont enregistrés: n'utilisez pas preventDefault() avec des événements de touche Esc. En plein écran dans Safari, l'événement d'appui sur une touche est utilisé par le jeu sans quitter le mode plein écran.
Technologies haptiques
Si nécessaire, il est recommandé d'utiliser le retour haptique (vibreur) pour rendre vos jeux plus amusants et immersifs.
Moments clés d'un match
Cette section traite des moments clés d'un jeu qui offrent une expérience de qualité au joueur.
Tutoriel
Incluez un bref tutoriel ou un niveau d'intégration pour aider les nouveaux joueurs.
L'intégration permet aux utilisateurs d'apprendre les principes de base du jeu et les éléments essentiels du jeu.
Étant donné que les jeux intégrés sont destinés à être rapides et accessibles pour que les utilisateurs commencent à jouer, essayez de limiter au maximum l'intégration. Tous les jeux ne nécessitent pas de tutoriel, mais la plupart bénéficient d'une forme d'intégration. Tenez compte des mécanismes, règles et compétences clés que le joueur doit connaître pour jouer et apprécier le jeu avec succès.
Les tutoriels peuvent être au format suivant:
- Ensemble d'écrans au début du jeu (ou, idéalement, présentés en contexte tout au long du jeu, le cas échéant)
- Niveau réel du tutoriel parcouru par l'utilisateur
Pause
Communiquez clairement l'état du jeu à l'utilisateur.
Indiquez clairement à l'utilisateur quand le jeu est suspendu et comment il peut le reprendre. Évitez de faire croire à l'utilisateur que le jeu s'est bloqué ou a planté.
Indiquer clairement que l'état du jeu est "mis en pause" et fournir une action claire (un bouton) pour reprendre le jeu.
Fin du match
Informez l'utilisateur qu'il a terminé le dernier niveau ou qu'il a terminé le jeu.
Si le jeu a une fin définitive (par exemple, un nombre fini de niveaux), informez-en clairement l'utilisateur. Cela évite à l'utilisateur de penser que le jeu est défectueux ou figé. Idéalement, le jeu félicite le joueur qui l'a terminé.
Audio
Le jeu peut contenir des commandes de volume distinctes pour les effets, la voix et la musique de fond. Elles peuvent être constituées de curseurs permettant de régler le volume ou d'un bouton de désactivation du son pour chacune d'elles, ou les deux.
Accessibilité
L'accessibilité dans la conception permet aux utilisateurs ayant des capacités diverses de jouer et d'apprécier votre jeu.
Contrairement à la conception Web et logicielle, les directives d'accessibilité standards dans l'industrie pour la conception de jeux n'existent pas. Pour obtenir des consignes supplémentaires sur la conception inclusive de jeux, consultez les consignes d'accessibilité des jeux. Nous vous recommandons de réfléchir à la manière dont ces consignes peuvent être appliquées à la conception de votre jeu.