Logo universal de Acessibilidade criado pela ONU para uso de domínio público
Logo universal de Acessibilidade criado pela ONU para uso de domínio público. Na imagem temos um círculo e uma pessoa de braços abertos que simbolizam a esperança e a igualdade de acesso para todo mundo

O que aprendi sobre acessibilidade quando migrei pra UX

Kênia Oliveira
flux_design
Published in
8 min readFeb 10, 2021

--

💡 Importante: este é um estudo de acessibilidade de acordo com as boas práticas da WCAG para design de experiência e produtos digitais. Vale destacar que é um primeiro experimento e temos uma longa jornada pela frente, considerando que apenas 0,74% dos sites brasileiros são desenvolvidos com práticas acessíveis

Como tudo começou

Migrei pra UX Design em 2020 quando ingressei no Grupo Fleury. Fiquei mega feliz e ao mesmo tempo apreensiva porque tudo era novo pra mim. Em poucos dias de trabalho, ainda conhecendo o terreno, eis que chega o primeiro grande desafio: Acessibilidade…

Os primeiros passos

Gif mão fazendo uma lista

’O poder da Web está na sua universalidade. O acesso por todas as pessoas independente de suas deficiências, é um aspecto essencial ‘’ Tim Berners-Lee

Comecei a mergulhar nesse universo, que até então eu acreditava ser relacionado apenas a pessoas deficientes. Temos uma forte tendência em acreditar que a acessibilidade está projetada somente nas cadeiras de rodas, próteses e bengalas. Aí fui surpreendida com o resultado das minhas pesquisas, quando descobri que acessibilidade é para TODOS.

Fiz uma pesquisa bem ampla em vários sites, YouTube e livros sobre o tema. Me encantei com tantas coisas que até então eram invisíveis pra mim.

Entre as minhas descobertas encontrei a WCAG (Web Content Acessibility Guidelines), que é um guia de acessibilidade com diretrizes e recomendações para desenvolver produtos digitais acessíveis.

A WCAG e os 3 níveis de sucesso

A WGAG é um caminho para nos orientar por onde e como começar, mas ela não é o fim. É uma longa jornada!

visualização do agrupamento de critérios por níveis de conformidade
visualização do agrupamento de critérios por níveis de conformidade
  • A é o nível mínimo de conformidade que pode ser alcançado.
  • AA é o nível intermediário de conformidade que pode ser alcançado. Ele atende os critérios no nível A e do nível AA.
  • AAA É o nível mais alto de conformidade que pode ser alcançado.
    Ele atende os critérios do nível A, nível AA e nível AAA.

Nada sobre nós sem nós

O segundo passo foi procurar pessoas com deficiência para entender quais barreiras elas enfrentavam no dia a dia com os produtos digitais. Nesse processo conheci várias pessoas que agregaram muito na minha jornada de aprendizado e na minha pesquisa. Uma delas foi o Bruno Alves, deficiente visual, que foi um grande aliado para ensinar, compartilhar experiências e participar de testes de usabilidade à distância.

Foi o Bruno quem me apresentou um conceito muito importante durante uma sessão de teste remoto: nada sobre nós sem nós. Ou seja, é fundamental sempre envolver as pessoas que vão usar a sua solução acessível durante o processo de design. Muito obrigada por tudo, Bruno.

Depois dessa imersão, fiquei questionando o meu papel como designer para eliminar várias barreiras que comecei a perceber. Partindo do princípio de que diferentes pessoas com diferentes deficiências e habilidades terão diferentes maneiras de usar os produtos que ajudo a desenvolver com meu time.

Mas afinal, qual é o papel da acessibilidade?

Gif criança expresando dúvidas

Disclaimer (aviso): Existe a lei LBI (Lei Brasileira de Inclusão) que apresenta um trecho sobre acessibilidade em sites no Brasil (artigo 63 da Lei nº 13.146 de 06 de Julho de 2015).

Não devemos pensar em acessibilidade apenas porque está na lei, mas porque é um direito básico que deve ser respeitado. Segundo o IBGE (2010), hoje no Brasil temos aproximadamente 50 milhões de pessoas com algum grau de deficiência. No mundo, há cerca de 1 bilhão de pessoas.

