1. Antes de começar
Conheça as orientações de comunicação do Material Design.
Uma escrita clara e concisa é importante para a qualidade das experiências do usuário. Conheça as diretrizes de escrita de UX do Material Design e comece a aplicar princípios para textos de interface que vão ajudar seus usuários a chegar onde querem.
Você sabia que a seção de comunicação do Material abrange muito mais do que a escrita de UX? Confira temas que vão desde visualização de dados até integração e padrões de estado vazio.
Pense como um escritor!
Independente de você trabalhar com um redator de UX ou um estrategista de conteúdo, este codelab apresenta maneiras de qualquer pessoa fazer escolhas de linguagem que funcionem bem para interfaces. Você vai aprender a fazer algumas das perguntas que um escritor pode se concentrar para melhorar as experiências com produtos, como clareza e concisão em textos voltados ao usuário, como rótulos e notificações.
O que você vai aprender
- O que é a escrita para UX e por que ela é importante
- Como determinar o tom e a voz certos para diferentes contextos
- Considerações específicas sobre a escrita de componentes
- Recursos para aprender mais
O que é necessário
- Abra um documento ou pegue um pedaço de papel para acompanhar os exercícios do codelab.
Pré-requisitos
Este laboratório se baseia em conceitos fundamentais de escrita, gramática e design do Material Design. É útil ter um conhecimento geral sobre elementos interativos em uma interface.
Focado em inglês, mas útil para todos
Este laboratório aborda princípios de comunicação para melhorar as experiências do usuário. No entanto, os exemplos e as escolhas de palavras são baseados nas convenções do inglês americano.
Com sensibilidade às mudanças no contexto e na cultura, essas orientações podem ser aplicadas a uma interface em qualquer idioma. Para mais informações específicas sobre considerações em outros idiomas, consulte os recursos listados na Etapa 9.
2. O que é escrita de UX?
Visão geral
A escrita de UX (UXW) também é chamada de estratégia de conteúdo ou design de conteúdo. É a disciplina por trás do texto em interfaces de usuário e um campo distinto que considera a linguagem como um meio de melhorar as experiências do usuário por meio de narrativas claras, escolha de palavras, hierarquia de informações e muito mais.
Pensar como um redator de UX pode melhorar a conclusão de tarefas, a satisfação do usuário e a facilidade de uso geral.
O que torna a escrita de UX diferente?
A escrita de UX é escrever para pessoas reais.
A escrita para experiências do usuário deve começar com a premissa de que uma meta principal do texto da interface é apoiar as jornadas do usuário.
A escolha de palavras, o comprimento, o estilo e a construção de qualquer texto podem afetar a compreensão do usuário sobre a meta e os benefícios de recursos e tarefas.
Estilo
As escolhas de estilo de escrita devem seguir as necessidades e os objetivos do público. A UXW combina as regras acadêmicas da escrita formal (o que você lê em jornais ou livros de não ficção) com os estilos menos formais que as pessoas usam ao se comunicar on-line (e-mail, texto, chat).
A escrita para apps e interfaces tem um tom menos formal por dois motivos principais:
- A comunicação on-line é menos formal do que a escrita impressa ou acadêmica.
- O texto da interface é limitado pelo espaço disponível na tela, e o comprimento dos caracteres é restrito.
Escrita centrada no usuário, também conhecida como "faça funcionar"
A escrita de UX prioriza um estilo orientado a objetivos, em vez da adesão à gramática. Isso não significa que a gramática não seja valiosa para a clareza e a consistência, mas é útil primeiro considerar as necessidades do usuário e deixar as decisões gramaticais seguirem.
Quando se trata de escolha de palavras e estilo, um princípio orientador para decisões de estilo pode ser simplesmente fazer funcionar. As escolhas mais adequadas para interfaces nem sempre são as mesmas regras da escrita formal.
Escreva para a forma como as pessoas leem
A UXW precisa refletir as maneiras como leitores de vários idiomas analisam páginas em um padrão em forma de F, em vez de ler parágrafos inteiros. Ao antecipar o comportamento do leitor, você pode escrever da maneira como o texto é realmente experimentado.
Para conteúdo da Web, isso geralmente se traduz em parágrafos curtos, títulos descritivos fáceis de ler e formatação estratégica.
Exemplos de rastreamento ocular de estudos de padrões de leitura on-line. Imagem e pesquisa de nngroup.com (2006; 2017).
Teste
Atender às necessidades de várias culturas ou faixas etárias com o mesmo texto pode ser um desafio. Encontrar as palavras certas para comunicar sua mensagem pode parecer simples, mas a linguagem e a compreensão são altamente subjetivas.
Para garantir que seu texto signifique o que você acha que ele significa, testar é uma etapa importante para avaliar a clareza, o significado e a eficácia no mundo real.
Abordagens
Fácil e barato
- Leia o que você escreveu em voz alta. Parece algo que você diria a uma pessoa de verdade? Se não, tente reescrever.
- Peça para outra pessoa ler e explicar o que ela acha que suas palavras significam
- Pesquise várias pessoas com exemplos da sua escrita no contexto de uma interface
- Use o Google Trends ou o Google Books Ngram Viewer para saber se uma palavra ou frase específica é mais comum do que outra.
O teste de conteúdo extenso usa heurísticas, como:
- Compreensão e legibilidade
- Conclusão da tarefa e tempo na tarefa
- Avaliação de tom e percepção
3. Princípios
Visão geral
Os princípios nas diretrizes de escrita do Material (link em inglês) foram criados para gerar confiança e melhorar a clareza com uma linguagem precisa e concisa. Você pode adicionar ou subtrair dos princípios do Material para atender às suas próprias necessidades.
As diretrizes permitem que várias pessoas tomem decisões mais consistentes como um grupo.
Seja conciso, mas não robótico
Escreva segmentos de texto curtos e fáceis de ler que se concentrem em um número limitado de ideias.
Escrever de forma simples e direta
Use uma linguagem simples e direta que facilite a compreensão do texto. Sempre que escrever algo, pergunte a si mesmo se há uma maneira mais fácil de expressar a ideia.
Falar com os usuários de forma clara
Em inglês, a segunda pessoa (você ou seu) costuma ser mais direta e clara. A primeira pessoa (eu, mim ou meu) pode ser usada quando a propriedade precisa ser enfatizada.
"Você" e "seu" são formas mais diretas de se referir a um usuário.
"Eu" ou "meu" podem ser confusos porque combinam a posição ou a voz de um usuário com a voz do app. "Eu" ou "meu" podem ser usados para enfatizar a propriedade clara de conteúdo ou ações.
Evite combinar a primeira e a segunda pessoa
Para evitar confusão, "me"/"my" e "you"/"your" não podem estar na mesma frase.
Comunicar os detalhes essenciais
Comunique apenas os detalhes essenciais para um contexto específico para que os usuários possam se concentrar na tarefa em questão, em vez de interpretar muitas opções. Em qualquer caixa de diálogo ou notificação, considere quais informações são necessárias para explicar uma operação e qualquer consequência crítica.
4. Voz e tom
Visão geral
É difícil alcançar consistência e clareza sem considerar o tom e a voz que você quer criar para uma experiência.
Imagine ler cinco frases juntas, mas cada uma delas foi escrita por pessoas diferentes que não viram as outras quatro. Às vezes, navegar em uma interface pode parecer desconexo porque cada pessoa escreve com um estilo e um tom próprios.
Quando várias pessoas contribuem com texto para um produto, diretrizes de tom e voz ajudam a garantir que as palavras sejam escolhidas com um senso compartilhado de significado e propósito.
Exemplo de uma campanha anterior do Android que usa uma voz clara e inclusiva com um tom direto.
O que são voz e tom?
A voz precisa ser consistente em toda a experiência, enquanto o tom é contextual e pode variar.
Voz
Voz se refere ao humor, à atitude ou à perspectiva comunicada em uma experiência. É um aspecto da "personalidade" de uma marca e permite que alguém se familiarize com a forma como um produto "soa".
Os princípios de voz orientam a escolha de palavras e funcionam melhor quando acompanhados de exemplos para ilustrar a voz em ação. Sem exemplos, os princípios podem ser muito abstratos para orientar as decisões de estilo de um grupo.
Confira alguns exemplos comuns de um princípio de voz:
- Útil: escreva como uma pessoa, não como uma máquina. Explicar erros e sugerir uma solução.
- Acessível: facilite a compreensão do texto para qualquer novo usuário. Explique ou substitua termos técnicos ou avançados.
- Inspirador: enfatize os benefícios e as conquistas ao longo de uma experiência. Declare metas e resultados de forma positiva e na voz ativa.
Tom
O tom da sua escrita comunica humor e emoção, quer você queira ou não.
Por exemplo, se uma voz for definida como "útil" e "humana", um tom que reforce essa meta pode ser de apoio e casual, em vez de exigente e conciso.
O que uma pessoa considera "de apoio e casual" também varia. Por isso, as listas de palavras e uma matriz de conteúdo ajudam a tornar a voz e o tom acionáveis. Isso será abordado com mais detalhes nas seções 6 a 8.
Por que isso é importante
O tom adequado pode gerar confiança e segurança nos usuários. Por exemplo, se uma mensagem de erro for uma piada em vez de um suporte, o tom divertido pode não mostrar ao usuário que a frustração dele é razoável e pode ser resolvida.
Criar um mapa de tons
Um mapa de tom ajuda a planejar e documentar uma estratégia para ajustar sua voz e seu tom.
Comece considerando os pontos principais ao longo da jornada do usuário. Seja para criar jogos, ferramentas financeiras ou um app de compras, o tom precisa variar em resposta a pontos ao longo da jornada do usuário, como integração, confirmações e erros.
Por exemplo, uma notificação divertida para uma confirmação de rotina parece uma boa ideia a princípio, mas na quinta vez que é recebida, a alegria pode rapidamente se transformar em irritação.
Os estados de erro são outro exemplo de onde o mapeamento de tom pode ajudar a informar uma mudança de tom, de casual e conversacional para de apoio e detalhado.
1. Primeiro, escolha duas dimensões ou espectros que possam representar um intervalo no tom desejado.
Confira algumas ideias de eixos importantes para um tom na escrita de UX:
- Divertido x sério
- Conciso x detalhado
- Emotiva x neutra
- Casual x rígido
2. Desenhe uma grade com duas linhas que se cruzam e identifique cada eixo com uma dimensão de tom que você quer criar uma estratégia.
No exemplo abaixo, divertido x sério e conciso x detalhado são as dimensões do mapa.
3. Em seguida, liste os tipos ou padrões de mensagens que você usa com frequência. Alguns tipos de mensagens que você pode mapear incluem:
- Integração
- Confirmação e reconhecimento
- Ajuda e feedback
- Erros
- Notificações
- Rótulos
- Estados vazios
4. Posicione cada tipo de mensagem no mapa em relação aos dois eixos.
Confira algumas considerações:
- Quanto espaço de tela estará disponível para uma determinada mensagem?
- Qual a importância ou a gravidade da compreensão para um tipo de mensagem? Há uma ação destrutiva em jogo?
- O que você quer que um usuário saiba ou sinta em relação à intenção de um tipo de mensagem? Por exemplo, o onboarding geralmente é acompanhado de uma intenção leve, mas prática.
5. Exemplo finalizado
Confira abaixo um exemplo de tipos de mensagens representados de acordo com as experiências comuns de apps.
Se o app tratar de assuntos financeiros ou legais, ajuste o tom para ser mais sério e detalhado quando a compreensão for essencial. Por outro lado, se a privacidade ou as finanças não estiverem em risco e uma Central de Ajuda também estiver disponível para mais informações, você poderá ser mais conciso.
5. Estrutura de conteúdo
Visão geral
A estrutura de uma declaração pode melhorar a compreensão e ajudar um usuário a se concentrar na tarefa em questão. Ao combinar uma imagem com texto, outra meta de uma estrutura de informações é melhorar a acessibilidade.
Comece com objetivos
Comece as frases com a meta de um usuário. Como a escrita de UX é orientada a tarefas, um padrão comum para frases é enfatizar uma meta que estabelece a estrutura motivadora de uma tarefa. Depois, a frase detalha a ação necessária para concluir a tarefa.
Revelar detalhes conforme necessário
Revele informações contextualmente e conforme necessário. Essa abordagem é chamada de divulgação progressiva. Revele detalhes sobre os recursos à medida que o usuário os explora e precisa de mais informações.
Revelar informações de forma estratégica geralmente envolve uma consideração cuidadosa das necessidades de informação em cada ponto da jornada do usuário. O objetivo não é ocultar ou omitir nada, principalmente as consequências de ações irreversíveis, mas tenha em mente que você vai ajudar os usuários ao restringir o foco imediato à tarefa em questão.
Design de conteúdo acessível
A escrita eficaz se estende às considerações sobre o pareamento de imagens e texto para usuários com baixa visão ou qualquer pessoa que use um leitor de tela. A seção de escrita de acessibilidade do Material inclui orientações para combinar imagens e legendas para que o design de conteúdo de uma página funcione para todos os usuários.
Texto visível e não visível
O texto de acessibilidade inclui:
- Texto visível: rótulos para elementos de interface, texto em botões, links e formulários
- Texto não visível: descrições que não aparecem na tela, como texto alternativo para imagens.
Quando o texto visível e não visível é descritivo e significativo, ele ajuda os usuários a navegar usando cabeçalhos ou links em uma tela. Um leitor de tela pode ajudar você a testar o texto de acessibilidade e identificar lugares onde ele pode ser adicionado.
Texto alternativo
O texto alternativo ajuda a traduzir uma interface visual em uma interface baseada em texto. O texto alternativo é um rótulo curto (até 125 caracteres) no código que descreve uma imagem para usuários que não conseguem vê-la.
No exemplo abaixo, um leitor de tela fornece contexto para o texto ao redor, oferecendo os descritores mais essenciais de uma imagem.
Como o texto alternativo é apenas para imagens, não é necessário adicionar "imagem de" ou "foto de" a ele. Um leitor de tela vai ler o texto alternativo em voz alta no lugar da imagem.
6. Escolha de palavras
Visão geral
Quando o espaço da tela é limitado, é fundamental escolher as palavras certas para transmitir sua mensagem e tom. Usar as mesmas palavras de forma consistente ajuda os usuários a se familiarizarem com uma experiência.
Escrever para todos os níveis de leitura
Use palavras comuns que sejam claras e fáceis de entender em todos os níveis de leitura.
Sem jargão
Evite terminologia ou nomes específicos do setor inventados para recursos de interface quando uma frase mais simples pode comunicar a mesma ideia de maneira semelhante.
Use palavras consistentes
Use palavras de maneira consistente em todos os recursos da interface.
Escreva no tempo presente
Use o tempo presente para descrever o comportamento do produto. Evite usar o tempo futuro para descrever como um produto sempre age.
Quando precisar escrever no passado ou no futuro, use formas verbais simples.
Referenciar elementos e controles da interface pelo rótulo
Os rótulos identificam o que um controle ou elemento faz. Eles aparecem no controle ou perto dele, como o texto em um botão ou interruptor. Para se referir a um controle ou elemento da interface, mencione-o usando o texto do rótulo. Não declare o tipo de elemento ou controle.
Comunicar detalhes essenciais
Comunique apenas os detalhes que um usuário precisa para se concentrar em uma tarefa.
Pontos principais
- Escrever para todos os níveis de leitura
- Use palavras de forma consistente, não por novidade
- Presente do indicativo
- Use números
7. Como escrever para componentes
Visão geral
Os componentes do Material têm uma intenção na interface, e escrever para componentes específicos pode reforçar essa intenção.
Esses componentes têm orientações de escrita em Material.io:
Caixas de diálogo
As caixas de diálogo são usadas para:
- Erros que bloqueiam a operação normal de um app
- Informações importantes que exigem uma tarefa, decisão ou confirmação específica do usuário
Componente | Prioridade | Ação do usuário |
Lanchonete | Prioridade baixa | As snackbars desaparecem automaticamente |
Banner | Destaque, prioridade média | Os banners permanecem até serem dispensados pelo usuário ou se o estado que causou o banner for resolvido |
Caixa de diálogo | Maior prioridade | As caixas de diálogo bloqueiam o uso do app até que o usuário realize uma ação ou saia da caixa (se disponível). |
Títulos
O objetivo de uma caixa de diálogo precisa ser comunicado pelo título e pelo texto do botão.
Os títulos precisam conter uma declaração ou pergunta breve e clara.
Snackbars
Os snackbars contêm um rótulo de texto diretamente relacionado ao processo em andamento. Em dispositivos móveis, um marcador pode ter até duas linhas de texto.
Os snackbars podem mostrar um único botão de texto que permite aos usuários realizar uma ação em um processo realizado pelo app.
8. Reúna tudo em uma matriz de conteúdo
Visão geral
Uma matriz de conteúdo é uma tabela para acompanhar as palavras e escolhas que você vai usar e reutilizar na sua escrita. A matriz de conteúdo é um recurso essencial para escrever e rastrear frases de forma consistente, além de servir como referência para qualquer escritor no futuro.
É um nome sofisticado para uma planilha (sim, isso viola a orientação de escolha de palavras para "sem jargão").
Como configurar uma matriz de conteúdo
Crie uma planilha ou tabela para acompanhar as escolhas de palavras e a escrita que funcionam bem e podem ser repetidas.
O objetivo de uma matriz de conteúdo é ajudar você a identificar e documentar como qualquer mensagem se conecta ao seguinte:
- Metas e contextos do usuário
- As necessidades de informação, declaradas de forma simples, que apoiam uma determinada meta
- Texto da interface do usuário rascunhado e final que reafirma a necessidade de informações em uma linguagem breve e sem jargões
As decisões de texto da interface na matriz de conteúdo também precisam refletir:
- Princípios de tom e voz
- Tipos de componentes
Por fim, a matriz de conteúdo pode incluir uma lista de palavras:
- Liste as palavras e os termos que devem ser usados para descrever seus recursos, ações e metas.
- Liste as palavras que devem ser evitadas como sinônimos ou frases inúteis
Não se esqueça:
- Substituir ou definir termos técnicos
- Use a opção de palavra mais comum para uma ação ou um substantivo
9. Tópicos e recursos avançados (opcional)
Visão geral
Este codelab aborda práticas recomendadas e métodos para começar a escrever textos de UX. Isso é apenas a ponta do iceberg.
Recursos
10. Parabéns!
Bom trabalho! Você está no caminho certo para escrever textos de interface claros e impactantes!