Digite para filtrar os verbetes do Glossário.

    Vibe Coding e produto · Vibe Coding: Do Zero ao MVP

    O que é Estado vazio?

    Estado vazio é a tela sem conteúdo, que precisa explicar o próximo passo. Entenda o desenho, a diferença para erro e a conferência no primeiro uso.

    Também chamado de: empty state, tela vazia

    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

    Aplicaçã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
    Capa da Formação Vibe Coding do Zero ao MVP

    Fontes consultadas

    Referências deste verbete

    Este verbete ajudou você?

    Planos Promovaweb

    Tire seus projetos do papel

    O Plano Martech cobre automação e atendimento. O Plano IA Makers acrescenta desenvolvimento com IA, enquanto o Plano Founders trata de gestão de negócios. Todos são anuais.

    Plano Martech

    Para conectar automação, marketing e atendimento com infraestrutura própria.

    R$ 897

    R$ 597/ano

    • Grade de automação, atendimento, marketing e análise de indicadores
    • Instalador Exclusivo Promovaweb
    • n8n, Evolution API, Chatwoot e Mautic
    • Trilha DevOps incluída
    • Encontros ao vivo (terça e quinta)
    • Comunidade e acompanhamento
    Conhecer o plano

    Plano Founders

    Plano anual para fazer um projeto de tecnologia avançar, com 90 dias de mentoria intensiva. R$ 1.997 à vista ou até 10x de R$ 219 no cartão.

    R$ 1.997/ano

    • 12 meses de acesso ao Founders
    • 90 dias de mentoria intensiva, um encontro por dia útil
    • Dia de conteúdo (terça e quinta) e War Room (segunda, quarta e sexta)
    • Encontro semanal em grupo após a fase intensiva
    • Formação Vibe Coding incluída no plano anual
    • Consultoria individual de até duas horas (bônus)
    Conhecer o plano