DISTRIBUTION OF TIZEN-BASED WATCH APPS HAS BEEN DISCONTINUED

Buttons

Tap a button to perform an action. Buttons can appear on almost any screen, should be easy to tap, and are designed according to the purpose of an action.

Usage

• Use a bottom button when providing one important action on a screen

  We recommend using a bottom button when you only provide one major function on a screen. If you don’t have enough space for a bottom button, use a text button instead.

• Use more options when providing multiple actions

  If you need multiple buttons on one screen, move any less important actions to More options.

Behavior

• Tap a button performs an action or opens a link

  A button should look tappable so users know intuitively to tap it.

• Buttons should be disabled if they can’t be tapped

  Disable a button if, in the current condition, it’s not able to perform an assigned action. For example, if no item is selected from a list, any Share or Delete buttons should be dimmed to indicate that they’re not active.

Types

• Bottom buttons

  A bottom button provides one main action. It remains fixed and non-scrollable at the bottom of the screen. To aid in readability, the text should be capitalized like a sentence, when applicable. Only use icon when you can't fit long text in the button field.

  Bottom button in developer's guides
  Native	button > bottom
  Web	Bottom Button

  

• Contained buttons

  The contained button is a rounded rectangle with text. Depending on the importance of the button, color contained buttons and gray contained buttons can be used selectively. The color contained button can be used for the most important primary action on the screen (for example, Okay, Next, or Do). The Gray contained button can be used for actions that are relatively less important or contrary to the primary action (for example, Cancle, Previous, or Don't).

  

• Text buttons

  The text button consists of text and the "greater than" character (>). Text buttons can be used for actions that are less important than contained buttons. If the contained button and text button are used together on one screen, the color contained button, gray contained button, and text button can be selectively used depending on the importance of each action.

  

• Select mode buttons

  These buttons appear when users select items from a list. Disable these buttons if there’s a limit to the number of items users can select, or if no item is selected.

  Selection mode action button in developer's guides
  Native	(Circle) UI Components (+ SDK : Ctxpopup)
  Web	―

  

• List buttons

  List buttons present action options for an item in a list through an icon. Display an icon with text when there’s only one list button for one list item, but remove the text when there are 2-3 buttons for a list item.

  

Design specs

• Bottom button

  

• Text button

  

• Select mode action button

  

• List button

  

• More options