Projet réalisé lors de ma formation chez OpenClassrooms. Rendre un site statique existant en un site dynamique.

L’objectif : je travaille en tant qu’intégrateur WordPress chez MyCustomiWP, une agence spécialisée dans le développement de thèmes personnalisés.

Ma mission est de dynamiser le site internet du studio Koukaki qui existe déjà en version statique

Le site existe déjà mais i est entièrement statique, je dois le rendre dynamique.

Le designer UX à crée sur Figma la maquette et le prototype pour pouvoir visualiser les animations demandés par le studio Koukaki. Il faut donc bien respecter la maquette lors de l’intégration.

La réalisation du projet : le thème utilisé est totalement personnalisé, il m’est donc demandé de travailler sur un thème enfant pour ne pas toucher au code du thème initial.

 

  • Création du thème enfant.
  • Gestion du carrousel des personnages avec Swiper JS en appliquant un effet Cover Flow et une boucle infinie.
  • Création de la modale avec l’aide de JQuery.
  • Mise en place des différentes sections qui apparaissent au chargement de la page avec un effet de fade-in en utilisant l’API « Intersection Observer ».
  • Ajout de la nouvelle section présentant la nomination aux oscars (qui pourra être retiré plus tard).
  • Mise en place de la vidéo dans le hero en background, le titre ayant un mouvement de flottement créée grâce à un effet parallax entre la vidéo et le titre géré uniquement en CSS.
  • Animation des fleurs grâce au CSS
  • Déplacement des nuages au scroll de la souris grâce à la librairie Skroll JS.
  • Suppression du menu actuel pour créer un menu burger en fullscreen.