Unifying Design: Building a Seamless Component-Based System at Akido Labs
Transforming our product suite at Akido Labs with a robust, component-based design system that streamlined collaboration and overhauled user experience.
At Akido Labs, we pride ourselves on delivering cutting-edge products to improve the lives of our doctors and patients and lead the healthcare industry into an AI-driven future. As the Product Design Lead, I had the privilege of leading the creation of our component-based design system. Our suite of products includes a custom Electronic Medical Record (EMR) system, mobile apps, and web applications, all designed to operate at an enterprise scale. Here's a glimpse into our approach, our challenges, and how our team overcame them.
The Problem
When I joined Akido Labs, our design ecosystem was a bit of a patchwork quilt. Each product had its own version of components, leading to inconsistent user experiences and major inefficiencies. Designers and engineers found themselves reinventing the wheel for every new feature, resulting in wasted time and effort. Collaboration between design, product, and engineering teams was often a game of broken telephone, with misaligned priorities and misunderstandings becoming the norm rather than the exception. It was clear that we needed a standardized approach to improve our productivity and make our lives a bit easier.
Recognizing these inefficiencies, I championed the initiative to develop a unified component-based design system. This wasn't just about making our products look cohesive and adding polish; it was about fostering collaboration, reducing redundancy, and accelerating our development cycle.
By creating a shared language between design and engineering, we could ensure that our teams were working towards the same goals with the same tools.
Solving Collaboratively
Working closely with our engineering leadership and CTO, I embarked on the journey of selecting the right foundation for our design system with our engineering leads. After evaluating many options, I chose the Shad CN component library. Shad CN offered a robust base that could be tailored to meet our needs, was well supported, incredibly flexible compared to its competitors, and placed a strong emphasis on accessibility.
The real magic happened in the execution. We adopted a systematic approach, building out the design system component category by component category. This iterative process allowed us to test and refine each element, ensuring that it met our usability and accessibility standards. Our small and talented design team collaborated with engineering to implement these components across our product suite.
Applying the System to a Custom, AI-Native EMR
One of the most ambitious projects we tackled with our new design system was the creation of a custom EMR (Electronic Medical Record). This was no small feat; an EMR is a complex application that requires meticulous attention to detail. We began with extensive market research and consultations with our Akido physicians and medical professionals to understand the pain points and needs of our users. The EMR was designed to be AI-native, considering the abilities of generative AI to accelerate our users’ work in every feature they interact with.
From conception to launch, the project was a testament to the power of our design system. By leveraging the standardized components, we were able to rapidly prototype and iterate on the EMR's design and get our MVP out in a matter of months.
I'm immensely proud of what we've accomplished at Akido Labs. This journey has not only transformed our product suite but also strengthened the relationship between our design, product, and engineering teams. The early success of our custom EMR is a foreshadowing of the impacts to come.