[Design] Show custom role permission details to all members

Problem to solve

Custom role permission detail lives under Settings > Roles & Permissions and can only be accessed by Admins and Group Owners.

The member role detail design limits the custom role information for non-admin users to just the description. Most Admin users noted that revealing more information may vary between organizations and teams depending on the security policy. Admin users wanted more detail to aid in empowering their teams and upholding transparency while a few noted that the information in the designs are sufficient.

While the designs below meets the criteria of a scalable UI, we need to look into providing custom role definitions and provide organization's members an ability to view and set who views custom role detail information.

Design exploration

We explore a few options on how users may find more details about their custom role

Options	Designs
Option 1 - View only state for Settings > Roles & Permissions
Option 2 - From the member page, access role permission details in drawer component	Admin view with popover Non admin view
Option 3 - Add roles & permissions as a section under Members

Options 1 and 3 brings up existing questions around navigation and where custom role best fits in our IA ( #442449).

Using the drawer pattern (popover or not)

Option 2 - drawer component gives users permission context without disrupting their workflow. This pattern will also hold the amount of custom permissions we expect to have and aligns with Tenant scale's plans to improve the member page ( #426964 (closed)).

I considered two interactions, one uses a popover with link to view more details in the drawer and the other uses a direct link to bring up more details in drawer. Prototypes below:

• Admin - popover to drawer
• Non admin - popover to bring up drawer
• Admin - direct link
• Non admin - direct link

Internal feedback preferred the interaction of a direct link but also brought up questions around whether moving "editing a role" to drawer will confuse users.

Prototypes

To understand if the experience is an improvement over the current, we built a prototype and tested them usability:

• Admin
• Non Admin

Solution Validation

Feedback to the proposed view for custom role permissions is positive, "simple and pleasant" and met user's expectation. The proposed view with edit functionality tested successfully for admins managing member's role with direct membership and not as successful for admins managing direct or inherited access.

• 📖 Dig into findings here: Solution Validation: View permissions on custom... (#452543 - closed)
• 🎬 Want an overview?: Video walkthrough

Final design and specs

Figma link for final design and specs

Drawer view for non-admins - custom role

Drawer view for non admin - default roles

Drawer view for admins - direct member

Out of scope

• Listing default role permissions in product (see #439823 (comment 1799768462), however we can still use the same drawer component to

Follow up and next steps

• Custom role detail for non admins [FE] Show custom role detail to non admins (#456273 - closed)
• Show default role detail view in drawer, first iteration - [FE] Show default role detail in drawer (#456280 - closed)
  • Description for default roles (#456522 - closed)
• Move change role dropdown from member table to member detail drawer: [FE] Move change role functionality to member d... (#456282 - closed)