Esse é o número de pessoas que excluímos de ter acesso aos nossos produtos digitais quando não pensamos na acessibilidade como parte da nossa atuação. E a realidade brasileira é triste: apenas 0,74% dos sites do Brasil são acessíveis, segundo estudo do Movimento Web para Todos.

Além das pessoas com deficiência, que têm o direto de usar os produtos digitais com independência e autonomia, existem também as limitações temporárias e situacionais como ter um braço quebrado, uma mãe com bebê no colo, idosos, iletrados, canhotos entre outras situações que dependem da acessibilidade para que se tenha sucesso na navegabilidade de um produto digital.

Portanto, nós temos o papel de remover barreiras, construir pontes e conectar pessoas em novas experiências.

“Quando a tecnologia é feita para todos, permite que cada um faça o que ama.”

Video Sandy: Apple Acessibilidade

Os benefícios são diversos. Além do retorno positivo à sociedade, oferecemos qualidade e eficiência, sem falar na autonomia e independência que proporcionamos às pessoas que vão utilizar o produto. Pense nisso quando for desenhar soluções! As pessoas mais beneficiadas serão PCDs (Pessoas com Deficiência) mas não serão apenas elas, já que produtos acessíveis favorecem a experiência de todo mundo.

Levando as descobertas pro time 😊

Com essa imersão no mundo da acessibilidade, chegou a hora de compartilhar os aprendizados com todo mundo e plantar a semente da cultura acessível no time. Até então era novidade pra todo mundo! Fiz toda a documentação dos aprendizados com o Paulo Matos, designer parceiro do time. Montamos uma apresentação contemplando todos os pontos que demonstravam a importância de termos um produto acessível e por onde deveríamos começar.

Foi uma grande surpresa, pois todos abraçaram a causa com grande alegria e engajamento para que tudo aquilo saísse do papel.

Não se constrói nada sozinho, então todo o time esteve envolvido. Foi de extrema importância a participação de todos para que pudéssemos juntos eliminar barreiras e promover a real inclusão.

Plano de ação 🤓

Roadmap

Fizemos um roadmap — artefato que orienta a estratégia de desenvolvimento de produtos digitais — com todas as ações a serem tomadas para que pudéssemos chegar no nosso objetivo

Roadmap acessibilidade
Roadmap acessibilidade

Cores

As cores são fundamentais no caminho para a acessibilidade e podem impactar toda a usabilidade. Por isso, fizemos testes de cores em nossos produtos para certificar se estavam de acordo com os padrões da WCAG. Usamos a ferramenta Color Review , que nos permitiu verificar as cores em todas as marcas do Grupo Fleury.

Estudo de cores usando a ferramenta Color Review

Com todo o material pronto, levamos o estudo pra validação com a área de marketing e apresentamos a importância do contraste pra acessibilidade. Nesse estudo constatamos que a maioria das cores foram projetadas para o mundo off-line, ou seja, não eram totalmente adequadas para nossos produtos digitais.

Essa conexão foi sensacional e de suma importância para seguirmos em frente na nossa jornada de acessibilidade. Em pouco tempo, tivemos aprovação das novas cores acessíveis em algumas marcas que foram alteradas em parceria com o Marketing da empresa em diversos canais (uhuuu! eu fiquei mega feliz, pois era um passo importante nessa caminhada que estava só começando. 😍)

Gif da apresentadora Oprah emocionada
Gif da apresentadora Oprah emocionada

Análise Heurística com foco em Acessibilidade

Depois das cores, avançamos para implementar uma planilha de Análise Heurística com foco em acessibilidade. Aprendi essa técnica no curso de Acessibilidade do @MarceloSales promovido pela @Mergo e recomendo demais!

Planilha de Análise Heurística com foco em acessibilidade criada por Denis Boudreau e Caitlin Geier em 2019

