Concevoir dès le départ pour les grands écrans

Les appareils Android sont disponibles dans différents facteurs de forme (téléphones, tablettes, appareils pliables et appareils ChromeOS) et proposent un large choix quant à la taille de l'écran. Android est compatible avec de nombreux modes d'affichage : mode multifenêtre, multi-écran, libre, Picture-in-picture, etc. Les appareils pliables peuvent avoir différents états ou postures, comme le mode écran à plat ou le mode Livre.

Envisagez différents cas d'utilisation pour votre application lorsque vous commencez à la concevoir. Exemple :

  • Les appareils à grand écran offrent aux utilisateurs plus d'espace pour interagir de différentes manières avec le contenu de votre application multimédia.

  • Les utilisateurs peuvent effectuer plusieurs tâches à la fois lorsqu'ils regardent une vidéo en mode multifenêtre ou profiter d'un écran plus grand pour appliquer des modifications plus complexes après avoir capturé une image.

  • Les utilisateurs peuvent se tourner vers une tablette pour rester en contact grâce aux appels vidéo et voir leurs amis et leur famille plus en détail. Votre application peut afficher un contexte plus riche sur un titre ou une scène dans une superposition de lecture personnalisée, ou proposer davantage d'options de contrôle à l'écran.

  • Les carrousels d'une vue de navigation peuvent offrir plus de variété pour un meilleur attrait visuel, ou votre application multimédia peut maintenir l'engagement utilisateur en proposant un flux navigable à côté de la lecture.

N'oubliez pas que votre application multimédia exécute le même code sur un téléphone standard, un appareil pliable, une tablette et des appareils ChromeOS. Vous devez donc concevoir votre application pour les grands écrans dès le début de son développement. Pour en savoir plus et voir des exemples visuels, consultez la galerie sur grand écran.

Rendre votre application multimédia responsive par défaut

Évitez les expériences utilisateur dégradées dans votre application multimédia en adaptant sa mise en page aux téléphones, tablettes, appareils pliables et appareils ChromeOS.

Votre application doit être responsive pour s'adapter aux différentes tailles d'écran, orientations et facteurs de forme. Une mise en page adaptative change en fonction de l'espace disponible sur l'écran. Pour en savoir plus, consultez Assurer la compatibilité avec différentes tailles d'écran.

Concevoir selon les consignes

La qualité de base des applications est le fondement de toutes les applications Android, indépendamment de la taille de l'écran, de la position de l'appareil ou d'autres considérations spécifiques à l'appareil. Votre application doit répondre à ces exigences de base avant que vous ne commenciez à la concevoir pour un grand écran. Pour en savoir plus, consultez Critères fondamentaux relatifs à la qualité des applis.

Votre application doit offrir une expérience utilisateur optimale quels que soient le facteur de forme, la taille de l'écran, le mode d'affichage ou la position de l'appareil. Concevez-la donc en suivant les consignes des niveaux 1, 2 et 3 ci-dessous.

Ces consignes définissent un ensemble complet de critères de qualité applicables à la plupart des types d'applications Android.

Niveau 3 :

À ce niveau de base, votre application doit toujours respecter les exigences concernant l'UI et les graphismes. Votre application est adaptée aux grands écrans, et les utilisateurs peuvent accomplir les procédures essentielles, mais l'expérience utilisateur est loin d'être optimale.

La mise en page de l'application n'est pas forcément idéale, mais elle s'exécute en plein écran ou dans toute la fenêtre en mode multifenêtre. Elle n'est pas au format letterbox et ne s'exécute pas en mode de compatibilité. L'appli offre une compatibilité basique avec les périphériques d'entrée externes, dont les claviers, souris et pavés tactiles. Pour en savoir plus, consultez Prêt pour les grands écrans.

Niveau 2 :

Ici, votre application implémente des optimisations de mise en page pour toutes les tailles d'écran et configurations d'appareil, et offre une compatibilité améliorée avec les périphériques d'entrée externes. Pour en savoir plus, consultez Optimisation pour les grands écrans.

