#1 Identify Client’s Values
Understanding BJAB’s Mission
BJAB uses a different educational system than most schools. Parents are playing an important role in the child’s development and teachers encourage children to take risks.
The old website was hard to browse and was not matching the unique BJAB values.
Defining Goals
The goal was pretty clear: Convey BJAB’s values to parents to build trust.
#2 Setting up the team
To produce the whole website, we formed a team with several partners. Alexandre Plennevaux contacted us to build the website as well as a video producer and a photograph.
-
Mathieu Galopin
Thanks to his sensitiveness, Mathieu succeeded to capture kids’ soul through profound pictures.
He spent several days inside the school to catch children’s smiles. View some pictures
#3 Reorganising content
Understanding the message
After a long brainstorming session, we managed to articulate the client’s core message and his values in a few words. This mission statement helped us plan the site architecture and organise the content for optimal presentation.
Creating Wireframes
We gave life to the new website by organising and presenting contents via wireframes. It allowed us to quickly get a first impression of the final result without writing code.
#4 Defining the Identity
Design Guidelines
To preserve the brand identity, we kept some existing elements such as the color palette and the general atmosphere of the logo.
For example, we improved the design of the logo. We moved away from the gradient look of it and opted for a more modern, flat design with very light profound effects.
Typography
We gave the website a facelift by changing the typography. We worked on spacing and shapes. We selected Modum for its Neo-Grotesque style. The font brings some modernity while maintaining an idea of excellence. For smaller content, we opted for Source Sans, a very legible font.
After
Before
#5 Prototyping
Collecting Feedback
With the wireframes ready, we used a prototyping tool (inVision) to observe users’ reactions.
Iterative work
Based on feedback from inVision, we regularly improved the designs to reflect improvements. This approach helped BJAB get a better result faster.
#6 WordPress Development
Content Management
For the technical aspect, we opted for WordPress, a CMS (Content Management System) that allows the client to manage his site on his own after the project.
Setting up a blog
To facilitate communication with parents, we installed a blog. With WordPress, configuration, design and development was very easy.
#7 Improving Visibility
To attract new students for upcoming years, we worked on usability and visibility of the website. We worked on designing a mobile-friendly version and prepare the website for SEO.
Code optimization
To generate as much traffic as possible from search engines, we made sure to write SEO-friendly code all along the development phase. Fast loading webpages is a key aspect of good SEO.
Indexing
We created sitemaps and submitted all content to Webmaster tools. Also, the technical aspects were respected (readable URLS, meta-tags, pagination …)
Mobile Friendly
In 2014, Google announced it was going to rank better websites that have a mobile-friendly version. The site passed the Google compatibility test successfully test compatibility via Google.
Côté Clar has been a very important partner in our journey to changing BJAB’s branding. We are extremely happy with their work.Sarah White, Head Teacher at BJAB
