Projet Backstage

Afin de valider mon année dans ma formation de webdesigner, il était indispensable de réaliser un site tout au long de l’année avec toutes les étapes. De l’arborescence du site, en passant par l’UX et l’analyse de marché, pour finir par les wireframe, les maquettes graphiques ainsi que des prototypages grâce au logiciel Adobe XD.

Résumé

L’agence de voyage qui propose de visiter des lieux de tournages pour quatre grandes sagas, Backstage, veut lancer son site. Il faut donc dans un premier temps déterminer : - Le profil de l’utilisateur - Faire une analyse concrète du marché (benchmark)

Avec tous ces éléments en mains, j’ai pu concevoir les wireframe ainsi que les maquettes graphiques.

Ambiance graphique

Typographies

Montserrat Light

Abcdefghijklmnopqrstuvwxyz0123456789

Montserrat Bold

Abcdefghijklmnopqrstuvwxyz0123456789

Museo 700

Abcdefghijklmnopqrstuvwxyz0123456789

Museo 900

Abcdefghijklmnopqrstuvwxyz0123456789

Technologies

  • -HTML
  • -CSS
  • -jQuery
  • -Photoshop
  • -Adobe XD

Maquettes

Design et graphisme

Le design du site se devait d’être immersif. Rappeler l’univers cinématographique, le challenge était de s’inspirer de l’univers graphique du cinéma sans totalement plonger dedans, puisqu’il s’agit d’un site qui propose des voyages.

Prototypage

Responsive

Adapté à tous les écrans

Le site Backstage est un site responsive, qui s’adapte aussi bien aux tablettes qu'aux mobiles.