UX Design system

What is a design system?

The WorkSafeBC UX system is a set of standards to manage design at scale by reducing redundancy while creating a shared language, visual consistency and common components across different pages, applications and online channels.

Design and development toolkit

payments

CSS Library

A set of HTML/CSS styles, components and usage rules

Claim file disclosure

Angular Library

Component library based on Angular

Reimbursements

Angular blueprint

Configurable boilerplate template with authentication options

payment method

HTML Templates

Lean web templates with minimal dependencies

Upload documents

UX design guides

Guidelines for error handling, data saving, CTA's and more

Form

Power Apps library

Branded template for designing with Microsoft power apps

Review

Mobile components

Mobile first widgets to use in web applications

Form

Figma library

UX library in Figma format for rapid design and ideation

Form

Email templates

Ready to use email templates with predefined layouts

developer-mode--v1

UI Kits

Component bundles for rapid design

Form

CDN Libraries

CDN resources for prototyping

Form

Micro interactions

Interactive design features and elements

Frameworks and libraries

Additional open source plug ins and resources to enhance user interfaces

payments

Angular

Front end framework to build single page applications

Claim file disclosure

Bootstrap

Foundational CSS framework to build web pages and screens

Reimbursements

Font Awesome

Font icon library for applications and website

payment method

AM Charts

Powerful data visualization library based on Javascript

Upload documents

Charts JS

Light weight chart library based on Javascript

Form

Animate css

Animation library for web applications

Review

Jquery

DOM manipulation library for prototyping

Form

QuillJs

Rich text editor with customizable features