SlideShare uma empresa Scribd logo
1 de 27
IUX para deficientes visuais
Isabel Braga
06/12/2015 2
Como começou?
IUX para deficientes visuais
06/12/2015 2
Como começou?
• Começamos a fazer alguns projetos onde a questão da acessibilidade
era requisito importante.
• Além disso, como parte do projeto de inclusão de deficientes em seu
quadro de funcionários, o UOL passou a contar com alguns deficientes
entre seus profissionais.
IUX para deficientes visuais
306/12/2015
06/12/2015 4
Antes, entenda um
pouco mais sobre a
deficiência visual
IUX para deficientes visuais
06/12/2015 4
Sobre a deficiência visual
IUX para deficientes visuais
06/12/2015 5
A deficiência visual é definida como a perda
total ou parcial, congênita ou adquirida, da
visão. O nível de acuidade visual pode variar, o
que determina, assim, dois grupos de
deficiência:
Definição:
Sobre a deficiência visual
IUX para deficientes visuais
Cegueira
Perda total da visão ou
pouquíssima capacidade de
enxergar, o que leva a pessoa
a necessitar do Sistema Braille
como meio de leitura e escrita
ou um sistema de leitor de voz
para navegar na Internet.
06/12/2015 6
Baixa visão ou visão
subnormal
caracteriza-se pelo
comprometimento do
funcionamento visual dos
olhos, mesmo após tratamento
ou correção. As pessoas com
baixa visão podem ler textos
impressos ampliados ou com
uso de recursos óticos
especiais, como a lupa
eletrônica.
Sobre a cegueira no Brasil
IUX para deficientes visuais
06/12/2015 7
Segundo dados do IBGE de 2010, no Brasil, mais de
6,5 milhões de pessoas têm alguma deficiência visual.
Desse total:
Incapazes de
enxergar
(cegos)
528,624
8%
Pessoas que
possuem grande
dificuldade
permanente de
enxergar (baixa
visão ou visão
subnormal)
6.056.654
92%
Sobre a cegueira no mundo
IUX para deficientes visuais
06/12/2015 8
A Organização Mundial da
Saúde aponta que, se houvesse
um número maior de ações
efetivas de prevenção e/ou
tratamento, 80% dos casos de
cegueira poderiam ser evitados.
Ainda segundo a OMS cerca de
40 a 45 milhões de pessoas
no mundo são cegas;
Os outros 135 milhões sofrem
limitações severas de visão.
06/12/2015 9
Meios de navegação
IUX para deficientes visuais
06/12/2015 9
Como eles acessam a Internet?
IUX para deficientes visuais
06/12/2015 10
Meios de navegação
• Leitores de Tela
Programas de software que convertem texto em voz sintetizada e as pessoas cegas são
capazes de ouvir o conteúdo da web.
O usuário pode simplesmente deixar que o leitor de tela leia tudo de cima para baixo, uma
linha de cada vez, ou o usuário pode usar a Tecla TAB para navegar a partir de link por link.
Leitores de Tela
Meios de navegação
06/12/2015 11
Limitações
• Imagens
Os Leitores de tela não podem descrever imagens. A única maneira que
um leitor de tela tem para poder transmitir o significado de uma imagem é
a leitura do texto do documento que serve como um substituto ou
alternativo para a imagem.
Leitores de Tela
Meios de navegação
06/12/2015 12
Limitações
• Visual e Layout
Além disso, leitores de tela não podem fazer o levantamento da totalidade
de uma página da web como um usuário visual pode fazer.
Um usuário visual pode olhar para uma página da web e logo perceber a
forma como a página está organizada, para em seguida ir para o
conteúdo mais importante.
O usuário, na pior das hipóteses, pode navegar pelos menu principal.
Numa página com uma boa semântica, tudo o que o deficiente visual não
poderá ver são as fotos e vídeos.
Leitores de Tela
Meios de navegação
06/12/2015 13
Limitações
• Tabela de dados
Do mesmo modo, pela forma que os leitores “varrem” a tela, os
dados de tabelas podem ficar bastante confusos.
Para burlar essas dificuldades em tabelas, uma solução é: se for
uma tabela de horários, carregar a tabela apenas com os
horários futuros, para que o usuário não tenha que passar por
horários já passados e defasados.
Leitores de Tela
Meios de navegação
06/12/2015 14
Mobile
• No iPhone
O aparelho da Apple permite selecionar blocos
de texto (em sites, por exemplo) e faz a leitura
para o usuário.
O smartphone também tem um recurso muito
interessante para os deficientes visuais,
o VoiceOver. Ele também lê e transforma em
áudio o que aparece na tela do aparelho.
O recurso descreve tudo o que o usuário toca na
tela. Assim, mesmo quem não enxerga consegue
utilizar o aparelho.
Leitores de Tela
Meios de navegação
06/12/2015 15
Mobile
• No Android
Do Android 4.0 em diante, o aparelho possui
recurso para descrever em voz o que o usuário
toca, seleciona e ativa.
06/12/2015 16
Pesquisa com usuários
IUX para deficientes visuais
06/12/2015 16
06/12/2015 17
Pesquisa com usuários
IUX para deficientes visuais
“No Android, uso Whatsapp, Gmail, redes
sociais e Internet Banking.”
“Não tive dificuldades em me adaptar ao
mobile, prefiro até do que usar o desktop.”
“Com o software de leitura JAWS, tinha muita
dificuldade de acessar o Internet Banking do
Santander.”
“Somos minoria e devemos acompanhar a
tecnologia para nos comunicar melhor e
como qualquer outra pessoa. Os
smartphones tornaram isso mais fácil.”
Citou o Software Madis, como
“sonho de consumo” que
amplia as telas e altera as
cores para quem tem baixa
visão, mas custa R$ 5.600,00.
06/12/2015 18
Pesquisa com usuários
IUX para deficientes visuais
“No desktop, não uso o leitor, prefiro usar a tela
ampliada (Ctrl+/Ctrl-)”
“Fora de casa, uso a lupa eletrônica para
acessar qualquer informação, digital ou
não.”
“No celular, não uso o voicer, apenas o zoom,
há opção de ampliar na maioria dos apps do
Android”
“No celular, uso o Internet Banking Itaú e
consigo fazer tudo que preciso.”
“Minha lupa eletrônica
dá opções de alterar as
cores da interface de
acordo com o que é mais
confortável para mim.”
06/12/2015 19
Pesquisa com usuários
IUX para deficientes visuais
“Prefiro não utilizar o computador, sou muito
sensível à luz e não me adapto ao leitor de tela.”
“Tenho medo de golpes, por isso não uso
nenhum tipo de serviço que seja preciso ter
senha, com exceção do Facebook e Gmail.”
“Seria legal se eu conseguisse ler as imagens
das notícias. Não consegui ler as descrições
das imagens do ParaPan, isso me desestimulou
a usar a Internet.” “Só uso e-mail e
Facebook, para
outros serviços peço
ajuda de pessoas
que convivem
comigo.”
06/12/2015 20
Pesquisa com usuários
IUX para deficientes visuais
“O Google já facilita muita coisa, consigo fazer
qualquer coisa, de 3 anos pra cá.”
“Navego tranquilo no site do UOL, exceto
algumas matérias que o link ‘continuar
lendo’ não funciona.”
“Usava Nokia e Hotmail e tinha muita
dificuldade, conheci o Gmail e um amigo me
apresentou o iPhone. Fui tirar uma foto e o
Voicer me descreveu a foto, com pouca luz e
muito foco. Achei muito interessante e não parei
mais de usar.”
06/12/2015 21
Pesquisa com usuários
IUX para deficientes visuais
“Embora tenha muitos deficientes que compram
pela Internet, prefiro estar com alguém que
enxerga, do meu lado, para tá fazendo isso.”
“A minha maior frustação online é não
conseguir entender uma foto quando ela não
está descrita.”
“Sou comentarista esportivo, ao comentar sobre
uma matéria, preciso sempre perguntar aos
amigos de trabalho sobre as imagens
divulgadas, da partida.
06/12/2015 22
Dicas para tornar seu
site mais acessível
IUX para deficientes visuais
06/12/2015 22
Dicas para tornar seu site mais acessível
IUX para deficientes visuais
06/12/2015 23
• É bom fazer os links o mais descritivo possível, não
somente “leia mais” ou “clique aqui”, mas sim “clique
aqui para ver o coelhinho pulando.”;
• Para pessoas de baixa visão o ideal é ter um controle
que aumente e diminua as letras da tela. Geralmente,
essas pessoas usam o zoom do próprio navegador,
mas nem sempre isso dá certo.
• A fonte precisa ter ao menos 16px;
06/12/2015 24
• O primeiro link da página no HTML precisa ser um
atalho para o conteúdo principal ou para qualquer ação
que tenho um peso importante (conteúdo, login);
• Não use uma cor para o texto muito parecida com a do
fundo da página. Na dúvida, use o site Color Contrast
Check para saber se um tom é visível ou não em
comparação com outro;
Dicas para tornar seu site mais acessível
IUX para deficientes visuais
06/12/2015 25
• Acrescente um sublinhado aos textos com links. Não
os diferencie do texto normal só pela cor;
• Leia os conselhos do W3C para criar uma página
organizada e acessível para todos.
Dicas para tornar seu site mais acessível
IUX para deficientes visuais
06/12/2015 26
IUX para deficientes visuais
Fontes:
Instituto Benjamin Constant
Av. Brig. Faria Lima, 1.384, 4º andar
CEP 01452-002 . São Paulo/SP
Telefone: 11 3914.9559
www.uol.com.br
06/12/2015 27
Obrigado ;-)
Isabel Braga – Analista de Produtos
Equipe de Concepção & Interface de Produtos – P&D
ELABORAÇÃO DO ROTEIRO
Isabel Braga
Luciana Terceiro
ENTREVISTAS E FILMAGENS
Isabel Braga
Pablo Turazzi

