Teladoc Health Design System



The Problem

Teladoc Health's rapid growth and frequent acquisitions brought about a significant issue: our design systems were all over the place. With different looks for web, print, and product assets, designers faced a tough time creating new pages. This led to prolonged discussions with creative heads and marketers, and coding for the development team became a headache.



The Solution

With the collective effort of developers and DevOps, we managed to straighten things out. Our new design system simplified processes, allowing for global updates and reducing production time. It also made life easier for new designers, enabling them to create web pages with confidence. Stakeholders could now approve designs knowing exactly what to expect, leading to smoother workflows overall.



The Take Away

We were able to nail down all the inconsistencies and organize a design system that was easy to use, saving time and being able to do updates globally and cut the time of production and avoid confusion when transfering to developers, this design system helps new designers be able to compose their own web pages that are ready to be transfered to AEM and be able to show high fidelity prototypes that look exactly how it’s going to look like when developed, as well as the different variables being able to showcase any site on any device that the marketers and stakeholders want to see before approving and producing.



1. Typography



2. Color Palette



3. Iconography



4. Grid



5. Spacing



6. Radius



7. Shadows



8. Button Behavior



9. Components










Thank you!

For a deeper understanding of the design system, explore its comprehensive library ot to grasp its full functionality, Feel free to reach out.
Special thanks to Travis Klein for his design contributions and project management and Initialyze for the development work on AEM.