A specialized agency of the United Nations responsible for international public health.

Produit context: The World Health Organization needed a scalable and reusable UI component library to streamline the development of web applications across various health initiatives. The goal was to accelerate development cycles, ensure design consistency, and comply with international accessibility and usability standards.

Team Composition: Designers UX/UI: Provided design specifications and ensured accessibility compliance.

Backend Developers: OIntegrated components into WHO’s web platforms.

Project Managers: Provided strategic direction and coordinated efforts across teams.

Contributions clés:

✅ Developed a reusable UI component library, accelerating development cycles and reducing redundancy across projects.

✅ Ensured design consistency and accessibility compliance, improving usability for a global audience.

✅ Enhanced performance and maintainability through optimized bundling and testing strategies.

✅ Enabled rapid deployment of new web applications, supporting WHO’s various health initiatives more efficiently.

Technical Challenges and Solution

The challenge was to develop a comprehensive design system and a collection of reusable UI components that could be easily integrated into multiple WHO web applications. The components needed to adhere to WHO’s branding, accessibility guidelines (WCAG), and international web standards while maintaining flexibility for different project needs.

🚀 As a UI Developer, I designed and implemented a reusable component library using TypeScript, ReactJS, and Styled Components, ensuring a modular and scalable architecture. By leveraging Storybook, I provided an interactive environment for designers and developers to test and refine components before deployment.

🚀 To optimize performance and maintainability, I used Webpack for efficient module bundling, ensuring lightweight and fast-loading web applications. I also integrated unit and end-to-end testing (Jest, Cypress) to maintain high code quality and prevent regressions.

🚀 Collaboration was key in this project. I worked closely with global teams, including designers, developers, accessibility experts, and health data analysts, to align the web solutions with international standards and WHO’s mission-critical requirements.

Technologies Used

TypeScript, HTML5, CSS3: for building UI components.

Webpack: for module grouping and optimization.

Adobe Creative Suite: for the integration of designs.

Conformité WCAG: for web accessibility.

Storyboo : to document and visualize the component library, providing a reference for other developers.

Sitefinity: CMS integration.

By building a scalable and reusable UI component library, I empowered WHO to develop web applications more efficiently, ensuring faster development cycles, improved user experiences, and adherence to international accessibility and usability standards.