Mais conteúdo relacionado

Mais procurados

O que é blog
O que é blogO que é blog
O que é blogluizIcm
 
Web Design Responsivo - Melhorando interfaces e a experiência do usuário na n...
Web Design Responsivo - Melhorando interfaces e a experiência do usuário na n...Web Design Responsivo - Melhorando interfaces e a experiência do usuário na n...
Web Design Responsivo - Melhorando interfaces e a experiência do usuário na n...Augusto César Albuquerque
 
Avaliação de usabilidade
Avaliação de usabilidadeAvaliação de usabilidade
Avaliação de usabilidadeJonas Henrique
 
Acessibilidade na web: como adaptar sites para deficientes online
Acessibilidade na web: como adaptar sites para deficientes onlineAcessibilidade na web: como adaptar sites para deficientes online
Acessibilidade na web: como adaptar sites para deficientes onlineAvantare Inteligência Interativa
 
Aula blogspot publicar
Aula blogspot publicarAula blogspot publicar
Aula blogspot publicarcharllos27
 

Mais procurados (9)

Apresentação Acesse
Apresentação AcesseApresentação Acesse
Apresentação Acesse
 
O que é blog
O que é blogO que é blog
O que é blog
 
Android / Paradigma
Android / ParadigmaAndroid / Paradigma
Android / Paradigma
 
