Coloque informações importantes no contexto certo.
Progresso da revisão
Compare as informações e a apresentação no contexto de uso.
Experimente a operação, altere o status e continue trabalhando.
O progresso é salvo automaticamente neste navegador.
ORIENTAÇÕES
Execute a ação recomendada e retorne à tela. O banner precisa ser atualizado ou desaparecer quando o problema for resolvido; Não deixe que informações antigas continuem a preocupar os usuários.
EXEMPLOS
O banner “Informações completas para continuar” possui um botão para ir para a seção correta que falta; Após a adição, o banner não aparece novamente.
Distinguir informação, aviso, erro e sucesso com rótulos ou ícones além da cor.
Ler o banner sem as cores: deve continuar claro se exige atenção ou apenas informa.
Exemplo Pagamento não concluído mostra um ícone de aviso e uma ação para verificar.
Informar primeiro o que aconteceu e depois explicar brevemente o impacto e a ação seguinte.
Testar mensagens longas e valores dinâmicos: não esconder ações importantes no celular.
Exemplo A sessão vai expirar. Salve o rascunho antes de entrar novamente.
Priorizar a ação que resolve o evento e oferecer fechar quando a mensagem não for obrigatória.
Executar a ação e voltar: o banner de erro não deve permanecer se o problema foi resolvido.
Exemplo Reconectar aparece no aviso de perda de conexão e não leva à página inicial.
Destacar a mensagem o suficiente para ser percebida sem prejudicar o conteúdo principal.
Testar o banner sobre fundos coloridos e no tema escuro: texto, links e botões devem ser legíveis.
Exemplo O banner de aviso tem borda e ícone; a descrição mantém um tamanho de texto legível.
Usar ícones para indicar o tipo de mensagem, mantendo o texto como fonte principal de informação.
Ocultar o ícone e reler: a mensagem deve continuar compreensível por si só.
Exemplo Um ícone de cadeado acompanha Você não tem permissão para editar.
Colocar a mensagem perto da área afetada; avisos sobre toda a sessão podem ficar no topo.
Rolar a página e abrir o teclado: o banner não deve cobrir a ação da área relacionada.
Exemplo Erros de filtro ficam ao lado dos resultados; manutenção do serviço aparece no topo.
