Case Study
BIO’s Digital Transformation In Action
How BIO's Digital Transformation Enabled a Swift Response to COVID-19
The Biotechnology Innovation Organization (BIO) is a leading global advocate for the biotech industry, driving innovation and fostering collaboration among diverse companies and organizations.
Overview
Client: Biotechnology Innovation Organization
Industry: Biotech
Role: Product Designer
The Ask
Seeking to revolutionize their online presence, BIO enlisted my team’s expertise to create a transformative framework that would empower their content creators. As a product designer collaborating with a talented development team, our mission was to migrate and unify BIO's websites onto a cutting-edge Drupal-based platform.
Together, we built a scalable design system, Helix, that provided BIO's content creators with the freedom to bring their creative visions to life. Little did we anticipate the profound impact our partnership would have when the pandemic struck, as BIO swiftly leveraged this framework to establish a COVID resource sharing hub, fostering collaboration and advancing the search for a vaccine. Join me as I share the remarkable story of collaboration, empowerment, and the lasting impact of our work.
The Problem
BIO faced the challenge of disjointed websites and a cumbersome content creation process. They desired a solution that would enable their content creators to build anything they envisioned without relying on iterative design processes. My team’s task was to create a comprehensive design system and framework that provided the flexibility and freedom for BIO's content creators to bring their ideas to life. We recognized the need to streamline the content creation process, empower the team to build custom layouts, and ensure a responsive user experience.
The new BIO website serves as a unifying force, bringing together previously fragmented experiences under a singular visual identity. From news sites, to blogs and conference platforms, all sites have a common thread woven throughout that ties them all together.
Crafting a Tailored Solution
In order to develop a tailored solution for the BIO project, we embarked on a collaborative journey with the client. Through immersive workshops and deep engagement, we gained a comprehensive understanding of their unique needs and priorities. These insightful sessions allowed us to identify key requirements and translate them into tangible outcomes. We meticulously crafted a library of components, designed page layouts, and fine-tuned functionalities to align with their specific goals.
By actively involving the client throughout the process, we ensured that the new platform would effectively address their challenges and serve as a powerful tool to advance their mission in the biotech industry.
Design System
Collaborating closely with a skilled development team, we built a robust design system from the ground up. Leveraging BIO's existing brand foundations, we crafted a collection of flexible components that empowered their content creators to build captivating layouts. With pixel-perfect implementation and meticulous attention to detail, we ensured that the components seamlessly integrated and maintained visual excellence across all devices. This design system became the foundation for BIO's content creators to unleash their creativity and share their stories.
Our diverse array of Helix components offers content authors the freedom to curate and assemble dynamic pages that perfectly align with their unique needs and objectives.
Implementation
To ensure a seamless content authoring process, I collaborated closely with the development team, establishing clear guidelines and best practices for leveraging the design system. With the aim of inspiring and guiding their content creators, we crafted a collection of example page layouts, showcasing the world of possibilities and encouraging the exploration of unique and captivating designs.
Invision DSM served as the home for the comprehensive documentation of the Helix design system, providing crystal-clear usage guidelines and governance recommendations for each component, empowering teams to create consistent and cohesive user experiences
“We now have a super robust platform that’s extremely scalable. It is a clear example of how technology can help us all prepare and respond to our rapidly changing world and offer tremendous efficiency along the way. Making everyone, throughout the organization, content creators”
— Joe Hansen, Managing Director, Digital Communications & Engagement, BIO
Conclusion
Our partnership with the Biotechnology Innovation Organization (BIO) has been a transformative journey of collaboration, empowerment, and innovation. By creating a scalable design system and framework, we enabled BIO's content creators to bring their ideas to life quickly and efficiently. The framework proved invaluable during the pandemic, empowering BIO to swiftly respond by establishing a COVID hub and disseminating critical information. Together, we have revolutionized content creation, making a lasting impact on BIO's ability to adapt and share valuable resources.
Using their new platform, BIO swiftly established a robust COVID resource hub within a matter of hours, efficiently distributing critical information and essential resources to researchers, businesses, and service providers.
Let’s Work Together!
Looking for a passionate designer to bring your project to life? Part of a team that shares my love for design? Let's explore the possibilities of working together!