Sean Miller

New Feature: Improved Business Experience

Blog Post created by Sean Miller Employee on Feb 11, 2020

In the RSA Identity Governance and Lifecycle 7.2 release the user interface is cleaner, more consistent, and provides a more cohesive experience.  We have moved to a style guide based reusable component framework.

 

This release includes redesigned UI components and features such as:

  • Dialogs
  • Buttons
  • Tables
  • Charts
  • Links
  • Card based component layout
  • New icon set for high resolution displays

 

Color Palette and Fonts

A palette of named colors for styling components is used now rather than hex codes used in multiple places.  This means one css file controls all color palettes making it consistent across all the UI components in the application.  

The default font has now been set to "Open Sans" and a consistent font sized used based on the context (Title: 20px, Heading: 16px, SubHeading: 12px ....).


Buttons

Buttons are now shown as primary, secondary, and tertiary buttons to help highlight the primary action, secondary action, and other actions that a user might be interested in.  Some buttons are now associated with action icons providing a visual cue to help with accessibility.

 

Icons

A new icon set for higher resolution has been provided.  This improves the scalability leading to faster performance and browser loading, avoids pixelation on larger displays, and avoids image redundancy.

 

Similarly, loading icons have been replaced by a standard spinner icon that is more scalable.

 

Notification Panel

The notification panel accessible from the top right of the main menu now has a cleaner user interface incorporating card based component layout with notifications grouped by date.

 

Progress Bar

Progress bards have been redesigned to look cleaner and render better in browsers.  Several browsers experienced clipping issues and the component was not performant.

 

Dialogs

The layout of dialogs has been changed so the header background color to a primary color (blue), new button design is used for primary and secondary actions, and links are highlighted in blue. 

 

Tabs and Breadcrumbs

Tabs are now shown as a minimalist component where the selected tab is denoted by an underline.  Earlier iterations were much busier, required rendering time in browsers, and proved to be distracting in user interaction testing.

The title of the page is shown now above the breadcrumb, highlighted in blue.  The breadcrumb shows a detailed path and allows the user to navigate to any page present in the path (earlier versions just allowed navigation back to the home page).

 

Tables

Tables have been redesigned with a modern them and includes a redesigned pagination component that is consistent across the application.  The go to page functionality has been separated out by aligning it to the bottom right of the table.

Table filtering has changed so the active filter is blue and other available filters are white.  Disabled filters are shown with a gray background.  Grouping and searching fields have also been made more consistent and clean in this release.

 

Links

Links are not represented in a blue color and appear red when hovered over with an underlined font.

 

Charts

Charts now have a modern theme and layout with improved animations.  A standard color palette is used and new options have been added to download charts in the desired user format.

 

Form Elements

The active field is now more evident in forms using a blue border to highlight text box and text area controls.

 

What's New Page

The what's new page has been redesigned to showcase key features in the top card based slider.  Other features are also shown on this page in standard cards below the slider.  The features here are controlled by entries in the strings.properties and additional text/highlights can be added in customerstrings.properties for customer environment's.

 

These are just some of the exciting changes we have made in the user interface this release.

Outcomes