Niveau 1 :

Il s'agit du meilleur niveau de compatibilité. Il offre à l'utilisateur une expérience optimale avec votre application, car il spécifie des fonctionnalités et des capacités premium.

Le cas échéant, l'appli est compatible avec le multitâche, les différentes positions des appareils pliables, le glisser-déposer et la saisie au stylet. À ce niveau, les applications sont très différenciées. Portez donc une attention particulière aux consignes concernant des éléments tels que le multitâche et les postures pliables. Pour en savoir plus, consultez Différenciation sur grand écran.

Mises en page optimisées

Profitez de l'espace accru des grands écrans sans letterboxing (en raison de la restriction de l'orientation) ni étirement. En optimisant la mise en page de votre application pour les contenus multimédias et les réseaux sociaux, vous élargissez la portée de votre application et améliorez l'expérience utilisateur sur tous les facteurs de forme d'écran (tablettes, appareils pliables et appareils ChromeOS), ainsi que sur toutes les tailles de téléphone.

Les composants des panneaux et le rail de navigation permettent de naviguer facilement, pour plus de confort et de contrôle dans l'interface utilisateur. Les composants complètent également les mises en page standards (liste/détail, flux et volet secondaire) en plaçant les destinations de navigation principales à portée de main tout en occupant un minimum d'espace à l'écran.

Mises en page des contenus multimédias

Améliorez l'ergonomie de votre application en implémentant des mises en page spécifiques aux contenus multimédias pour les listes/détails, les flux et les volets secondaires. Pour en savoir plus sur les mises en page MDX, Flutter et Compose, consultez Ressources de mise en page.

  • Liste/Détails : Concevoir votre application avec un navigateur multimédia interactif permet aux utilisateurs de parcourir différents contenus multimédias tout en regardant ou en écoutant. Les titres multimédias sont affichés à côté du lecteur de fichier audio ou vidéo. Si l'orientation de l'appareil change, une mise en page de type "Liste et vue détaillée" s'adapte pour préserver l'état de l'application. Pour en savoir plus, consultez Mises en page liste/détail.

  • Flux : une mise en page de type "Flux" organise des éléments de contenu équivalents dans une grille configurable afin d'afficher rapidement et facilement une grande quantité de contenu, comme un flux musical ou un kiosque de films et de séries TV dans votre application. Pour en savoir plus, consultez Mises en page de type "Flux".

  • Volet secondaire : avec des zones d'affichage principale et secondaire, votre application peut intégrer un volet secondaire pour le contexte, la pertinence ou la référence, comme une liste déroulante de titres similaires, d'avis publiés ou d'œuvres supplémentaires des mêmes artistes ou acteurs. Pour en savoir plus, consultez Mises en page des volets secondaires.

Pour découvrir une sélection de mises en page multimédias, consultez la galerie multimédia.

Mises en page pour les réseaux sociaux

Les grands écrans offrent aux utilisateurs de réseaux sociaux plus d'espace pour créer du contenu, pour effectuer plusieurs tâches à la fois, et pour glisser-déposer du contenu entre les applications et le partager. Grâce à des fonctionnalités et des capacités impossibles à utiliser sur les appareils à petit écran, votre application multimédia pour grand écran peut exploiter les mises en page de type liste-détail, flux et volet d'assistance.

  • Liste et vue détaillée : cette mise en page est idéale pour les applications de chat, les gestionnaires de contacts ou les explorateurs de fichiers. Par exemple, votre application peut afficher une liste des conversations avec les détails de chacune d'entre elles en parallèle, afin de ne rater aucun des derniers messages. Pour en savoir plus, consultez Mises en page liste-détail.

  • Flux : les composants courants de ce style de mise en page sont les cartes et les listes. Par exemple, créez un montage de posts dans un format de grille flexible, ou ajustez leur taille et leur position pour attirer l'attention sur les posts importants. Les utilisateurs peuvent afficher rapidement de grands groupes de contenus. Pour en savoir plus, consultez Mises en page des flux.

  • Volet secondaire : les applications de recherche et de documentation ou les applications de productivité peuvent bénéficier de ce style de mise en page. Il permet à l'utilisateur de garder les outils de création de contenu à portée de main. Par exemple, votre application peut permettre aux utilisateurs de régler des paramètres, d'accéder aux palettes de couleurs, d'appliquer des effets et de voir les modifications instantanément. Pour en savoir plus, consultez Prendre en charge les mises en page à volets.

