TORNANDO SEU APP DISPONÍVEL PARA …...2019/06/17 · Desativar animações dos elementos de...
Transcript of TORNANDO SEU APP DISPONÍVEL PARA …...2019/06/17 · Desativar animações dos elementos de...
![Page 1: TORNANDO SEU APP DISPONÍVEL PARA …...2019/06/17 · Desativar animações dos elementos de interface para melhorar a performance do app 2. Leitura nativa Manter a leitura nativa](https://reader033.fdocumentos.tips/reader033/viewer/2022042708/5f3c4cef2690a0749f3ad489/html5/thumbnails/1.jpg)
TORNANDO SEU APP DISPONÍVEL PARA MILHARES DE PESSOAS ATRAVÉS DA
ACESSIBILIDADE
TDC BH 2019
![Page 2: TORNANDO SEU APP DISPONÍVEL PARA …...2019/06/17 · Desativar animações dos elementos de interface para melhorar a performance do app 2. Leitura nativa Manter a leitura nativa](https://reader033.fdocumentos.tips/reader033/viewer/2022042708/5f3c4cef2690a0749f3ad489/html5/thumbnails/2.jpg)
DAIANE FREIRA DOS SANTOS
Software Consultant @ Thoughtworks
#Android Developer
![Page 3: TORNANDO SEU APP DISPONÍVEL PARA …...2019/06/17 · Desativar animações dos elementos de interface para melhorar a performance do app 2. Leitura nativa Manter a leitura nativa](https://reader033.fdocumentos.tips/reader033/viewer/2022042708/5f3c4cef2690a0749f3ad489/html5/thumbnails/3.jpg)
JACKSON
Software Consultant @ Thoughtworks
#iOS Developer
![Page 4: TORNANDO SEU APP DISPONÍVEL PARA …...2019/06/17 · Desativar animações dos elementos de interface para melhorar a performance do app 2. Leitura nativa Manter a leitura nativa](https://reader033.fdocumentos.tips/reader033/viewer/2022042708/5f3c4cef2690a0749f3ad489/html5/thumbnails/4.jpg)
SUMÁRIO
● Nossa história com acessibilidade
● O que é acessibilidade ?
● O que devo fazer ?
● Por onde começo
● Leitores de Tela
![Page 5: TORNANDO SEU APP DISPONÍVEL PARA …...2019/06/17 · Desativar animações dos elementos de interface para melhorar a performance do app 2. Leitura nativa Manter a leitura nativa](https://reader033.fdocumentos.tips/reader033/viewer/2022042708/5f3c4cef2690a0749f3ad489/html5/thumbnails/5.jpg)
Exclusão Segregação
Integração Inclusão
O QUE É ACESSIBILIDADE ?
![Page 6: TORNANDO SEU APP DISPONÍVEL PARA …...2019/06/17 · Desativar animações dos elementos de interface para melhorar a performance do app 2. Leitura nativa Manter a leitura nativa](https://reader033.fdocumentos.tips/reader033/viewer/2022042708/5f3c4cef2690a0749f3ad489/html5/thumbnails/6.jpg)
MOTIVAÇÕES
![Page 7: TORNANDO SEU APP DISPONÍVEL PARA …...2019/06/17 · Desativar animações dos elementos de interface para melhorar a performance do app 2. Leitura nativa Manter a leitura nativa](https://reader033.fdocumentos.tips/reader033/viewer/2022042708/5f3c4cef2690a0749f3ad489/html5/thumbnails/7.jpg)
MOTIVAÇÕES
![Page 8: TORNANDO SEU APP DISPONÍVEL PARA …...2019/06/17 · Desativar animações dos elementos de interface para melhorar a performance do app 2. Leitura nativa Manter a leitura nativa](https://reader033.fdocumentos.tips/reader033/viewer/2022042708/5f3c4cef2690a0749f3ad489/html5/thumbnails/8.jpg)
O CÓDIGO CIVIL ..
Artigo 47, o Decreto nº 5.296/2004 estabelece que: é obrigatória a acessibilidade nos portais e sítios eletrônicos da administração pública na rede mundial de computadores (internet), para o uso das pessoas
portadoras de deficiência visual,Desenho para todos
![Page 9: TORNANDO SEU APP DISPONÍVEL PARA …...2019/06/17 · Desativar animações dos elementos de interface para melhorar a performance do app 2. Leitura nativa Manter a leitura nativa](https://reader033.fdocumentos.tips/reader033/viewer/2022042708/5f3c4cef2690a0749f3ad489/html5/thumbnails/9.jpg)
ACESSIBILIDADE PARA QUEM ?
![Page 10: TORNANDO SEU APP DISPONÍVEL PARA …...2019/06/17 · Desativar animações dos elementos de interface para melhorar a performance do app 2. Leitura nativa Manter a leitura nativa](https://reader033.fdocumentos.tips/reader033/viewer/2022042708/5f3c4cef2690a0749f3ad489/html5/thumbnails/10.jpg)
Visual
Au
ditiva
Motora Mental ou
Intelectual
18,6%
5,10%
7%
1,4%
ACESSIBILIDADE PARA QUEM ?
![Page 11: TORNANDO SEU APP DISPONÍVEL PARA …...2019/06/17 · Desativar animações dos elementos de interface para melhorar a performance do app 2. Leitura nativa Manter a leitura nativa](https://reader033.fdocumentos.tips/reader033/viewer/2022042708/5f3c4cef2690a0749f3ad489/html5/thumbnails/11.jpg)
DEFICIÊNCIA AUDITIVA
● Escreva de forma simples e clara● Usar legendas e/ou transcrições
para vídeos● Permitir que o usuário escolha a
melhor forma de comunicação
![Page 12: TORNANDO SEU APP DISPONÍVEL PARA …...2019/06/17 · Desativar animações dos elementos de interface para melhorar a performance do app 2. Leitura nativa Manter a leitura nativa](https://reader033.fdocumentos.tips/reader033/viewer/2022042708/5f3c4cef2690a0749f3ad489/html5/thumbnails/12.jpg)
DEFICIÊNCIA MOTORA
● Área de mínima de toque ● Espaçamento em campos e
formulários● Projetar para usar somente
voz, teclado (Precisam de botões extras ou teclados)
![Page 13: TORNANDO SEU APP DISPONÍVEL PARA …...2019/06/17 · Desativar animações dos elementos de interface para melhorar a performance do app 2. Leitura nativa Manter a leitura nativa](https://reader033.fdocumentos.tips/reader033/viewer/2022042708/5f3c4cef2690a0749f3ad489/html5/thumbnails/13.jpg)
DISLEXIA
● Usar imagens e diagramas para suporte ao texto
● Alinhar textos à esquerda e manter uma distribuição consistente
● Produzir conteúdos em outros formatos (áudio ou vídeo)
![Page 14: TORNANDO SEU APP DISPONÍVEL PARA …...2019/06/17 · Desativar animações dos elementos de interface para melhorar a performance do app 2. Leitura nativa Manter a leitura nativa](https://reader033.fdocumentos.tips/reader033/viewer/2022042708/5f3c4cef2690a0749f3ad489/html5/thumbnails/14.jpg)
DEFICIÊNCIA VISUAL - BAIXA VISÃO
● Usar bons contrastes e um tamanho de fonte legível
● Usar combinação de cores, formas e texto
● Construir layout linear e lógico garantindo boa leitura em ampliações
![Page 15: TORNANDO SEU APP DISPONÍVEL PARA …...2019/06/17 · Desativar animações dos elementos de interface para melhorar a performance do app 2. Leitura nativa Manter a leitura nativa](https://reader033.fdocumentos.tips/reader033/viewer/2022042708/5f3c4cef2690a0749f3ad489/html5/thumbnails/15.jpg)
DEFICIÊNCIA VISUAL - DALTONISMO
● Use elementos como traçados, indicadores, padrões, textura ou texto para descrever ações e conteúdos
![Page 16: TORNANDO SEU APP DISPONÍVEL PARA …...2019/06/17 · Desativar animações dos elementos de interface para melhorar a performance do app 2. Leitura nativa Manter a leitura nativa](https://reader033.fdocumentos.tips/reader033/viewer/2022042708/5f3c4cef2690a0749f3ad489/html5/thumbnails/16.jpg)
DEFICIÊNCIA VISUAL - CEGUEIRA
● Descrever imagens e fornecer transcrições para vídeos
● Layout linear e lógico● Utilizar textos auto - descritivos
ou legendas● Utilizar mecanismos como de
vibração para associar a algo● Considera mais de um tipo de
navegação
![Page 17: TORNANDO SEU APP DISPONÍVEL PARA …...2019/06/17 · Desativar animações dos elementos de interface para melhorar a performance do app 2. Leitura nativa Manter a leitura nativa](https://reader033.fdocumentos.tips/reader033/viewer/2022042708/5f3c4cef2690a0749f3ad489/html5/thumbnails/17.jpg)
USABILIDADE
● Mantenha o conteúdo curto, claro, consistente e simples
● Dar liberdade ao usuário (Permitir que o usuário escolha contrastes, forma de produzir conteúdo, forma de comunicação etc)
![Page 18: TORNANDO SEU APP DISPONÍVEL PARA …...2019/06/17 · Desativar animações dos elementos de interface para melhorar a performance do app 2. Leitura nativa Manter a leitura nativa](https://reader033.fdocumentos.tips/reader033/viewer/2022042708/5f3c4cef2690a0749f3ad489/html5/thumbnails/18.jpg)
POR ONDE COMEÇAR ?
![Page 19: TORNANDO SEU APP DISPONÍVEL PARA …...2019/06/17 · Desativar animações dos elementos de interface para melhorar a performance do app 2. Leitura nativa Manter a leitura nativa](https://reader033.fdocumentos.tips/reader033/viewer/2022042708/5f3c4cef2690a0749f3ad489/html5/thumbnails/19.jpg)
![Page 20: TORNANDO SEU APP DISPONÍVEL PARA …...2019/06/17 · Desativar animações dos elementos de interface para melhorar a performance do app 2. Leitura nativa Manter a leitura nativa](https://reader033.fdocumentos.tips/reader033/viewer/2022042708/5f3c4cef2690a0749f3ad489/html5/thumbnails/20.jpg)
![Page 21: TORNANDO SEU APP DISPONÍVEL PARA …...2019/06/17 · Desativar animações dos elementos de interface para melhorar a performance do app 2. Leitura nativa Manter a leitura nativa](https://reader033.fdocumentos.tips/reader033/viewer/2022042708/5f3c4cef2690a0749f3ad489/html5/thumbnails/21.jpg)
![Page 22: TORNANDO SEU APP DISPONÍVEL PARA …...2019/06/17 · Desativar animações dos elementos de interface para melhorar a performance do app 2. Leitura nativa Manter a leitura nativa](https://reader033.fdocumentos.tips/reader033/viewer/2022042708/5f3c4cef2690a0749f3ad489/html5/thumbnails/22.jpg)
O QUE É DESIGN UNIVERSAL ?
Desenho para todos
![Page 23: TORNANDO SEU APP DISPONÍVEL PARA …...2019/06/17 · Desativar animações dos elementos de interface para melhorar a performance do app 2. Leitura nativa Manter a leitura nativa](https://reader033.fdocumentos.tips/reader033/viewer/2022042708/5f3c4cef2690a0749f3ad489/html5/thumbnails/23.jpg)
Convenções adotadas para melhorar a performance
1. Animações: Desativar animações dos elementos de interface para melhorar a performance do app
2. Leitura nativaManter a leitura nativa dos componentes de interface (não quebrar padrões)
3. LegendaUtilizar uma linguagem verbal e simbólica que todos envolvidos no projeto compreendam
DICAS (APRENDIZADOS..)
![Page 24: TORNANDO SEU APP DISPONÍVEL PARA …...2019/06/17 · Desativar animações dos elementos de interface para melhorar a performance do app 2. Leitura nativa Manter a leitura nativa](https://reader033.fdocumentos.tips/reader033/viewer/2022042708/5f3c4cef2690a0749f3ad489/html5/thumbnails/24.jpg)
LEITORES DE TELA (ANDROID)
![Page 25: TORNANDO SEU APP DISPONÍVEL PARA …...2019/06/17 · Desativar animações dos elementos de interface para melhorar a performance do app 2. Leitura nativa Manter a leitura nativa](https://reader033.fdocumentos.tips/reader033/viewer/2022042708/5f3c4cef2690a0749f3ad489/html5/thumbnails/25.jpg)
FERRAMENTAS PARA AUXILIAR NO DESENVOLVIMENTO ANDROID
![Page 26: TORNANDO SEU APP DISPONÍVEL PARA …...2019/06/17 · Desativar animações dos elementos de interface para melhorar a performance do app 2. Leitura nativa Manter a leitura nativa](https://reader033.fdocumentos.tips/reader033/viewer/2022042708/5f3c4cef2690a0749f3ad489/html5/thumbnails/26.jpg)
FERRAMENTAS PARA AUXILIAR NO DESENVOLVIMENTO ANDROID
![Page 27: TORNANDO SEU APP DISPONÍVEL PARA …...2019/06/17 · Desativar animações dos elementos de interface para melhorar a performance do app 2. Leitura nativa Manter a leitura nativa](https://reader033.fdocumentos.tips/reader033/viewer/2022042708/5f3c4cef2690a0749f3ad489/html5/thumbnails/27.jpg)
Configurar → Programador → Simular espaço de cores
DEVELOPER OPTIONS
![Page 28: TORNANDO SEU APP DISPONÍVEL PARA …...2019/06/17 · Desativar animações dos elementos de interface para melhorar a performance do app 2. Leitura nativa Manter a leitura nativa](https://reader033.fdocumentos.tips/reader033/viewer/2022042708/5f3c4cef2690a0749f3ad489/html5/thumbnails/28.jpg)
Configurar → Acessibilidade → TalkBack →
Configurações do TalkBack →
Configurações do desenvolvedor →
Mostrar saída de voz
DEVELOPER OPTIONS
![Page 29: TORNANDO SEU APP DISPONÍVEL PARA …...2019/06/17 · Desativar animações dos elementos de interface para melhorar a performance do app 2. Leitura nativa Manter a leitura nativa](https://reader033.fdocumentos.tips/reader033/viewer/2022042708/5f3c4cef2690a0749f3ad489/html5/thumbnails/29.jpg)
TRABALHANDO COM IMAGENS
![Page 30: TORNANDO SEU APP DISPONÍVEL PARA …...2019/06/17 · Desativar animações dos elementos de interface para melhorar a performance do app 2. Leitura nativa Manter a leitura nativa](https://reader033.fdocumentos.tips/reader033/viewer/2022042708/5f3c4cef2690a0749f3ad489/html5/thumbnails/30.jpg)
Dark Theme
![Page 31: TORNANDO SEU APP DISPONÍVEL PARA …...2019/06/17 · Desativar animações dos elementos de interface para melhorar a performance do app 2. Leitura nativa Manter a leitura nativa](https://reader033.fdocumentos.tips/reader033/viewer/2022042708/5f3c4cef2690a0749f3ad489/html5/thumbnails/31.jpg)
LEITORES DE TELA (iOS)
![Page 32: TORNANDO SEU APP DISPONÍVEL PARA …...2019/06/17 · Desativar animações dos elementos de interface para melhorar a performance do app 2. Leitura nativa Manter a leitura nativa](https://reader033.fdocumentos.tips/reader033/viewer/2022042708/5f3c4cef2690a0749f3ad489/html5/thumbnails/32.jpg)
Aumento de tela por foco (iOS)
![Page 33: TORNANDO SEU APP DISPONÍVEL PARA …...2019/06/17 · Desativar animações dos elementos de interface para melhorar a performance do app 2. Leitura nativa Manter a leitura nativa](https://reader033.fdocumentos.tips/reader033/viewer/2022042708/5f3c4cef2690a0749f3ad489/html5/thumbnails/33.jpg)
Textos Largos
![Page 34: TORNANDO SEU APP DISPONÍVEL PARA …...2019/06/17 · Desativar animações dos elementos de interface para melhorar a performance do app 2. Leitura nativa Manter a leitura nativa](https://reader033.fdocumentos.tips/reader033/viewer/2022042708/5f3c4cef2690a0749f3ad489/html5/thumbnails/34.jpg)
Textos Largos
![Page 35: TORNANDO SEU APP DISPONÍVEL PARA …...2019/06/17 · Desativar animações dos elementos de interface para melhorar a performance do app 2. Leitura nativa Manter a leitura nativa](https://reader033.fdocumentos.tips/reader033/viewer/2022042708/5f3c4cef2690a0749f3ad489/html5/thumbnails/35.jpg)
Dark Mode
![Page 36: TORNANDO SEU APP DISPONÍVEL PARA …...2019/06/17 · Desativar animações dos elementos de interface para melhorar a performance do app 2. Leitura nativa Manter a leitura nativa](https://reader033.fdocumentos.tips/reader033/viewer/2022042708/5f3c4cef2690a0749f3ad489/html5/thumbnails/36.jpg)
TRABALHANDO COM IMAGENS
![Page 37: TORNANDO SEU APP DISPONÍVEL PARA …...2019/06/17 · Desativar animações dos elementos de interface para melhorar a performance do app 2. Leitura nativa Manter a leitura nativa](https://reader033.fdocumentos.tips/reader033/viewer/2022042708/5f3c4cef2690a0749f3ad489/html5/thumbnails/37.jpg)
FERRAMENTAS PARA AUXILIAR NO DESENVOLVIMENTO iOS
![Page 38: TORNANDO SEU APP DISPONÍVEL PARA …...2019/06/17 · Desativar animações dos elementos de interface para melhorar a performance do app 2. Leitura nativa Manter a leitura nativa](https://reader033.fdocumentos.tips/reader033/viewer/2022042708/5f3c4cef2690a0749f3ad489/html5/thumbnails/38.jpg)
A IMPORTÂNCIA DOS TESTES MANUAIS
![Page 39: TORNANDO SEU APP DISPONÍVEL PARA …...2019/06/17 · Desativar animações dos elementos de interface para melhorar a performance do app 2. Leitura nativa Manter a leitura nativa](https://reader033.fdocumentos.tips/reader033/viewer/2022042708/5f3c4cef2690a0749f3ad489/html5/thumbnails/39.jpg)
WTS - OPEN SOURCE PROJECT
![Page 40: TORNANDO SEU APP DISPONÍVEL PARA …...2019/06/17 · Desativar animações dos elementos de interface para melhorar a performance do app 2. Leitura nativa Manter a leitura nativa](https://reader033.fdocumentos.tips/reader033/viewer/2022042708/5f3c4cef2690a0749f3ad489/html5/thumbnails/40.jpg)
Por que mostraram tão pouco de
implementação?
![Page 42: TORNANDO SEU APP DISPONÍVEL PARA …...2019/06/17 · Desativar animações dos elementos de interface para melhorar a performance do app 2. Leitura nativa Manter a leitura nativa](https://reader033.fdocumentos.tips/reader033/viewer/2022042708/5f3c4cef2690a0749f3ad489/html5/thumbnails/42.jpg)
EMPATIA
![Page 43: TORNANDO SEU APP DISPONÍVEL PARA …...2019/06/17 · Desativar animações dos elementos de interface para melhorar a performance do app 2. Leitura nativa Manter a leitura nativa](https://reader033.fdocumentos.tips/reader033/viewer/2022042708/5f3c4cef2690a0749f3ad489/html5/thumbnails/43.jpg)
CURTIU ?
… ANIMAÇÃO ...
… ORDENAÇÃO ...
… CUSTOMVIEW ...
… HIERARQUIA DE VIEWS ...
… AGRUPAMENTO ...… TESTE ...
![Page 44: TORNANDO SEU APP DISPONÍVEL PARA …...2019/06/17 · Desativar animações dos elementos de interface para melhorar a performance do app 2. Leitura nativa Manter a leitura nativa](https://reader033.fdocumentos.tips/reader033/viewer/2022042708/5f3c4cef2690a0749f3ad489/html5/thumbnails/44.jpg)
“Para as pessoas sem deficiência a
tecnologia torna as coisas mais fáceis.
Para as pessoas com deficiência, a
tecnologia torna as coisas possíveis.” Mary Pat Radabaugh
ex-diretora do IBM National Support Center
for Persons with Disabilities
![Page 45: TORNANDO SEU APP DISPONÍVEL PARA …...2019/06/17 · Desativar animações dos elementos de interface para melhorar a performance do app 2. Leitura nativa Manter a leitura nativa](https://reader033.fdocumentos.tips/reader033/viewer/2022042708/5f3c4cef2690a0749f3ad489/html5/thumbnails/45.jpg)
![Page 46: TORNANDO SEU APP DISPONÍVEL PARA …...2019/06/17 · Desativar animações dos elementos de interface para melhorar a performance do app 2. Leitura nativa Manter a leitura nativa](https://reader033.fdocumentos.tips/reader033/viewer/2022042708/5f3c4cef2690a0749f3ad489/html5/thumbnails/46.jpg)
Fatos, fuxicos,
comentários, boatos,
dúvidas e/ou perguntas
![Page 47: TORNANDO SEU APP DISPONÍVEL PARA …...2019/06/17 · Desativar animações dos elementos de interface para melhorar a performance do app 2. Leitura nativa Manter a leitura nativa](https://reader033.fdocumentos.tips/reader033/viewer/2022042708/5f3c4cef2690a0749f3ad489/html5/thumbnails/47.jpg)
daiane.freira
Contatos Daiane
@3jacksonsmith
Contatos Jackson