Reservia

Link to website
Link to project repo
Project Gallery

1/4

CSS3
Github
HTML5

Reservia est une petite entreprise proposant un outil de planification de vacances. Leur site permet aux usagers de trouver des hébergements et des activités dans la ville de leur choix. Les hébergements peuvent également être filtrés par thématique, par exemple leur budget ou leur ambiance. Un nouveau design basé sur les principes du Material Design vient d’être proposé par le designer UI. Avant de valider définitivement ce design, l’entreprise décide de réaliser un prototype. La première étape consiste à intégrer la maquette responsive en HTML et CSS.

Fonctionnalités

  • Le champ de recherche est un champ de saisie, cependant, à ce stade, le bouton de recherche ne sera pas fonctionnel.
  • Chaque carte d’hébergement ou d’activité devra être cliquable dans son intégralité. Pour l’instant les liens seront vides.
  • Les filtres ne seront pas fonctionnels pour cette version, en revanche, il faut qu’ils changent d’apparence au survol.
  • Dans le menu, les liens “Hébergements” et “Activités” sont des ancres qui doivent mener aux sections de la page.

Contraintes

  • Il y a fournis deux maquettes : l’un desktop et l’autre mobile.
  • Aucun élément ne doit être coupé et le texte est de taille suffisante.
  • Choisir les breakpoints appropriés.
  • N’utiliser pas de Framework ou pré-compilateur CSS pour ce projet (comme SASS par exemple).
  • L'utilisation de Visual studio est recommandé.
  • Intégrer les icônes Font Awesome en HTML ou CSS.
  • Utiliser Flexbox ou CSS Grid.
  • Utiliser des balises sémantiques et passer le validateur HTML et CSS du W3C.
  • Le site doit être compatible avec les dernières versions de Chrome et de Firefox.
  • Versionner le code avec Git.

Compétences

  • Utiliser un système de gestion de versions pour le suivi du projet et son hébergement.
  • Mettre en place son environnement Front-End.
  • Intégrer du contenu conformément à une maquette.
  • Implémenter une interface responsive.