O que é blog?
O que é blog?O que é blog?
O que é blog?
 
Web Design Responsivo - Melhorando interfaces e a experiência do usuário na n...
Web Design Responsivo - Melhorando interfaces e a experiência do usuário na n...Web Design Responsivo - Melhorando interfaces e a experiência do usuário na n...
Web Design Responsivo - Melhorando interfaces e a experiência do usuário na n...
 
Avaliação de usabilidade
Avaliação de usabilidadeAvaliação de usabilidade
Avaliação de usabilidade
 
Design responsivo
Design responsivoDesign responsivo
Design responsivo
 
Acessibilidade na web: como adaptar sites para deficientes online
Acessibilidade na web: como adaptar sites para deficientes onlineAcessibilidade na web: como adaptar sites para deficientes online
Acessibilidade na web: como adaptar sites para deficientes online
 
Aula blogspot publicar
Aula blogspot publicarAula blogspot publicar
Aula blogspot publicar
 

Semelhante a Iux para deficientes visuais - UX Day Itaú - Cubo

Razões para tornar um web site acessível
Razões para tornar um web site acessívelRazões para tornar um web site acessível
Razões para tornar um web site acessívelMDesign Estúdio
 
E mag desenvolvedor_mod_1
E mag desenvolvedor_mod_1E mag desenvolvedor_mod_1
E mag desenvolvedor_mod_1Leo Serrao
 
Frontend com Acessibilidade - FrontInSampa - Nov. 2012
Frontend com Acessibilidade - FrontInSampa - Nov. 2012Frontend com Acessibilidade - FrontInSampa - Nov. 2012
Frontend com Acessibilidade - FrontInSampa - Nov. 2012Horácio Soares
 
Padrões em Governo Eletrônico - Cartilha de Usabilidade
Padrões em Governo Eletrônico - Cartilha de UsabilidadePadrões em Governo Eletrônico - Cartilha de Usabilidade
Padrões em Governo Eletrônico - Cartilha de UsabilidadeGovBR
 
Aplicações Web Acessíveis
Aplicações Web AcessíveisAplicações Web Acessíveis
Aplicações Web AcessíveisDiego Pessoa
 
Web 2.0 + Foco no Usuário
Web 2.0 + Foco no UsuárioWeb 2.0 + Foco no Usuário
Web 2.0 + Foco no Usuárioguest479a40
 
PUB5AN - Dicas de Usabilidade
PUB5AN - Dicas de UsabilidadePUB5AN - Dicas de Usabilidade
PUB5AN - Dicas de UsabilidadeNeca Boullosa
 
Acessibilidade1
Acessibilidade1Acessibilidade1
Acessibilidade1cdchaves
 
Acessibilidade1
Acessibilidade1Acessibilidade1
Acessibilidade1angeli_mk
 
2010.1 - PUB5AN - Marketing Digital AULA 03
2010.1 - PUB5AN - Marketing Digital AULA 032010.1 - PUB5AN - Marketing Digital AULA 03
2010.1 - PUB5AN - Marketing Digital AULA 03Neca Boullosa
 
