British Boarding Schools Network

BBSN provide services for UK boarding schools to recruit pupils, through a global network of trusted educational agents. We had to develop a community engagement platform.

 

BbsnHomeMacbook.jpg

 

My role

In collaboration with Major Digital, my job was to build wireframes to test predetermined flows and to develop a design language that would unify the 3 brands that sat under the main BBSN brand.

These deliverables would then be used as the foundations of the user experience and aesthetic for the new marketing website and community web app.

 

BbsnMobileTablet.jpg

Building blocks

Once I had completed the initial wireframes and building an in-browser prototype for the new web app we were ready to apply UI design.

We were using a CMS for the build which focused heavily on the Block approach. With this in mind, I began designing all the required block elements and then constructed a UI pattern library.

BbsnHomeWireDesign.jpg

 

UI library

I designed the primary pages for the marketing sites and an extensive UI library with all the component blocks ready for the next phase, the community engagement platform.

The development team were now equipped to roll out the new design across the entire application and marketing site.

BbsnUiCards.jpg
BbsnUiDashboardNav.jpg
BBSN-Forms-UI.jpg

 

A roll-out design for the community platform