An atomic design approach ensured both consistency and scalability.

We developed a set of core components that could be endlessly reconfigured to suit the needs of thousands of different pages. Starting with basic elements defined in Figma, our system was capable of handling extensive content needs—today and well into the future. 

A combination of curated and commissioned elements upped the aesthetic while also creating a more immersive user experience. Our new visual language, taking cues from Montefiore Einstein’s history of compassion and innovation, worked as a critical storytelling component and established consistency from page to page.

The technology stack balanced performance, flexibility, and maintainability. Storybook formed the core of our development process, allowing us to build and test design components in isolation. 

For front-end interactivity, we chose Alpine.js for its lightweight nature, complemented by Tailwind CSS for rapid, consistent styling. This combination enabled us to implement a responsive design language that reflected Montefiore Einstein’s newly aligned brand identity while ensuring optimal user experience across devices. 

Twig served as our templating language, bridging our front-end components with a headless Drupal CMS. This setup separated content management from front-end presentation, giving editors a familiar interface while allowing our design system to leverage the latest technologies.