Gestão de projetos em soluções mobile
Gestão de projetos em soluções mobileGestão de projetos em soluções mobile
Gestão de projetos em soluções mobileMarcos Fabrício
 
Palestra Padrões Brasil E-Gov: World Usability Day 2010 - no IBGE
Palestra Padrões Brasil E-Gov: World Usability Day 2010 - no IBGEPalestra Padrões Brasil E-Gov: World Usability Day 2010 - no IBGE
Palestra Padrões Brasil E-Gov: World Usability Day 2010 - no IBGELuiz Agner
 
Caracteristicas da Usabilidade
Caracteristicas da UsabilidadeCaracteristicas da Usabilidade
Caracteristicas da UsabilidadeFernando Vargas
 
TDC2017 | São Paulo - Trilha Acessibilidade How we figured out we had a SRE t...
TDC2017 | São Paulo - Trilha Acessibilidade How we figured out we had a SRE t...TDC2017 | São Paulo - Trilha Acessibilidade How we figured out we had a SRE t...
TDC2017 | São Paulo - Trilha Acessibilidade How we figured out we had a SRE t...tdc-globalcode
 

Semelhante a Iux para deficientes visuais - UX Day Itaú - Cubo (20)

Razões para tornar um web site acessível
Razões para tornar um web site acessívelRazões para tornar um web site acessível
Razões para tornar um web site acessível
 
Joomla e acessibilidade
Joomla e acessibilidadeJoomla e acessibilidade
Joomla e acessibilidade
 
E mag desenvolvedor_mod_1
E mag desenvolvedor_mod_1E mag desenvolvedor_mod_1
E mag desenvolvedor_mod_1
 
Frontend com Acessibilidade - FrontInSampa - Nov. 2012
Frontend com Acessibilidade - FrontInSampa - Nov. 2012Frontend com Acessibilidade - FrontInSampa - Nov. 2012
Frontend com Acessibilidade - FrontInSampa - Nov. 2012
 
Padrões em Governo Eletrônico - Cartilha de Usabilidade
Padrões em Governo Eletrônico - Cartilha de UsabilidadePadrões em Governo Eletrônico - Cartilha de Usabilidade
Padrões em Governo Eletrônico - Cartilha de Usabilidade
 
Aplicações Web Acessíveis
Aplicações Web AcessíveisAplicações Web Acessíveis
Aplicações Web Acessíveis
 
Web 2.0 + Foco no Usuário
Web 2.0 + Foco no UsuárioWeb 2.0 + Foco no Usuário
Web 2.0 + Foco no Usuário
 
PUB5AN - Dicas de Usabilidade
PUB5AN - Dicas de UsabilidadePUB5AN - Dicas de Usabilidade
PUB5AN - Dicas de Usabilidade
 
Acessibilidade1
Acessibilidade1Acessibilidade1
Acessibilidade1
 
Acessibilidade1
Acessibilidade1Acessibilidade1
Acessibilidade1
 
2010.1 - PUB5AN - Marketing Digital AULA 03
2010.1 - PUB5AN - Marketing Digital AULA 032010.1 - PUB5AN - Marketing Digital AULA 03
2010.1 - PUB5AN - Marketing Digital AULA 03
 
Inclusao digital para deficientes
Inclusao digital para deficientesInclusao digital para deficientes
Inclusao digital para deficientes
 
Gestão de projetos em soluções mobile
Gestão de projetos em soluções mobileGestão de projetos em soluções mobile
Gestão de projetos em soluções mobile
 
Web Design > Usabilidade
Web Design > UsabilidadeWeb Design > Usabilidade
Web Design > Usabilidade
 
Acessibilidade web
Acessibilidade webAcessibilidade web
Acessibilidade web
 
Palestra Padrões Brasil E-Gov: World Usability Day 2010 - no IBGE
Palestra Padrões Brasil E-Gov: World Usability Day 2010 - no IBGEPalestra Padrões Brasil E-Gov: World Usability Day 2010 - no IBGE
Palestra Padrões Brasil E-Gov: World Usability Day 2010 - no IBGE
 
Caracteristicas da Usabilidade
Caracteristicas da UsabilidadeCaracteristicas da Usabilidade
Caracteristicas da Usabilidade
 
0000015305.pdf
0000015305.pdf0000015305.pdf
0000015305.pdf
 
Acessibilidade na web
Acessibilidade na webAcessibilidade na web
Acessibilidade na web
 
TDC2017 | São Paulo - Trilha Acessibilidade How we figured out we had a SRE t...
TDC2017 | São Paulo - Trilha Acessibilidade How we figured out we had a SRE t...TDC2017 | São Paulo - Trilha Acessibilidade How we figured out we had a SRE t...
TDC2017 | São Paulo - Trilha Acessibilidade How we figured out we had a SRE t...
 

