Solutions

Solutions industrielles

Besoins d'entreprise

  • Intégration de systèmes
  • Stratégie
  • Commercialisation
  • Conformité GDPR
  • Conformité ADA (accessibilité)
  • Gestion des infrastructures

Produits

Design des géants de la technologie, Partie 3: Le style translucide d’iOS et d’OSX

Dans la première et la seconde partie de cette série, nous avons vu les designs de Microsoft avec Modern UI et de Google avec Material. Intéressons-nous maintenant au style d'Apple pour iOS et OSX.

Le style d'Apple est très différent du style de Google et Microsoft. Même si le style d'Apple est énormément moins skeuomorphic qu'auparavant, il est tout de même celui qui garde le plus d'éléments graphiques traditionnels, tel que des dégradés et des ombres. C'est en fusionnant ces éléments avec un effet translucide que l'interface devient unique. Elle prends la couleur du contenu à l'arrière de celle-ci, ce qui fait en sorte que l'interface graphique semble être adaptée à l'utilisateur à chaque fois. Cette façon de présenter et de contextualiser le contenu peut être adaptée pour le développement web.

Apple - Transparency

Historique

2013 - iOS7 Apple se défait de son attirance envers le faux cuir afin de sortir une version de son système d’exploitation mobile qui n’est pas skeuomorphic. iOS 7 est un redesign complet de l’interface, vers un style plus minimaliste et coloré que le précédent. De grandes typographies minces sont utilisées, les icônes sont plus raffinées et l’interface est parsemée d’éléments semi-transparents, qui laissent paraître l’arrière-plan en transparence floue.

2014 - OS X 10.10 Apple présente OS X Yosemite, lun système d’exploitation ayant un style similaire à la dernière version d’iOS. Des nouvelles icônes, des éléments ayant un fond transparent et une  typographie rafinée.

2015 - watchOS Avec la sortie de l’Apple Watch, Apple emprunte certains éléments d’iOS, mais épure l’interface en plaçant quasiment tous les éléments sur des fonds noirs. Ce choix démarque ce nouveau design de celui des autres produits Apple.

Le style

Forme:

  • Grandes formes translucides
  • Des ombrages
  • Des dégradés
  • Couleurs blanches et noirs

Typographie:

  • Grandes typographies minces
  • Police de choix: Helvetica Neue

Fonds:

  • Fonds translucides
  • Dégradés se rapprochant de la couleur grise

Icônes:

  • Icônes blanches
  • Parfois munies d’une bordure entourant le symbole d’un cercle
  • Formes habituellement faites à partir de minces lignes


Exemples du web

Peek Calendar (http://www.peekcalendar.com/) - Application de calendrier

Valencia (http://valencia.mustachethemes.com/) - Thème HTML

Outils iOS

TETHR (http://www.invisionapp.com/tethr) - Kit de design pour Photoshop et Sketch

App Icon Template (http://appicontemplate.com/) - Templates de design d’icônes

Ionic (http://ionicframework.com/) - Framework de développement d’applications

En bref, si vous voulez un site web qui met la priorité sur le contenu, soit avec des effets translucides ou avec une interface plutôt minimaliste, l'utilisation du style translucide d'iOS et d'OSX est conseillée. Mais suite à l'étude de ces trois styles, pouvons-nous donc conclure que les tendances du design web sont définies par Google, Apple et Microsoft? Ou est-ce les géants qui suivent la vague d’un certain style qui est déjà présent sur le web? Nos prochains articles de design web vont définitivement nous aider à répondre à cette question.

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

Nous contacter
Logo Nixa spécialistes digital