Essa análise nos ajudou a mapear possíveis problemas de acessibilidade nos nossos produtos. O método foi repassado pro time de UX pra que todo mundo use nos processos de design e crie um pensamento mais crítico sobre o tema. Também ajudou bastante a ampliar os conhecimentos com mais propriedade e segurança sobre acessibilidade. Foi um verdadeiro aprendizado coletivo. E tem sido!

Validações e Testes

O próximo passou foi validar as nossas ações de acessibilidade com ferramentas que ajudaram a verificar o código e a detectar falhas técnicas, como Lighthouse , Axe acessibility e Wave .

Exemplo de validação feita pela Lighthouse

Essas ferramentas são de grande ajuda no processo de identificação das barreiras, mas elas não garantem que o seu produto está 100% acessível. Além dos testes técnicos, tivemos a chance de rodar testes manuais, como navegação por teclado, testes com leitores de tela e testes de usabilidade à distância com pessoas usuárias que tinham algum tipo de deficiência.

✅ Semântica e UX Writing

Para continuar nosso plano de ação, trabalhamos na semântica de um fluxo que funcionaria como nosso primeiro experimento, um piloto. Escolhemos o fluxo de agendamento de exames domiciliares.

Em termos de acessibilidade, a “semântica” é a forma como os componentes visuais irão repassar toda informação sonora para o leitor de tela. Na prática seria você dar significado aos componentes, de forma que o nome de um botão seja verbalizado para o leitor. Isso permite que a experiência seja mais fluida.

Exemplo de documentação de especificação de semântica fluxo de pagamento
Vídeo como o teste de semântica do Fluxo de pagamento

Algumas melhorias de acessibilidade são feitas no código no nível HTML. Esses aperfeiçoamentos (como o uso correto de cabeçalho, identificação de títulos, legendas, textos alternativos e hierarquia de conteúdo) são fundamentais para viabilizar o uso de leitores de tela. E tudo desenrolou em parceria com o time de UX Writing, com @victordefrancagomes e @vcerqueiraa3, que ajudaram a desenvolver o conteúdo e vão participar dos testes de usabilidade e da escuta com leitores de tela.

✅ Cultura acessível e trabalho de formiguinha

Ufa! Foram muitos processos até aqui. Aos poucos estamos despertando a cultura de acessibilidade em nossos produtos digitais. O engajamento do time para eliminar barreiras e a conexão das pessoas usuárias tem sido essenciais. É um trabalho de formiguinha mesmo, mas é muito gratificante saber que será de extrema importância na vida de alguém.

Em qual momento devemos pensar na acessibilidade?

Importante: acessibilidade NÃO é uma feature (funcionalidade). Muito menos é opcional ou supérflua. Ela é uma característica fundamental para o sucesso e a qualidade de qualquer produto. Quando não levamos isso em consideração, limitamos o alcance da experiência e impedimos que todas as pessoas usem nossas soluções.

Não fazemos isso por mero altruísmo, mas sim por uma questão de respeito e afeto com o próximo. Temos que criar artefatos acessíveis para que os nossos produtos sejam de fácil acesso para TODAS AS PESSOAS.

Portanto, o ideal é que acessibilidade se torne parte da cultura de design das empresas e que os novos produtos já tenham uma premissa acessível assim que nascem.

Se você me perguntar: agora todos os produtos digitais são acessíveis?

Minha resposta é que estamos trabalhando para isso e empenhando todos os nossos esforços em práticas acessíveis.

É um processo orgânico e que demanda tempo. Afinal, acessibilidade é algo vivo, sempre em atualização, e futuramente poderemos identificar barreiras que antes não foram detectadas. É um desafio constante pois as tecnologias mudam, as pessoas mudam e os comportamentos mudam.

Incluir a acessibilidade nesse ciclo é algo que me move todos os dias. Fazer a diferença na vida das pessoas também. Foi isso que me levou a fazer minha transição de carreira. 😊

Construa um ambiente acessível para todas as pessoas! Seja entusiasta em levar essa mensagem para frente.

Agora me conta, o que você está fazendo para ser mais acessível?
Deixa seu relato ou me manda um feedback sobre o que contei, vou adorar ler. Até a próxima!

--

--