Mais de Lu Terceiro

Lote - A friend for parents and children
Lote - A friend for parents and childrenLote - A friend for parents and children
Lote - A friend for parents and childrenLu Terceiro
 
UOL HOST: Diplomacy for a good experience
UOL HOST:  Diplomacy for a good experience UOL HOST:  Diplomacy for a good experience
UOL HOST: Diplomacy for a good experience Lu Terceiro
 
Transformational Design Thinking - Aula 10
Transformational Design Thinking - Aula 10Transformational Design Thinking - Aula 10
Transformational Design Thinking - Aula 10Lu Terceiro
 
Transformational Design Thinking - Aula 9
Transformational Design Thinking - Aula 9Transformational Design Thinking - Aula 9
Transformational Design Thinking - Aula 9Lu Terceiro
 
Transformational Design Thinking - Aula 8
Transformational Design Thinking - Aula 8Transformational Design Thinking - Aula 8
Transformational Design Thinking - Aula 8Lu Terceiro
 
Transformational Design Thinking - Aula 7
Transformational Design Thinking - Aula 7Transformational Design Thinking - Aula 7
Transformational Design Thinking - Aula 7Lu Terceiro
 
Transformational Design Thinking - Aula 6
Transformational Design Thinking - Aula 6Transformational Design Thinking - Aula 6
Transformational Design Thinking - Aula 6Lu Terceiro
 
Transformational Design Thinking - Aula 5
Transformational Design Thinking - Aula 5Transformational Design Thinking - Aula 5
Transformational Design Thinking - Aula 5Lu Terceiro
 
Transformational Design Thinking - Aula 4
Transformational Design Thinking - Aula 4Transformational Design Thinking - Aula 4
Transformational Design Thinking - Aula 4Lu Terceiro
 
Transformational Design Thinking - Aula 1
Transformational Design Thinking - Aula 1Transformational Design Thinking - Aula 1
Transformational Design Thinking - Aula 1Lu Terceiro
 
UP[W]IT - Projeto Deevas da Tecnologia - TDC4Women - The Developer's Conferen...
UP[W]IT - Projeto Deevas da Tecnologia - TDC4Women - The Developer's Conferen...UP[W]IT - Projeto Deevas da Tecnologia - TDC4Women - The Developer's Conferen...
UP[W]IT - Projeto Deevas da Tecnologia - TDC4Women - The Developer's Conferen...Lu Terceiro
 
Inspetor Bugiganga - pesquisas criativas para desenvolvimento ágil
Inspetor Bugiganga - pesquisas criativas para desenvolvimento ágilInspetor Bugiganga - pesquisas criativas para desenvolvimento ágil
Inspetor Bugiganga - pesquisas criativas para desenvolvimento ágilLu Terceiro
 
Design Thinking como potencializador do empreendedorismo
Design Thinking como potencializador do empreendedorismoDesign Thinking como potencializador do empreendedorismo
Design Thinking como potencializador do empreendedorismoLu Terceiro
 
Design como potencializar do empreendedorismo - WIAD 2016
Design como potencializar do empreendedorismo - WIAD 2016Design como potencializar do empreendedorismo - WIAD 2016
Design como potencializar do empreendedorismo - WIAD 2016Lu Terceiro
 
IxDA - Assembléia & Planejamento 2016
IxDA - Assembléia & Planejamento 2016IxDA - Assembléia & Planejamento 2016
IxDA - Assembléia & Planejamento 2016Lu Terceiro
 
Design Thinking para Startups #4
Design Thinking para Startups #4Design Thinking para Startups #4
Design Thinking para Startups #4Lu Terceiro
 
Campus Party 2013 - Como mimar seus usuários (e fazer com que falem bem de você)
Campus Party 2013 - Como mimar seus usuários (e fazer com que falem bem de você)Campus Party 2013 - Como mimar seus usuários (e fazer com que falem bem de você)
Campus Party 2013 - Como mimar seus usuários (e fazer com que falem bem de você)Lu Terceiro
 
WIAD 2013 - De detetive a arquiteto da informação
WIAD 2013 - De detetive a arquiteto da informaçãoWIAD 2013 - De detetive a arquiteto da informação
WIAD 2013 - De detetive a arquiteto da informaçãoLu Terceiro
 
UOL Mackenzie Day 2013
UOL Mackenzie Day 2013UOL Mackenzie Day 2013
UOL Mackenzie Day 2013Lu Terceiro
 
Fiquei tanto tempo programando mas ninguém usa, e agora?
Fiquei tanto tempo programando mas ninguém usa, e agora?Fiquei tanto tempo programando mas ninguém usa, e agora?
Fiquei tanto tempo programando mas ninguém usa, e agora?Lu Terceiro
 

