Webfolio

Processus de création

Inspiration : pour réaliser ce site web, il a tout d'abord fallu définir le style et l'ambiance graphique souhaitée. Je me suis donc inspirée de mon portfolio papier pour coordonner mes visuels. Mon identité graphique est basée sur un style zen, léger, agrémenté de couleurs pastels.

mock up portfolio

Wireframe : il s'agit d'une étape importante dans la réalisation du site. En effet, le wireframe permet de définir toute l'architecture du site avec le positionnement des éléments principaux sous forme de gros blocs et ainsi, anticiper l’agencement et l’organisation. Le type de balise HTML peut églement être défini à ce moment là pour gagner du temps par la suite. J'ai créé mon wireframe avec le logiciel draw.io.

Deux versions ont été faites : pour petits et grands écrans.

wireframe

Maquettes responsives : cette étape consiste à créer et designer la maquette du site web. Réalisées avec Photoshop, elle se veut beaucoup plus précises et correspond au rendu final de la page internet. Mes visuels ont cependant légèrement évolués au fur et à mesure de l'intégration.

maquette mobile
maquette desktop