Notifications

Notifications deliver meaningful information from an app and connect users to the next required action smoothly.

  • Make your notifications glanceable

    Notifications should deliver a clear message at a glance. Users should be able to check and understand information easily even while doing something else.

  • Connect users to the next step smoothly

    Remember that users should be able to easily continue with any task suggested by a notification. For example, provide a link to the relevant app’s menu or allow user input on the notification itself.

Notification pop-up alerts

There are 2 types of alerts:

  • Full pop-ups are displayed when a notification arrives when the Gear is turned off. They lead to a corresponding notification card depending on a user’s settings(Auto show details should be turned On in the Gear Manager (mobile) -> Notifications -> Auto show details.). Users can view details or perform a task on the notification card.
  • Small pop-ups appear at the top of the screen when the Gear is turned on. These smaller pop-ups minimize interruptions to the user’s workflow and take them to a corresponding notification card when tapped.

             Full pop-up alert                                    Small pop-up alert     

    A notification can be either a full or small pop-up.

Notification board

Notifications received on the Gear appear on the notification board, located to the left of the watch face. Users can look through notification panels one by one, starting from the most recent. When they tap one of the panels, it expands into a notification card to show more details.

Notification board

  Notification panel                               Notification card expanded

The notification board consists of notification panels, which expand into notification cards.

  • Notification panels

    Notification panels display the title, part of the content, and the total number of notifications received from an app. The panels should provide appropriate information to help users decide whether to view notifications in full or do other things. Customize icons and other design elements of your app’s notification panels. Group notifications from the same app into a single panel, as the total number of notifications will be shown at the bottom of the screen.

  • Notification cards

    Each notification panel expands into a notification card that shows more details and body text. You can also include an action button that performs a related task and a More options button. More options include Block app and Clear by default, and you can add more functions like Share or Select App.

Designing notifications

All elements of notifications can be customized to deliver information in the most effective way.

  • Design elements

    Information is configured differently on notification pop-ups, notification panels, and notification cards.

    Notification pop-up alert

              Notification panel

    Notification card

    Full pop-up alert

     

    Small pop-up alert

     

  • App icons

    App icons show which app the notification corresponds to. You can design separate icons for the notification board to optimally brand your app. If you don't provide an icon design for the notification board, an app icon will appear at the top center of the notification panel.

    Original app icon

    When a separate icon is designed for the notification board.

    When no separate icon is designed for the notification board.

  • Title

    Use the most important word or phrase in the card as the title. For instance, the sender's name in a messaging app.

  • Body text

    Body text forms the main content of a notification. You can choose to fill the body solely with text or include images or attached files.

  • Action buttons

    Action buttons give access to related functions or tasks, like sending a message or opening an app. Provide action buttons below the body text of a notification or in a More options menu.

    Actions can be surfaced in More options menus.