Partilhar via

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

Aumente o engajamento do utilizador com o seu app fornecendo notificações personalizadas, executáveis e úteis app (também chamadas de toast notificações). App notificações são as notificações do Windows que aparecem no canto inferior direito da tela do usuário e a Central de Notificações (chamada de Central de Ações no Windows 10). Este artigo fornece orientações de design a serem consideradas ao planear e implementar a experiência de notificação para o appapp.

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

Note

O termo "toast notificação" está a ser substituído por "app notificação". Ambos os termos se referem ao mesmo recurso do Windows, mas com o tempo eliminaremos gradualmente o uso de "toast notificação" na documentação.

As notificações devem ser informativas e valiosas

Projete suas notificações para ter uma intenção clara para que o usuário possa entender rapidamente o propósito da notificação e permanecer em seu fluxo. Considere os cenários de usuário que suas app notificações estão habilitando e adicione elementos à sua notificação que sejam apropriados para cada cenário. As notificações devem permitir que o usuário economize tempo, mas não devem distrair ou criar mais trabalho.

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

Considere quais elementos da interface do usuário oferecem mais valor para seu cenário de usuário. O objetivo 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.

Buttons

Os botões acionam 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 embutida.

Images

As imagens podem ser app substituídas por logotipo, embutidas ou heróis. Ao adicionar imagens, o usuário pode analisar seu conteúdo mais rapidamente. Os exemplos incluem adicionar uma imagem de sobreposição de logotipo app representando o perfil do remetente a uma notificação de bate-papo ou e-mail.

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

Quick replies

As caixas de resposta rápida permitem que os utilizadores respondam às mensagens sem abrir o app. Os exemplos incluem a adição de caixas de resposta rápida a uma notificação de chat.

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

Botões do menu de contexto

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

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

Progress bars

As barras de progresso comunicam o status de operações de longa duração. Ao adicionar uma barra de progresso, o utilizador não precisa verificar o app para atualizações. Os exemplos incluem comunicar um download de arquivo ou atualização de jogo com uma notificação da barra de progresso.

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

As notificações não devem ser ruidosas

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

  • Um método de não interromper o usuário, mas ainda assim comunicar informações valiosas é suprimindo a notificação, o que significa que a notificação é automaticamente colocada diretamente na Central de Notificações sem um alerta.
  • No Windows 11, as Sessões de Foco permitem que os usuários suprimam notificações estranhas. Você pode usar a API FocusSessionManager para detetar se o utilizador está numa sessão de foco e ajustar o comportamento de notificação do app em conformidade.

Responder à intenção do utilizador

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 utilizador clicar na sua notificação para iniciá-la, o seu app deve iniciar no contexto da notificação.
  • Se o utilizador clicar num botão na sua notificação, o app deverá iniciar 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, o app não deve ser iniciado.

Fornecer uma experiência consistente da Central de Notificações

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

A Central de Notificações permite que o usuário visualize 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 a Central de Notificações arrumada limpando as 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ções torna a experiência de notificação previsível e intuitiva para os usuários.

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

  • O usuário recebe 10 novos e-mails e, portanto, 10 novas notificações. O usuário vai até o e-mail app e visualiza 10 e-mails, sem interagir com as 10 notificações. Depois que o usuário visualiza os 10 e-mails, o e-mail app remove as 10 notificações da Central de Notificações. Isso também se aplica se o usuário tiver visualizado os 10 e-mails em outro lugar, como seu telefone ou site.
  • O usuário recebe 10 novas mensagens de bate-papo de um usuário e, portanto, 10 novas notificações. O usuário seleciona uma dessas notificações de bate-papo, que inicia o bate-papo. Depois que o usuário visualiza o bate-papo, o app remove as 9 notificações restantes da Central de Notificações.

Orientação do desenvolvedor para notificações

  • Last updated on