About
A phased UX overhaul for an electronic health and medical ecosystem, built around a scalable design system that could grow with the product. Centra GP is a SaaS platform for electronic health records and patient management. I came in to gradually overhaul the existing UI through a phased approach, introducing a new design system without disrupting an active product and development team.
Rather than building a design system from scratch, which would have slowed down a team already pushing toward funding, I based the system on Shadcn and Tailwind CSS. This gave the development team familiar, easy-to-implement components while still giving the product a consistent, professional feel.
My work focused on the organism level of the atomic design methodology, which meant designing the screens and larger composite components, such as patient record views and management screens, built on top of the atoms and molecules already established in Shadcn. I also worked closely with the development team to assist with integrating the new UI.
Tools Used
Figma,
Shadcn,
Tailwind CSS
Key Takeaways
Learned how to design with Tailwind CSS constraints in mind, producing designs that translate cleanly into code without friction between design and development
Gained experience creating a Tailwind CSS-compatible design system, something I hadn't done before this project
Navigated the challenge of overhauling a live product's UI without breaking existing workflows or slowing down the engineering team
