Pense no seu site ou app favorito. O que o torna seu favorito? Agora, pense em um site ou app que você não gosta. O que você não gosta nele? A interação dos usuários com seu design e a experiência deles no seu site e app podem variar.
Essa experiência pode mudar com base no horário do dia, no tipo de dispositivo usado, se a pessoa dormiu bem na noite anterior, se ela está doente, se está usando tecnologia adaptativa e muito mais. Com quase oito bilhões de pessoas em todo o mundo, as possibilidades de como as pessoas usam e vivenciam seus designs são ilimitadas.
Design inclusivo
Como podemos atender a todas as necessidades potenciais do usuário de uma só vez? É aí que entra o design inclusivo. Ele usa uma abordagem centrada no ser humano que combina inclusão, usabilidade e acessibilidade em uma só.
Ao contrário do design universal, que se concentra em um único design que o maior número possível de pessoas possa usar, os princípios do design inclusivo se concentram em projetar para um indivíduo ou caso de uso específico e, em seguida, estender esse design a outras pessoas.
Há sete princípios de design inclusivo com foco em acessibilidade:
- Ofereça uma experiência comparável: garanta que sua interface ofereça uma experiência igual para todos, para que as pessoas possam realizar tarefas de uma maneira que atenda às necessidades delas sem prejudicar a qualidade do conteúdo.
- Considere a situação: garanta que sua interface ofereça uma experiência valiosa para as pessoas, independentemente das circunstâncias.
- Seja consistente: use convenções familiares e aplique-as de maneira lógica.
- Dê controle: garanta que as pessoas possam acessar e interagir com o conteúdo da maneira preferida.
- Ofereça opções: considere oferecer diferentes maneiras para as pessoas concluírem tarefas, especialmente aquelas que são complexas ou não padrão.
- Priorize o conteúdo: ajude os usuários a se concentrarem nas principais tarefas, recursos e informações, organizando esses elementos na ordem preferida no conteúdo e no layout.
- Agregue valor: considere a finalidade e a importância dos recursos e como eles melhoram a experiência de diferentes usuários.
Perfis
Ao desenvolver um novo design ou recurso, muitas equipes confiam em perfis de usuários para orientá-las no processo. Os perfis são personagens fictícios que usam seus produtos digitais, geralmente com base em pesquisas quantitativas e qualitativas de usuários.
Os perfis também oferecem uma maneira rápida e barata de testar e priorizar esses recursos durante o processo de design e desenvolvimento. Eles ajudam a concentrar as decisões sobre os componentes do site, adicionando uma camada de consideração do mundo real à conversa para ajudar a alinhar a estratégia e criar metas focadas em grupos de usuários específicos.
Incorpore deficiências
"As pessoas são todas diferentes. Só posso falar da minha experiência. Quando você conhece uma pessoa surda, você conhece uma pessoa surda, não todas nós."
Meryl Evans, da palestra ID24 Deaf Tech: Travel Through Time from Past to Future.
Os perfis podem ser usados como uma ferramenta de design inclusivo quando você incorpora pessoas com deficiência. Há muitas maneiras diferentes de fazer isso. Você pode criar perfis específicos para deficiências, adicionar deficiências aos perfis de usuários atuais ou até mesmo criar um espectro de perfis para refletir a realidade dinâmica de deficiências situacionais, temporárias e permanentes
Não importa como você incorpora pessoas com deficiência aos seus perfis, eles não devem ser baseados em pessoas reais ou estereótipos. E os perfis nunca substituem os testes de usuários.
- Nome: Jane Bennet
- Idade: 57 anos
- Local: Essex, Reino Unido
- Profissão: engenheira de UX
- Deficiência: tremor nas mãos devido à doença de Parkinson de início precoce (YOPD)
- Objetivos: usar a entrada de fala para texto para facilitar a adição de sugestões de código; encontrar equipamentos de ciclismo on-line com o mínimo de pressionamentos de tecla.
- Frustrações: sites sem suporte apenas para teclado; apps de design com pequenas áreas para interação por toque.
Como engenheira de UX, Jane projeta e cria páginas que são essenciais para manter o site da empresa relevante. Ela oferece suporte a muitos membros da equipe ao longo do dia. Ela é a rainha de apagar incêndios técnicos, e todos no departamento recorrem a ela quando algo acontece inesperadamente.
Perder as habilidades motoras finas devido a tremores está dificultando cada vez mais o uso do mouse. Ela tem confiado cada vez mais no teclado para navegar na Web. Jane sempre foi dedicada à atividade física. Ela adora corridas de rua e BMX. Isso tornou o diagnóstico da doença de Parkinson de início precoce no ano passado ainda mais difícil.
Simuladores de deficiência
Tenha muito cuidado ao usar simuladores de deficiência para emular ou complementar seus perfis.
Os simuladores de deficiência são uma faca de dois gumes, pois podem gerar simpatia ou empatia. Isso pode depender do indivíduo, do contexto em que o simulador é usado e de muitos outros fatores incontroláveis. Muitos defensores da acessibilidade são contra o uso de ferramentas de simulador de deficiência e recomendam procurar filmes, demonstrações, tutoriais e outros conteúdos criados por pessoas com deficiência e aprender sobre as experiências delas em primeira mão.
"Acho que precisamos ser completamente honestos de que qualquer atividade de simulação não afeta algumas das compreensões mais importantes que queremos que as pessoas com visão tenham no coração e na cabeça. A cegueira não é a característica que nos define, que os mal-entendidos e as baixas expectativas sobre a cegueira são nosso maior obstáculo.
Esses mal-entendidos criam barreiras artificiais que nos impedem de participar totalmente, e essas limitações falsas se transformam em algo que nos impede."
Mark Riccobono, presidente da Federação Nacional de Cegos.
Heurísticas de acessibilidade
Considere adicionar heurísticas ao seu fluxo de trabalho ao criar seus perfis e designs. As heurísticas são regras para design de interação, introduzidas em 1990 por Jakob Nielsen e Rolf Molich. Esses dez princípios foram desenvolvidos com base em anos de experiência no campo da engenharia de usabilidade e têm sido usados em programas de design e interação humano-computador desde então.
Em 2019, a equipe de design da Deque criou e compartilhou um novo conjunto de heurísticas focadas na acessibilidade digital. De acordo com a pesquisa deles, até 67% de todos os bugs de acessibilidade de um site ou app podem ser evitados quando a acessibilidade faz parte do processo de design. Esse é um impacto enorme que pode ser causado antes mesmo de uma linha de código ser escrita.
Semelhante ao conjunto original de heurísticas, há dez heurísticas de acessibilidade a serem consideradas ao planejar seu design.
- Métodos e modalidades de interação: os usuários podem interagir com eficiência com o sistema usando o método de entrada de sua escolha (como mouse, teclado, toque etc.).
- Navegação e orientação: os usuários podem navegar, encontrar conteúdo e determinar onde estão, a qualquer momento, no sistema.
- Estrutura e semântica: os usuários podem entender a estrutura do conteúdo em cada página e entender como operar no sistema.
- Prevenção e estados de erro: os controles interativos têm instruções persistentes, significativas para ajudar a evitar erros e fornecer aos usuários estados de erro claros que indicam quais são os problemas e como corrigi-los sempre que erros forem retornados.
- Contraste e legibilidade: os usuários podem distinguir e ler facilmente textos e outras informações significativas.
- Linguagem e legibilidade: os usuários podem ler e entender o conteúdo com facilidade.
- Previsibilidade e consistência: os usuários podem prever a finalidade de cada elemento. É claro como cada elemento se relaciona com o sistema como um todo.
- Tempo e preservação: os usuários têm tempo suficiente para concluir as tarefas e não perdem informações se o tempo (ou seja, uma sessão) acabar.
- Movimento e piscadas: os usuários podem parar elementos na página que se movem, piscam ou são animados. Os usuários não devem ser distraídos ou prejudicados por esses elementos.
- Alternativas visuais e auditivas: os usuários podem acessar alternativas baseadas em texto para qualquer conteúdo visual ou auditivo que transmita informações.
Depois de entender esses princípios heurísticos de acessibilidade, você pode aplicá-los a um perfil ou design usando a planilha de heurísticas de acessibilidade e seguindo as instruções fornecidas. Esse exercício é mais esclarecedor quando você reúne várias perspectivas.
Um exemplo de revisão heurística de acessibilidade para o ponto de verificação de navegação e orientação pode ser semelhante ao seguinte:
| Pontos de verificação para navegação e orientação | Excelente (+2 pontos) | Aprovado (+1 ponto) | Reprovado (-1 ponto) | N/A (0 ponto) |
|---|---|---|---|---|
| Um indicador claro e visível é definido em todos os elementos ativos à medida que eles recebem o foco? | ||||
| A página tem um texto de título significativo, com informações específicas da página primeiro? | ||||
| O elemento de título da página e o H1 são iguais ou semelhantes? | ||||
| Há títulos significativos para cada seção principal? | ||||
| A finalidade dos links é definida apenas pelo texto do link ou pelo contexto imediato? | ||||
| Um link de pular é fornecido na parte superior da página e é revelado no foco? | ||||
| A organização dos elementos de navegação facilita a orientação? |
Depois que todos na equipe analisam a página ou o componente e fazem a revisão heurística de acessibilidade, os totais são calculados para cada ponto de verificação. Nesse momento, você pode decidir como corrigir os problemas encontrados ou corrigir as omissões que são fundamentais para oferecer suporte à acessibilidade digital.
Anotações de acessibilidade
Antes de entregar seu design à equipe de desenvolvimento, considere adicionar anotações de acessibilidade.
As anotações, em geral, são usadas para explicar escolhas criativas e descrever diferentes aspectos do design. As anotações de acessibilidade se concentram em áreas em que os desenvolvedores podem fazer escolhas programáticas mais acessíveis com a orientação da equipe de design ou de um especialista em acessibilidade.
As anotações de acessibilidade podem ser aplicadas durante qualquer estágio do processo de design, desde wireframes até simulações de alta fidelidade. Elas podem incluir fluxos de usuários, estados condicionais e funcionalidades. Elas geralmente usam símbolos e rótulos para simplificar o processo e manter o design como o foco principal.
Os exemplos de ilustrações de design a seguir são do kit de anotações de acessibilidade do Indeed.com para Figma.
Dependendo do seu programa de design, você terá vários kits iniciais de anotação de acessibilidade para escolher. Ou, se preferir, você pode criar seu próprio conjunto. Em ambos os casos, você precisa decidir quais informações precisam ser comunicadas à equipe de entrega e qual formato funciona melhor.
Algumas áreas a serem consideradas para anotações de acessibilidade incluem:
- Cor: inclua proporções de contraste de todas as diferentes combinações de cores na paleta.
- Botões e links: identifique os estados padrão, passar o cursor, ativo, foco e desativado.
- Links de pular: destaque os aspectos de design ocultos e visíveis e para onde eles estão vinculados na página.
- Imagens e ícones: adicione recomendações de texto alternativo para imagens e ícones essenciais.
- Áudio e vídeo: destaque áreas e links para legendas, transcrições e audiodescrições.
- Títulos: adicione níveis programáticos e inclua tudo que pareça um título.
- Marcos: destaque as diferentes seções do design com HTML ou ARIA.
- Componentes interativos: identifique elementos clicáveis, efeitos de passar o cursor e área de foco.
- Teclado: identifique onde o foco deve começar (parada alfa) e a ordem de tabulação a seguir.
- Formulários: adicione rótulos de campo, texto de ajuda, mensagens de erro e mensagens de sucesso mensagens.
- Nomes acessíveis: identifique como a tecnologia adaptativa deve reconhecer o elemento.