Le Material Design : principe et applications pratiques

Maj. le 5 décembre 2014 à 10 h 34 min

C’est un concept qui est revenu fréquemment dans certaines actualités récentes du petit monde d’Android. Un concept au nom séduisant, mais dont la particularité est en soi assez difficile à saisir. Alors que le Play Store de Google s’est converti à ce nouveau concept graphique avec sa dernière mise en jour, et qu’il devrait être au coeur de l’expérience Android L, on vous explique rapidement en quoi consiste le material design et quels sont ses apports pour l’utilisateur d’Android.

Présenté au cours de la dernière Google I/O, le concept de Material Design est en soi un peu compliqué à expliquer, donc commençons par évoquer ce à quoi il est censé parer, en prenant l’exemple d’une application qui ne fonctionne pas sous Material Design.

material design explication

C’est le cas notamment de l’application Météo d’iOS, une application que l’on peut qualifier de réussie au niveau du design mais dont l’interactivité n’est pas vraiment intuitive. Les zones que l’utilisateur peut activer tactilement ne sont pas explicites et il faut un peu de recherche avant de découvrir que la partie haute de l’écran peut être activée comme vous pouvez le voir sur l’image ci-dessus. Il est donc parfois difficile pour l’utilisateur de s’y retrouver sans tâtonner, et parfois sans activer une option ou un lien non désiré.

fonctionnement material design

Pire, certains mouvements suivant la logique de l’application ne font pas toujours immédiatement sens quand on les active. Toujours dans la même application, il est possible de réduire une page en appuyant sur en bas à droite de l’écran. La page se réduit en faisant une animation de glissement, ce qui laisse à penser qu’elle peut être réagrandie en faisant glisser le doigt le long de l’écran. Ce qui n’est pas le cas, puisqu’il faut à nouveau appuyer sur une des lignes réduites.

explication material design

Pour se figurer les problèmes d’interactivité de l’application, il est possible de la recréer sous forme papier. On s’aperçoit alors qu’il est nécessaire, si l’on veut recréer les interactions possibles, de couper une partie de l’écran et de le déplacer. Ce modèle papier montre de quelle façon l’interaction dans l’application devrait s’arranger pour que l’utilisateur s’y retrouve immédiatement.

Les conventions de ce genre de design ne sont donc pas des plus instinctives, et c’est sur ce point que le Material Design intervient. Grâce à ce concept, les applications créées sur ce modèle ne laisseront plus passer des errances de design de la sorte en matérialisant le mouvement dans les applications. Concrètement par exemple, si vous choisissez de déplacer une ligne, ses contours seront nettement visibles, et si vous la faîtes glisser, une ombre et des effets de perspective vous permettront de vous y retrouver facilement.

material design fonctionnement

Le principe du Material Design est donc d’offrir à l’utilisateur une expérience qui se rapproche au plus près de celle qu’elle serait dans la vie de tous les jours. En créant des designs instinctifs, il permet à ceux qui n’ont pas toujours l’habitude de s’y retrouver sur un écran tactile de ne plus être perdus. Et aux autres d’éviter les manipulations involontaires parfois parasites dans une application.

Via

Réagissez à cet article !
  • Atlas

    Le truc en papier est très bien fait, et c’est vrai, la grande faiblesse de iOS 7 et le manque de visibilité des zones « touchables », ce qui est ironique en sachant les avancées que Apple avait introduit dans ce domaine avec la première version de iPhone OS.

    Après, les idées du Material design ne sont pas nouvelles, c’est au contraire les bases du design. L’utilisateur doit savoir où il se trouve, où il peut aller et comment, et quelles sont les cibles qu’il peut toucher à l’écran. L’utilisateur ne devrait pas à avoir à apprendre comment utiliser l’interface, et se sont ses habitudes qu’il a apprises dans le monde réel qui devraient le guider. Poussé à l’extrême cette notion a mené au design skeuomorphe que Apple a largement défendu depuis sa création, et qu’ils ont poussé encore plus ces dernières dix années (en influençant tous les domaines du design), et que les gens voulaient absolument voir disparaître fin 2013.

    Google a bien fait de ne pas aller trop loin dans le design ‘flat’. Ainsi ils se démarquent des autres avec une interface facilement reconnaissable : il faut dire que jusqu’à maintenant, le visage de Android n’était pas très clair, à mon avis, contrairement à celui de iOS, immédiatement reconnaissable avec sa grille d’icônes. Une chose que Google devrait arrêter de faire par contre, c’est de changer tout le temps certaines icônes, j’espère que celles-ci sont là pour rester un bon moment, ça aidera les gens à reconnaître ou même s’attacher à l’OS plus facilement.

    • Jean Poopyx

      Marque un bon point ! Après tout au final c’est chacun ces gouts.
      Pour moi Google s’ils iront plus loin dans le flat ça changerais pas grand chose. Parce que une chose est claire , chaque constructeur se distingue de son flat design, par exemple on sait faire la différence entre celui de MS, IOS et Google. Tout ça parce que l’interface est différente, qu’alors il y a d’autre interface de petit constructeur un peut confondu.

      • Atlas

        Oui, on est peut être enfin arrivé à un moment où même les utilisateurs lambda peuvent distinguer les OS entre eux rapidement.

  • YouNex

    C’est clair :)

Abonnez-vous gratuitement à la newsletter
Chaque semaine, le meilleur de Phonandroid dans votre boite mail !
Demandez nos derniers articles !
Android : Oreo au point mort avec 0,5% des terminaux, Marshmallow passe en dessous des 30%

Découvrez la répartition des versions d’Android du mois de décembre à travers le classement que vient de publier Google, Oreo ne représente que 0,5% de part de marché et Marshmallow passe en dessous des 30%. Il reste encore beaucoup de chemin pour arriver au niveau du Nougat et Marshmallow. Analysons le classement pour voir de quoi il retourne exactement.