#1 Identifier les valeurs du client
Comprendre la mission de BJAB
BJAB est une école avec un système éducatif différent de la plupart des écoles. Les professeurs encouragent les enfants à prendre des risques et les parents participent également au développement de l’enfant.
Leur ancien site était difficile à naviguer et ne reflétait plus les valeurs uniques de BJAB.
Définition des objectifs
Le but du site était clair: transmettre les valeurs de l’école aux parents afin d’établir une relation de confiance.
#2 Mise en place de l’équipe
Pour réaliser ce projet complexe, nous avons formé une équipe avec différents partenaires. Alexandre Plennevaux nous a contacté pour la création du site ainsi que Mathieu Galopin et Alexandre Pakakonstantinou pour la photo et la vidéo respectivement.
-
Mathieu Galopin
Grâce à sa sensibilité, Mathieu a réussi à capturer l’âme des enfants à travers des photos pleine de profondeurs.
Mathieu a passé plusieurs jours dans l’école afin de capturer les sourires des enfants. Voir quelques photos
#3 Réorganiser le contenu
Comprendre le message
Après une réflexion intense, nous sommes parvenu avec le client à articuler le message et les valeurs de BJAB en quelques mots. Cela nous a permis de planifier l’architecture du site et de réorganiser les contenus pour une présentation optimale.
Création des wireframes
Nous avons ensuite donné vie aux contenus en les présentant sur forme de wireframes. Cela nous a permis d’obtenir rapidement une première impression du site sans devoir écrire de code.
#4 Définir l’identité du projet
Création de la charte graphique
Au moment de définir la nouvelle identité, il était important de garder certains éléments existants et déjà reconnu comme les couleurs et l’idée générale du logo.
Par exemple, pour le logo, nous nous sommes éloigné des jeux de couleurs dégradés et avons opté pour un design plus plat et modèrne.
Typographie
Nous avons donné un coup de jeune en changeant la typographie du site en travaillant les formes et les espaces. Nous avons choisi Modum pour son style Neo-Grotesque. Cela apporte une certaine modernité tout en gardant une idée d’excellence. Pour le contenu nous utilisons Source Sans pour sa lisibilité.
Après
Avant
#5 Créer des prototypes interactifs
Collecter du feedback
Une fois les designs terminé, nous avons utilisé un outil de prototypage (inVision) pour observer les premières réactions d’utilisateurs lambda.
Travail par itération
Grâce au feedback collecté avec inVision, nous avons régulièrement adapté les designs pour refléter les améliorations. Cette approche nous a permis de satisfaire le client plus rapidement.
#6 Développement du site en WordPress
Gestion du contenu facile grâce à WordPress
Au niveau de la technologie, nous avons opté pour WordPress, un CMS (Content Management System) qui permet au client de gérer son site une fois le dévelopement terminé.
Installation d’un blog
Afin de communiquer facilement avec les parents, nous avons installé un blog. Grâce à WordPress, la configuration, le développement et la prise en main de ce blog ont été très facile.
#7 Améliorer la visibilité du site
Afin d’attirer de nouveaux élèves pour les années scolaire suivantes, nous avons amélioré la version mobile ainsi que le référencement naturel du site internet.
Optimisation du code
Tout au long du développement du site, nous avons fait attention à écrire du code adapté aux moteurs de recherche ce qui accélère l’indexation et augmente ainsi le traffic sur BJAB.
Indexation bien faite
Nous avons optimisé le site de manière à indexer les pages dans les moteurs de recherches. (URL lisibles, pagination, metas tags, sitemaps, etc…)
Optimisé pour mobile
Depuis fin 2014, Google met en avant les sites web optimisés pour mobile. Le site web de BJAB a donc passé avec succès le test de compatibilité Google.
Côté Clair a été un partenaire essentiel dans la démarche de renouvellement de notre image. Nous sommes très satisfaits de leur travail.Sarah White, Principale de BJAB
