O que é estado vazio
Estado vazio é a tela que aparece quando ainda não existe conteúdo para mostrar. Ele ocorre no primeiro acesso, depois de uma busca sem resultado ou quando uma lista é esvaziada.
O vazio é uma tela de orientação. Ele explica o que aparece ali, por que está vazio e qual ação cria o primeiro item.
A diferença para erro e permissão
O vazio tem causas diferentes. A lista pode estar vazia porque o cliente ainda não criou nada, porque o filtro não encontrou resultado ou porque a permissão limita o que ele vê.
Cada caso exige um texto próprio. O erro oferece nova tentativa, e a falta de permissão indica o responsável pelo acesso. O vazio oferece a criação.
O que a tela precisa dizer
O título nomeia o conteúdo ausente, a descrição explica o benefício de criar o primeiro item e a ação principal aparece com o verbo que descreve o resultado.
A tela também pode mostrar um exemplo ou um caminho de importação. O recurso serve quando o cliente chega com informação pronta de outro sistema.
Exemplo
Como conferir
Abra a tela com um cadastro novo e percorra o caminho até o primeiro item. Confira o texto, a ação e o estado seguinte. Repita com um filtro sem resultado e com um usuário sem permissão.
O onboarding usa o estado vazio como primeiro passo. O UX writing define o texto que explica a ação e o resultado.
Dúvidas frequentes
Perguntas frequentes sobre Estado vazio
- Estado vazio é a mesma coisa que erro?
- Não. O vazio indica que ainda não há conteúdo. O erro indica que uma ação falhou e precisa de correção ou de nova tentativa.
- O vazio precisa de texto?
- Sim. A tela explica o que apareceria ali e qual é o próximo passo. Sem essa orientação, o cliente não sabe se o sistema está vazio ou com problema.
- Um botão resolve o estado vazio?
- O botão resolve quando a ação é clara. A tela também precisa explicar o benefício e o que será criado, principalmente no primeiro uso.
- Como conferir o estado vazio?
- Abra a tela com um cadastro novo e percorra o caminho até o primeiro item. Verifique o texto, a ação e o que aparece depois da criação.
Para continuar
Recursos relacionados
Artigo
Nielsen Norman Group: estados vazios
Apresenta tipos de estado vazio e orientações de desenho.
Abrir recursoDocumentação
Material Design
Reúne os padrões visuais e de conteúdo para telas sem item.
Abrir recursoAplicação na formação
Vibe Coding: Do Zero ao MVP
Na Formação Vibe Coding, o estado vazio aparece na primeira tela do MVP e na orientação para o cliente criar o primeiro item.
Conhecer a formação
Fontes consultadas
Referências deste verbete
Este verbete ajudou você?
Obrigado pela resposta. Ela fica salva apenas neste navegador.