Headspace

Posté le 4 septembre 2017 dans Webdesign

Headspace

Aujourd’hui je voudrais vous parler d’Headspace.

Headspace est une application d’aide à la méditation, pour les personnes souffrant de troubles du sommeil, de stress et assimilés.

Le design du site en lui même n’est pas une révolution, mais il y a tout de même des gros points forts qui s’en dégagent :

  • la charte graphique “friendly”
  • les effets de fondu particulièrement adaptés au sujet
  • le design en split screen parfaitement réalisé
  • la jolie version mobile

La charte graphique est très agréable et amicale, du fait de ses couleurs et des personnages qui habitent la page. Ce côté amical et bienvenu est plus qu’adapté au vu du thème abordé par le site. Il s’agit d’ailleurs de sa plus grande force.

Les effets de fondu au nivrau des blocs “Stressed out” est extrêmement pertinent. L’effet de fondu qui se calque sur le scroll de la page permet au texte d’apparaître et disparaître progressivement, comme s’il s’agissait d’une respiration lente pendant une séance de méditation. C’est un effet qui nous plonge inconsciemment dans le sujet, et nous rends en quelque sorte acteur.

Le design en split screen est vraiment bien réalisé ici, car il ne s’agit pas de blocs faisant chacun 50% de la largeur de la fenêtre avec une séparation franche et précise. Au contraire, il donne l’impression d’un bloc en pleine largeur composé d’une image et de texte, tour à tour à gauche puis à droite. La délimitation se fait par la taille de l’image et est de ce fait très douce.

Headspace

La jolie version mobile est principalement le résultat de cette belle charte graphique. Les couleurs y sont plus abondantes que sur la version desktop et interpellent plus. Ce qui est une bonne chose, quand on pense que la consultation de sites sur mobile se fait souvent entre deux portes et souvent rapidement. Il est donc important que le site ait un impact visuel plus fort.

Au final, c’est un site dont le design n’a à priori pas grand chose de spécial, mais en creusant plus il recèle des petites perles !

headspace.com