The Student Affairs Design System is an integral tool used for the development of CU Boulder’s digital products.
Year
2019
Role
System Design
Cohesive Guidance
During my time as a UX Designer for the University of Colorado Student Affairs Web Team, I was tasked with creating and maintaining a design pattern library with corresponding brand guidelines. The pattern library consisted of 500+ assets that would be used by a team of 5 designers and 6 developers, and the brand guidelines set the rules of how to use the assets in the pattern library. Current and future users will use the brand guidelines to make sure that any CU Boulder app, website, or digital product has a cohesive visual infrastructure and passes WCAG AA accessibility standards.
Design Pattern Library
The DPL process mainly consisted of compiling materials, standardizing in-house design practices, and creating an efficient structure for the assets. The main users of this new library would be the design team and the engineers. Exploratory sessions helped me empathize with the users’ needs, find common pain points, and gather insights. This allowed me to set some broad objectives to guide me through the whole process of designing the structure.
These objectives included:
• Promote individual creativity
• Enable the structure to grow with the team
• Bring the engineers and designers closer
• Have a versioning system to keep everyone in sync
• Standardize naming convention
After a few feedback sessions and revisions, the DPL was ready to be deployed. It was created as a Sketch library file and distributed to the team using Abstract. This way the DPL could be used for a variety of projects while making sure everyone uses the same version.
Brand Guidelines
Documenting the design team's assets into a set of brand guidelines helped us have one source of truth. It helped us provide a catalog of the DPL assets, branding components, and UI specifications. The brand guidelines were hosted in an internal server for the SA Web team to use.
