Sustainability Institute Website Development

INSEAD's new institute, pioneering the integration of sustainability and businesses education, needed a new website allowing them to integrate content aggregation and tagging in line with the United Nations Sustainable Development Goals and Targets.

I was kind of thrown into the middle of a battlefield with this project, brought on just two weeks before the tender/procurement deadline and in the middle of a requirements disagreement. The institute and it's stakeholders wanted a website, the institutional communications and IT teams didn't want to complicate it's digital ecosystem as they were in the initial stages of a fully inclusive website system redesign.

I had the difficult task of finding a solution that would work in very little time. We already had design proposals from two high profile web agencies, but the budget and the timeline were major blocking points. Both agencies were offering offshore development too, which posed a problem to both the communications and IT team as we didn't want a messy back-end to deal with.

After getting to know and understand the various requirements I proposed an alternate solution, one that would ultimately reduce costs by roughly 80% and bring both development and design in-house.

The solution proposed three development sprints:

1. An initial information architecture sprint
2. A design and development sprint in WebFlow
3. A migration sprint, from WebFlow to Drupal

The initial sprint would allow me to defne and refine the website architecture and content structures. The second one would allow for rapid prototyping, itteration and design. The final one would allow the project to comply with IT requirements. This process also facilitated project management by removing the interaction between the developpers and the clients, avoiding costly changes during the migration and development process.

After the initial design system creation and approval I worked closely with the institutes team and started building all the widgets, templates and CMS collections they would need. This enabled me to get a Minimum Viable Product up and running in about a month. From here the team began working on the website, populating content through WebFlows's built-in editor, while I continuously upgraded the backend to allow for additional requirements and information.

While the team was discovering the website and refining their needs I focused on developping automated workflows that would eventually be added to the website. From social media publishing to automated asset creation, the back-end of this website enabled aggregation and distribution of content across multiple channels. Integration would enable, for example, a team member to simply write the text of a blog post and the rest would be taken care of automatically (image selection, on-brand visual asset creation through digital templates, content calendar and social media distribution) the automated process included editorial and content validation steps as well as a clear auditable trail of information.

After another month or so of itterating the stakeholders where all happy with the layout of the website, both back and front end. At this stage the website pased from alpha stage to pre-beta, meaning I had to optimise accessibilty, SEO, UI and UX before the migration. The website was now fully functional, with a Google Lighthouse rating of 91% for accesibility and 100% for SEO, performance (64%) and best pratices (80%) would be optimised during the migration.

Time to migrate, working with INSEAD's in-house team of developpers based in Singapour we developped the website under Drupal 8, Developping re-usable modules based on the symbols defined in WebFlow and optimising content for better performance and accesibilty. Under Drupal 8 the Website passed the Google LightHouse Audit with 100% on all categories. Drupal's back-end however became a major drawback, the lack of standard integration created barriers to the scalability, integration and management of the website. Where Drupal excelled in customisability, Webflow excelled in user experience and multi-stakeholder management and integration.

The thing about fully customisable systems (such as Drupal) is that they quickly loose standardisation and as a result also loose integration. The website that I had designed for the institute worked well in webflow, it enabled the team to manage content in a unified manner, using integrations to create, publish and distribute content seamlessly. This enabled a complexe communications strategy to be excecuted through scalable, automated processes. In Drupal the website architecture had to be modified, not only to adapt to the platforms architecture but also to INSEADs pre-existing (semi-document and ad-hoc) ecosystem, creating over-clompiclated and cumbersome databses. The database worked fine for Drupal and simple website content population. The complexity however rendered the integration of this website with third party services somewhat impossible - at least not in a scalable and optimisable manner. This website now lays dormant, awaiting stakeholder decisions.

While developping this website it was also important to keep the existing website active and up to date. During the projects lifecycle the institute had other major projects, for which I was delegated as communications manager. This demanding environment pushed my agile project management skills to their limit. I learnt a lot working in an agile environment and managed to deliver a website all the while managing the communications for two major events, INSEAD in Davos and INSEAD at ChangeNOW.