De la visite au panier
Ready ?
Dans le cadre de mes études à la Haute École Albert Jacquard, en option DWT, j’ai clôturé le premier quadrimestre 2024 avec un projet solo intitulé “Décembre”.
L’objectif ? Concevoir une page web dédiée à la présentation et à la mise en vente d’une oeuvre. Ce projet marque l’un de mes premiers pas dans la création de fonctionnalités plus avancées, et a été l’occasion idéale de mettre en pratique mes bases en design et en développement web.
Une demande, un projet
Pour ce projet, j’ai choisi comme “œuvre”, une exposition artistique appelée CAPTURE #2, présentée à l’époque au Pavillon de Namur – un centre culturel qui, anciennement, était le Pavillon belge de l’Exposition universelle de Milan.
Le site devait permettre de simuler l’achat, le don et la livraison fictive d’un produit dérivé d’une œuvre. Ici la vente de billets d’entrée, proposés en deux versions : physique ou dématérialisée.
Lire entre les lignes
Ma principale source d’inspiration et de recherche a été la visite de l’exposition CAPTURE #2 elle-même, ainsi que les échanges avec les médiateurs présents sur place. Cette immersion directe m’a permis de mieux comprendre les intentions artistiques de l’événement et les attentes du public visé. Pour enrichir cette analyse, j’ai également étudié plusieurs sites web d’expositions culturelles, afin d’en repérer les bonnes pratiques en matière de : structuration, d’accessibilité et de système de réservation!
Et la DA?
Le direction artistique du site s’est construite autour de l’envie de retraduire visuellement l’univers de l’exposition CAPTURE #2, qui mêle nature, technologie et immersion sensorielle.
I. La palette de couleur
Pour refléter le contraste entre le vivant et le numérique, j’ai opté pour un jaune-vert, évoquant la nature, mêlée à des teintes mauves sur un fond sombre, en lien avec les œuvres numériques souvent projetées dans la pénombre.
II. La recherche typographique
“Thunder”, une fonte impactante, contemporaine, avec une forte présence visuelle. “Poppins”, une sans-serif simple et lisible, parfaite pour les paragraphes explicatifs et les éléments d’interface. Couplée à ça, “Soria”, apporte un contraste et un équilibre élegant en résonance avec l’esprit de “Capture#2”.
III. La préparation graphique
Avant de passer au code, j’ai travaillé sur la conception d’un “wireframe” pour définir la structure de la landing page ainsi que d’un “sitemap” clair pour organiser la navigation autour des besoins utilisateurs.
L’envers du décors
Derrière l’expérience visuelle, j’ai conçu une structure technique pensée pour être fluide et intuitive.Un des éléments centraux du site était la mise en place d’un panier interactif.
Grâce à JavaScript, les choix étaient mémorisés temporairement, simulant une vraie expérience d’achat. J’ai également intégré des ajustements dynamiques sur mobile, comme l’ajout de boutons pour gérer facilement le nombre de billets.
Le final
Ce projet m’a permis d’allier design, UX et développement autour d’un sujet culturel inspirant. Travailler seule sur toutes les étapes m’a aidé à structurer un projet complet et à résoudre des défis techniques concrets.
J’ai pu expérimenter la gestion d’un panier, un processus d’achat en plusieurs étapes, et l’adaptation mobile. Ce travail m’a aussi appris à mieux gérer mon temps et à documenter rigoureusement mon avancée.
Bien que perfectible, “Décembre” représente une étape importante dans ma progression, avec un projet autonome et cohérent.