Le contexte
Dans le cadre de mes évaluations du premier quadrimestre, j'ai dû créer un projet moi-même, le Projet Janus, qui avait pour objectif de concevoir un site web simple centré sur un influenceur, à travers une approche à la fois promotionnelle, critique et factuelle. Le projet devait comporter trois pages distinctes : une page valorisant la personnalité choisie, une seconde développant une réflexion critique sur son activité, et une dernière rassemblant des données factuelles sourcées. L'ensemble devait répondre à des normes strictes d'accessibilité, de sémantique web et de cohérence graphique, tout en démontrant une pensée critique construite.
Choix de l'influenceur
Avant de commencer les recherches, il me fallait choisir une personnalité. Plusieurs options m'attiraient : Jennie, chanteuse coréenne de renommée internationale, ou Squeezie, l'un des plus grands influenceurs francophones. Étant un grand fan des deux, le choix n'a pas été simple. J'ai finalement opté pour la personnalité que je connaissais le mieux : Squeezie.
Recherche et approche
Au début du projet, j'ai rencontré quelques difficultés à cerner les attentes précises en matière de contenu. Je ne savais pas s'il fallait aborder la vie personnelle de la personnalité, retracer son évolution, présenter ses projets ou simplement parler de sa popularité. Ce flou m'a amené à tâtonner avant de comprendre que la première page devait fonctionner comme une véritable mise en valeur, presque comme si je devais "vendre" ou promouvoir l'influenceur, à la manière d'un contenu sponsorisé. Cette prise de conscience m'a permis d'adopter une approche plus stratégique, en pensant le contenu comme une vitrine soignée destinée à convaincre.
Une fois cette direction clarifiée, j'ai mené une phase de recherche approfondie afin de mieux comprendre le positionnement public de la personnalité choisie, son parcours, ses projets marquants, ses statistiques et les débats qui l'entourent. J'ai également étudié plusieurs sites existants pour analyser comment les personnalités sont représentées en ligne, tant sur le plan du design que du contenu. Cette analyse comparative m'a permis d'identifier les bonnes pratiques en matière d'expérience utilisateur, de structuration du contenu et de hiérarchie visuelle.
Ces éléments ont nourri une direction artistique en accord avec l'identité de l'influenceur, tout en laissant de la place à une interprétation personnelle du sujet.
Direction artistique et prototypes
Les prototypes ont été conçues sur Figma. Une attention particulière a été portée à la hiérarchie de l'information, à la cohérence des composants et à la clarté du parcours utilisateur. Chaque page avait son propre ton tout en restant dans une même logique visuelle. La page promotionnelle était immersive et engageante, la page critique plus sobre et structurée, et la page factuelle plus légère et amusante. L'expérience devait être fluide, aussi bien sur desktop que sur mobile, tout en respectant les normes d'accessibilité imposées par le briefing.
Pour la page promotionnelle, j'ai choisi de mélanger les différents univers que l'influenceur fréquente — comme Twitch, YouTube, le GP Explorer ou Gentle Mates — afin de créer plusieurs ambiances visuelles au sein d'une seule page. Pour la partie YouTube, j'ai utilisé ses couleurs caractéristiques, rose et bleu foncé. La section Twitch reprend les codes de la plateforme en simulant une interface typique. Pour évoquer le GP Explorer, j'ai opté pour une dominante bleu foncé, tandis que la partie dédiée à Gentle Mates s'inspire de leur identité visuelle : une teinte rose douce combinée à une typographie manuscrite.
La page critique devait trancher radicalement avec l'univers promotionnel. J'ai choisi une direction artistique plus sombre, reposant sur un rouge foncé combiné à des touches de rose. Le contenu aborde plusieurs polémiques ayant concerné la personnalité. J'ai également adopté une mise en page diagonale pour casser la linéarité classique des sections, apporter du dynamisme visuel, et guider le regard de l'utilisateur de manière plus expressive.
Enfin, la page factuelle présente ses statistiques principales sur Twitch, YouTube, Instagram et X, ainsi que quelques informations personnelles. J'ai intégré quatre boutons permettant d'afficher dynamiquement chaque bloc de données, ainsi qu'une "carte d'identité" placée en introduction pour donner un aperçu rapide et structuré.
Développement
Le développement a été réalisé en HTML, CSS et JavaScript. J'ai utilisé Visual Studio Code pour coder, en appliquant une méthode BEM pour le nommage des classes CSS. Le site est entièrement responsive. Chaque composant a été pensé de manière sémantique, pour garantir à la fois performance, clarté du code et compatibilité. J'ai consacré environ une semaine au développement, en y travaillant en moyenne neuf heures par jour.
Points forts et axes d'amélioration
Je suis particulièrement fier du résultat global du site, notamment de l'équilibre trouvé entre immersion visuelle, lisibilité et richesse du contenu. En revanche, la page factuelle a été un point faible dans l'évaluation : le contenu n'était pas clair, ce qui a nui à la clarté. Avec le recul, j'aurais dû simplifier cette partie, en modifiant l'animation que j'ai mise ou ne pas mettre d'animation tout court.
Conclusion
Le projet Janus a été une occasion de mettre en œuvre toutes les compétences acquises depuis le début de mon année: recherche, conception UX, design d'interface, développement front-end et rigueur technique. Il m'a permis de traiter un sujet grand public avec une approche à la fois professionnelle et critique. Ce projet m'a aussi sensibilisé à l'importance de la hiérarchisation de l'information, de l'accessibilité web et du lien entre narration et technique. J'ai aimé faire ce travail.