Applications multimédias

Les utilisateurs Android interagissent avec différents types de contenus, y compris des livres audio, de la musique, des podcasts et la radio. Il est important de concevoir des applications qui permettent aux utilisateurs d'accéder facilement au contenu multimédia sur leur montre. La montre est une surface unique sur laquelle la facilité et la rapidité des interactions sont une priorité absolue, car les utilisateurs passent beaucoup moins de temps à interagir avec leur montre que sur leur téléphone ou leur tablette.

Pour en savoir plus, consultez le kit multimédia sur GitHub.

Architecture des applications multimédias

Créez des applications multimédias qui répondent aux exigences de conception de Wear OS. Les applications multimédias incluent souvent des pages Parcourir et Entité.

Parcourir

Permet aux utilisateurs de trouver des contenus multimédias à lire. Hiérarchisez les éléments téléchargés pour aider les utilisateurs à lancer ou reprendre rapidement la lecture.

Entité

Donne aux utilisateurs plus d'informations sur un élément multimédia spécifique. Le contexte important et les actions clés doivent être facilement accessibles (téléchargement, lecture ou lecture en mode aléatoire, par exemple).

Minimisez la hiérarchie de votre application et facilitez l'accès des utilisateurs aux contenus multimédias. Concevez avec une architecture d’information plate qui permet aux utilisateurs d’accéder rapidement aux listes et de présenter des vignettes aux utilisateurs. Pensez à utiliser des composants de conception personnalisée pour Wear OS. Pour en savoir plus, consultez les recommandations de conception pour les chips et les fiches.

Écrans de commandes multimédias

Les applications multimédias doivent également inclure des écrans de commandes multimédias. Créez des commandes multimédias avec une disposition à cinq boutons. Vous garantissez ainsi que le nombre minimal de cibles tactiles est atteint. Voici des exemples de commandes multimédias pour une application musicale et une application de podcast:

Adaptez les commandes multimédias que vous affichez, en fonction du type de contenu. Utilisez une icône à trois points pour rediriger les utilisateurs vers une page supplémentaire si vous souhaitez inclure plus de cinq actions. Des icônes et des polices personnalisées peuvent également être appliquées à votre application.

Régler le volume

Les commandes de volume sont l'une des commandes multimédias les plus importantes pour les utilisateurs de la montre. Les commandes multimédias doivent inclure un bouton de volume pour accéder à l'écran des commandes de volume.


La plupart des appareils Wear OS sont dotés d'un bouton latéral rotatif ou d'un contour. Certains appareils Wear OS disposent également d'autres boutons physiques pour contrôler le volume. Utilisez le bouton latéral rotatif, le contour ou le bouton supplémentaire pour contrôler le volume. N'affichez l'indicateur que lorsque vous faites pivoter le bouton latéral rotatif ou le contour, comme illustré dans l'exemple.

Cas d'utilisation courants

Lors de la conception d'applications multimédias, veillez à donner la priorité aux cas d'utilisation importants suivants:

  • Écouter des contenus multimédias téléchargés
  • Écouter de la musique en streaming depuis sa montre

Écouter des contenus multimédias téléchargés

Les utilisateurs doivent pouvoir télécharger manuellement des éléments multimédias à partir d'une page d'entité.

Communiquez à l'utilisateur l'emplacement où il télécharge le contenu, la progression du téléchargement, le temps nécessaire et la taille du téléchargement, comme illustré dans l'exemple suivant:

Lorsque l'utilisateur parcourt les contenus multimédias, afficher ceux qui ont été téléchargés en dernier:

Si le contenu est déjà téléchargé, indiquez-le clairement en affichant une action permettant de supprimer le téléchargement de la montre. Dans ce cas, vous devez également indiquer l'espace occupé par le téléchargement sur la montre, comme illustré ci-dessous:

Si l'appareil source est la montre, demandez aux utilisateurs de connecter un casque avant de commencer à écouter de la musique. Une fois le casque connecté, lancez la lecture du contenu et ouvrez les commandes multimédias.

Écouter de la musique en streaming depuis la montre

La diffusion de contenus multimédias en streaming depuis la montre a un impact important sur la batterie d'un appareil Wear OS. Donnez la priorité au contenu téléchargé lorsque les utilisateurs choisissent d'écouter sur leur appareil Wear OS en affichant les téléchargements récemment utilisés dans la liste de navigation. Pensez à ajouter un bouton qui les mène à la liste complète des téléchargements, comme illustré dans les images suivantes:

Pour en savoir plus, consultez le kit multimédia sur GitHub.

Mises en page adaptatives

Les adaptations d'écran de plus grande taille pour les applications multimédias sont axées uniquement sur l'expérience du lecteur multimédia. Tous les autres éléments sont capturés sur les pages Chips, Buttons, Dialogs et Listes qui décrivent le comportement approprié de l'application pour s'adapter aux écrans de grande taille.

Configuration des boutons

Pour respecter les principes de dimensionnement des zones cibles tactiles, affichez une disposition à deux boutons sur les appareils Wear OS dont la taille est inférieure à 225 dp et une mise en page à trois boutons sur les appareils dotés d'un écran plus grand. Les images suivantes décrivent d'autres exemples, tels qu'une mise en page à un bouton et une mise en page à deux boutons avec un logo:

Bouton de commande responsive

La commande principale (lecture/pause) passe de 60 dp à 80 dp sur les appareils Wear OS dont la taille est supérieure à 225 dp, ce qui augmente la hauteur de la section du milieu de 80 dp et augmente ainsi les zones cibles tactiles pour toutes les commandes qu'elle contient. Ce comportement responsif intégré est dont vous hériterez du modèle Media Player.

Scaling sur différentes tailles d'écran:

< 225 dp: 60 dp x 60 dp
> 225 dp: 80 dp x 80 dp

Comportement du rectangle de sélection

Dans l'en-tête, utilisez une marge universelle de 9,38%, avec une marge supplémentaire pour le titre du morceau de 4,16%. Utilisez un dégradé de 8 dp pour le défilement des titres, et un espace supplémentaire de 8 dp lorsqu'une icône est présente. Incluez toutes les transitions de défilement du rectangle de sélection sous l'icône, dont la position reste fixe.

Marges atomiques de l'en-tête
9,38%

Marge interne du titre du morceau
4,16%

Dégradés
8 dp à fond perdu

Absence d'icônes
8 dp

Éléments tactiles

Sur les appareils Wear OS dotés d'un écran plus grand, les icônes situées au milieu et au pied de page profitent de l'espace supplémentaire disponible pour augmenter la taille des zones d'appui. Cela signifie qu'hormis un atome de contrôle fixe, le « remplissage de l'espace disponible » sont appliquées aux conteneurs d'icônes:

Petits écrans Wear OS

< 225 dp

Écrans Wear OS plus grands

> 225 dp