Skip to main content

Encompass Design System

Distributor overview of the Encompass Design System, the UI/UX framework and component library for building custom screens in Encompass. Needs a Dashboard Role for access; v23.01+.

B
Written by Bailey Naas-Thornton

Minimum Version Required: 23.01

Steps

The Encompass Design System is a UI/UX framework for building screens and customizations throughout Encompass.

Encompass internal development utilizes this same design system to build the core Encompass pages and functionality for the entire system.

You can find the Encompass Design System in the universal search, as long as a Dashboard Role has been added to grant you access.

The principles of Encompass design offer designers, product managers, and developers with ways to evaluate their designs, as well as give direction to design system components and patterns. These principles are in service to the Encompass brand, and should be thought of throughout the design process.

Build trust between the user and the product

Encompass customers trust our products with sensitive data. Because of this, users should always feel a sense of confidence that their data is safe (and in many cases, more powerful) in our hands. Many things contribute to building trust with a user, including:

- Text content throughout the product. Incorrect grammar/spelling, or even an out-of-place tone can cause the user to feel confused and hesitant.

- Consistent spacing, alignment, sizing, etc.

- Meeting expectations. Surprising results or actions that aren’t expected can cause hesitancy when using Encompass products.

Maintain consistency across the experience

Encompass works to connect multiple tiers with software. Consistent experiences between groups of users allow them to communicate easier, as well as adopt new features internally. Work to apply the same solution to the same problem across Encompass products.

Enable users to act confidently on data

Our users use rich data to make business decisions every day. Encompass products should always clearly and specifically guide the user towards actions they can take. Users should be able to act on data with confidence.

The design system consists of many pieces, including:

  • Design Principals

  • Color Palette

  • Semantic Tokens

  • UI Containers

  • Typography

  • Motion standards

  • Component Library (HTML Web Components based)

  • Patterns

For more information about the design system, it is recommended to pursue a Code Block certification from Encompass.

Did this answer your question?