Dans le cadre d’un projet du second semestre du BUT MMI, j’ai conçu un site web personnel en me basant sur une maquette Figma fournie par notre enseignant. L’objectif principal était de développer une interface responsive, adaptée aux formats desktop, tablette et mobile. Le site intégrait également des animations au survol (hover) afin d’améliorer l’interactivité, tout en respectant une structure HTML sémantique et un CSS organisé et lisible.
AC14.01 : Exploiter de manière autonome un environnement de développement efficace et productif
AC14.02 : Produire des pages Web fluides incluant un balisage sémantique efficace et des interactions simples
AC24.01 : Produire des pages et applications Web responsives
Détails du projet
What / Quoi
Dans le cadre du second semestre du BUT MMI, j’ai développé un site web personnel à partir d’une maquette Figma fournie par l’enseignant. Le but était de créer un site responsive, adapté aux écrans d’ordinateur, tablette et mobile, intégrant des effets de survol (hover) pour améliorer l’interaction utilisateur.
Why / Pourquoi
Ce projet m’a permis de consolider mes compétences en intégration front-end. En reproduisant fidèlement une maquette imposée, j’ai affiné mon sens du détail et appris à respecter des contraintes graphiques précises. Il m’a aussi permis de travailler mon autonomie et ma capacité à produire un site fonctionnel et conforme aux standards du web.
Where / Où
La réalisation s’est faite entre les séances de cours d’intégration et des sessions de travail personnel à domicile. J’ai utilisé mon propre environnement de développement pour concevoir et tester le site.
When / Quand
Ce projet a été mené entre février et avril 2025, au cours du second semestre de l’année universitaire 2024-2025.
Who / Qui
Entièrement réalisé de manière individuelle, j’ai assuré l’intégration HTML et CSS du site, de la structure de base jusqu’aux finitions graphiques.
Lien avec les apprentissages critiques
Grâce à ce projet, j’ai appliqué plusieurs acquis essentiels du BUT MMI :
Utilisation autonome d’un environnement de développement performant (AC14.01)
Mise en œuvre d’un balisage HTML sémantique et d’un design responsive (AC14.02, AC24.01)
Intégration fluide d’animations pour enrichir l’expérience utilisateur
Ce que j’ai appris
Technique : meilleure gestion du responsive design, maîtrise des animations CSS simples et des bonnes pratiques en intégration.
Méthodologie : organisation du travail en autonomie, gestion du temps, et respect d’un cahier des charges graphique strict.
Conception : compréhension des enjeux de fidélité à une maquette dans une démarche professionnelle.
