Inspire Design System : What's New

March 2021

Component documentation 

• Action Bar

• Advanced Filters

• Breadcrumb

• Button

• Card

• Checkbox

• Context Menu

• Date Picker - Calendar

• Detail Panel

• Drop Area

• Dropdown

• File Input

• Grid

• Link

• List Item

• Loader

• Number Input - Stepper

• Pagination

• Radio Button

• Side Modal

• Switch Button

• Tabs

• Text Area

• Text Input

• Time Picker

• Tooltip

• Tree List

• Progress bar

November 2020

Component documentation 

• Content – explains the usage of UX writing for UI, best practices, and Grammar and Mechanics guidelines.
• Tables - Revised usage of tables, best practices and simplified visual style.
• Modals – Revised usage of modals, best practices and simplified visual style.
• Design tokens - Attributes of visual design. They are used instead of hard-coded values, such as hex values for colors. They allow you to increase UI consistency and support UI themes independently across products and platforms.

June 2020

• Forms are used to gather information from users via form controls such as checkboxes, inputs, radio buttons, selects and text areas.

April 2020

New features

UX Patterns and Guidelines

• Displaying and Editing Privacy Data - explains usage of editing sensitive information ​​(password, API keys, activation keys).

February 2020

Visual Language

• New Impress gradients - supported in bobwai–color.

UX Patterns and Guidelines

• Empty States -  explains how to communicate to users that there is no content and what action they should take next.

Visual Language

• New Spacing Scale based on 4px grid - improves consistency and scalability of UI, eliminates design decisions and leads to predicable spacing a consistent UX.
• Generic Tokens - defines design values for spacing and typography.
• Design Kit V.1.0.0 - visual component library format in Adobe XD format - increases velocity and consistency in creating UI prototypes.

UX Patterns and Guidelines

Layouts

• Layouts in Inspire Applications - explains usage and basic configuration of the application layout.

Disabled States

• Disabled states - explains when to use Disabled vs Read-only states in UI.