If you're looking to build a fully customized website or application, UCSF has an easy-to-use Web Patterns Library that will allow you to build a unique look and feel without designing common elements from scratch. Developers across the UCSF community can borrow and contribute patterns, making it easier to forge functional, beautiful websites or applications with less effort.
What Is It?
A pattern library houses snippets of CSS, HTML, and Javascript needed to build various web elements. They range from simple to complex, and include everything from buttons to animated slideshows.
Who Should Use It?
The library itself is a resource for web developers. If you are managing or overseeing a website project at UCSF, refer your design and development team to this resource.
Why Should I Use It?
There are many benefits to using the Web Pattern Library:
Combining efforts: Having a central pattern library allows multiple development teams across UCSF to work together on devising new features. If a bug needs to be fixed and one team finds a solution, that solution will apply everywhere.
Saving time and money: Designing and building new features is expensive and time-consuming. Using this library allows you to avoid "reinventing the wheel" for basic or common elements and instead focus on creating more complex, unique features that will take your custom website to the next level.
Creating unique combinations: The more patterns there are, the more possibilities. This makes UCSF feel visually unified while allowing individual sites and applications to feel distinct.
Providing a consistent user experience: When visitors enter a UCSF website, they expect a high-quality online experience that reflects a brand that they know and trust. Having the required elements and other universal patterns helps orient visitors, and lends credibility to your website.
Getting Started
If you have a digital project coming up, you can take advantage of current web elements that already exist in the Web Patterns Library.
To get started, developers can jump over to the Pattern Library and familiarize themselves with existing elements.
Have additional questions? Contact IT Web Services.
Contributing a Pattern
New patterns must undergo a three-step process before being integrated into the Web Patterns Library.
- You submit a request for a new or existing pattern you'd like added.
- The IT Web Services Team will work with you to design and develop a new pattern or make sure that your existing pattern passes accessibility and compliance requirements.
- The UCSF Brand Team will make sure it fits into our visual system and offer suggestions for updates if needed.
- If you'd like to suggest or contribute a new pattern, please submit a ticket through help.ucsf.edu.