Les nouveaux commits dans Chromium Gerrit semblent faire référence à « Material Design 2 », qui pourrait être une nouvelle version améliorée du langage Material Design de Google.
Material Design, le langage de conception unifié lancé avec Android Lollipop, propose des palettes de couleurs plates et pastel, de la profondeur, un éclairage doux et une physique réaliste. Il s'agit d'imiter la tactilité des objets du monde réel sans recourir au skeuomorphisme; Google le décrit comme une synthèse des « principes classiques » avec « [l']innovation et les possibilités » de la technologie.
Depuis les débuts de Material Design en 2014, il s'est répandu dans l'écosystème Android comme une traînée de poudre, sans parler des applications Google telles que YouTube, Chrome, Gmail, Hangouts et Google Calendar. Des boutons d'action flottants, des couleurs agréables et des techniques d'élévation ont été mis à disposition dans le cadre du Bibliothèque de composants de matériaux sur GitHub (le suivi de la bibliothèque de support de conception d'Android et de Material Design Lite axé sur le Web de Google), qui apporte les fonctionnalités de Material bonté pour Android sous la forme de vues personnalisées et pour le Web sous la forme d'ensembles pouvant être importés et utilisés comme du HTML standard Mots clés.
Aujourd'hui, à la veille du quatrième anniversaire de Material Design, Google semble préparer la prochaine génération de son inspiré du papier et de l'encre esthétique: Conception matérielle 2. Peu d’informations précieuses sont accessibles au public sur Material Design 2, dont nous avons découvert l’existence cette semaine dans de nouveaux commits dans Chromium Gerrit. Nous ne prétendons pas qu'il s'agit d'un approprié successeur du nouveau framework Material Design, mais les engagements indiquent des changements notables, bien que subtils, dans les palettes de couleurs, l'iconographie et le comportement de l'écran tactile.
Material Design 2 apparaît dans Chromium Gerrit
Début février, de nouveaux commits sur Chromium Gerrit ont implémenté l'interface utilisateur « Material Design 2 » dans Chrome. tabstrip: les onglets déplaçables contenant les titres des pages Web, les favicons et le bouton « Fermer l'onglet » au-dessus de celui de Chrome. barre d'adresse.
Les commits ne sont pas drastiques, mais apportent des modifications à l'apparence des onglets de Chrome. Ils augmentent la hauteur de la languette; apporter des modifications non spécifiées à la disposition du contenu des onglets, en particulier aux titres et aux indicateurs d'alerte; et diminuez la largeur tactile de l'onglet tout en augmentant la largeur standard de l'onglet. Ils explicitement ne le faites pas modifiez les couleurs de l’indicateur d’alerte d’onglet, les couleurs du séparateur d’onglets, le bouton « nouvel onglet » ou toute typographie d’onglet.
De manière révélatrice, les commits font référence à une icône de bouton de fermeture de l'onglet « Material Design 2 » et aux « constantes de couleur de base requises pour Google Material Design 2 ».
En approfondissant le code de validation, on découvre de nouvelles palettes de couleurs « Material Design 2 » pour les thèmes Chromium gris, rouge et rouge-foncé, ainsi que de nouvelles couleurs pour la barre d'outils Chrome standard et la barre d'outils de navigation privée. Nous avons utilisé une table de recherche hexadécimale pour générer les échantillons RVB :
Le rouge de Material Design 2 est légèrement plus foncé que le Material Design actuel Rouge 800 (#C62828) et Rouge 600 (#E53935), tandis que les nouvelles nuances de gris (#3C4043, #5F6368, #BDC1C6, #F1F3F4) ont une teinte plus claire et bleutée. La conception matérielle présente des gris traditionnels, où R=G=B, tandis qu'ici, B>G>R à chaque nuance (mais seulement de 1 à 4 sur 255).
Les versions compatibles avec Material Design 2, Chrome comporteront également une barre d'outils beaucoup plus lumineuse que les versions actuelles: elle est presque blanche par rapport à la palette de couleurs grisâtre actuelle.
Voici une maquette rapide de l'apparence de la barre d'outils avec les nouvelles couleurs appliquées :
Enfin, le commit ajoute un nouveau IsTouchOptimizedMatériau() drapeau au MaterialDesignController, qui pourrait faire référence à des éléments Material Design 2 optimisés au toucher. Nous avons écrit début janvier sur les efforts de Google pour améliorer la Prise en charge de l'écran tactile du navigateur Web Chrome sur les appareils Chrome OS, et cela semble en être une continuation.
Par exemple, le commit montre que sur les appareils à écran tactile, SetStackedLayout de Chrome sera « toujours » activé.' Par défaut, lorsque vous ouvrez un grand nombre d'onglets, la largeur des autres onglets diminue pour s'adapter à la taille de l'onglet. de nouveaux onglets. La disposition empilée de Chrome conserve les largeurs des onglets d'origine et ajoute de nouveaux onglets derrière eux.
L'importance de la couleur dans la conception matérielle
Alors, que signifient les nouvelles couleurs dans le contexte plus large du Material Design ?
La conception matérielle va bien au-delà des calques, des composants et des éléments, ainsi que de la façon dont ils se comportent les uns par rapport aux autres. Au cœur du motif de conception de Google se trouvent des thèmes très contrastés, des couleurs vives et des reflets audacieux: c'est ce qui permet aux applications compatibles Material Design de se démarquer de la foule.
Google fournit un échantillon palettes de couleurs conçu pour « bien travailler ensemble » sur toutes les plateformes, et encourage les développeurs qui en profitent pour s'approvisionner une couleur d'application principale - autrement connue sous le nom de couleur "dominante" - issue d'une collection de 500 couleurs différentes échantillons. (Pensez au « bleu », au « vert » ou au « violet » et à d'autres couleurs de base.) Si nécessaire, ils se procurent une couleur secondaire à partir d'une collection élargie de 700 couleurs. (des couleurs complémentaires pour les éléments d'interface utilisateur les plus importants, et analogues pour les éléments d'interface utilisateur moins importants, et une couleur tertiaire provenant d'un sous-ensemble de 300).
La couleur joue un rôle important dans la hiérarchie du Material Design. Les couleurs vives suggèrent l'importance: elles sont réservées aux boutons proéminents et autres éléments interactifs. Les couleurs plus subtiles, en revanche, ajoutent un intérêt visuel en accentuant les champs de texte, les barres de progression, les liens et d'autres parties de l'interface utilisateur.
D'après ce que nous savons de la palette de couleurs de Material Design 2, au moins quelques-uns des échantillons des "500 primaires" de Google, comme Red 600 et 800, sont plus foncés que leurs prédécesseurs Material Design. Mais d'autres, comme le gris, reçoivent le traitement inverse: les échantillons de gris et de blanc affichés dans la maquette de l'onglet Chrome ont une échelle de gris plus froide et des valeurs de bleu plus élevées.
Pour l’instant, c’est tout ce que nous savons vraiment sur Material Design 2. Mais les commits pourraient être le signe que quelque chose se passe dans les coulisses, et si cela est vrai, nous pourrions en apprendre davantage le plus tôt possible. Google devrait dévoiler Android P, la prochaine version majeure d'Android, dès mars, et Google I/O 2018 débutera le 8 mai. Les deux sont d’excellentes opportunités de dévoiler Material Design 2.
Mise à jour du 04/02/2018 : Peu de temps après la publication de cet article, le commit a été rendu privé, ce qui signifie potentiellement qu'il était censé rester secret. Nous continuerons de vérifier les modifications apportées à Chromium Gerrit et mettrons à jour cet article si nous en trouvons.