Portfolio
Conçu et développé dans le cadre du cours de Design Web, ce projet consiste en la création de mon site portfolio interactif. L’enjeu principal était de concevoir une plateforme qui ne soit pas un simple CV en ligne, mais une véritable extension de mon univers créatif. J’ai choisi de construire l’expérience utilisateur (UX) autour de la métaphore du livre : « Des sites qui se parcourent comme une histoire… page après page. »
Mes étapes
-
déation, Concept & Character Design : La première phase a consisté à définir le fil conducteur visuel. Voulant un site chaleureux et qui me ressemble, j’ai travaillé sur du character design pour créer mon propre avatar en version cartoon. Cet avatar m’accompagne tout au long du site (en train de lire, sur un nuage dans mon parcours, ou à côté de mes coordonnées) pour guider l’utilisateur.
-
Arborescence & Wireframes (UX) : J’ai structuré la page d’accueil de manière à ce qu’elle raconte une histoire chronologique et logique. Les wireframes ont permis de valider la disposition des blocs : l’introduction, la « bibliothèque à compétences » (représentée par des livres alignés), la section « Mes réalisations » (conçue comme une étagère de livres thématiques), puis le fil de mon parcours sous forme de frise temporelle, pour finir sur le formulaire de contact.
-
Design Visuel (Haute Fidélité) & Univers Graphique : Le passage à la haute fidélité a permis d’harmoniser les illustrations personnalisées avec les éléments UI. J’ai conçu des couvertures de livres uniques pour chacun de mes projets phares (comme Soundlabs, Marvel, ou Les Voisins Solidaires).
-
Déclinaison des Pages Internes (Études de Cas) : J’ai également conçu le template des pages intérieures. Lorsqu’un utilisateur clique sur un projet (comme sur l’exemple de Soundlabs), il accède à une mise en page aérée et structurée reprenant la présentation de la maquette, la méthodologie (Moodboard, Wireframes), les fonctionnalités clés et une galerie d’écrans.
Mon design
-
Palette de couleurs : Le site utilise une harmonie de teintes douces et organiques (nuances de beige, crème et marron chocolat pour le footer). Ce choix crée une atmosphère feutrée, confortable et apaisante, qui rappelle le papier des livres anciens et l’univers de la lecture.
-
Typographie & Style : L’association de polices élégantes pour les titres et d’illustrations de style cartoon personnalisées apporte un équilibre parfait entre professionnalisme et originalité, montrant à la fois mes compétences de designer et mon identité graphique.
Fonctionalités clés
-
La Bibliothèque à compétences : Une manière ludique et visuelle d’afficher mes outils techniques et méthodologiques.
-
Le Rayon des Réalisations : Une grille interactive où chaque projet majeur est modélisé sous la forme d’un livre (Site reproduction, Plai, Portfolio, Les Voisins Solidaires, Marvel, Soundlabs).
-
La Frise « Mon Parcours » : Une ligne du temps poétique où mon avatar progresse de nuage en nuage pour détailler mes formations et expériences passées (2020 à aujourd’hui).
-
Le Bloc Contact : Un espace clair avec formulaire intégré, complété par un footer chocolat structuré pour la navigation rapide.
Conclusion
Gallerie
