Get started

We're a complex organization with many layers. Ensuring consistency in how we identify these layers builds a positive experience for all our audiences.

The UCalgary Design System (UCDS) was developed as part of our Ahead of Tomorrow strategic goals. By ensuring that we offer seamless, consistent and clear branded experiences across all digital touchpoints, we locate community at the centre of all we do. By offering a resource that is standardized, efficient and scalable we make our processes clearer, simpler, better than any other university. 

The UCDS offers a unified set of visual, interactive, and technical assets, designed and developed to establish a consistent look and feel across all digital products, platforms and touchpoints at our organization. This approach to digital product development strengthens our brand and creates seamless, enjoyable user experiences for everyone interacting with the University. 

Looking for additional resources outside the Design System? Checkout these other helpful sites: 

• UCalgary Brand site 
  Everything you need to know about UCalgary's brand alongside assets and downloadable resources.
• UCalgary Web System knowledgebase
  User community support for our Drupal based UCalgary web system. 

The UCalgary Design System enables digital product owners, designers, developers and vendors at UCalgary to tap into our established digital design language. The UCDS is the starting point, the foundations for digital experiences, adopting the design system allows you to build digital products efficiently. Save time on the basics so you can invest into solving unique challenges and elevating user experiences.

For designers

How to start using UCDS as a designer:  

Our design documentation is built using Figma. Designers can access our Figma workspace to review and utilize elements of the UCalgary Design System – including design foundations, re-usable components, and usage guidelines – to help design webpages, templates, and digital products.  

1. Connect with us to get a dedicated designer onboarding session
2. From there we can grant you access to the UCDS Figma environment
3. Gain access to tokens and foundation specs
4. View and leverage the component library to design pages and patterns

For developers

How to start using UCDS as a developer:  

Live examples, code snippets and technical documentation for UCDS components are available to developers on our Storybook website. Developers can explore component variants, manipulate controls, and copy code directly from Storybook to apply the UCDS to digital platforms and CMS’s. 

1. Connect with us for a dedicated developer onboarding session
2. Gain access to the UCDS on Storybook assets
3. Learn how to adopt and connect with our repo to stay up-to-date on future releases

For teams

Are you looking to introduce or replace a digital touchpoint on behalf of UCalgary?  

Whether working internally or with a vendor we can help get your teams started with onboarding into the digital design standards for UCalgary. The resources for designers and developers within the UCDS offer comprehensive documentation and assets, eliminating guesswork and rework. No matter the product or project, we’re here to connect, share our expertise, and support your digital design needs.

We're excited by all things digital, connect with us.