Ux Writing: estudo de caso da plataforma Take Blip
Você acompanhará neste post uma breve análise sobre o tom e voz empregados no site da Take Blip, com algumas sugestões de melhorias.
O objetivo desta análise é avaliar como a linguagem é utilizada para dar uma personalidade identificável ao público ao acessar o site da Blip. Além disso, definir tom e voz também torna possível orientar equipes sobre como trazer informações claras e autoexplicativas.
Vamos entender como isso funciona na prática?
Num olhar, as primeiras impressões
Iniciamos a análise entrando no site da Blip a partir do link https://account.blip.ai/login.
O primeiro ponto que chama a atenção é o uso da arte e elementos gráficos. Estes se apresentam de forma a denotar um ar limpo, jovial, trabalhando as cores da identidade visual da Blip para fortalecer a marca já nesse primeiro contato.
Atentando para os textos, observamos que ele tenta gerar as mesmas impressões positivas que o visual assinala: é dinâmico, positivo, focado em apresentar soluções.
A arte, então, já conta com frases curtas, imperativas e persuasivas que, juntas, assinalam o objetivo geral do site e constroem uma certa atmosfera à pessoa usuária (Figura 1):
Figura 1: textos na arte alocada no link https://account.blip.ai/login. Acesso em 05.11.2021.
- “Faça o cadastro gratuito!” - há uma ação que a pessoa usuária deve empreender. Mas por quê?
- “Crie seu chatbot” - eis a resposta! A criação do cadastro resolve esse problema.
- “Configure sem complicações” - não apenas a Blip resolve problemas, mas também o faz de maneira simplificada, e por isso é mais interessante que os concorrentes.
Com isso, os textos cumprem a função de ambientar a pessoa usuária, de forma breve e direta, sobre o que é a empresa e o que ela oferece.
Perceba que esses são blocos de texto integrados à arte e ainda não se relacionam explicitamente à ação de login e demais mensagens diretamente relacionadas ao UX Writing.
Porém, são frases que se relacionam com as características incitadas pela foto/arte e, por conseguinte, devem estar alinhadas aos demais elementos textuais como forma de dar uma unidade ao tom e voz.
Bom dia, boa tarde, boa noite
Em termos de texto mais diretamente relacionado ao UX Writing, chama a atenção o uso do cumprimento em destaque: “Boa tarde :)” (Figura 2).
Figura 2: frase inicial no link https://account.blip.ai/login. Acesso em 05.11.2021.
Ele nos instigou a questionar se, em outros horários, veríamos uma mudança programável para o texto em horários diferentes de acesso - por exemplo, pela manhã, o usuário leria “Bom dia :)”? E, pela noite, “Boa noite :)”?
Por conta do fuso horário, pensamos também em outro detalhe: será que a mensagem se ajusta ao fuso horário do local onde está a pessoa usuária? Esse insight se deu ao lembrar da grande extensão do país, o que faz com que ele tenha diversos fusos.
Dúvida: O “Boa tarde :)” sofre um ajuste para se adequar ao fuso horário da pessoa usuária acessando o site? |
Esse pode parecer um detalhe mínimo em uma página de login, mas é um ajuste que vale a pena ser pensado para minimizar confusão na pessoa usuária. Afinal, o foco é que ela realize com sucesso a tarefa de efetuar login, e não que repare em ambiguidades na comunicação.
Confirmando a suspeita, no período da noite, a frase mudou, seguindo o fuso horário da máquina utilizada para acesso (Figura 3).
Figura 3: O cumprimento muda de acordo com o fuso horário da pessoa usuária. Acesso em 06.11.2021.
Caso isso não ocorresse, a sugestão para solucionar o problema seria utilizar outra forma de cumprimentar a pessoa usuária. Algumas sugestões que manteriam as características de jovialidade, positividade, assertividade e simpatia são:
- Olá! :)
- Oi, tudo bem? :)
- Que bom ter você por aqui! :)
Enfim, o login!
Finalmente, chegamos ao grande momento: o login!
Se ele é efetuado, quer dizer que a pessoa usuária já embarcou no que a Blip deseja apresentar a ela; e se ainda não tem esse login, significa que precisamos orientá-la a realizar um cadastro.
Independente da opção de logar direto ou preencher um cadastro, é preciso explicar para a pessoa usuária que ela deve seguir uma dessas ações.
Isso explica o texto “Para começar, faça o login na sua conta”. De início, avaliamos que ele poderia ser complementado de forma a criar dois blocos de texto:
Bloco 1: “Para começar, faça o login na sua conta. Bloco 2: Não tem cadastro? Crie o seu agora!” |
Porém, observando a forma de dispor o texto “Cadastre-se grátis”, avaliamos que ele chama a atenção o suficiente da pessoa usuária. O motivo: tem uma cor diversa (o azul em tom frio) e está presente como ghost button, equilibrando a necessidade de direcionar o olhar sem ser, no entanto, gritante demais.
É a mesma lógica da opção de login via conta do Google, que também conta com cor diversa. Este ainda tem a vantagem de se aliar a um recurso extremamente popular, facilitando ainda mais o login da pessoa usuária.
Partindo para a opção de login via preenchimento dos campos “E-mail” e “senha”, observa-se que eles poderiam ser ainda mais claros à pessoa usuária se indicassem, em cor mais discreta (algum tom de cinza), orientações via texto para esclarecer o preenchimento dos campos (Figura 4), tais como:
| - No campo e-mail: “exemplo: seuemail@email.com” - No campo senha: “até X dígitos” |
Figura 4: campos de preenchimento de e-mail e senha para login. Acesso em: 06.11.2021.
Porém, vale destacar o uso das cores das bordas do campo para orientação de preenchimento e a mensagem de preenchimento obrigatório dos campos (Figura 4).
Além disso, na medida em que esses campos são preenchidos, surgem orientações à pessoa usuária sobre a tarefa. No campo E-mail, por exemplo, o preenchimento incorreto aponta para a mensagem “Deve ser um e-mail válido” (Figura 5).
Figura 5: preenchimento incorreto do campo E-mail gera mensagem de orientação. Acesso em 06.11.2021.
Já o campo Senha, se preenchido incorretamente, aponta para a mensagem “O valor é muito curto”, quando o número de caracteres é baixo (Figura 6).
Figura 6: preenchimento incorreto do campo Senha gera mensagem de orientação. Acesso em 06.11.2021.
O mesmo não acontece, porém, quando o campo é preenchido por um número alto de caracteres (Figura 7). Porém, como essa quantidade potencializa erros de preenchimento, nossa recomendação é limitá-los, orientando a pessoa usuária quanto a isso.
Figura 7: alto número de caracteres não gera mensagem de erro de preenchimento. Acesso em 06.11.2021.
Como sugestão, acreditamos que, ao fazer esse tipo de preenchimento, a borda do campo poderia ficar vermelha, seguindo a lógica de preenchimento com número muito baixo de caracteres para a senha, com a seguinte mensagem: “até X dígitos”.
Seguindo na análise, é interessante o uso do “Esqueceu sua senha?” escrito da mesma forma que em vários outros sites e em cor diversa, pois isso gera uma identificação rápida desse elemento como um link cuja função é clara: auxiliar a recuperar a senha ou reconfigurá-la. É a mesma lógica aplicada ao box de Captcha.
Por fim, nesta página, destacamos o uso das cores nos botões de “Entrar” (azul) e “Cadastre-se grátis” (ghost button de bordas azuis). Este ajuda a hierarquizar o conteúdo e guiar o olhar da pessoa usuária (Figura 8). Outro ponto digno de nota é o uso do termo “grátis” no botão de cadastro porque é um gatilho poderoso de benefício.
Figura 8: opções de login e cadastro. Acesso em 06.11.2021.
Em uma avaliação geral do processo, vemos um equilíbrio no tom e voz quando a colocar a comunicação da Blip como simpática (o uso de emoji no cumprimento ajuda a reforçar isso, por exemplo), mas também assertiva (como vemos nas mensagens de orientação de login). Em ambos os casos, há uma unidade na forma “de falar” da empresa, que se desenha desde os textos na arte e perdura por todo o processo.
Login efetuado. E agora?
Uma vez que o login foi efetuado com sucesso, num primeiro acesso, a pessoa usuária é levada à página “Meu perfil”. Isso poupa tempo e paciência na navegação, assim como o fato dos campos da página contarem com orientações sobre seu preenchimento.
Estas vão desde mensagens de erro com variação de cores, mantendo a lógica de funcionamento da página de login - o que já gera identificação à pessoa usuária; até facilitações e preenchimentos automáticos, como quando vamos assinalar dados de localização (Figura 9).
Figura 9: orientações e facilitações na página de perfil. Acesso em 06.11.2021.
O tom das mensagens, aqui, é assertivo, mas já difere um pouco do da página de login. Se na primeira as mensagens focavam na assertividade e limitação de caracteres para garantir que a pessoa usuária efetuaria o login, aqui, o fato de ela já ter realizado o cadastro/login dá espaço para focar no tom de simpatia, como vemos no uso do emoji e tom mais amigável em mensagens como “Esse não parece ser um telefone válido. Por favor, tente de novo :)” (Figura 9).
A lógica de uso de cores das caixas de preenchimento, por sua vez, usam a mesma lógica do login: o campo Site fica vermelho e assinala mensagem de erro se não colocamos ali um bloco de texto com escrita diferente do padrão; o campo Telefone sequer permite que digitemos letras ao invés de números; e, ao preencher a cidade corretamente, o campo fica verde e o Estado e País são preenchidos automaticamente. Essa é uma ordenação seguida também na opção Preferências.
No topo da página, o botão “Salvar alterações” é bem visível, mudando de cor quando tudo está preenchido corretamente. Mais uma vez, há uma lógica no uso de cores, alocação de botões e tom da mensagem, tudo atuando conjuntamente.
Quando seguimos para a opção Alterar Senha, a mesma sugestão dada anteriormente sobre senhas ao logar pode ser aplicada aqui. Quando vemos a mensagem “A senha deve conter PELO MENOS 8 itens [...], acreditamos que deveria haver um limite para os caracteres, com fins de evitar erros de preenchimento para as pessoas que não salvam automaticamente essas senhas em suas máquinas de acesso (Figura 10).
Figura 10: mensagem sobre tipos e quantidade de caracteres da senha. Acesso em 06.11.2021.
Porém, vale destacar que a mensagem mostrada para o item Nova Senha é bastante didática, o campo de confirmação de senha realmente indica se a mesma está incorreta e o botão de confirmação de mudança de senha (Alterar Senha) tem uma mensagem clara, sem ambiguidades quanto a que tarefa a pessoa usuária está fazendo ali.
No portal
Navegando pelo portal pela primeira vez, a unidade no tom e voz empregados pela Blip se mostra novamente apurada. A simpatia e assertividade são a tônica, com uma sendo dosada um pouco mais que a outra, dependendo do que cada bloco de texto quer dizer.
No texto de início da navegação, por exemplo, a orientação é apresentada de forma direta, mas amigável, em tom de conversa com a pessoa usuária. O “vamos lá” do botão, sem a atenção correta a esses detalhes, seria um simples “Iniciar” ou “Avançar”. Aqui, ele é um convite! (Figura 11)
Figura 11: texto inicial do portal. Acesso em 07.11.2021.
Ao clicar em “Vamos lá”, automaticamente surge, no primeiro acesso, a mensagem informando sobre o uso de cookies. Normalmente, essas são mensagens irritantes, pois estão fora do interesse da pessoa usuária na navegação.
Aqui, porém, o tom é mais leve, fazendo com que a pessoa, por mais que ignore a mensagem e apenas clique no botão “Ok, entendi”, não tenha sentimentos negativos pelo simples uso de uma ilustração cômica e fofa (Figura 12). O texto em si que detalha sobre o uso de cookies poderia, então, equilibrar o tom informativo e assertivo com o tom de brincadeira que a ilustração carrega, talvez substituindo o título “Cookies” por algo do tipo “Huuum, cookies”, “Entra que tem cookies!” ou variantes.
Figura 12: mensagem sobre o uso de cookies. Acesso em 07.11.2021.
Após aceitar o uso de cookies ao clicar no botão “Ok, entendi”, cuja cor e destaque chama a nossa atenção, a página apresenta opções muito autoexplicativas para a criação de chatbots.
Há uma personalização no título principal (Espaço de trabalho de [nome da pessoa]); botões em destaque hierarquizados através de cores (“Criar roteador” e “Criar chatbot” - este último mais destacado em ambas as vezes que aparece na tela); um texto inspirador e em tom de convite para continuar a impelir a pessoa usuária no uso da plataforma (“Para começar sua jornada de transformação digital, que tal criar seu primeiro chatbot?”); dois campos que nos auxiliam a ter mais segurança quanto ao uso das demais opções (“Aprenda a utilizar o Take Blip” e “Tire suas dúvidas com a comunidade”) e um para atentarmos a detalhes de contrato (“Painel de contrato”) (Figura 13).
Figura 13: visão geral do Espaço de Trabalho. Acesso em 07.11.2021.
É relevante destacar que os três blocos de tarefas na parte inferior têm breves descrições de suas funções. O tom delas é amigável e assertivo, de quem não tem tempo a perder, mas não usa isso como desculpa para ser frio ou pouco cordial.
A persona-base nos remete sempre a uma figura jovem, esperta, com vigor, simpatia e domínio do que fala e faz. Em suma, a Blip fala como o tipo de jovem com que outros jovens gostariam de se comunicar e fazer negócios, e como o tipo de jovem que pessoas mais velhas respeitariam e aceitariam orientação para empreender tarefas no mundo digital.
No geral, o tom e voz empregados são adequados para os diversos “momentos” do processo de navegação, equilibrando humores e expectativas da pessoa usuária. Afinal, às vezes não queremos e nem demandamos ser envolvidos por uma mensagem cativante; queremos apenas atingir um objetivo o mais rápido e fácil possível. E isso é algo que o UX Writing na plataforma parece dominar bem.
Essas impressões se mantêm ao avançarmos na navegação. Neste caso, escolhemos clicar na opção em maior destaque, “Criar chatbot”. O tom e voz escolhidos para a descrição das opções “Criar do zero”, “Usar um template” e “Atendimento humano” permite uma comunicação clara e simples de entender (Figura 14).
Figura 14: opções para criação de chatbots. Acesso em 07.11.2021.
Uma sugestão a ser avaliada, dependendo do perfil de pessoa usuária da plataforma, seria a substituição do termo “template” por “modelo de chatbot” na descrição do item “Usar um template”. Assim a descrição seria: “Aqui você escolhe um modelo de chatbot pronto para uso. Com tudo o que você precisa para dar início ao seu contato inteligente!”. O motivo dessa sugestão seria explicar o termo “template”, caso a pessoa usuária não fosse familiarizada com o mesmo.
Criar do zero
Escolhemos agora a primeira opção, “Criar do zero”. Embora informal, essa expressão é facilmente inteligível e, junto com a descrição logo abaixo do título, entendemos facilmente o seu objetivo. Clicando nela, As mensagens indicando como devemos preencher o nome do chatbot (indicando limite de caracteres), como colocar uma imagem para identificá-lo e os clicáveis (“Finalizar” e “Voltar”) são didáticos (Figura 15).
Figura 15: campos para criação de chatbot do zero. Acesso em 07.11.2021.
Como sugestão, acreditamos que o termo “finalizar” poderia ser substituído por “Continuar”, para dar uma ideia melhor à pessoa usuária de que há mais passos para a criação do chatbot nessa opção.
Usar template
Voltando agora à página anterior, decidimos avaliar a opção “Usar um template”. Clicando nela, temos uma série de opções, nomeadas de acordo com seus objetivos comunicacionais (FAQ simples, Atendimento segmentado, E-commerce etc.) (Figura 16).
Figura 16: opções de templates. Acesso em 07.11.2021.
Se fossem menos opções de templates, seria interessante colocar breves descrições das mesmas abaixo de seus títulos. Porém, por serem sete, a opção de usar títulos mais didáticos e os ícones altamente reconhecíveis das plataformas nas quais o chatbot pode rodar já dá um resumo válido à pessoa usuária (Figura 16).
Isso se reforça mais ainda pelo fato de que, ao escolher uma das opções de template, a pessoa é direcionada a explicações mais aprofundadas sobre seu uso (Figura 17).
Figura 17: opção FAQ Simples. Acesso em 07.11.2021.
A ordenação dos textos é agradável à primeira vista e didática numa leitura mais atenta. Divide o conteúdo em blocos superiores (com título, idioma, link de texto explicativo, palavras-chave; bloco designando o tipo de plano; canais suportados via ícones altamente identificáveis das plataformas; o detalhamento resumido do roteador; e o Sobre, no qual é explicado, com um texto mais extenso, a função desse chatbot. Temos, também, o botão em destaque “Selecionar template”, o qual confirma o uso deste modelo pela pessoa usuária.
Acerca do “Sobre”, é válido sugerir algumas quebras de frase para outras mais curtas, seguindo preceitos que também vemos na redação para Inbound Marketing, por exemplo. O motivo é que frases curtas, na web, potencializam a manutenção de atenção e a facilidade de entendimento na leitura.
Além disso, a substituição de alguns termos por outros mais curtos também poderia ser empregada. Assim, sugerimos uma mudança como esta:
A FAQ SIMPLES é um Contato Inteligente pronto para empresas que desejam estreitar o relacionamento com seus clientes. Com ele, você:
O template da FAQ SIMPLES é composto de:
Ao usar esse template, você:
|
Seguindo tal sugestão, acreditamos que a Blip mantém o padrão de tom à voz empregada até então no processo de navegação da pessoa usuária, além de facilitar o processo de scanning reading, comum na web.
Atendimento humano
Voltando ao menu anterior (Figura 14), optamos por dar uma olhada na opção Atendimento Humano. Sua descrição inicial explica que, com ele, é possível responder usuários através de um atendente humano.
Ao clicar nessa opção, somos levados a uma nova página, na qual vemos um título mais confuso: “Testar template”. Ao contrário das opções anteriores, não é muito claro se aqui vamos criar um chatbot, simular o uso de um modelo ou testar algo que já deveríamos ter criado em outra opção do site (Figura 18).
Figura 18: seção Atendimento Humano. Acesso em 07.11.2021.
Ao lermos a descrição “Bot de atendimento humano”, entendemos melhor o que essa seção do site objetiva nos oferecer. Avaliamos, então, que esse poderia ser o título principal, no lugar de “testar template”. Por sua vez, o botão “Teste” poderia ser um CTA menos ambíguo, usando uma descrição como “Teste esse bot”, uma vez que a palavra “teste” pode ser tanto um verbo como um sinônimo.
Ao testarmos o bot, outro ponto chama a atenção. O texto que aparece diz, em dado momento: “Infelizmente não temos atendentes disponíveis agora. Nosso horário de atendimento é de 08:30 às 18:50 (Figura 19). Ficamos confusos sobre a mensagem, sem saber se essa é apenas uma simulação geral do que seria a resposta ou se ela realmente simularia algum tipo de atendimento com mais especificidades.
Figura 19: teste do Bot. Acesso em 07.11.2021.
Uma das dúvidas geradas foi: o acesso-teste se deu em um domingo, às 15h22; logo, dentro do horário indicado. Essa mensagem, então, deveria dizer que o horário de atendimento é, por exemplo, de segunda à sexta-feira, de 08h30 às 18h50? Ou essa é uma simulação extremamente geral, só para vermos um exemplo de mensagem possível de ser programada?
Essas parecem dúvidas bobas, mas dependendo da pessoa usuária, elas geram frustração e resistência quanto ao uso do recurso e valem a pena serem avaliadas. Por isso, sugerimos a adição de um bloco de texto que explicaria isso à pessoa usuária, algo do tipo “Veja um exemplo de como o Bot de Atendimento Humano informaria o horário de funcionamento aos seus clientes”.
Em uma plataforma cuja clareza, didatismo e boas sensações são tão presentes, esse foi a única sessão que avaliamos em que a voz soou ambígua, o que não combina com o tom geral idealizado para a Blip.
Mover chatbots
Por fim, observamos que, ao voltar para o Espaço de Trabalho, o botão “Mover chatbots” permite selecionar os chatbots e o contrato para o qual a pessoa usuária deseja associá-lo. Tal processo é quase intuitivo graças às mensagens de orientação (exemplo: os bots selecionados aparecerão aqui) e recursos como a marcação de caixas alocando cada chatbot (Figura 20).
Figura 20: opção Mover chatbots. Acesso em 07.11.2021.
Nessa opção, mais uma vez a assertividade se destaca, com frases breves e muito simples, que ajudam a pessoa usuária a entender o que e como deve ser feito o processo ao qual a página se dedica.
Partindo para a conclusão…
Com isso, finalizamos a análise proposta para a atividade técnica. Ao longo dela, apresentamos diversas observações de como se dá o UX Design, UX Writing e inferimos alguns pontos que a pesquisa do UX Research avaliou como o melhor caminho para servir à plataforma.
A partir dessa análise, podemos resumi-la nos seguintes apontamentos mais centrais de verificação de escrita UX quanto à heurística de conteúdo:
Práticas com melhor avaliação:
- É de fácil leitura
- É concisão
- É simples
- É consistente ao longo da navegação
Práticas que podem melhorar:
- Hierarquização dos conteúdos na medida que se aprofunda na navegação de opções específicas e descrições de benefícios.
Pontos fortes de voz e tom:
- Mostra empatia
- É “on brand”
- Passa confiança
Pontos que podem melhorar:
- Ser gramaticalmente mais apurado em alguns pequenos detalhes (exemplo: aplicação de vírgulas)
Pontos fortes nas Mensagens de erro:
- Apontam para ações de resolução de problemas
- Mostram empatia e compaixão
Pontos fortes de Notificações e alertas:
- Demarcam bem no layout o erro para ser corrigido
- É focado na pessoa usuária
- É claro e direto
Pontos fortes de onboarding:
- Envolve a pessoa usuária na narrativa de resolução de dores a partir do uso da plataforma.
- Desperta o senso de necessidade do uso da plataforma.
- É focado nos interesses e dores da pessoa usuária
- Coesão entre o que é apresentado como vantagem no uso da plataforma e o que é de fato oferecido à pessoa usuária.
De maneira geral, concluímos que a Blip trabalha bem o UX ao longo da navegação proposta no site. Apesar de possibilidades de melhoramento, acreditamos que a plataforma atende de maneira satisfatória os desejos de quem a utiliza, pois entrega algo simples, intuitivo, agradável e relevante aos clientes.
Post a comment