Spécifications de conception des icônes Google Play

Un nouveau système d'icônes est mis en place pour les applications et les jeux sur Google Play afin de mieux adapter les illustrations des développeurs aux multiples dispositions d'interface utilisateur, facteurs de forme et appareils de Google Play, ainsi que pour apporter une plus grande homogénéité et une présentation épurée à Google Play.

Les formes uniformes sont visuellement plus attrayantes et plus faciles à assimiler. Elles permettent aux utilisateurs de se concentrer sur l'illustration plutôt que sur la forme. De plus, elles éliminent les problèmes d'alignement causés par un espace libre aléatoire afin de mieux présenter les informations environnantes, telles que le titre, les avis et le prix.

Forme libre (format d'origine)
Forme uniforme (nouveau format)

Cette page fournit des consignes pour créer des éléments destinés à la fiche de votre application sur Google Play. Par exemple, dans la mesure où Google Play applique dynamiquement des angles arrondis et des ombres projetées aux icônes de votre application, vous devez les supprimer de vos éléments d'origine.

Important : Si vous préférez en savoir plus sur la création d'icônes de lanceurs APK, qui sont distinctes des icônes Google Play décrites sur cette page, consultez les ressources ci-dessous :

  • Icônes adaptatives Android
    Suivez ces consignes relatives aux icônes de fichiers APK pour savoir comment créer des icônes de lanceurs adaptatives, introduites dans Android 8.0 (API niveau 26).
  • Icônes de produits
    Consultez les principes du Material Design relatifs aux icônes de produits, y compris les consignes concernant la conception, les formes, les spécifications et le traitement des icônes.

Créer des éléments

Cette section fournit des consignes pour créer des éléments visuels destinés à votre application sur Google Play.

Attributs

L'illustration d'une icône peut occuper tout l'espace de l'élément visuel. Cela dit, vous pouvez également concevoir un élément d'illustration, tel qu'un logo, et le positionner sur la grille de repère. Lorsque vous placez votre illustration, utilisez les lignes de repère en guise de référence, et non comme une règle absolue.

Lorsque vous créez une illustration, veillez à ce qu'elle respecte les conditions suivantes :

  • Taille finale : 512 x 512 px
  • Format : PNG 32 bits
  • Espace de couleurs : sRVB
  • Taille maximale du fichier : 1 204 Ko
  • Forme : carré plein (Google Play gère le masquage de manière dynamique. L'arrondi sera équivalent à 20 % de la taille de l'icône).
  • Ombre : aucune (Google Play gère les ombres de manière dynamique). Pour ajouter des ombres à votre illustration, consultez la section "Ombres" ci-dessous.
Taille totale de l'élément
Lignes de repères pour une icône de produit

Une fois l'élément importé, Google Play applique de manière dynamique le masquage arrondi et l'ombre pour une meilleure cohérence de toutes les icônes d'application/de jeu.

À gauche figure votre nouvel élément d'icône. Les trois images qui suivent à droite, illustrent le traitement dynamique de l'icône par Google Play.

Dimensionnement

Utilisez l'espace complet de l'élément comme arrière-plan lorsque vous utilisez une illustration minimaliste.

Utilisez les lignes de repère en guide de référence pour positionner les éléments d'illustration (logos).

Votre illustration à fond perdu (élément final)
Résultat final avec les ombres et les angles arrondis appliqués dynamiquement par Google Play

Ne forcez pas votre logo ou votre illustration à s'adapter à l'espace complet de l'élément. Utilisez plutôt la grille de repère.

À ne pas faire
Ne forcez pas une transformation radicale de la marque et de l'illustration à fond perdu.
À faire
Placez plutôt l'illustration de l'icône à forme libre sur les lignes de repères.

Les illustrations conviennent généralement bien pour une icône à fond perdu.

À ne pas faire
Ne diminuez pas les illustrations sur les lignes de repère.
À faire
Utilisez l'espace complet de l'élément pour que votre illustration occupe toute l'icône.

Ombres

Une fois l'importation effectuée, Google Play ajoute de manière dynamique une ombre projetée autour de l'icône finale.

Lorsque vous ajoutez des ombres à l'intérieur de l'illustration de l'icône, veillez à suivre les consignes relatives au Material Design de Google pour une parfaite cohérence avec la plate-forme Android.

À ne pas faire
N'ajoutez pas d'ombres projetées à l'élément final.
À faire
Vous pouvez créer des ombres et ajuster la luminosité à l'intérieur de l'illustration.

Arrondi d'angle

Google Play applique de manière dynamique des angles arrondis. Cela garantit plus de cohérence lorsque l'icône est redimensionnée sur différentes dispositions d'interface utilisateur. L'arrondi sera équivalent à 20 % de la taille de l'icône.

À ne pas faire
N'arrondissez pas les bords de l'élément final.
À faire
Si possible, remplissez tout l'élément avec des illustrations.

Badges

Les badges incorporés nuisent à l'illustration même et ne se réduisent pas bien avec l'icône.

Attention
Évitez toute promotion sur votre illustration.
Attention
Évitez d'utiliser des badges de marque.

Adaptation de la marque

Si les formes constituent une partie essentielle d'un logo, ne forcez pas l'illustration à fond perdu. Placez-la plutôt sur la nouvelle grille de repère.

De gauche à droite : élément d'icône d'origine, nouvel élément d'icône (adaptation recommandée), nouvelle icône affichée sur Google Play.

Si possible, attribuez à votre élément une couleur d'arrière-plan adaptée à votre marque, sans aucune transparence. Les éléments transparents afficheront la couleur d'arrière-plan de l'interface utilisateur Google Play.

De gauche à droite : élément d'icône d'origine, nouvel élément d'icône (adaptation recommandée), nouvelle icône affichée sur Google Play.

S'il n'y a pas de forme distincte autour d'un logo le définissant, placez-le sur un arrière-plan à fond perdu.

De gauche à droite : élément d'icône d'origine, nouvel élément d'icône (adaptation recommandée), nouvelle icône affichée sur Google Play.

Si votre illustration est suffisamment flexible, pensez à la modifier légèrement pour utiliser pleinement la taille de l'élément. Si ce n'est pas possible, placez le logo sur une grille de repère.

De gauche à droite : élément d'icône d'origine, nouvel élément d'icône (adaptation recommandée), nouvelle icône affichée sur Google Play.

Mode de compatibilité

Les éléments d'icône d'origine qui n'ont pas été mis à jour conformément aux nouvelles spécifications sont finalement migrés vers l'ancien mode et réduits de 75 % par rapport à la taille de la grille de repère (512*0,75 = 384 pixels).

Le téléchargement d'une icône conformément aux spécifications d'origine ne sera plus autorisé à compter de mai 2019. En savoir plus sur l'échéancier

Les éléments d'icône d'origine seront automatiquement convertis en éléments compatibles avec l'ancien mode et réduits à 75 % sur une nouvelle grille de repère.

Télécharger des modèles et des ressources de conception

Pour commencer, téléchargez l'un des modèles d'élément fournis :