SharePoint Internet UI upgrade - EDSA

As part of an upgrade to the CMS platform (SharePoint), I used the opportunity to redesign and redevelop the UI by integrating the Bootstrap CSS framework. This not only improved the accessibility of the site, but also provided a modern, cleaner look and feel.


  • Balsamiq Mockup Tool
  • Adobe XD
  • Visual Studio Code
  • Bootstrap CSS Framework

My Role

  • UX research
  • UI design
  • Data migration
  • Front-end web development


  • Overall: 8+ weeks
  • Discovery & Research: 2+ weeks
  • Development & testing: 6 weeks

The problems

  • Leverage out-of-box elements
  • Applications lacked cross web browser compatibility
  • UI does not adapt to different screen sizes
  • Not meeting WCAG 2.0 criteria
  • UI branding solution relied on SharePoint 2010 theming engine and was not supported in future versions
EDSA before

The solutions

  • Implement a responsive framework
  • Introduce Accessibility and cross-browser test plan
  • Retro-fit applications to have a responsive UI
  • Future-proof by moving away from customized components to extending out-of-box elements
EnviroDataSA after

The before and after