Noções básicas de design de notificações

Este artigo fornece diretrizes de design para planejar e implementar sua appexperiência de notificação, incluindo escolher os elementos corretos da interface do usuário, gerenciar a frequência de notificação e lidar com interações do usuário. Para obter mais informações sobre app notificações, consulte App a visão geral das notificações.

Uma captura de tela mostrando uma app notificação acima da barra de tarefas. A notificação é um lembrete para um evento. O app nome, o nome do evento, a hora do evento e o local do evento são mostrados. Uma entrada de seleção exibe o valor selecionado no momento,

As notificações devem ser informativas e valiosas

Crie suas notificações para ter uma intenção clara para que o usuário possa entender rapidamente a finalidade da notificação e permanecer no fluxo. Considere os cenários de usuário que suas app notificações estão habilitando e adicione elementos à notificação que são apropriados para cada cenário. As notificações devem permitir que o usuário economize tempo, mas não deve distrair ou criar mais trabalho.

Escolha os elementos de interface do usuário de notificação corretos

Considere quais elementos da interface oferecem mais valor para o seu cenário de uso. A finalidade da notificação é permitir que o usuário realize uma tarefa ou é simplesmente obter novas informações? A seção a seguir mostra alguns elementos de exemplo que você pode usar em suas app notificações.

Uma captura de tela da área de trabalho cortada mostrando uma notificação com elementos de botão.

Botões

Botões disparam uma ação imediata. Ao adicionar botões, o usuário pode concluir uma tarefa dentro da notificação.

Uma captura de tela cortada da área de trabalho mostrando uma notificação com uma imagem integrada.

Imagens

As imagens podem ser app substituição de logotipo, embutida ou hero. Ao adicionar imagens, o usuário pode analisar seu conteúdo mais rapidamente. Exemplos incluem a adição de uma app imagem de substituição de logotipo representando a imagem do perfil do remetente a uma notificação de chat ou email.

Uma captura de tela da área de trabalho cortada mostrando uma notificação com uma caixa de resposta rápida.

Respostas rápidas

As caixas de resposta rápidas permitem que os usuários respondam às mensagens sem abrir o app. Exemplos incluem a adição de caixas de resposta rápidas a uma notificação de chat.

Uma captura de tela da área de trabalho cortada mostrando uma notificação com um menu de contexto.

Botões de menu de contexto

Os botões de menu de contexto oferecem aos usuários mais opções ao clicar com o botão direito do mouse na notificação ou na seleção do ícone de menu de contexto. Um exemplo de cenário é adicionar uma opção para silenciar um chat em grupo por uma hora.

Uma captura de tela da área de trabalho cortada mostrando uma notificação com uma barra de progresso.

Barras de progresso

As barras de progresso comunicam o status de operações de longa duração. Ao adicionar uma barra de progresso, o usuário não precisa verificar novamente em seu app para atualizações. Exemplos incluem a comunicação de um download de arquivo ou atualização de jogo com uma notificação de barra de progresso.

Para ver todos os elementos da interface do usuário que podem ser usados em uma notificação, consulte App o conteúdo da notificação.

As notificações não devem ser barulhentas

Os usuários podem facilmente ser sobrecarregados com muita informação e ficar frustrados se estiverem sendo interrompidos enquanto tentam se concentrar. Muitas interrupções levam os usuários a desativar esse canal de comunicação crítico para seu app.

  • Um método de não interromper o usuário, mas ainda comunicar informações valiosas é suprimir a notificação, o que significa que a notificação é colocada automaticamente diretamente no Centro de Notificação sem um alerta.
  • Em Windows 11, as Sessões de Foco permitem que os usuários suprimam notificações desnecessárias. Você pode usar a API FocusSessionManager para detectar se o usuário está em uma Sessão de Foco e ajustar seu appcomportamento de notificação adequadamente.

Responder à intenção do usuário

Assim como o design da interface do usuário de notificação, o comportamento quando o usuário clica na notificação ou em elementos da interface do usuário dentro da notificação deve ser deliberado e consistente e deve envolver o usuário em uma tarefa ou cenário claro.

  • Se o usuário clicar na sua notificação para iniciá-la, seu app deverá ser iniciado no contexto da notificação.
  • Se o usuário clicar em um botão na sua notificação, o seu app deve ser iniciado no contexto apropriado para a ação do botão
    • No entanto, se a ação for destinada a ser uma tarefa em segundo plano, como uma resposta rápida, app não deve ser iniciado.

Fornecer uma experiência consistente da Central de Notificação

Uma captura de tela da área de trabalho cortada mostrando a Central de Notificações com várias notificações.

A Central de Notificação permite que o usuário exiba e responda às notificações depois que elas forem exibidas ou, no caso de notificações silenciosas, depois de terem sido recebidas, mas não exibidas. É importante manter o Centro de Notificação arrumado limpando notificações antigas. Você também deve fornecer uma experiência consistente ao remover notificações para que o usuário se sinta confiante de que não está faltando informações. Seguir convenções padrão para remoção de notificação torna a experiência de notificação previsível e intuitiva para os usuários.

Veja a seguir alguns cenários de exemplo que ilustram estratégias para limpar notificações antigas da Central de Notificação:

  • O usuário recebe 10 novos emails e, portanto, 10 novas notificações. O usuário vai para o email app e exibe 10 emails, sem interagir com as 10 notificações. Depois que o usuário exibir os 10 emails, o email app removerá as 10 notificações da Central de Notificação. Isso também se aplica se o usuário tiver exibido os 10 emails em outros lugares, como seu telefone ou site.
  • O usuário recebe 10 novas mensagens de chat de um usuário e, portanto, 10 novas notificações. O usuário seleciona uma dessas notificações de chat, que inicia o chat. Depois que o usuário exibir o chat, as 9 notificações restantes serão removidas da Central de Notificações pelo app.
  • Last updated on