Projet séminaire

Contexte : Dans le cadre d'un séminaire imposé par l'école, notre équipe a conçu et développé un site vitrine pour une entreprise fictive de spa animalier : Coeur et pattes. Ce projet intensif nous a permis de travailler en équipe sous contraintes de temps et d'objectifs.

🐾 Site vitrine — Coeur et pattes

"Coeur et pattes" est un spa et centre de bien-être animalier fictif. L'objectif du site était de présenter les services proposés (toilettage, massages, balnéothérapie) et de permettre aux propriétaires d'animaux de se renseigner et de réserver une séance en ligne.

Capture d'écran du site Coeur et pattes — page d'accueil
Page d'accueil du site vitrine « Coeur et pattes — Spa & Bien-être animalier »

🛠️ Outils et technologies utilisés

Le site a été développé uniquement en HTML5 et CSS3, sans framework ni CMS. Ce choix nous a permis de travailler directement sur la structure et le style des pages, en maîtrisant pleinement chaque élément visuel : mise en page, typographie, couleurs, responsive design et animations CSS.

🎨 Conception et design

Le design du site s'articule autour d'une identité visuelle douce et professionnelle, avec une palette bleu marine et blanc qui inspire confiance et sérénité. La page d'accueil intègre une hero section avec image pleine largeur, un menu de navigation fixe, et des boutons d'appel à l'action bien mis en évidence (Découvrir nos soins, Réserver une séance). Le site comprend également des sections Tarifs, Contact et Galerie.

👥 Travail en équipe

Ce projet a été réalisé en équipe, ce qui a impliqué une organisation rigoureuse : répartition des tâches entre les membres, harmonisation du style CSS commun, et intégration des différentes parties du site dans un ensemble cohérent. Cette expérience a renforcé nos pratiques de collaboration et de communication au sein d'un projet web.

✅ Compétences mobilisées

  • Structuration sémantique d'un site en HTML5 (nav, section, figure, footer…)
  • Mise en page et design en CSS3 (flexbox, variables CSS, responsive)
  • Conception d'une identité visuelle cohérente (couleurs, typographie, espacement)
  • Intégration d'une hero section avec image de fond et overlays textuels
  • Travail en équipe : répartition des tâches, cohérence du code partagé
  • Respect des contraintes de délai imposées par le cadre du séminaire