Go to Body Go to Navigation

Buttons

Usage

Buttons are used to perform certain actions. They can be shaped differently according to your needs, and mainly consist of text and images. To ensure a consistent user experience in Samsung Connect app, it is recommended that you use the following styles for buttons.

Style

  • Style1 (solid white + shadow) : Use this style for buttons that emphasize control functions in the Hero card on the first page of a plug-in. Don’t use too many of them on one screen and use them only on buttons that need to attract users’ attention. Button Style1 uses a white-colored image and a rounded edged shape, including circles and has a subtle shadow to it. A button can include text or an image, and we recommend that you apply the primary color to it.

    Style1 (solid white + shadow)

  • Style2 (flat text) : This is the most commonly used button type. To ensure that users can distinguish the difference between general text and text on a button, clear feedback should be provided when the button is pressed, and an instant response should be displayed on the screen at the same time. We recommend that whenever possible you use the primary color for a button to distinguish it from surrounding text, and for deactivated buttons, use an opacity level lower than that of existing buttons.

    Style2 (flat text)

  • Style3 (flat image) : Design buttons using colors that can easily be distinguished from the background color an image or icon is placed against. Provide clear feedback when buttons are pressed or an instant on-screen response like Flat text buttons appears.

    Flat TextStyle3 (flat image)

  • Style4 (line frame) : For drop-down buttons that change the mode of items displayed on the Hero card or changes to the filtering method, use a rounded rectangular. The length of a frame is adjustable depending on the length of text.

    Style4 (line frame)