École Méliès

"On a un site très différent des autres écoles, grâce à plein de petits clins d’œil que 148 Agence Collective a su nous proposer."

Pauline, Directrice développement de projets, École Georges Méliès

On se plonge donc dans l’univers de l’École Georges Méliès. Son fondateur, Franck Petitta, était un sculpteur. Pour lui, une animation 3D doit s’inspirer de l’artisanat et les étudiants doivent apprendre le dessin avant de découvrir la 3D. Georges Méliès était lui un réalisateur et illusionniste, considéré comme l’un des créateurs des premiers trucages au cinéma. Son univers est fantasque et poétique. L’occasion pour nous de libérer toute notre énergie créative ! Tels des sculpteurs de pages web, nous sommes force de conseil et d’accompagnement pour faire ressortir l’identité de l’école dans le site. En arrière-plan, on devine une lune, l’un des symboles phares de Georges Méliès, qui grossit au fur et à mesure de la navigation. Le fond du site est légèrement grisé, comme du papier à dessin. Quand on scroll, on a l’impression d’un coup de pinceau. Même la souris est singulière, en forme de petit point qui semble se promener partout. Notre client est enthousiaste, il adhère à nos propositions créatives.

Pour créer un site dynamique (à l’image d’une école d’animation), on insère en haut de chaque page du site un gif. Ces petits personnages ou animaux, souvent drôles, sont des réalisations des étudiants. Cela permet de mettre aussi en valeur le travail de l’école. Et on a tout pensé pour que la mise à jour ou l’actualisation de ces gifs soit très facile.

"Le site met en avant la multitude des formations et le dynamisme de l’école."

Pauline, Directrice développement de projets, École Georges Méliès

Autre élément différenciant du site : le scroll immersif. On s’explique. L’idée est de prendre l’utilisateur par la main et de le guider pour lui montrer l’ensemble des contenus. Le seul mouvement à faire, c’est scroller. Et on navigue à l’intérieur du site, sans avoir besoin de cliquer. C’est vraiment une navigation originale très différente des autres sites. Et cela permet aussi à l’école de s’assurer que le visiteur passe bien par toutes les pages, sans sauter un contenu important. Du point de vue technique, c’est un virtual scroll : un effet de scroll recréé en javascript pour permettre cette navigation innovante.

Aujourd’hui, l’École Georges Méliès a un site sur lequel elle peut très facilement reprendre la main. C’était une de ses priorités : pouvoir actualiser les contenus ou ajouter de nouveaux cursus de formation. En utilisant Wordpress, on donne un vrai confort d’utilisation à notre client. On lui donne accès à des blocs libres (titre, texte, illustration) pour pouvoir composer une nouvelle page comme il le souhaite.

Ce site me change la vie, il est vraiment facile à administrer.

Pauline, Directrice développement de projets, École Georges Méliès

Techniquement, tout cela est un challenge car il y a beaucoup de contenus à intégrer. Il faut que tout soit bien structuré pour être facilement lisible. Et que les pages se chargent rapidement. À l’agence, on sait très bien gérer cette densité des contenus. En fait, ce qu’on fait c’est qu’on ne rentre dans le DOM (l’interface de programmation) que les éléments visibles à l’instant t sur le site. Cela allège énormément la page et elle se charge en un instant.

Au-delà de l'aspect visuel, nous avons déployé une stratégie SEO sur mesure. Notre approche holistique du référencement a commencé par une analyse approfondie des termes recherchés par les futurs étudiants en animation et effets spéciaux. Nous avons optimisé l'infrastructure technique du site pour améliorer sa performance et sa lisibilité auprès des moteurs de recherche. Chaque contenu a été minutieusement travaillé pour allier pertinence éditoriale et optimisation SEO. Notre stratégie de maillage externe s'est concentrée sur des partenariats qualitatifs avec des acteurs reconnus du secteur de l'animation et de l'éducation. Un dispositif analytique complet permet désormais d'affiner continuellement la stratégie digitale de l'école.