Industry
Education
Client
UMD
UMD Design System
A top university’s first ever design system
The University of Maryland has over 1,680 websites. Built on different systems, templates, and technologies, everything about these sites is difficult to manage, and detrimental to a cohesive brand. As the UX and digital design lead for the university’s digital team, my team and I sought to create a design system that would address consistency and accessibility issues, as well as minimize design and technical debt. The link below previews an updated home page design and links to the existing documentation site.
Process: comprehensive and ever evolving
As is commonly the case, our design system is in continuous development. It is refined and iterated as we get more feedback and optimize it for both a range of design and development processes. We started with an interface inventory of the existing university sites to determine the functionality and components we should standardize across properties (shown below). In our assessment, we found 100+ buttons, 30+ carousels - all with a11y bugs, and 12 hex codes for Maryland Red, among other inconsistencies. We then assessed each component for broad usage prior to design. The design style was largely based on the university’s existing brand guidelines, with needed adjustments to allow a scalable and neutral framework that would be compatible with most of the university’s websites. In addition, we had the job of selling the design system to other parts of the university. We sought to encourage adoption to maintain brand and accessibility standards. Presentations to stakeholders have been an important part of the work. Adoption is an on-going challenge in a decentralized university model. UMD's Division of Information Technology adopted it in 2025 making it much more widely available.
Documentation is (almost) everything
Our documentation site accounted for a lot of the hours spent by my team. We wanted to create thorough documentation to outline component requirements and options, layout optimization, and best practices. 100+ sites have adopted the Design System to date and nobody was required to. The university provided no mandate and our team had no enforcement ability. Adoption happened based on the design and brand benefits and the strength of the documentation. I also created an AI-enabled design system page builder for machine-readable documentation, allowing us to create prompt-driven prototypes using the design system.
Results that speak for themselves
Our team has successfully used the design system on several projects and it has been used on several projects outside our team as well to stand up websites much faster than had previously been possible. In addition: • 76% increase in engagement time on adopting sites • Accessibility scores on adopting sites went from below 40% to above 90% • 57 components • 20K+ downloads