Mais de Lu Terceiro (20)

Lote - A friend for parents and children
Lote - A friend for parents and childrenLote - A friend for parents and children
Lote - A friend for parents and children
 
UOL HOST: Diplomacy for a good experience
UOL HOST:  Diplomacy for a good experience UOL HOST:  Diplomacy for a good experience
UOL HOST: Diplomacy for a good experience
 
Transformational Design Thinking - Aula 10
Transformational Design Thinking - Aula 10Transformational Design Thinking - Aula 10
Transformational Design Thinking - Aula 10
 
Transformational Design Thinking - Aula 9
Transformational Design Thinking - Aula 9Transformational Design Thinking - Aula 9
Transformational Design Thinking - Aula 9
 
Transformational Design Thinking - Aula 8
Transformational Design Thinking - Aula 8Transformational Design Thinking - Aula 8
Transformational Design Thinking - Aula 8
 
Transformational Design Thinking - Aula 7
Transformational Design Thinking - Aula 7Transformational Design Thinking - Aula 7
Transformational Design Thinking - Aula 7
 
Transformational Design Thinking - Aula 6
Transformational Design Thinking - Aula 6Transformational Design Thinking - Aula 6
Transformational Design Thinking - Aula 6
 
Transformational Design Thinking - Aula 5
Transformational Design Thinking - Aula 5Transformational Design Thinking - Aula 5
Transformational Design Thinking - Aula 5
 
Transformational Design Thinking - Aula 4
Transformational Design Thinking - Aula 4Transformational Design Thinking - Aula 4
Transformational Design Thinking - Aula 4
 
Transformational Design Thinking - Aula 1
Transformational Design Thinking - Aula 1Transformational Design Thinking - Aula 1
Transformational Design Thinking - Aula 1
 
UP[W]IT - Projeto Deevas da Tecnologia - TDC4Women - The Developer's Conferen...
UP[W]IT - Projeto Deevas da Tecnologia - TDC4Women - The Developer's Conferen...UP[W]IT - Projeto Deevas da Tecnologia - TDC4Women - The Developer's Conferen...
UP[W]IT - Projeto Deevas da Tecnologia - TDC4Women - The Developer's Conferen...
 
Inspetor Bugiganga - pesquisas criativas para desenvolvimento ágil
Inspetor Bugiganga - pesquisas criativas para desenvolvimento ágilInspetor Bugiganga - pesquisas criativas para desenvolvimento ágil
Inspetor Bugiganga - pesquisas criativas para desenvolvimento ágil
 
Design Thinking como potencializador do empreendedorismo
Design Thinking como potencializador do empreendedorismoDesign Thinking como potencializador do empreendedorismo
Design Thinking como potencializador do empreendedorismo
 
Design como potencializar do empreendedorismo - WIAD 2016
Design como potencializar do empreendedorismo - WIAD 2016Design como potencializar do empreendedorismo - WIAD 2016
Design como potencializar do empreendedorismo - WIAD 2016
 
IxDA - Assembléia & Planejamento 2016
IxDA - Assembléia & Planejamento 2016IxDA - Assembléia & Planejamento 2016
IxDA - Assembléia & Planejamento 2016
 
Design Thinking para Startups #4
Design Thinking para Startups #4Design Thinking para Startups #4
Design Thinking para Startups #4
 
Campus Party 2013 - Como mimar seus usuários (e fazer com que falem bem de você)
Campus Party 2013 - Como mimar seus usuários (e fazer com que falem bem de você)Campus Party 2013 - Como mimar seus usuários (e fazer com que falem bem de você)
Campus Party 2013 - Como mimar seus usuários (e fazer com que falem bem de você)
 
WIAD 2013 - De detetive a arquiteto da informação
WIAD 2013 - De detetive a arquiteto da informaçãoWIAD 2013 - De detetive a arquiteto da informação
WIAD 2013 - De detetive a arquiteto da informação
 
UOL Mackenzie Day 2013
UOL Mackenzie Day 2013UOL Mackenzie Day 2013
UOL Mackenzie Day 2013
 
Fiquei tanto tempo programando mas ninguém usa, e agora?
Fiquei tanto tempo programando mas ninguém usa, e agora?Fiquei tanto tempo programando mas ninguém usa, e agora?
Fiquei tanto tempo programando mas ninguém usa, e agora?
 

