Last Update: Sept. 15, 2023
Platform: Web
Designer: Sharosh Rajasekher
Intro
The Skill Rater is a grid table in the context of the growth portfolio. With this grid table component, a manager can view the attributes of several of his employees in a team to update their ratings and thus keep their portfolios current.
Usage
This most likely occurs in the context of required updates that managers need to perform on a regular basis or in the case of employees that do not have access to the SuccessFactors HXM system. A rating given by a manager will immediately appear in the portfolio and the history in the attribute details will be updated to show that this has occurred.
Types
Currently there is one type of floorplan used in Growth Portfolio. Other modules in SuccessFactors have also expressed interest or are planning to use the component:
- Recruiting Management
- Performance Management
- etc
Structure & Components
The Skill Rater grid table is formed by the following elements:
- Filter toolbar
- Table header
- Filter groups
- Skill column
- Table toolbar
- Employee header row
- Grid table cells
Behavior & Interaction
A number of interactions can be made on the Skill Rater grid table, from both, the skills column and the employee bar are starting point for several main user interactions.
Skill Details: From the skill list the user can open a detail popup, to recieve more information about the skill.
Various actions can be started from the menu button in the Skill element:
- View Proficiency Levels
- Set Baseline Value
- Remove for Everyone
Employee Details: Below the avatar the employees name acts as a link, from there, details about the employee can be retrieved
Various functions can also be carried out on the cells of the grid table. After the switch from display to edit has taken place, the proficiency level can be edited directly on the cells.
The cell area can be clicked to access the proficiency details. Here the current status is compared with the expected status (after a course).
Various functions can also be carried out on the cells of the grid table: editing, increasing and decreasing the proficiency level
Under certain circumstances, the manager may also remove a skill from an employee's portfolio. A warning will be thrown in this case.
Responsiveness & Adaptiveness
The design of the Skill Rater grid table follows two principles of responsiveness:
-
The column width within a grid - goes from 175px minimum to 261px column width maximum.
-
The total screen width, where only the header of the UI behaves responsive. The grid table remains stable against changes in the screen width and forms two scrollbars,
- one horizontal scrollbar for employees
- one vertical scrollbar for skills
Application-specific examples
So far there is only one application example of the Skill Rater in SuccessFactors in Growth Portfolio.
Resources
Manager View adoption use cases: https://confluence.successfactors.com/pages/viewpage.action?spaceKey=ENG&title=Manager+View+adoption+use+cases
Link to Figma design file: Growth Portfolio (WSP) - 2305 to 2311
Link to Figma design file: B2311_Growth Portfolio - Manager View
Link to Fiori Design Guideline (grid table): https://experience.sap.com/internal/fiori-design-web/grid-table/
SF Web Stencils Horizon Template