Pour obtenir une collection de mises en page de réseaux sociaux, consultez la page Galerie de réseaux sociaux.

Bonnes pratiques pour les applications multimédias sur grand écran

En suivant les bonnes pratiques pour les grands écrans, vous éviterez de devoir retravailler inutilement votre application. Elles vous permettront également de rendre votre application plus conviviale sur un plus grand nombre d'appareils dès le départ, en particulier en ce qui concerne l'orientation, les raccourcis clavier, la prise en charge de l'aperçu de l'appareil photo et les postures pliables.

Orientation et redimensionnement

Si votre application multimédia déclare des restrictions d'orientation et de redimensionnement, Android active un mode de compatibilité. Bien que le mode de compatibilité garantisse un comportement acceptable de votre application, la facilité d'utilisation est considérablement réduite et l'expérience utilisateur en pâtit.

Par exemple, si votre application est sur une tablette, celle-ci s'ancre en mode paysage. Si votre application est limitée au mode portrait, cela entraîne l'apparition de bandes noires, ce qui n'est pas idéal pour l'utilisateur final. Votre application doit permettre aux utilisateurs d'utiliser l'orientation de leur choix. Profitez donc de la taille disponible d'un grand écran dans votre conception.

Toute restriction d'orientation réduit la façon dont les utilisateurs peuvent interagir avec le contenu ou consommer des contenus multimédias, ce qui limite l'utilisation de votre application. Le changement d'orientation peut affecter le dimensionnement dans une certaine mesure, mais le redimensionnement ne modifie pas nécessairement l'orientation.

Raccourcis clavier

Sur un écran plus grand, les raccourcis clavier sur les claviers physiques, tels que démarrer, arrêter, mettre en pause, revenir en arrière et avancer, sont plus susceptibles d'être utilisés, ce qui rend l'expérience utilisateur cohérente avec un clavier.

Les utilisateurs s'attendent à trouver ces fonctions dans leurs applications multimédias. Pour réduire les points de friction pour les utilisateurs, envisagez de tester votre application avec un clavier physique. Cela vous aide à remarquer et à inclure ces raccourcis importants dans votre application dès le début de votre conception.

Compatibilité avec l'aperçu de l'appareil photo

Avec les grands écrans, vous pouvez rencontrer davantage de problèmes d'étirement, de recadrage et de rotation. Vous ne pouvez donc pas supposer que la taille de l'aperçu de l'appareil photo correspond à ce que l'UI de votre application multimédia affiche réellement.

Par exemple, si un utilisateur prend une photo avec sa tablette, mais qu'elle s'affiche à l'envers sur l'écran, l'expérience n'est pas optimale. Incluez la prise en charge de l'aperçu de l'appareil photo pour les grands écrans.

Pour en savoir plus, consultez Aperçu CameraX ou Aperçu Camera2.

Positions des appareils pliables

La conception de votre application multimédia pour les grands écrans inclut les postures pliables. Par exemple, votre application peut permettre à un utilisateur d'avoir une configuration sur table pour la lecture de contenus multimédias, ou d'utiliser un écran arrière et un mode Dual Screen pour les aperçus et la capture.

En incluant les postures pliables dans votre plan de développement, votre application est disponible sur davantage d'appareils et a un impact plus important. Vous améliorez l'expérience multimédia de l'utilisateur d'une manière que les autres appareils ne peuvent pas proposer sans les postures pliables. Pour en savoir plus, consultez Positions pliables.