Iux para deficientes visuais - UX Day Itaú - Cubo

  • 1. IUX para deficientes visuais Isabel Braga
  • 2. 06/12/2015 2 Como começou? IUX para deficientes visuais 06/12/2015 2
  • 3. Como começou? • Começamos a fazer alguns projetos onde a questão da acessibilidade era requisito importante. • Além disso, como parte do projeto de inclusão de deficientes em seu quadro de funcionários, o UOL passou a contar com alguns deficientes entre seus profissionais. IUX para deficientes visuais 306/12/2015
  • 4. 06/12/2015 4 Antes, entenda um pouco mais sobre a deficiência visual IUX para deficientes visuais 06/12/2015 4
  • 5. Sobre a deficiência visual IUX para deficientes visuais 06/12/2015 5 A deficiência visual é definida como a perda total ou parcial, congênita ou adquirida, da visão. O nível de acuidade visual pode variar, o que determina, assim, dois grupos de deficiência: Definição:
  • 6. Sobre a deficiência visual IUX para deficientes visuais Cegueira Perda total da visão ou pouquíssima capacidade de enxergar, o que leva a pessoa a necessitar do Sistema Braille como meio de leitura e escrita ou um sistema de leitor de voz para navegar na Internet. 06/12/2015 6 Baixa visão ou visão subnormal caracteriza-se pelo comprometimento do funcionamento visual dos olhos, mesmo após tratamento ou correção. As pessoas com baixa visão podem ler textos impressos ampliados ou com uso de recursos óticos especiais, como a lupa eletrônica.
  • 7. Sobre a cegueira no Brasil IUX para deficientes visuais 06/12/2015 7 Segundo dados do IBGE de 2010, no Brasil, mais de 6,5 milhões de pessoas têm alguma deficiência visual. Desse total: Incapazes de enxergar (cegos) 528,624 8% Pessoas que possuem grande dificuldade permanente de enxergar (baixa visão ou visão subnormal) 6.056.654 92%
  • 8. Sobre a cegueira no mundo IUX para deficientes visuais 06/12/2015 8 A Organização Mundial da Saúde aponta que, se houvesse um número maior de ações efetivas de prevenção e/ou tratamento, 80% dos casos de cegueira poderiam ser evitados. Ainda segundo a OMS cerca de 40 a 45 milhões de pessoas no mundo são cegas; Os outros 135 milhões sofrem limitações severas de visão.
  • 9. 06/12/2015 9 Meios de navegação IUX para deficientes visuais 06/12/2015 9
  • 10. Como eles acessam a Internet? IUX para deficientes visuais 06/12/2015 10 Meios de navegação • Leitores de Tela Programas de software que convertem texto em voz sintetizada e as pessoas cegas são capazes de ouvir o conteúdo da web. O usuário pode simplesmente deixar que o leitor de tela leia tudo de cima para baixo, uma linha de cada vez, ou o usuário pode usar a Tecla TAB para navegar a partir de link por link.
  • 11. Leitores de Tela Meios de navegação 06/12/2015 11 Limitações • Imagens Os Leitores de tela não podem descrever imagens. A única maneira que um leitor de tela tem para poder transmitir o significado de uma imagem é a leitura do texto do documento que serve como um substituto ou alternativo para a imagem.
  • 12. Leitores de Tela Meios de navegação 06/12/2015 12 Limitações • Visual e Layout Além disso, leitores de tela não podem fazer o levantamento da totalidade de uma página da web como um usuário visual pode fazer. Um usuário visual pode olhar para uma página da web e logo perceber a forma como a página está organizada, para em seguida ir para o conteúdo mais importante. O usuário, na pior das hipóteses, pode navegar pelos menu principal. Numa página com uma boa semântica, tudo o que o deficiente visual não poderá ver são as fotos e vídeos.
  • 13. Leitores de Tela Meios de navegação 06/12/2015 13 Limitações • Tabela de dados Do mesmo modo, pela forma que os leitores “varrem” a tela, os dados de tabelas podem ficar bastante confusos. Para burlar essas dificuldades em tabelas, uma solução é: se for uma tabela de horários, carregar a tabela apenas com os horários futuros, para que o usuário não tenha que passar por horários já passados e defasados.
  • 14. Leitores de Tela Meios de navegação 06/12/2015 14 Mobile • No iPhone O aparelho da Apple permite selecionar blocos de texto (em sites, por exemplo) e faz a leitura para o usuário. O smartphone também tem um recurso muito interessante para os deficientes visuais, o VoiceOver. Ele também lê e transforma em áudio o que aparece na tela do aparelho. O recurso descreve tudo o que o usuário toca na tela. Assim, mesmo quem não enxerga consegue utilizar o aparelho.
  • 15. Leitores de Tela Meios de navegação 06/12/2015 15 Mobile • No Android Do Android 4.0 em diante, o aparelho possui recurso para descrever em voz o que o usuário toca, seleciona e ativa.
  • 16. 06/12/2015 16 Pesquisa com usuários IUX para deficientes visuais 06/12/2015 16
  • 17. 06/12/2015 17 Pesquisa com usuários IUX para deficientes visuais “No Android, uso Whatsapp, Gmail, redes sociais e Internet Banking.” “Não tive dificuldades em me adaptar ao mobile, prefiro até do que usar o desktop.” “Com o software de leitura JAWS, tinha muita dificuldade de acessar o Internet Banking do Santander.” “Somos minoria e devemos acompanhar a tecnologia para nos comunicar melhor e como qualquer outra pessoa. Os smartphones tornaram isso mais fácil.” Citou o Software Madis, como “sonho de consumo” que amplia as telas e altera as cores para quem tem baixa visão, mas custa R$ 5.600,00.
  • 18. 06/12/2015 18 Pesquisa com usuários IUX para deficientes visuais “No desktop, não uso o leitor, prefiro usar a tela ampliada (Ctrl+/Ctrl-)” “Fora de casa, uso a lupa eletrônica para acessar qualquer informação, digital ou não.” “No celular, não uso o voicer, apenas o zoom, há opção de ampliar na maioria dos apps do Android” “No celular, uso o Internet Banking Itaú e consigo fazer tudo que preciso.” “Minha lupa eletrônica dá opções de alterar as cores da interface de acordo com o que é mais confortável para mim.”
  • 19. 06/12/2015 19 Pesquisa com usuários IUX para deficientes visuais “Prefiro não utilizar o computador, sou muito sensível à luz e não me adapto ao leitor de tela.” “Tenho medo de golpes, por isso não uso nenhum tipo de serviço que seja preciso ter senha, com exceção do Facebook e Gmail.” “Seria legal se eu conseguisse ler as imagens das notícias. Não consegui ler as descrições das imagens do ParaPan, isso me desestimulou a usar a Internet.” “Só uso e-mail e Facebook, para outros serviços peço ajuda de pessoas que convivem comigo.”
  • 20. 06/12/2015 20 Pesquisa com usuários IUX para deficientes visuais “O Google já facilita muita coisa, consigo fazer qualquer coisa, de 3 anos pra cá.” “Navego tranquilo no site do UOL, exceto algumas matérias que o link ‘continuar lendo’ não funciona.” “Usava Nokia e Hotmail e tinha muita dificuldade, conheci o Gmail e um amigo me apresentou o iPhone. Fui tirar uma foto e o Voicer me descreveu a foto, com pouca luz e muito foco. Achei muito interessante e não parei mais de usar.”
  • 21. 06/12/2015 21 Pesquisa com usuários IUX para deficientes visuais “Embora tenha muitos deficientes que compram pela Internet, prefiro estar com alguém que enxerga, do meu lado, para tá fazendo isso.” “A minha maior frustação online é não conseguir entender uma foto quando ela não está descrita.” “Sou comentarista esportivo, ao comentar sobre uma matéria, preciso sempre perguntar aos amigos de trabalho sobre as imagens divulgadas, da partida.
  • 22. 06/12/2015 22 Dicas para tornar seu site mais acessível IUX para deficientes visuais 06/12/2015 22
  • 23. Dicas para tornar seu site mais acessível IUX para deficientes visuais 06/12/2015 23 • É bom fazer os links o mais descritivo possível, não somente “leia mais” ou “clique aqui”, mas sim “clique aqui para ver o coelhinho pulando.”; • Para pessoas de baixa visão o ideal é ter um controle que aumente e diminua as letras da tela. Geralmente, essas pessoas usam o zoom do próprio navegador, mas nem sempre isso dá certo. • A fonte precisa ter ao menos 16px;
  • 24. 06/12/2015 24 • O primeiro link da página no HTML precisa ser um atalho para o conteúdo principal ou para qualquer ação que tenho um peso importante (conteúdo, login); • Não use uma cor para o texto muito parecida com a do fundo da página. Na dúvida, use o site Color Contrast Check para saber se um tom é visível ou não em comparação com outro; Dicas para tornar seu site mais acessível IUX para deficientes visuais
  • 25. 06/12/2015 25 • Acrescente um sublinhado aos textos com links. Não os diferencie do texto normal só pela cor; • Leia os conselhos do W3C para criar uma página organizada e acessível para todos. Dicas para tornar seu site mais acessível IUX para deficientes visuais
  • 26. 06/12/2015 26 IUX para deficientes visuais Fontes: Instituto Benjamin Constant
  • 27. Av. Brig. Faria Lima, 1.384, 4º andar CEP 01452-002 . São Paulo/SP Telefone: 11 3914.9559 www.uol.com.br 06/12/2015 27 Obrigado ;-) Isabel Braga – Analista de Produtos Equipe de Concepção & Interface de Produtos – P&D ELABORAÇÃO DO ROTEIRO Isabel Braga Luciana Terceiro ENTREVISTAS E FILMAGENS Isabel Braga Pablo Turazzi