@freshworks/button

@freshworks/button

ember install @freshworks/button

Buttons in Freshdesk

Buttons means operation or series of operations. Buttons are interactive components that the users can click or touch to trigger corresponding business logic.

Scenario

There are several button variants used throughout the product. They are used in pages such as articles, forms, wizards and perform actions such as saving, cancelling or sending, or call users to those actions.

Guidelines

DO’s

1. Label button with what action it triggers.
2. Choose appropriate button for the context.
3. Use primary button for the primary/important action of the page.
4. Use secondary buttons as default buttons.
5. Use link buttons as tertiary buttons for less prominent actions.
6. Use consistent button placement and direction for a user journey.
7. Use button against a contrast background and have essential white space around the button.

DONT’s

1. Avoid using too many buttons in one page.
2. Button copy shouldn’t be too wordy.
3. Don’t use more than one primary button in a page.
4. Don’t use buttons instead of tabs.
5. Don’t trigger the action without alerting the user for destructive buttons.
6. Don’t use destructive buttons for all delete/ cancellation scenarios. More applicable for actions which involves deleting the data permanently.
7. Don’t enable primary button before all mandatory fields are filled.