Tirando o melhor dos estados vazios em um app.
A experiência de uso de um aplicativo é algo interessante de se projetar, muitas vezes nos focamos em pensar já na aplicação finalizada e cheia de dados providas pelo usuário sem ao menos lembrar em como vai ser a recepção deste mesmo em seu primeiro uso.
Este esquecimento pode nos levar a um problema mortal para toda aplicação: transformar o primeiro uso em algo frustrante, fazendo com que o usuário abandone a aplicação. E é isto que estamos aqui para evitar!
O que é um estado vazio?
Basicamente, um estado vazio é o que o usuário vê quando não há dados para mostrar na tela. Simples. A idéia é que mesmo que não haja nenhum dado a retenção do usuário no app não caia ou ele venha tomar uma ação indesejada.
Uma abordagem interessante do uso de estados vazios é como o Gmail recebe seus usuários:
A maneira que o Gmail recebe seus novos usuários é bem interessante, observe: As informações básicas vem no mesmo formato que você vai ter outras informações e usá-lo no futuro: e-mails.
Nestes e-mails, a própria aplicação envia instruções sobre como você pode obter mais valor do aplicativo, todos projetados para aumentar o sucesso de uso pelo usuário (e, posteriormente, de retenção).
Um estado vazio útil diz o que é e por que você está vendo-o bem como de que maneira você pode preenchê-lo.
Um estado vazio tem que ser bonito mas acima de tudo útil.
Como projetar um estado vazio?
Ao projetar um estado vazio você tem que ter em mente três perguntas e respondê-las de forma a reengajar o usuário o quê, porquê e como preencher.
Observe a tela abaixo:
- o quê: Não existem vacinas e medicações.
- porquê: Por que nenhuma foi cadastrada.
- Como preencher: Acessando o painel web e cadastrando novas.
Obs: Claro que seria mais fácil cadastrar já no aplicativo, mas por causa das especificidades no sistema e o tanto de dados pedidos para cadastro da medicação e registro perante orgãos responsáveis, foi optado por orientar o usuário a usar o painel web neste aplicativo.
Obtendo a atenção do usuário com os estados vazios
Este é um grande problema. É a forma mais eficiente de continuar o seu processo de integração e manter seus usuários engajados.
Como eu disse no início, estados vazios podem e devem ser utilizados para envolver os usuários e ajudá-los a obter uma melhor experiência e satisfação no uso do app.
Trabalhando branding em estados vazios
Os estados vazios são uma excelente oportunidade para fazer uma conexão humana com seus usuários e obter toda a personalidade de seu aplicativo.
Assim como como podemos ser engraçadinhos e criativos com páginas 404, estados vazios também são uma oportunidade pra esse tipo de situação.
Aaron Walter, especialista em Design emocional fez uma associação com a pirâmide de Maslow que mostra hierarquia das necessidades humanas para uma explicação sobre o que torna a experiência do usuário de um aplicativo bem-sucedida; enquanto que a sua aplicação deve ser funcional, confiável e útil, ele também deve ser prazerosa.
Usando emoções nos estados vazios
Voltando as tópico de caixas de entrada, note algo interessante sobre os diferentes tipos estados vazios; isto é, como algumas caixas de entrada parabenizam você por não ter tudo resolvido, enquanto outros aplicativos incentivam a preenchê-los.
O tipo de sentimento seus estados vazios transmitem depende da finalidade do seu aplicativo. O Google Hangouts por exêmplo, fica triste e quer que você adicione conteúdo falando com alguém, enquanto Inbox foca em motivar você a ler todos os seus e-mails.
Um dos aplicativos que trabalhei, o Farmin, incentiva o usuário a tomar uma ação de registro dependendo do contexto, a imagem abaixo mostra uma view vazia para adicionar o peso dos animais com um animal fazendo ‘carinha-de- cachorro-que-caiu-da-mudança’ (o animal também muda a imagem conforme o contexto do rebanho previamente configurado).
Use e abuse das emoções para incentivar seu usuário a preencher o estado vazio, como disse anteriormente, o importante não é ele ser bonito, é ser funcional, então não se apegue aos estados vazios como se fossem obras de arte, mas seja criativo ao implementá-los.
Quais são as principais lições a se aprender com estados vazios?
Assim como nos video-games porque você fez todo o caminho até o fim, você recebe uma recompensa especial, eis um TL;DR do texto:
- NUNCA deixe uma estado vazio realmente vazio, forneça feedback ao usuário
- Lembre sempre o por que que seu usuário deve preencher esses espaços.
- Se possível, use ilustrações e emoção para ‘forçar’ o usuário a preencher estas informações.
- Use filtro solar, nunca deixe de usar filtro solar.
Quer outros exêmplos para entender melhor os espaços vazios? Então acessa essa coleção aqui ó: http://emptystat.es/, e sempre é bom lembrar o bom e velho PTTRNS!
São milhares de exêmplos de espaços vazios nos mais diversos apps.
Atente-se sempre em não deixar o usuário sem feedback!
↪ DevFest Paraná vem aí e você não pode perder!
Você ta dormindo no ponto se ainda não adquiriu o seu ingresso pra esse evento! Vai ser em Foz do Iguaçu e os palestrantes já estão sendo mostrados na fan-page do face! Acesse o site para mais detalhes ou já compre seu ingresso clicando no banner abaixo — CORRE QUE É DIA 29! SÁBADO!.
↪ Merchan dos brother! Ionic Bootcamp!
Antes do Devfest Paraná rodar lá em Foz, o Joselito vai fazer seu bootcamp de ionic, você que é desenvolvedor e quer aprender mais sobre como criar aplicações híbridas usando JS e HTML é só clicar no banner! ̶N̶a̶ ̶m̶i̶n̶h̶a̶ ̶m̶ã̶o̶ ̶é̶ ̶m̶a̶i̶s̶ ̶b̶a̶r̶a̶t̶o̶! Não, já ta barato pra caramba!
Se você gostou do post, recomende pra seus amigos no Medium clicando no coração, me segue no Medium, tem texto novo sempre que sobra um tempinho. além do mais, você pode ajudar e ver um pouco mais do que faço clicando abaixo:
