Technologies
Transformation Numérique
Prestations de service
Technologies

Python

Django, Flask

Wagtail, Django CMS, CKAN

PHP

Laravel, Symfony

Magento, Opencart

Wordpress, Drupal, Joomla

JavaScript

React, Angular, Vue

Android

Java

Ionic, Cordova

iOS

Swift, Objective C

Transformation Numérique

Numérisation bancaire

Traitement des données médicales

Numérisation du commerce de détail

Main d'œuvre de programmation

Solutions pour site d'emploi

Prestations de service

Développement SaaS

Développement web

Développement d'applications

Intelligence artificielle

Conception UX/UI

Développement de logiciels

Maintenance Web

Intégration

Programmation

Gestion infonuagique

Services conseils

logo Nixa

Développement numérique
Application, Web, Logiciel

Du nouveau chez NIXA #NixaLife Planifiez votre prochain projet

Parce qu'on s'amuse et qu'on apprend plein de truc, on a envie de vous les partager ♥️

Material et le style Google Now

Dans la première partie de cette série, nous avons abordé l'utilisation du style Metro pour présenter un site web de manière structurée, avec un style qui est très modulaire et qui accorde une grande importance à la typographie. Il est conseillé de lire la première partie, qui se trouve ici, si vous ne l’avez pas déjà fait.

 

Dans la seconde partie de cette série, nous aborderons l'inspiration du style Material de Google. Le style Material est semblable au style Metro avec l’utilisation des couleurs vives et unies, mais le style de Google rajoute des ombres portées afin de différencier la profondeur des éléments. Ce qui distingue ce style parmi les autres est l'utilisation d'animations et de transitions fluides afin de rendre le contenu d'une page web plus dynamique.

Google - Material

Historique

2012 - Now Google apporte un vent de fraîcheur sur leur plateforme mobile, Android, en présentant Google Now, une application qui présente un résumé contextualisé basé sur la localisation de l’utilisateur. Google Now est la première application qui adopte un nouveau style illuminé, présentant l’information sous forme de cartes, avec des couleurs très vives et une typographie élégante.

 

 

2014 - Lollipop Google présente la cinquième version de son système d’exploitation mobile, Android Lollipop, changeant complètement de direction graphique. Depuis le tout début d’Android, le design était entièrement foncé, avec seulement quelques légères démarcations bleues. En suivant le style de Google Now, le système entier est devenu illuminé, avec des blancs purs et des couleurs vives.

Avec Lollipop, Google a misé beaucoup sur la métaphore des cartes, en combinant des ombres portées avec un style très plat et minimaliste. Il y a aussi un énorme travail qui a été fait sur la fluidité des animations, ce qui donne l’impression que tout ce qui est à l’écran peut être manipulé facilement. Cela fait un contraste notable avec les premières versions d’Android: alors que les animations auparavant étaient délaissées et non-fluides à cause du manque de performance du système.

2014 - Android Wear Google a apporté son nouveau style, maintenant sous le nom de Material, sur une plateforme entièrement différente.


Le style

Forme:

  • Cartes séparées entre niveaux avec ombrages
  • Ombrages
  • Pas de dégradés
  • Couleurs vives

Typographie:

  • Grandes typographies
  • Police de choix: Roboto

Fonds:

  • Sections séparées par différentes couleurs vives
  • La typographie devant les couleurs est souvent blanche ou noire afin de rester visible.

Iĉones:

  • Icônes contextuelles blanches
  • Icônes d’applications multicolores avec profondeur

 

Exemples du web

 

Google I/O (https://events.google.com/io2015/) - Conférence officielle de Google

 

Angular (https://angular.io/) - Plateforme de développement d’applications web

 

AndroidTO (http://androidto.com/) - Conférence sur Android

 

Outils Material

 

Material Design Lite (http://www.getmdl.io/) - Librairie de développement simplifiée

 

Polymer Project (https://www.polymer-project.org/) - Framework web officiel

 

MaterialUp (http://www.materialup.com/) - Communauté web de Material

 

Finalement, si vous voulez un site web qui présente le contenu de manière dynamique, avec un style qui met l'emphase sur des animations et des transitions fluides, l'utilisation du style Material est conseillée. Dans la dernière partie de cette série, nous aborderons l'inspiration du style translucide d'iOS et d'OSX de la compagnie Apple afin de rendre le design de votre site web plus raffiné.

Chez Nixa nous sommes des passionnés de design et de nouvelles technologies. Nous serions heureux de partager notre passion avec vous.

Nous Contacter