The Power of a Design System

Many major companies rely on design systems to codify and scale design efforts to deliver exceptional digital experiences. But design systems aren’t just for big-name brands.

Higher education faces a persistent paradox in meeting its digital needs. Universities are a complex system of students, faculty and staff with individual departments, schools, units and leadership — each with different priorities. It is a necessity to create unique digital experiences that align with the institution’s established design identity. With a centralized design system, we are enabling our websites to strengthen their connection and association with Ohio State, taking advantage of the institution’s reputation as a leader in research and higher education.

What is a design system?

A design system is a collection of reusable UI elements and components that can be assembled to create a consistent user experience across digital products, such as websites and apps. It is guided by clear documentation of design principles, specifications, code, usage standards, best practices and more.

What are the benefits of our BUX design system?

Our design system provides many benefits to Ohio State colleges and units, as well as vendors who are creating websites and other digital products. Those benefits carry on to our audiences who are consuming the content.

Streamlines design and development efforts

For our staff, there is no need to design yet another button! With our design system principles in mind, our foundational elements (like typography and buttons) are well-established and based on Ohio State’s brand experience principles. They can be combined to create endless new components. Designers can prototype web experiences quickly with premade UI components and patterns. Developers no longer need to code each component from scratch.

Provides standard components that comply with accessibility standards and guidelines

By federal mandate, we must ensure that all users can access our digital information, including but not limited to those with disabilities. BUX prioritizes accessibility within all design elements and components. When web teams work with accessible components early in their work cycle, it reduces the amount of time spent in accessibility evaluation later in the cycle.

Provides onboarding and support for website projects

Our design system serves as an educational tool and reference for new designers, developers and communicators. Those who have adopted the system can rely on design and development support, documentation and ongoing enhancements from the BUX core team.

Improves our audiences’ overall experience across Ohio State’s websites

Thousands of websites make up Ohio State’s digital ecosystem, and they are inter-connected through a myriad of links and calls to action. BUX ensures that Ohio State’s design aesthetics are applied consistently across websites, reducing visitors’ cognitive load by establishing predictable user patterns across sites.

Within each component, we intentionally determine style, behavior and usage. For example, our OSU Navbar contains the university’s identity and crucial links to the university homepage and other central resources. Link text is displayed on desktop and tablet devices and contained in a menu on mobile. The placement at the very top of each website is an immediate way of connecting with a first-time user. It creates familiarity as the user browses multiple Ohio State websites.

Enhancing digital experiences

Our audiences experience Ohio State locally and from afar. Whether seeing a sign on campus, receiving communications in the mail or visiting an Ohio State webpage, we want our audiences to come to recognize the way we intentionally use design to represent Ohio State. BUX allows our Buckeye community to have a familiar experience on all Ohio State web applications. By having our own design system, we lean into Ohio State’s value of inclusivity as we strive to address unique needs of our colleges and units and their audiences.