Usando os microtextos a favor da experiência do usuário
Há alguns anos falava-se muito sobre o fato de que usuários não lêem. Mas convenhamos, isso era em uma época onde grande parte das interfaces digitais (majoritariamente “sites”) utilizavam grandes blocos de texto para comunicar mensagens aos usuários. Talvez uma herança das revistas, cartilhas ou manuais de instrução, onde parte-se do pressuposto que o usuário está disposto a ler textos em profundidade.
Anos depois, mobile. Uma mudança de paradigma que afetou não apenas a forma como os sistemas são desenhados, mas também a forma como os usuários se comportam ao interagirem com eles.
- Do ponto de vista do sistema: interfaces extremamente pequenas, com espaço limitado para texto e um tipo de interação muito mais curta, breve, em pequenas doses.
- Do ponto de vista do usuário: uso muito mais fragmentado de tecnologia no decorrer do dia (150 vezes, em média), o hábito do multi-tasking e um nível de concentração muito diminuído sobre o que está sendo feito.
Tendo isso em vista, é natural que as pessoas estejam muito menos dispostas a “ler” interfaces.
Daí surge o termo “microtexto” (“microcopy” em inglês). Na prática: a arte de conseguir transmitir uma mensagem em pequenos fragmentos, num espaço limitado de texto, com concisão, clareza e personalidade. Pode ser um nome de um botão, uma mensagem de erro ou sucesso, uma linha de instrução exibida acima de um formulário, um tooltip de ajuda — qualquer texto de interface.
Um bom exemplo para começar?
[caption id=”attachment_10061" align=”alignnone” width=”414"]
O link de “Like” do Facebook: microtexto do começo ao fim.[/caption]
O “Curtir” do Facebook. Repare como a ação inicial é descrita somente em texto. Quando o usuário clica, o feedback é transmitido também somente em texto (“Like” vira “Unlike”). E para desfazer a ação? Somente texto, de novo.
Leia também: You Should Folllow Me on Twitter
Interessante que é possível observar o uso de microtexto sob dois aspectos: um mais funcional e outro mais emocional.
O aspecto funcional é esse que descrevi no parágrafo anterior: uma ação simples onde todos os estados são transmitidos com clareza ao usuário. Sem erro. Sem ruído ou ambiguidade.
Já o aspecto emocional é um pouco mais abstrato, obviamente. A ação escolhida pelo Facebook foi “Curtir” por algum motivo. É o verbo que mais combina com a personalidade leve (leviana?) da rede social. Imagine se fosse “Amar”. Imagine se fosse “Legal”. Imagine se fosse “LOL” ou “Adorar”. Talvez você achasse o Facebook muito mais “pegajoso” do que já acha. O microtexto ajuda não apenas o usuário a entender o que está acontecendo no sistema, mas também a formar em sua cabeça a percepção que ele tem daquele produto/marca.
[caption id=”attachment_10062" align=”alignnone” width=”423"]
Já o Svbtle preferiu chamar o seu botão de “Kudos” (exemplo); mais alinhado com sua personalidade.[/caption]
O valor funcional dos microtextos
Além de explicar uma ação (“cadastrar”), um microtexto pode ser usado para orientar o usuário na realização de uma tarefa (“sua senha deve conter no mínimo 6 caracteres”) ou dar feedback sobre uma ação que ele realizou (“sua conta foi criada com sucesso”).
Também é possível usar microtextos para antecipar necessidades, anseios ou preocupações que o usuário terá ao realizar determinada tarefa. Veja o exemplo abaixo citado neste artigo de Joshua Porter.
Na página de compra do livro, o autor adicionou uma linha de texto que é crucial para quem está considerando efetuar a compra: “as transações utilizam PayPal, mas você não precisa ter uma conta para comprar esse livro”.
Isso antecipa uma das principais preocupações que passam pela cabeça das pessoas quando elas vêem o logo do PayPal (“eu não tenho uma conta lá”) e evitam que elas abandonem o fluxo por causa disso.
[caption id=”attachment_10064" align=”alignnone” width=”301"]
Exemplo de antecipação no formulário de criação de um novo Tumblr.[/caption]
Em seu livro mais recente, Dan Saffer aborda o assunto “Microcopy” e dá algumas dicas úteis na hora de escrever esse tipo de texto:
- Evite nomes de ações muito vagos, como “Enviar”. O que acontece depois que o usuário “Envia” os dados do formulário?
- O texto de instrução é absolutamente necessário? Você não precisa adicionar um “Por favor, faça login” acima de um formulário de login.
- Quando o texto é muito longo e precisa ser truncado na interface, tenha certeza de que o usuário consegue ler o texto completo facilmente.
- Teste seus textos com usuários reais. Mostre uma interação com microtexto para eles e peça para eles dizerem em voz alta o que acham que acontecerá ao clicarem ou interagirem.
- Use linguagem humana, não de sistema. “Postado há 3 horas” é muito mais fácil de entender do que “postado em 04/03/2014 às 14h33” — um detalhe que acaba passando batido em muitos produtos por aí.
O valor emocional dos microtextos
Esses dias preenchi minha declaração de imposto de renda aqui dos EUA usando a ferramenta TurboTax. Foi uma experiência tão simples e tão cuidadosamente pensada, que quando terminei eu queria sair contando para todos os meus amigos UXers como tinha sido. Eles, obviamente, já estavam acostumados com o produto.
Prencher a declaração de imposto de renda não é uma tarefa breve (são muitos e muitos passos), mas o interessante da experiência do TurboTax é como eles usam microtextos para encorajar os usuários a seguirem em frente. Eles “celebram” cada pequena conquista sua à medida em que você vai percorrendo cada um dos mais de 50 passos do formulário. Resultado? Durante o processo, fiquei muito mais tranquilo do que achei que ficaria antes de começar.
[caption id=”attachment_10067" align=”alignnone” width=”381"]
Microtexto no TurboTax.com depois que você envia a declaração: imposto de renda sem complicacação.[/caption]
Em muitos produtos, o microtexto representa também uma ótima oportunidade para expressar a personalidade da marca. Apesar da limitação de pixels e caracteres dos microtextos, a escolha certa das palavras pode ajudar a transmitir alguns dos valores da marca para seus usuários (como o exemplo do Facebook “Like” no início do post).
O Mailchimp, por exemplo, usa cada oportunidade que tem para expressar sua personalidade. Eles inclusive publicaram um guia sobre tom de voz para quem costuma redigir email marketing.
Abaixo mais algumas boas dicas deste artigo do UX Matters sobre o impacto dos textos na experiência do usuário, do ponto de vista emocional.
Comunique benefícios, não funcionalidades.
Se você explica para as pessoas o porquê de você estar pedindo para elas fazerem algo, é muito mais provável que elas acatem. É um pequeno truque de texto que você pode fazer e, imediatamente, soar mais inteligente. Em redação, há sempre dois elementos: funcionalidades e benefícios. O primeiro é sobre o que um produto faz. O segundo é sobre o que ele permite você fazer.
Fale a linguagem dos seus usuários.
As pessoas respondem bem a palavras, frases e tons de voz dependendo da própria personalidade delas, e não porque você escolheu a palavra certa. É nessa hora que as personas são úteis. Elas te ajudam a se comunicar com os usuários de uma forma natural e lógica para eles. E isso resulta em uma melhor experiência do usuário. Você não diz para uma criança “essa afirmação é ilógica e, portanto, inválida”. Você diz “não é assim que funciona, deixa eu te explicar”.
Mantenha os textos curtos.
Aqui voltamos ao tema “microtextos”: mantenha seus textos curtos. Clientes costumam sempre pedir mais palavras em uma página. Mas o texto sempre pode ser mais curto. E na maioria dos casos, textos mais curtos geram melhores resultados. Sempre que possível, reduza.
[caption id=”attachment_10065" align=”alignnone” width=”299"]
Password é “sEnSíVeL” a maiúsculas e minúsculas.[/caption]
Texto é uma peça fundamental da experiência do usuário, às vezes negligenciada por profissionais de UX depois que “o wireframe com lorem ipsum” foi entregue.
Acompanhar o desenvolvimento dos textos que serão exibidos na interface é importante não só para garantir boa usabilidade, mas também para ter certeza que texto e imagem estão trabalhando juntos para transmitir uma mensagem alinhada com o tom de voz da marca.
Mais sobre o assunto:
