Cartilha Stid

modelo de
interao
inclusivo
das Comunicaes
MinisIrio
Node|o de |oterao |oc|0s|vo
para interfaces de governo eletrnico

Lara Schibelsky Godoy Piccolo
Claudia Povoas Schmidt
Alexandre Freire da Silva Osorio
Robson Eudes Duarte
Ismael Mattos Andrade vila
Cludia de Andrade Tambascia
Rafael Faria Carvalho
Murilo Gomes Aureliano
Luiz Accio Guimares Rolim

Modelo de interao inclusivo
para interfaces de governo eletrnico

Campinas, SP

Fundao CPqD
2010

Atribuio-Uso no-comercial-Compartilhamento pela mesma licena 3.0 Brasil
Voc tem a liberdade de:

Compartilhar copiar, distribuir e transmitir a obra.

Remixar criar obras derivadas.
Sob as seguintes condies:

Atribuio Voc deve creditar a obra da forma especificada pelo autor ou
licenciante (mas no de maneira que sugira que estes concedem qualquer aval
a voc ou ao seu uso da obra).

Uso no-comercial Voc no pode usar esta obra para fins comerciais.

Compartilhamento pela mesma licena Se voc alterar, transformar ou
criar em cima desta obra, voc poder distribuir a obra resultante apenas sob a
mesma licena, ou sob uma licena similar presente.
***

Reviso
Elisabete da Fonseca
Juliana Cristina Fernandes Pereira
Rosana Barreto Brando
Thas Ribeiro Bueno

Diagramao
Sergio Ricardo Mazzolani

Capa
AVANTI! Comunicao

Agradecimento

Esta publicao resultado do trabalho de uma equipe multidisciplinar
que reuniu seus esforos com o objetivo indireto de agregar qualidade
de vida s pessoas que hoje so excludas digitalmente da sociedade.
Agradecemos a todos que trouxeram para o projeto uma viso particular
e diferenciada do problema, o que nos permitiu trabalhar em busca de
solues amplas, contemplando as necessidades da sociedade brasileira
da maneira mais abrangente possvel.
Nosso agradecimento a toda a equipe tcnica e gerencial da Diretoria de
Tecnologias de Servios do CPqD, que apoiou e que se envolveu com
esse trabalho.
Agradecemos tambm aos grupos acadmicos que enriqueceram e
subsidiaram essa pesquisa com seu notrio saber e intensa dedicao,
criando uma grande rede de conhecimento em torno dos termos
acessibilidade e incluso digital:
Grupo do Laboratrio de Tecnologia de Software (LTS) do
Departamento de Engenharia de Computao e Sistemas Digitais
(PCS) da Escola Politcnica da USP, coordenado pela Prof Dr
Lucia Vilela Leite Filgueiras.
Equipe do Ncleo de Informtica Aplicada Educao da
Universidade Estadual de Campinas (Unicamp), coordenado pela
Prof Dr Maria Ceclia Calani Baranauskas.
Pesquisadores e alunos do Instituto de Estudos da Linguagem (IEL)
da Universidade Estadual de Campinas (Unicamp), dirigidos pela
Prof Dr Denise Brtoli Braga.
Tambm dirigimos nosso agradecimento aos funcionrios das
prefeituras de Bastos e Santo Antnio de Posse, especialmente queles

envolvidos com a operao dos telecentros, que permitiram e apoiaram
a realizao de muitas atividades com usurios finais. Agradecemos
especialmente populao desses dois municpios, aos alunos de
escolas de alfabetizao de adultos e aos participantes de associaes de
pessoas com deficincias, que tornaram possvel o desenvolvimento
desse trabalho participando das oficinas de avaliao e validao de
solues.
Nosso muito obrigado tambm s equipes da Editora e da Biblioteca do
CPqD, que nos auxiliaram na materializao desse resultado em forma
de livro.
E, por fim, agradecemos ao Ministrio das Comunicaes pelo apoio e
incentivo, sem os quais a execuo do projeto STID no seria possvel.

Sumrio
Introduo ................................................................................................ 9
1 Modelo de interao ............................................................... 13
1.1 Motivao............................................................................... 13
1.2 Aplicao dos conceitos de usabilidade, acessibilidade e
inteligibilidade ....................................................................... 14
1.3 Prova de conceito ................................................................... 14
1.4 Diretrizes ................................................................................ 18
2 Modelo dos usurios .............................................................. 21
2.1 Interface universal considerando as diferenas ...................... 21
2.2 Perfis de usurio que incluam analfabetos e pessoas com
deficincia .............................................................................. 21
3 Layout .................................................................................... 25
3.1 Wireframe com a distribuio dos elementos na tela ............. 25
3.2 Posio das janelas de vdeo .................................................. 27
3.3 Janelas de mensagem em formato de pop-up ......................... 28
3.4 Tamanho dos links e objetos selecionveis ............................ 29
3.5 Composio das opes de navegao (links) ........................ 30
3.6 Distncia entre links e rtulos ................................................ 30
3.7 Tela sem rolagem ................................................................... 31
3.8 Minimizar barras de ferramentas do navegador ..................... 31
4 Apresentao .......................................................................... 33
4.1 Apresentao de textos ........................................................... 33
4.2 Uso de cores para diferenciar servios ................................... 34
4.3 Uso de metforas do mundo real ............................................ 34
4.4 Introduo ao mundo Web ..................................................... 35
4.5 Tamanho do ponteiro do mouse ............................................. 35

4.6 Aproximar a interao maneira como a populao entende e
usa o servio ........................................................................... 36
5 Navegao .............................................................................. 41
5.1 Interao por mouse, teclado e tecla de toque ........................ 41
5.2 Nmero de opes de navegao por tela .............................. 41
5.3 Clique no texto dispara o udio .............................................. 42
5.4 Navegao pelos cones ......................................................... 43
5.5 Indicao de disparo de udio ................................................ 43
5.6 Retorno de tela ....................................................................... 44
5.7 Avano automtico de tela ..................................................... 44
5.8 Destaque da opo selecionada .............................................. 45
6 Ajuda ...................................................................................... 47
6.1 Contextualizao do servio ................................................... 47
6.2 Ajuda on-line por tela ............................................................. 47
6.3 Formato do audiovisual .......................................................... 48
6.4 Contedo da ajuda por tela ..................................................... 48
6.5 Contedo da contextualizao do servio .............................. 49
6.6 Tooltips ................................................................................... 50
7 Audiovisuais ........................................................................... 51
7.1 Durao dos audiovisuais ....................................................... 51
7.2 Narrativa ................................................................................. 52
7.3 rea do audiovisual ................................................................ 52
7.4 Vdeos inclusivos ................................................................... 53
7.5 rea de texto .......................................................................... 53
7.6 Locuo .................................................................................. 54
7.7 Legendas ................................................................................ 54
7.8 Controles do player ................................................................ 54
8 Recursos de acessibilidade ..................................................... 57
8.1 Controle de tamanho de fonte ................................................ 57
8.2 Contraste de cores .................................................................. 58
8.3 Avatar Libras .......................................................................... 58
8.4 Controles do avatar ................................................................ 59
8.5 Texto em portugus no avatar Libras ..................................... 59
8.6 Navegao pela tecla Tab ....................................................... 60

9 Contedo em udio e em Libras ............................................. 61
9.1 Equivalente textual em udio ................................................. 61
9.2 Equivalente textual em Libras ................................................ 61
9.3 Atraso mximo para verbalizao .......................................... 62
9.4 Verbalizao no simultnea .................................................. 62
9.5 Verbalizao para perfil de usurio deficiente visual ............ 62
9.6 Verbalizao do ttulo da pgina ............................................ 63
9.7 Referncia dos udios a elementos presentes nos cones ....... 63
10 Elaborao de textos .............................................................. 65
10.1 Texto do roteiro dos vdeos .................................................... 65
10.2 Textos curtos .......................................................................... 66
10.3 Gnero narrativa ..................................................................... 66
10.4 Eixo semntico das tarefas ..................................................... 67
10.5 Rtulos ................................................................................... 68
10.6 Ttulo da pgina ..................................................................... 68
10.7 Tooltip .................................................................................... 68
10.8 Texto da janela de ajuda ......................................................... 68
10.9 Eixo semntico das TICs ........................................................ 69
10.10 Recursos multimodais ............................................................ 69
10.11 Consistncia, redundncia e reiterao .................................. 70
10.12 Silogismo e sincretismos com combinao de informaes e
conhecimento prvio .............................................................. 71
10.13 Textos curtos e palavras pequenas ......................................... 71
10.14 Abordagem direta ao cidado ................................................. 72
11 cones ..................................................................................... 75
11.1 Consistncia dos cones na interface ...................................... 75
11.2 Diferenciao dos cones........................................................ 76
11.3 Tamanho dos cones ............................................................... 76
11.4 Grau de representatividade dos cones ................................... 77
11.5 Elementos representativos ...................................................... 78
11.6 Interao dos cones com outros elementos ........................... 78
11.7 cones pictricos e fotogrficos ............................................. 79
11.8 Tipos fsicos representados nos cones .................................. 79
11.9 Redundncia ........................................................................... 80
Concluses ............................................................................................. 83
Referncias ............................................................................................ 85

Introduo
Proporcionar o ingresso efetivo do cidado na sociedade informacional
um processo que demanda, alm da infraestrutura tcnica, a adequao
dos servios ofertados por meio das tecnologias de informao ao seu
usurio final, de forma que esse usurio, principalmente aquele que
ainda no faz uso da tecnologia no dia a dia, possa superar as barreiras
que impedem o seu uso e a sua apropriao.
Nesse cenrio, o projeto STID (Solues de Telecomunicaes para
Incluso Digital), financiado pelo FUNTTEL (Fundo para o
Desenvolvimento Tecnolgico das Telecomunicaes), do Ministrio
das Comunicaes, prope uma soluo efetiva de incluso digital que
considera as vrias dimenses desse processo (VILA; HOLANDA,
2006), sejam elas tcnicas, sociais, econmicas ou educacionais. Essa
proposio implicou a discusso do conceito de incluso digital, a
anlise das iniciativas existentes e, assim, a identificao do
pblico-alvo mais desprovido de aes voltadas sua incluso, para que
ento fossem definidos os pontos focais de atuao.
Entre outras atuaes, a concretizao dessas anlises apontou para a
necessidade de criao de um modelo de interao para construo de
interfaces humano-computador que atenda s necessidades e s
peculiaridades da populao brasileira da maneira mais ampla possvel
(PICCOLO et al., 2009). Esse modelo deve orientar desenvolvedores e
projetistas de interfaces de usurio de tecnologias de informao na
criao de solues adequadas s habilidades e experincia dos
usurios finais, o que, no contexto do projeto STID, implica considerar
que pessoas com baixo letramento e pessoas com deficincias tambm
sejam parte desse grupo de usurios.
Esta publicao apresenta as diretrizes que guiaram a construo do
modelo de interao, bem como as recomendaes para o projeto e
Modelo de interao inclusivo para interfaces de governo eletrnico
10
desenvolvimento de interfaces de usurio que incluam pessoas com
baixo letramento e pessoas com deficincias sensoriais.
As recomendaes foram elaboradas a partir de pesquisas e testes
realizados com esse pblico-alvo pela equipe do CPqD e por grupos
acadmicos parceiros do projeto (HAYASHI et al., 2009; PICCOLO et
al., 2008; TAMBASCIA, 2009). Elas tratam no s de aspectos de
usabilidade comumente encontrados em guias de estilo, como
navegao e apresentao dos elementos de interface, mas tambm de
aspectos de linguagem, cuja abordagem essencial para se promover a
inteligibilidade dos servios propostos. Alm disso, so considerados
aspectos de acessibilidade que procuram criar condies de acesso e uso
por todos os perfis de usurio, independentemente de suas limitaes
sensoriais ou cognitivas decorrentes do analfabetismo, alinhados meta
do design universal.
Essa proposta de aplicao dos conceitos de usabilidade, acessibilidade
e inteligibilidade em interfaces para analfabetos, idosos e pessoas com
deficincia foi levada anlise e discusso por especialistas em
Interao Humano-Computador (MELO et al., 2009). Alguns resultados
dessas discusses tambm foram incorporados ao modelo de interao.
As recomendaes so justificadas e ilustradas com exemplos de
implementao na interface dos servios Inclua Sade (MARQUES et
al., 2007) e Previdncia Fcil (PATACA et al., 2007), de modo a serem
sucintas e livres de ambiguidades. Dessa forma, indicam para o
desenvolvedor ou projetista o que necessrio para a construo de uma
interface de usurio aplicvel aos demais servios em ambiente Web, de
acordo com o modelo sugerido. Porm, importante ressaltar que essas
recomendaes foram concebidas no contexto de um projeto de
pesquisa cujo foco principal era atender s necessidades do pblico-
alvo, independentemente de custo ou esforo de implementao. Por
esse motivo, algumas recomendaes podem precisar de adaptaes
quando aplicadas a outros cenrios de uso, o que no invalida o seu
propsito de guiar este projeto e seu desenvolvimento.
As recomendaes esto organizadas da seguinte forma:
O Captulo 1 apresenta as diretrizes que guiaram a construo do
modelo de interao. O Captulo 2 traz as recomendaes associadas
identificao e criao de um modelo de usurios. Os Captulos 3, 4 e
Introduo
11
5 apresentam as recomendaes acerca da construo da interface de
usurio associadas ao layout, apresentao e navegao,
respectivamente. A construo de mecanismos de ajuda e a elaborao
dos audiovisuais esto documentadas nos Captulos 6 e 7. O Captulo 8
trata dos mecanismos de acessibilidade. A verbalizao da informao
textual em udio e em Libras abordada no Captulo 9. O Captulo 10
descreve as recomendaes para elaborao de textos e o Captulo 11
apresenta os critrios para criao e uso de cones.

1 Modelo de interao
1.1 Motivao
Para transpor a barreira de disponibilidade de acesso no processo de
incluso digital, necessrio lidar com fatores relacionados s
necessidades e habilidades cognitivas, fsicas e psicolgicas individuais
que possibilitam o uso e a apropriao da tecnologia.
Segundo o Indicador Nacional de Analfabetismo Funcional INAF
(INSTITUTO PAULO MONTENEGRO, 2007), em 2007, cerca de 72%
da populao brasileira possua nvel incompleto de alfabetizao, sendo
7% analfabetos absolutos, 25% com alfabetizao rudimentar e 40%
com alfabetizao intermediria.
Ao mesmo tempo em que a eliminao do analfabetismo tem sido
tratada pela rea de Educao, esse contingente de pessoas com baixo
letramento representa um legado de excluso que no pode ser
simplesmente ignorado pelos elaboradores de polticas de incluso
digital e social. Pelo contrrio, tais polticas devem atingir grande parte
da populao.
Essa desproporo observada no Brasil entre a magnitude do problema e
os esforos na busca por solues foi a principal motivao para que o
projeto STID tenha priorizado, na definio do seu pblico-alvo,
pessoas analfabetas, semianalfabetas e idosas, alm das pessoas com
deficincias sensoriais, envolvendo continuamente pessoas com esses
perfis na construo de um modelo de interao (VILA et al., 2007;
TAMBASCIA; DALLANTONIA, 2006).
Os critrios para a construo do modelo so descritos ao longo desta
publicao.
14
1.2 Aplicao dos conceitos de usabilidade,
acessibilidade e inteligibilidade
A usabilidade de uma Tecnologia de Informao e Comunicao (TIC)
diz respeito aos aspectos de aprendizado e uso de uma interface de
maneira eficiente, eficaz e que gere satisfao para o usurio
(INTERNATIONAL ORGANIZATION FOR STANDARDIZATION,
2007). Aborda as barreiras de acesso relacionadas s limitaes
psicolgicas e cognitivas de um indivduo. A acessibilidade, por sua
vez, a caracterstica de uma TIC que trata das barreiras de acesso
relacionadas s limitaes fsicas, sensoriais e motoras de um indivduo.
A acessibilidade de uma interface assegura o acesso a um sistema, ou
seja, garante que todos os usurios sejam capazes de utilizar o sistema
com autonomia.
Segundo vila, Ogushi e Bonadia (2006), garantir a usabilidade e a
acessibilidade de uma TIC ainda no garante a apropriao da
tecnologia pelo indivduo. necessrio tambm garantir a
inteligibilidade, que a adequao dos contedos e das interfaces aos
perfis culturais e lingusticos, associada ao nvel de letramento de cada
usurio. Tambm devem ser considerados os nveis de letramento em
Braile e Libras, nos casos dos deficientes visuais e dos auditivos,
respectivamente, alm do nvel de letramento destes em relao lngua
portuguesa, quando se trata de surdos oralizados. Nessa adequao de
contedo so considerados, ainda, aspectos de ergonomia cognitiva, que
correspondem aos modelos mentais e s estratgias de memorizao e
abstrao empregadas pelo pblico-alvo da interface para vencer a
barreira que sua condio impe interao com os contedos digitais
disponveis na Internet.
Esse entendimento dos conceitos de usabilidade, acessibilidade e
inteligibilidade foram transpostos para o modelo de interao,
resultando em algumas diretrizes, descritas a seguir.
1.3 Prova de conceito
O modelo de interao foi aplicado em dois servios de governo
eletrnico (e-gov) considerados estratgicos em termos de apelo e
Modelo de interao
15
retorno ao pblico-alvo: um no mbito da sade e outro relacionado
Previdncia Social. Ambos os servios foram instalados em telecentros
pblicos, em parceria com as prefeituras de Bastos e Santo Antnio de
Posse, no Estado de So Paulo, conforme ilustram as Figuras 1 e 2.

Figura 1 Telecentro em Bastos
16

Figura 2 Telecentro em Santo Antnio de Posse
Em cada telecentro existe um monitor treinado para receber e capacitar
minimamente o pblico-alvo. Em sua primeira visita, o usurio
cadastrado em um sistema com mecanismo de reconhecimento facial e
associado a um perfil da interface: usurios analfabetos so associados
chamada interface-padro; usurios deficientes visuais ou auditivos so
associados respectivamente s interfaces para cegos e para surdos. Feito
o reconhecimento facial como forma de autenticao, a interface
adequada aberta para o usurio, identificando-o pelo nome.
Dessa maneira, os cidados tm as condies plenas de acesso aos
servios Inclua Sade e Previdncia Fcil.
O objetivo do Inclua Sade disponibilizar aos usurios da rede pblica
municipal de sade um servio eletrnico com as seguintes
funcionalidades: agendamento prvio de consultas mdicas em
atendimentos de ateno bsica sade; e disponibilizao de dicas e
informaes, relacionadas sade, de interesse local ou nacional.
A disponibilizao de recursos para a realizao do agendamento prvio
de consultas se prope a corrigir uma deficincia comumente presente
Modelo de interao
17
na grande maioria das Unidades de Atendimento Bsico de Sade, os
chamados postos de sade do Pas: os usurios so atendidos segundo a
ordem de chegada e de acordo com a urgncia do caso. Esse tipo de
atendimento resulta frequentemente na baixa qualidade do servio
prestado, uma vez que os usurios tm de enfrentar grandes filas de
espera. A possibilidade de agendamento pelos prprios usurios, ainda
que restrita a alguns tipos de consulta, no somente proporciona a
melhoria da qualidade do atendimento, por constituir um canal gil de
acesso, mas tambm viabiliza uma melhor estruturao operacional dos
quadros de atendimento nos postos de sade.
O Inclua Sade tambm oferece um novo canal de obteno de
informaes da rea da sade pblica que pode contribuir para
promover maior autonomia do usurio nas questes que envolvem
preveno e agilidade no uso do servio de sade, permitindo aos
cidados conhecer melhor seus direitos e os servios. Nesse caso, so
utilizados contedos audiovisuais inclusivos, disponibilizados por
agentes de sade do municpio e disparados sob demanda pelos
usurios.
Da mesma forma, dada a sua relevncia no Brasil, o servio de
Previdncia Social foi definido como prioritrio para o desenvolvimento
de uma prova de conceito do modelo de interao. O objetivo do servio
minimizar os deslocamentos do trabalhador aos postos da Previdncia
Social, disponveis em somente 20% dos municpios brasileiros
(PATACA et al., 2007).
O servio prov ao usurio informaes necessrias para a requisio da
aposentadoria, rural ou urbana, por idade, invalidez ou tempo de
servio. Apesar de essas informaes estarem disponveis no stio da
Previdncia Social, a excessiva formalidade da linguagem impe uma
barreira para grande parte dos usurios, em especial para aqueles com
baixo letramento.
Por meio de diversos ndices e medidas obtidos com base na
comparao entre a lngua falada pelo pblico-alvo do projeto STID e
os textos disponveis nos servios eletrnicos de previdncia, concluiu-
se que so necessrios cerca de 18 anos de escolaridade para que os
textos sejam bem compreendidos; isto , presume-se que os textos
possam ser lidos por leitores com, no mnimo, ps-graduao
(OSORIO; SCHMIDT; DUARTE, 2008). Nesse sentido, uma
18
readequao desse contedo essencial para que o cidado possa
usufruir dessas informaes.
1.4 Diretrizes
A construo de uma interface inclusiva, voltada para usurios
inexperientes no uso de TICs, deve considerar tambm aspectos da
preparao do usurio em termos psicolgicos e de aprendizagem, de
forma a mitigar as sucessivas barreiras enfrentadas nos primeiros
acessos. Para concretizar esses aspectos no modelo de interao e guiar
o processo de pesquisa e construo de solues, foram definidas as
seguintes diretrizes:
(a) A autonomia do usurio deve ser incremental
A incluso digital do pblico-alvo em questo deve ocorrer de forma
gradual, com a paulatina superao das barreiras psicolgicas e sociais
frente s TICs em seu contexto de uso, seguida pela gradativa aquisio
de habilidades e modelos mentais necessrios sua utilizao
(inicialmente com recursos para guias virtuais, apoio de usurios mais
experientes ou monitores), para que, por fim, cada novo usurio se torne
proficiente no uso dos servios. No entanto, para isso, importante que
o usurio sempre conclua a tarefa logo no primeiro acesso, de forma a se
sentir satisfeito e autoconfiante.
(b) Ter o design universal como meta
O objetivo buscar a concepo de uma mesma interface para o maior
nmero possvel de usurios, incluindo analfabetos e pessoas com
deficincia.
(c) Uso de interfaces ajustveis
Dentro da abordagem do design universal, a interface deve permitir
ajustes de acordo com os perfis de usurio do pblico-alvo definido,
sempre que necessrio e para aprimorar a usabilidade de cada um.
(d) Incorporao de modelos mentais conhecidos
importante identificar e incorporar os modelos mentais de uso de
outras tecnologias mais comuns entre o pblico-alvo, tais como rdio,
TV, urna eletrnica, telefone fixo ou celular.
Modelo de interao
19
(e) Possibilidade de extrapolar o modelo mental desenvolvido
O modelo mental criado na interao deve permitir a extenso
(extrapolao) a outros servios e contextos, servindo como porta de
entrada para o cidado na sociedade informacional.
(f) Normas de acessibilidade
A fim de possibilitar a incorporao de tecnologias assistivas usuais no
processo de interao de pessoas com deficincia e tambm a
extrapolao do modelo de interao para outros servios de governo
eletrnico, o cdigo gerado deve ser compatvel com as normas de
acessibilidade em vigor, tais como W3C
1
e e-mag
2
.
(g) Envolvimento do usurio final
As propostas de solues com representantes do pblico-alvo devem ser
continuamente validadas para que o modelo de interao seja adequado
s necessidades e s habilidades dos usurios.
O envolvimento do pblico tende a ser o grande diferencial das solues
aqui propostas. A descrio do modelo de interao, apresentada a
seguir, considera essas diretrizes e apresenta solues que passaram por
um processo de validao com o pblico-alvo, conforme descrito em
Tambascia (2009).

1
Disponvel em: http://www.w3.org/TR/WCAG/.
2
Disponvel em: http://www.governoeletronico.gov.br/acoes-e-projetos/padroes-
brasil-e-gov.

2 Modelo dos usurios
Este captulo contempla as recomendaes para a criao do modelo dos
usurios, que usado para guiar o processo de especificao e
desenvolvimento dos servios e suas interfaces.
As recomendaes esto alinhadas com o princpio do design universal,
que sugere que, na medida do possvel, seja construda uma mesma
interface para todos os usurios, incluindo pessoas com deficincia.
2.1 Interface universal considerando as
diferenas
O princpio do design universal deve ser considerado uma meta, de
forma a buscar a concepo de uma mesma interface para todos os
usurios, incluindo analfabetos e pessoas com deficincia. No entanto,
possvel que algumas necessidades de um grupo especfico de usurios
comprometam a usabilidade de outros. Nesse caso, deve ser feita uma
anlise criteriosa para identificar diferentes perfis de interface que
reflitam as particularidades.
2.2 Perfis de usurio que incluam
analfabetos e pessoas com deficincia
Projetos de interface para servios de governo eletrnico que buscam
atender sociedade como um todo devem considerar, no mnimo, trs
perfis de usurio: analfabetos, deficientes visuais e deficientes auditivos,
que, normalmente, possuem necessidades distintas de interao.
22
Justificativa e exemplos
No desenvolvimento do STID, optou-se pela criao de trs diferentes
perfis de interface: a interface-padro, que atende tanto ao usurio
analfabeto quanto ao alfabetizado; a interface para o surdo; e a interface
para o cego.
A interface-padro focada principalmente nos analfabetos pleno e
funcional, mas atende tambm o usurio alfabetizado. Contm o
contedo equivalente em udio para a informao textual e enfatiza os
elementos grficos.
A interface para o surdo no contm udio e apresenta o equivalente
informao textual em Libras (Lngua Brasileira de Sinais). Identificou-
se que, nesse caso, conveniente retirar o udio da interface, evitando
assim alguma forma de constrangimento em virtude da exposio de
seus dados em udio no ambiente, sem que o usurio perceba.
J na interface para o cego, optou-se por no usar a mesma verbalizao
automtica dos textos da interface-padro, para permitir que o usurio
aprenda a interagir com o auxlio de um software leitor de telas e que,
dessa forma, utilize esse mesmo conceito em outras interfaces.
Tanto o deficiente visual parcial (baixa viso) como o deficiente
auditivo parcial podem fazer uso da interface-padro, seja com
ampliao da fonte e aumento do contraste de cores ou com o aumento
do volume do udio no caso do deficiente auditivo. A apresentao e o
layout so os mesmos para todos os perfis.
Quando o teclado o nico mecanismo de navegao, como ocorre na
interao pelo usurio cego, possvel atender tambm ao usurio com
alguma deficincia motora, que faz uso de solues assistivas de
hardware. Esses hardwares assistivos variam muito em funo da
deficincia e das habilidades de cada usurio e, portanto, no fazem
parte do escopo do STID. A Figura 3 apresenta screenshots das
interfaces do tipo padro (a) e para o perfil do usurio surdo (b).
Modelo dos usurios
23

Figura 3 Interfaces do tipo padro (a) e para o usurio surdo (b)

3 Layout
Este captulo contempla as recomendaes acerca da distribuio dos
elementos na interface de modo a maximizar a inteligibilidade da
aplicao.
3.1 Wireframe com a distribuio dos
elementos na tela
No incio do projeto de desenvolvimento da interface, recomenda-se a
criao de um wireframe, um desenho simples que define reas
funcionais especficas na tela. Essas reas devem servir de base para o
projeto como um todo, mantendo a coerncia de distribuio dos
elementos em cada uma das telas. Esse wireframe deve contemplar, no
mnimo:
rea de navegao principal, que deve ocupar a rea central da tela.
Deve apresentar o contedo principal da tela, seja vdeo, texto ou
mesmo um menu essencial para que o usurio avance na interao.
rea para ttulo ou instruo principal da tela.
rea de acionamento da ajuda.
rea de execuo da ajuda.
Ajustes de acessibilidade: contraste de cores e tamanho de fonte.
Identificao da empresa, do projeto ou do servio.
importante manter a coerncia na disposio dos elementos na tela
para que o usurio possa criar um modelo mental da interface durante a
sua utilizao.
26
Alm disso, os testes mostraram que a rea central a rea que primeiro
atrai a ateno dos usurios, sendo a maioria pouco acostumada com o
modo tradicional de leitura de textos. Por esse motivo, esse espao deve
concentrar o contedo mais importante.
Foram criados dois wireframes para as interfaces do STID: o wireframe
principal e o wireframe de ajuda. Na Figura 4, exibida a distribuio
dos elementos da interface no layout da tela da aplicao no wireframe
principal. A rea de ttulo deve conter uma frase que conduz o usurio
s tarefas constantes na pgina em questo.
sigla
navegao
ttulo
acionamento
do vdeo
de ajuda
avatar Libras
logo CPqD
tam. fonte /
contraste
a
j
u
d
a

Figura 4 Wireframe principal do STID
A interface foi projetada para um monitor com resoluo de 1.280 x
1.024 pixels, no entanto, as recomendaes podem ser adaptadas para
resolues mais baixas.
As reas definidas no wireframe foram:
rea de ttulo: 665 x 74 pixels.
rea de acessibilidade: 179 x 136 pixels.
rea de navegao: 980 x 869 pixels.
rea de ajuda: 201 x 775 pixels.
Layout
27
A Figura 5 ilustra a sobreposio da ajuda acionada ao contedo
principal da tela.
a
j
u
d
a
ttulo sigla
navegao
Exibir
vdeo
de ajuda
avatar Libras
logo CPqD
tam. fonte / contraste
vdeo de ajuda
controles de execuo
texto de ajuda

Figura 5 Wireframe de ajuda do STID
3.2 Posio das janelas de vdeo
As janelas de vdeo (tanto de ajuda como de contedo) devem ocupar a
parte central da tela, mas sem que o usurio perca o contexto de onde
ele est na navegao. Durante a exibio das janelas de vdeo, a tela de
fundo no deve responder a eventos.
A rea central da tela onde o usurio mantm o foco. Se inserida na
rea perifrica, a tela com o contedo audiovisual pode no atrair a
ateno do usurio.
No STID, a tela de ajuda foi colocada em uma rea de cerca de 720 x
480 pixels, sobreposta tela atual de navegao, que aparece de forma
translcida, mantendo o contexto da navegao (Figura 6).
28

Figura 6 Audiovisual de ajuda sobre fundo translcido
3.3 Janelas de mensagem em formato de
pop-up
Assim como a janela de ajuda, as janelas de mensagem devem ocupar a
parte central da tela, mas sem que o usurio perca o contexto de onde
ele est na navegao. Durante a exibio das janelas de mensagem, a
tela de fundo no deve responder a eventos.
Para isso, sugere-se o uso de telas com efeito pop-up com fechamento
automtico, por temporizao.
A rea central da tela onde o usurio mantm o foco. No STID, as
janelas de mensagem foram colocadas, sempre que possvel, sobre a tela
que originou a mensagem, como ilustra a Figura 7, a seguir, causando
um efeito semelhante s janelas pop-up.
Layout
29

Figura 7 Janela de mensagem
3.4 Tamanho dos links e objetos
selecionveis
Todos os links e objetos selecionveis, sejam eles figuras, botes, caixas
de seleo, entre outros, devem ser grandes o suficiente para que sejam
acionados por meio de uma tela de toque.
A navegao do STID foi construda por meio de botes na rea de
navegao em formato retangular, com cantos arredondados (Figura 8).
Os botes foram divididos entre uma rea contendo um cone,
esquerda, e uma rea contendo o rtulo do boto, direita. Cada boto
tem o tamanho de cerca de 798 x 173 pixels na rea de fundo.

Figura 8 Exemplo de boto de navegao
30
3.5 Composio das opes de navegao
(links)
As opes de navegao, ou links, devem ser compostas por cones e um
rtulo textual associado, que pode ter a forma de rtulo ou tooltip,
etiqueta textual que exibida quando o usurio passa o mouse sobre o
link (evento de mouse over).
A composio de um boto com cone e rtulo pode ser observada na
Figura 8 (acima). O uso de um tooltip est ilustrado na Figura 9.

Figura 9 Exemplo de uso de um tooltip
3.6 Distncia entre links e rtulos
Para que um cone seja correlacionado adequadamente com seu rtulo
(texto) e vice-versa, necessrio que a distncia entre cone e texto seja
menor que a distncia entre esses elementos e quaisquer outros cones e
textos presentes na interface, ou que esse vnculo entre cone e texto seja
reforado pela moldura do campo em que esses elementos aparecem.
Para melhor clareza e identificao tanto dos cones como das palavras
contidas em seus rtulos, os textos sempre guardam uma distncia dos
cones. Alm disso, dado que cliques em cones e textos geram aes
diferentes, esses elementos devem estar separados de forma que a
Layout
31
interao seja agradvel ao usurio, tanto via mouse como por meio da
tela de toque. Entretanto, essa distncia deve ser tal que o usurio
perceba que um determinado cone est relacionado com o texto
correspondente, sem ambiguidades, uma vez que haver mais de um
cone com o respectivo rtulo por pgina.
3.7 Tela sem rolagem
As telas devem ser projetadas para ajustar todas as informaes, sem a
necessidade de rolagem vertical ou horizontal. Se toda a informao
pertinente no couber numa determinada tela, as informaes restantes
devem ser mostradas em uma nova tela.
Testes com usurios demonstraram que a identificao da barra de
rolagem raramente acontece com usurios com baixo letramento digital.
Alm disso, o mecanismo de funcionamento da barra de rolagem (rolar
a barra para baixo faz a tela subir) no bem compreendido.
3.8 Minimizar barras de ferramentas do
navegador
Sempre que possvel, as barras de ferramentas do navegador devem ser
ocultadas.
A exibio de barras de ferramentas do navegador pode levar usurios
no familiarizados com o ambiente Web a sair do contexto do servio e
a se perder na interao (quando algum comando acionado por
engano). De acordo com o aprendizado e a evoluo do usurio na
interao, esses elementos podem ser adicionados, aproximando-o do
mundo Web.

4 Apresentao
Este captulo contempla as recomendaes a respeito da aparncia dos
elementos na tela, no que tange a tamanho, cores e formas.
4.1 Apresentao de textos
Os ttulos de links e os rtulos dos botes devem ser grafados em letras
maisculas, sem sombreamento e sem negrito. Sugere-se o uso da fonte
Verdana, que prpria para Web, com tamanho superior a 24 pts,
sempre que possvel.
Fontes grandes so mais facilmente lidas por pessoas com baixa viso
(sem lupa) e por idosos. No texto dos rtulos dos botes foi usada a
fonte Verdana com 36 pts, como ilustrado na Figura 10. O texto da rea
de ttulo (Figura 11) tambm foi grafado com letras na fonte Verdana,
mas com 30 pts.

Figura 10 Exemplo de texto de rtulo de boto

Figura 11 Exemplo de texto da rea de ttulo
34
4.2 Uso de cores para diferenciar servios
No caso de haver mais de um servio disponvel em um portal, ou
mesmo contextos muito diferentes de um mesmo servio, recomenda-se
a utilizao de cores distintas que ajudem o usurio a distinguir o
servio ou o contexto em que ele est.
Para distinguir os dois servios do STID, foram usadas as seguintes
cores: degrad em verde para o Inclua Sade (de #d0f28b at #85ab3b),
visto que a cor verde geralmente associada com o tema sade e
transmite sensao de confiana e higiene; e degrad em laranja (de
#fdbb36 at #fcd382) para o Previdncia Fcil, remetendo s cores
oficiais da Previdncia Social brasileira. A Figura 12, a seguir, ilustra as
cores utilizadas.

Figura 12 Degrads usados para identificar os servios de sade e
Previdncia
4.3 Uso de metforas do mundo real
Sempre que possvel, os elementos da interface devem utilizar metforas
do mundo real, representando objetos que faam parte do dia a dia do
pblico-alvo.
As metforas de "folhinha" (calendrio), relgio analgico e o boto
Confirma da urna eletrnica so exemplos de metforas aplicadas na
interface, como mostra a Figura 13. A identificao desses elementos
Apresentao
35
grficos com objetos do cotidiano do usurio facilita o processo de
entendimento e abstrao da tarefa no mundo virtual.

Figura 13 Metforas de calendrio e relgio analgico
4.4 Introduo ao mundo Web
Elementos grficos que introduzam o usurio a conceitos do mundo
Web, mesmo que no sejam inicialmente metforas do mundo real pelo
usurio, devem ser avaliados e utilizados na interface quando
conveniente.
A seta para voltar um conceito largamente utilizado nos navegadores
e, portanto, foi identificada como um elemento importante para o
aprendizado do usurio que pretende utilizar os recursos da Web de uma
maneira mais abrangente. Assim, a seta foi estilizada (seu tamanho foi
aumentado, como ilustrado na Figura 9) e adotada como o link-padro
para retornar pgina anterior.
A interpretao desses elementos pode no ocorrer num primeiro
instante, mas seu aprendizado justificvel tendo em vista a autonomia
que o usurio pode adquirir nas prximas interaes.
4.5 Tamanho do ponteiro do mouse
Recomenda-se utilizar ponteiros do mouse aumentados em relao ao
padro do sistema operacional, facilitando a interao de usurios com
36
pouca viso ou inexperientes que, portanto, tm pouca destreza, e de
usurios idosos, entre os quais comum haver problemas de preciso
motora.
O cone com o desenho de uma seta inclinada (Figura 14), usado para
representar o ponteiro do mouse na interface, possui tamanho mnimo
de 33 x 60 pixels. A ttulo de comparao, a imagem-padro utilizada
pelo sistema operacional Windows tem cerca de 12 x 22 pixels. O cone
com o desenho de uma mo fechada com o dedo indicador estendido
(Figura 14), usado para representar o ponteiro do mouse quando este se
encontra sobre um objeto de interface que contm um link, possui
tamanho mnimo de 44 x 60 (largura x altura) pixels, enquanto o
tamanho utilizado pelo Windows de cerca de 18 x 30 pixels.

Figura 14 Ponteiros do mouse com tamanhos aumentados
O comportamento dos elementos da tela durante a navegao ser
descrito na prxima seo.
4.6 Aproximar a interao maneira como
a populao entende e usa o servio
Na medida do possvel, a interao deve buscar uma aproximao entre
a forma de interao e a maneira como o cidado entende e usa o
servio no dia a dia, em vez de espelhar a estrutura organizacional
interna dos servios de governo, que normalmente no tem significado
conhecido para o cidado.
Foram criadas duas abordagens alternativas para a interao com o
servio de Previdncia, de forma a minimizar o problema de abstrao
Apresentao
37
do servio para o mundo virtual, principalmente para os usurios com
baixo letramento.
(a) Uso de personas como facilitadores da interao
A primeira abordagem fez uso do conceito de personas, que so
arqutipos de usurios, como forma de facilitar a compreenso das
diversas alternativas possveis para aposentadoria, segundo os critrios
do INSS: aposentadoria por invalidez, aposentadoria por idade e
aposentadoria por tempo de contribuio. O mtodo normalmente
utilizado no desenvolvimento de sistemas de software, como uma
ferramenta de apoio para que seja possvel mapear as caractersticas dos
possveis usurios. O tratamento que dado na interface proposta aqui
foi diferente, uma vez que os usurios das personas so os usurios
finais, do pblico-alvo, e no os desenvolvedores da interface (VILA
et al., 2009; FILGUEIRAS et al., 2009).
A definio das personas buscou caracterizar alguns tipos
principais de usurios dos servios da Previdncia Social,
correlacionando, por um lado, os tipos de segurados, e, por outro
lado, as principais modalidades de benefcio s quais esses
segurados podem pleitear. Para isso, foram considerados dados do
Regime Geral de Previdncia Social, programa que atende a maior
parte da populao: trabalhadores que esto no mercado formal,
trabalhadores autnomos, rurais, empregados domsticos e demais
pessoas que contribuem facultativamente. (VILA et al., 2009)
Ao atuar com base nas estatsticas da Previdncia, garantiu-se que as
personas criadas representassem a grande maioria de usurios do
pblico-alvo interessada em se aposentar.
A soluo adotada para apresentar as personas na interface foi a de uma
animao em Flash que representa uma fila posicionada defronte a uma
agncia do INSS. Na fila esto as personas criadas (Figura 15).
38

Figura 15 Fila de personas
Ao clicar sobre uma delas, o usurio ouve uma gravao em que a
persona conta sua histria, como ilustrado na Figura 16. As vozes
relativas a cada persona possuem entonaes e timbres diferentes, na
tentativa de se aproximar do que seria considerada uma voz adequada
para a persona criada. O texto falado tambm apresentado por escrito.
A ideia que, nesse processo, o usurio se identifique com uma das
personas, o que pode acontecer por identificao visual, antes mesmo de
ouvir a histria de vida. Durante esse processo de identificao, o
usurio pode clicar no nmero que aparece associado persona
escolhida para que seja carregada uma nova pgina, contendo um vdeo
explicativo sobre a forma de se requisitar aposentadoria para aquela
modalidade representada pela persona.
Apresentao
39

Figura 16 Histria de vida da persona
(b) Metfora do atendente da Previdncia
A soluo de interao consiste numa animao em que um
personagem, caracterizado como atendente de um posto de servio do
governo, fornece informaes ao usurio a respeito do servio,
ajudando-o a descobrir qual categoria de aposentadoria seria a mais
adequada para ele. Mais uma vez, o foco est no eixo semntico da
tarefa e, para atingir esse objetivo, uma rvore decisria foi
implementada e percorrida de acordo com as respostas dadas pelo
usurio s perguntas feitas pelo atendente.
A rvore projetada para conter todas as categorias possveis de usurio
para o servio em questo e os respectivos requisitos. A cada ramo da
rvore, associada uma pergunta com resposta binria (sim ou
no), como ilustrado na Figura 17. O percurso na rvore de deciso
definido pelas respostas dadas pelo usurio. Ao final de cada percurso,
apresentada ao usurio a categoria qual ele pertence e um boto que d
acesso a informaes sobre como utilizar o servio (tipicamente em
forma de vdeo). Os preceitos de uso de linguagem simplificada e de uso
da metfora da urna eletrnica (os botes para responder "sim" e "no"
40
possuem o mesmo desenho e as mesmas cores dos botes de "confirma"
e "corrige" da urna eletrnica) foram mantidos nessa soluo.

Figura 17 Tela do atendente da Previdncia

5 Navegao
Neste captulo as recomendaes dizem respeito navegao dentro da
aplicao, isto , aos passos e mecanismos necessrios para se realizar
uma tarefa.
5.1 Interao por mouse, teclado e tecla de
toque
Os mecanismos de navegao devem pressupor o uso do mouse, do
teclado e da tela de toque.
Esses mecanismos atendem a diferentes perfis, inclusive as pessoas que
no tm habilidade com o mouse. O uso do teclado se aplica mais
diretamente ao deficiente visual. O mouse deve estar sempre disponvel,
pois apesar de muitos usurios ainda no terem habilidade para us-lo,
desejam ter a oportunidade de aprender e adquirir destreza.
5.2 Nmero de opes de navegao por tela
Cada tela deve conter no mximo quatro opes de navegao, dispostas
na vertical, ocupando toda a rea central da tela. A ordem das opes
pode refletir a importncia e/ou a frequncia de uso.
A escolha de quatro opes por tela leva em conta as restries do
pblico-alvo e est abaixo do limite mnimo da capacidade humana de
reter informaes na memria de trabalho para fazer escolhas, que
entre cinco e nove opes. Alm disso, quatro opes permitem uma
distribuio adequada na rea central da tela, gerando o mximo
42
aproveitamento do espao e permitindo o uso de fontes grandes e botes
suficientemente largos para serem usados com a tela de toque. A Figura
18 ilustra a tela principal de navegao do servio Inclua Sade. No
caso de haver cinco opes ou mais, o ltimo boto contm um texto
referente a Outras opes, que direciona o usurio para uma segunda
tela que deve ter, no mnimo, outras duas opes de navegao.

Figura 18 Posicionamento dos botes na rea de navegao
5.3 Clique no texto dispara o udio
A ao de clicar no texto deve acionar a verbalizao da informao de
que a navegao feita por determinado cone. Desse modo, os textos
no devem exercer a funo de link.
Para o usurio com baixo letramento, o texto em si representa uma
barreira compreenso da tarefa a ser executada ou da funo do boto.
O udio associado ao texto clicado elucida a funo do boto para o
analfabeto pleno e ajuda a esclarecer possveis dvidas de um usurio
com alfabetizao rudimentar.
Navegao
43
Observou-se em campo que outras alternativas para acionamento do
udio equivalente ao texto, tais como evento de mouse over sobre o
texto ou um boto especfico de udio, provocam inmeros problemas
de interao, principalmente pelo fato de que a pessoa com baixo
letramento digital percorre uma trajetria aleatria na tela, disparando
inmeros udios, sem associar esse disparo com a sua ao.
5.4 Navegao pelos cones
A navegao entre as pginas (links) deve ocorrer por meio dos cones,
liberando o evento de clique sobre a informao textual, que usualmente
corresponde a links, para o acionamento do udio.
O disparo do udio correspondente ao evento de clique sobre o texto
mostrou-se um recurso interessante para a navegao pelos usurios
com baixa alfabetizao, auxiliando no processo de leitura. Alm disso,
esse mecanismo viabiliza a interao por tela de toque, uma vez que
essa forma de interao inviabiliza a ocorrncia de eventos de mouse
over.
5.5 Indicao de disparo de udio
Deve haver uma indicao grfica de acionamento de udio para que o
usurio volte a sua ateno ao som.
Muitas vezes o usurio inexperiente no associa o seu clique com o
disparo de um udio; alm disso, o rudo ambiente pode prejudicar essa
percepo.
Foi utilizada uma imagem em formato .gif (Figura 19), sincronizada
com o udio, o que refora para o usurio que o som vem da interface e
consequncia do clique no texto. Para situar o usurio da origem do
udio, um smiley em formato .gif animado, dentro do boto onde o texto
clicado se insere, assume o papel de locutor.
44

Figura 19 Smiley que indica o disparo de um udio
5.6 Retorno de tela
Com exceo da tela inicial e da ltima tela de cada tarefa, todas as
outras telas devem conter um boto para retorno de pgina. O
acionamento desse boto deve fazer retornar para a tela imediatamente
anterior atual.
Sugere-se que o boto seja representado por uma seta para a esquerda,
de forma que o usurio possa extrapolar esse conceito para os comandos
do navegador.
No STID, a indicao de retorno de tela foi reforada com a presena de
um detalhe no canto inferior que remete a uma folha de papel sendo
levantada. Esse detalhe sugere a metfora de uma passagem de pgina
de material impresso, como ilustrado na Figura 20.

Figura 20 Indicaes para retorno de tela
5.7 Avano automtico de tela
Ao trmino da operao da tela atual, a passagem para a tela seguinte
dever ser automtica, ou seja, no deve haver um boto especfico para
avano de tela.
Navegao
45
O avano de tela consequncia de uma opo feita pelo usurio.
Exceto para o acionamento dos comandos do menu de ajuda, todo o
clique est associado a uma escolha feita pelo usurio no decorrer da
navegao. Essa dinmica sugere que sempre h um avano no sentido
de concluir a tarefa proposta pelo servio. Um clique cujo resultado
mantm o usurio na mesma tela pode sugerir que nada aconteceu.
Alm disso, a necessidade de fazer mais de uma escolha por pgina
pode paralisar o usurio, que no tem uma estratgia de navegao
estruturada, tampouco domina a lgica do servio.
5.8 Destaque da opo selecionada
Botes devem ser visualmente destacados quando houver um evento de
mouse over. O destaque deve durar enquanto o ponteiro do mouse
estiver posicionado sobre a rea do boto. Caso o udio do boto seja
disparado, o efeito tambm permanece pelo tempo que durar o udio e
mesmo aps a sua finalizao, se o mouse over persistir.
O destaque no boto (Figura 21) indica que algo diferente est
acontecendo ou que houve uma mudana de status, como uma
consequncia ao de mover o mouse. Essa estratgia ajuda o usurio
a associar o movimento do mouse na mesa ao efeito resultante. Dessa
forma, o usurio consegue se orientar na explorao dos botes e fica
seguro de que sua interao est sendo reconhecida pela aplicao.
46

Figura 21 Opo de navegao com destaque por evento de mouse over

6 Ajuda
Neste captulo esto as recomendaes que dizem respeito aos
mecanismos de funcionamento da ajuda contextualizada.
6.1 Contextualizao do servio
Deve existir uma ajuda que apresente a viso geral dos servios em um
carter de tutorial e de motivao para o uso dos servios.
Essa ajuda de contextualizao deve auxiliar o usurio na sua primeira
interao com o servio, elucidando o que pode ser feito por meio do
servio e como.
6.2 Ajuda on-line por tela
Toda tela deve conter uma ajuda contextualizada, acionvel por um
boto posicionado na rea para acionamento da ajuda.
Toda tela possui um boto (Figura 22), de 179 x 195 pixels, posicionado
no lado direito de cada tela. Pelo fato de a ajuda ser exibida em
audiovisual, a metfora da TV foi usada para o seu acionamento.
48

Figura 22 Boto de ajuda contextualizada
6.3 Formato do audiovisual
Recomenda-se o uso de audiovisuais para a ajuda.
Alm de serem dinmicos e permitirem uma associao com o formato
da TV, familiar para grande parte dos usurios, os audiovisuais podem
ser aplicveis s interfaces para todos os perfis de usurio. No caso do
STID, os audiovisuais foram desenvolvidos para contemplar o pblico
com os perfis analfabeto e deficiente auditivo. Ao fazer uso de um
roteiro preparado para ser direto, objetivo e descritivo, o deficiente
visual tambm pode ser beneficiado pelo audiovisual.
6.4 Contedo da ajuda por tela
Os vdeos de ajuda on-line que constituem apoio navegao so
exclusivos de cada tela e orientam o usurio, explorando as
Ajuda
49
funcionalidades da tela a que se referem. Alm disso, apresentam
elementos de interface, como cenrio, e exibem a dinmica da
navegao de acordo com o desenvolvimento da narrativa do locutor (no
caso de interface para analfabeto) e intrprete de Libras (no caso de
interface para deficiente auditivo).
A ajuda on-line associada aos elementos da interface e dinmica da
navegao facilita a memorizao dos passos de interao, e associa
esses elementos (botes e cones) tarefa que proposta pela pgina em
questo. Toda tela possui um audiovisual de ajuda on-line
correspondente, que exibido na rea para execuo da ajuda aps o
acionamento.
6.5 Contedo da contextualizao do
servio
Os vdeos com a viso geral dos servios, chamados de vdeos de
contextualizao, tm um carter tutorial e de motivao para o uso dos
servios. Concebido sob a forma de dilogo entre um usurio experiente
e um inexperiente (alm do intrprete de Libras na interface para
deficiente auditivo), o roteiro se baseia na explicao dos servios e das
funcionalidades da interface, apoiado nos elementos grficos que a
compem.
A viso geral dos servios no deve ser vinculada a uma pgina do
servio, podendo ser disparada automaticamente na primeira vez em que
o usurio acessar os servios ou acionada pelo usurio no momento do
login no servio. Por se tratar de uma explicao mais longa e que pode
ser ilustrada com fatos do dia a dia, o desenrolar de um dilogo sobre o
tema constitui o formato mais adequado. Como o dilogo tende a ser
mais dinmico e apresentar ganchos que levam aos diversos tpicos do
servio, ele tende a despertar maior interesse e prender a ateno com
mais eficincia. Nessa dramatizao, o usurio inexperiente se v
representado por um dos locutores, que levanta dvidas sobre o servio,
50
as quais so esclarecidas por um usurio experiente. Isso facilita o seu
envolvimento e entendimento do contexto dos servios.
6.6 Tooltips
Quando no possuem rtulos textuais associados, as figuras devem ter
um texto curto e explicativo no formato de tooltip, que exibido no
evento de mouse over.
Os tooltips podem ajudar o usurio inexperiente a interpretar o
significado de imagens usadas na tela. A Figura 23 ilustra um tooltip em
uso.

Figura 23 Tooltip em uso

7 Audiovisuais
Este captulo rene recomendaes sobre produo e aplicao de
vdeos na interface.
Os audiovisuais possuem formatos especficos correspondentes s
funes que desempenham: ajuda contextualizada da tela ou
mensagem/informao que o servio pretende passar para o usurio. Os
contedos recomendados para ajuda contextualizada esto apresentados
no Captulo 6.
Os chamados vdeos de contedo representam a carga informativa do
servio que deve ser passada ao usurio, possuem cenrio limpo e so
fortemente baseados na narrativa. Muitas vezes, sem elementos grficos
para facilitar a compreenso da mensagem, necessrio investir na
adequao lingustica da informao original para assegurar sua
compreenso.
Os audiovisuais so aplicveis s interfaces para os perfis de usurio
analfabeto e deficiente auditivo. Os vdeos da interface para deficientes
auditivos contam com intrprete de Libras.
7.1 Durao dos audiovisuais
A durao de um audiovisual de ajuda contextualizada depende das
funcionalidades que devem ser exploradas na tela a que esse audiovisual
se refere. Esse tipo de audiovisual uma ferramenta de apoio, e no
deve competir com a mensagem final ou com a tarefa proposta pelo
servio. A durao mxima recomendada para esse tipo de audiovisual
de 30 segundos, podendo ser disparado na mesma navegao sempre
que acionado pelo usurio.
Um audiovisual tutorial introdutrio com a viso geral dos servios deve
ter durao mxima de trs minutos, se explorar ludicamente as tarefas e
52
traar paralelos com a vida real, empregando estratgias para prender a
ateno do usurio.
Os vdeos de contedo devem durar em torno de um minuto.
Vdeos longos so mais suscetveis ao desinteresse do usurio, que pode
ter sua ateno facilmente desviada por estmulos externos. Alm disso,
podem descontextualizar e confundir o usurio.
7.2 Narrativa
A linguagem deve ser direta e coloquial, evitando termos tcnicos de
uso restrito a determinada rea de conhecimento, estruturas gramaticais
sofisticadas e discursos prolixos. Deve-se evitar informaes perifricas
e complementares que no sejam imprescindveis para a compreenso
da mensagem principal.
Informaes complementares disputam espao com a mensagem
principal que se deseja passar e confundem o usurio com o excesso de
dados a serem retidos.
7.3 rea do audiovisual
Os vdeos devem ser produzidos levando-se em considerao a rea
disponvel para a janela de audiovisual no layout da pgina. Definida a
rea, locutores e intrpretes vo compartilhar o espao com elementos
da interface que recebero efeitos de destaque de acordo com o
desenvolvimento do roteiro. Dessa forma, os locutores e intrpretes
devero ter seu posicionamento estabelecido de forma a no
comprometer a visualizao desses efeitos. Os elementos e efeitos
devero tambm ser escolhidos de forma a no ocupar espao de
locutores e intrpretes, mas ser perfeitamente visveis e facilmente
associados s respectivas pginas a que se referem.
Audiovisuais
53
Produes que no considerem as variveis mencionadas correm o risco
de apresentar como resultado final: locutores e intrpretes obstruindo a
viso dos elementos da interface, elementos de interface de tamanho
inadequado a uma boa compreenso dos efeitos, locutor de tamanho
inadequado para leitura labial ou intrprete de Libras com gestos amplos
e fora do audiovisual.
7.4 Vdeos inclusivos
Vdeos inclusivos compreendem as informaes acessveis a todos os
perfis que constituem o pblico-alvo. Os intrpretes devem ter tamanho
equivalente ao do locutor e apresentar legenda. Alm disso, deve ser
possvel ao usurio fazer a leitura labial do locutor.
Dessa forma, o deficiente auditivo tem condies para comparar a
mensagem obtida por meio da leitura labial com a da gestual. Isso
promove confiana em um intrprete desconhecido, alm de esclarecer
eventuais dvidas que um dos dois modos de expresso possa gerar. A
legenda um reforo ao entendimento da mensagem.
7.5 rea de texto
As janelas de audiovisual devem possuir uma rea de texto, contendo
uma explicao sucinta sobre a funcionalidade da pgina atual. O texto
deve ser apresentado de forma esttica, sem nenhum efeito de rolagem.
Com a mesma funo da legenda, a rea de texto refora o entendimento
da mensagem, alm de embutir a capacidade de agilizar o tempo de
navegao do usurio alfabetizado.
54
7.6 Locuo
A narrao oral deve ser preferencialmente espontnea, sem uso de um
texto pronto a ser lido em frente s cmeras. O locutor, no mximo,
lana mo de um teleprompter e dirige seu foco para o usurio.
A simples leitura de um texto escrito ineficiente para a comunicao
com o usurio-alvo do projeto, que tem dificuldade de assumir-se como
o sujeito indefinido tratado no texto lido. Esse usurio geralmente
procura compreender o mundo por meio de aproximaes com sua
realidade cotidiana e, para isso, o locutor deve dirigir-se diretamente a
ele, como em um dilogo frente a frente.
7.7 Legendas
Os vdeos de ajuda ou de contedo devem vir acompanhados de
legenda, que deve conter as transcries dos contedos falados no
audiovisual.
A legenda representa uma ferramenta para reforo no entendimento da
mensagem.
7.8 Controles do player
Os seguintes botes de controle devem ser mostrados de forma
centralizada em relao rea do audiovisual:
boto de pausa/play: quando o audiovisual estiver sendo tocado, a
funcionalidade dever ser de pausa; quando o audiovisual estiver em
pausa, a funcionalidade dever ser de play;
boto para parar a execuo (stop): fecha a janela de exibio do
audiovisual;
boto retorna: retorna o audiovisual ao comeo.
Audiovisuais
55
Os controles do player esto associados aos controles de DVD players e
VCRs, aparelhos frequentemente usados pela populao, e tendem a ser
mais facilmente identificados pelo usurio.

8 Recursos de acessibilidade
Este captulo trata das recomendaes acerca da acessibilidade, com
requisitos e sugestes de projeto e implementao para que todos os
perfis que constituem o pblico-alvo possam fazer uso da interface com
autonomia. So previstas integraes com ferramentas assistivas, tais
como leitores de tela, sntese de voz e intrpretes de Libras.
8.1 Controle de tamanho de fonte
O boto de controle de tamanho de fonte est na rea de ferramentas de
ajuda para auxiliar pessoas com baixa viso. Recomenda-se utilizar a
simbologia corrente em stios da Web que apresentam essa
funcionalidade.
A simbologia escolhida de uso corrente em stios que disponibilizam
esse recurso (Figura 24).
Embora essa simbologia no seja popular entre o pblico-alvo do STID,
inicialmente, seu aprendizado representa mais um passo no sentido de
promover autonomia no mundo Web.

Figura 24 Boto de controle de tamanho de fonte

58
8.2 Contraste de cores
Deve haver a possibilidade de aumentar o contraste das cores usadas nas
telas. Recomenda-se o uso das cores branco e preto.
A funcionalidade representada pela Figura 25 e pode auxiliar a
interao de usurios com determinados tipos de deficincia visual. O
acionamento desse recurso no portal do STID leva os servios
Previdncia Fcil e Inclua Sade a assumir a mesma aparncia, sendo
indistinguveis apenas por meio das cores caractersticas de cada um.
Entretanto, o uso do preto e do branco alivia a carga cromtica que pode
atrapalhar a compreenso em alguns casos de deficincia visual, no
acarreta o desconforto que uma possvel combinao letra/fundo pode
causar e no impede que os servios sejam identificados por meio dos
outros recursos assistivos que permanecem disponveis.

Figura 25 Boto de controle de contraste
8.3 Avatar Libras
Quando o perfil do usurio for o de deficiente auditivo, a interface deve
mostrar o equivalente textual em Libras, respeitando a gramtica e a
expresso facial do interlocutor exigidas pela lngua.
A Figura 26 ilustra o avatar utilizado nas interfaces do STID. Esse
avatar substitui a funo do udio da interface-padro. Adequado para o
usurio com autonomia em Libras, o avatar tambm representa reforo
no entendimento da lngua para o usurio deficiente auditivo que l em
portugus. Idealmente, esse avatar no deve recorrer soletrao, j que
as letras isoladas muitas vezes no fazem sentido para esse usurio, que
usualmente no alfabetizado em portugus. Entretanto, esse
procedimento adequado quando se tratar de nome prprio.
Recursos de acessibilidade
59

Figura 26 Avatar Libras
8.4 Controles do avatar
O avatar Libras deve oferecer opes para controle da velocidade da
representao, alm de opes para pausa e repetio.
Para usurios no fluentes em Libras, deve ser possvel reduzir a
velocidade de expresso do avatar, bem como repetir e pausar a
execuo para que sua compreenso seja mais efetiva.
8.5 Texto em portugus no avatar Libras
interessante que o avatar apresente, quando possvel, o texto
equivalente em portugus sincronizado com Libras.
Essa associao pode contribuir com o aprendizado de pessoas
alfabetizadas em portugus que esto aprendendo Libras, e vice-versa.
60
8.6 Navegao pela tecla Tab
Toda a navegao da interface deve ser possvel utilizando somente as
teclas Tab e Enter do teclado.
O deficiente visual que utiliza um leitor de telas-padro faz uso dessas
teclas para interagir.

9 Contedo em udio e em
Libras
Durante a interao, os usurios procuram interpretar as novas
experincias a partir de relaes de proximidade com seus cotidianos.
Para auxiliar nesse processo, principalmente para o usurio com baixo
letramento, o multimodalismo da interface um recurso essencial. O
presente captulo trata de contedos audveis que possuam relao com
os elementos da interface. Em interfaces para usurios surdos, as
informaes audveis devem ser substitudas por informaes expressas
em Libras.
As recomendaes a seguir dizem respeito tanto ao contedo audvel da
interface, produzido pelo sintetizador de voz, quanto s mensagens
gesticuladas pelo avatar Libras.
9.1 Equivalente textual em udio
Todo elemento de interface com um rtulo (botes, caixas de seleo,
links etc.) deve possuir um texto associado que deve ser verbalizado
com um clique sobre o texto.
No projeto STID foi utilizado o CPqD Texto Fala, produto que faz a
sntese do texto de maneira dinmica.
9.2 Equivalente textual em Libras
Todo elemento de interface com um rtulo associado (botes, caixas de
seleo, links etc.) deve possuir um texto associado a ser apresentado
62
em Libras, sob demanda, a cada evento de clique sobre o texto,
respeitando a gramtica dessa lngua.
No projeto STID foi utilizado um avatar animado, que faz a
interpretao do texto em Libras, como descrito no Captulo 8.
9.3 Atraso mximo para verbalizao
O atraso entre o evento de clique e o incio da verbalizao do texto
correspondente deve ser de, no mximo, um segundo.
Atrasos superiores podem descorrelacionar verbalizao e clique sobre o
texto.
9.4 Verbalizao no simultnea
No deve haver verbalizao simultnea de textos. A verbalizao
corrente deve ser interrompida caso se inicie uma nova.
Superposio de udio pode sugerir que o usurio cometeu algum erro
na navegao ou que o sistema apresentou alguma pane, diminuindo a
sua confiana nos servios.
9.5 Verbalizao para perfil de usurio
deficiente visual
Para o perfil de usurio deficiente visual, a verbalizao de rtulos deve
ser realizada pelo uso de um leitor de telas usual.
Para que o cego tenha autonomia no uso amplo da Web, importante
que ele seja familiarizado com a operao e a terminologia usada pelos
leitores de tela usuais.
Contedo em udio e em Libras
63
9.6 Verbalizao do ttulo da pgina
No momento em que uma nova pgina carregada, seu ttulo deve ser
verbalizado.
Essa prtica refora ao usurio que sua opo anterior foi bem-sucedida,
isto , que houve avano na continuidade da tarefa, resultando em
mudana de pgina.
9.7 Referncia dos udios a elementos
presentes nos cones
Os udios associados aos cones devem, sempre que possvel, fazer
referncia a elementos ou caractersticas facilmente identificveis nos
respectivos cones.
A proximidade entre o contedo e a realidade do usurio do servio
construda por meio da reiterao das estruturas da interface e do inter-
relacionamento de seus diversos modos, sejam eles grficos, textuais ou
sonoros.
O udio associado ao boto Marcar consulta pode mencionar o
elemento balco, que est presente no cone (Figura 27), enquanto o
udio associado ao boto Clnico geral faz referncia ao fato de o
mdico aparecer sentado (atrs de sua mesa), em contraposio s
demais opes naquela tela, nas quais os mdicos aparecem de p.
64

Figura 27 cone "Marcar consulta"

10 Elaborao de textos
As recomendaes contidas neste captulo dizem respeito aos aspectos
lingusticos da interface: qual a melhor maneira de se narrar um texto,
qual a melhor maneira de se redigir um texto em termos de estrutura
sinttica e escolha lexical (do vocabulrio), qual deve ser o tamanho das
frases a serem exibidas/narradas etc.
10.1 Texto do roteiro dos vdeos
Os roteiros devem contemplar explicaes orais (no leitura em voz alta
de textos escritos) e a informao verbal escrita deve ser apresentada de
forma sinttica, j que o usurio tem dificuldade de leitura.
O uso de textos longos e que no sejam orais contribui para a rpida
distrao do usurio e a deficiente absoro das informaes passadas
pelo contedo.
Exemplo de roteiro adequado utilizado na pgina inicial do STID:
Aqui voc pode usar os servios de sade e aposentadoria
que construmos para voc!
Sempre que voc quiser ouvir o que est escrito ou ter o
equivalente em Libras, clique nas palavras de cada boto.
Para usar o servio de sade, clique na figura do boto
INCLUA SADE.
Para usar o servio de aposentadoria, clique na figura do
boto PREVIDNCIA FCIL.
66
10.2 Textos curtos
Os textos produzidos em qualquer modalidade devem ser curtos e
objetivos.
Os usurios com baixo letramento fazem uma leitura fragmentada, que
consiste em preencher lacunas da informao textual com o
conhecimento prvio do usurio, esteja este de acordo ou no com as
informaes veiculadas pelo texto.
Dado que o usurio pode recorrer a essa estratgia, constata-se a
inutilidade de se escrever pargrafos longos e complexos, com uso de
muitas oraes subordinadas que no sero lidas. Como consequncia,
textos complexos podero ocasionar apagamentos mais extensos e
lacunas que favorecem o uso indevido de conhecimento prvio por parte
do usurio, comprometendo todo o processo de comunicao.
Alm disso, recomenda-se que os textos de servios voltados ao cidado
sejam reescritos com menos nominalizao (caracterstica natural de
textos escritos, com poucos verbos e ricos em substantivos abstratos e
que no denotam ao). Ou seja, o texto ideal deve ter menos adjetivos,
substantivos e preposies e mais estruturas verbais e pronominais.
Exemplo de um texto inadequado: O acesso ao servio INCLUA
SADE se d pelo clique sobre o boto com desenho de um posto de
sade. J o texto adequado seria: Clique no desenho do posto de
sade para entrar no servio de sade.
10.3 Gnero narrativa
O gnero textual recomendado para as tarefas o da narrativa, isto , o
de um tema que se desenvolve necessariamente para um desfecho, em
que elementos acessrios podem participar, desde que colaborem, de
algum modo, para esse mesmo desfecho.
Esse foco em narrativa delimita em grande parte o processo criativo do
stio, orientando-o mais tarefa do que pureza do design ou ao carter
Elaborao de textos
67
de divulgao e marketing do rgo governamental envolvido, como
ocorre no momento. O predomnio do campo semntico da tarefa sobre
os demais, inclusive sobre o prprio campo semntico dos ambientes de
programao e o campo semntico autorreferente das instituies, se
estabelece para viabilizar a legibilidade do stio para o pblico-alvo
previsto.
Exemplo de um texto adequado: "Ol!!! Posso te mostrar um jeito de
marcar consulta com um mdico no postinho, mas sem ter que ir at o
postinho?.
10.4 Eixo semntico das tarefas
Qualquer elemento de tela relacionado a uma tarefa (imagem, texto,
desenho, foto ou audiovisual) deve conduzir ao tema central dessa
tarefa. Do mesmo modo, os demais elementos relacionados devem
reforar esse tema.
Uma das vantagens da construo hipertextual oferecer opes de
escolha e caminhos de leitura. A suposio que o leitor possui
habilidades suficientes para navegar e obter o que desejar da pgina.
Entretanto, h duas diferenas que no permitem uma abordagem
multimodal livre, na concepo de interfaces que tenham como pblico-
alvo pessoas com baixo letramento textual e digital. Primeiramente,
pode ser que os servios a serem oferecidos pela interface concebida
tenham finalidades especficas, ou seja, apresentem contedos com
intenes prprias e objetivos definidos quanto a usurios, diferindo,
por exemplo, de um ambiente de entretenimento ou simples oferta de
informao. De outra parte, os usurios com baixo letramento no
possuem a autonomia para construir livremente seus percursos dentro da
esfera de servios que essa interface se prope a facilitar. O encontro
dessas duas caractersticas determina que a proximidade e a
familiaridade, ao serem construdas, devem se basear num eixo
semntico que o da tarefa a ser realizada, no qual um determinado
elemento de tela, seja ele imagem, texto, desenho, foto ou audiovisual,
conduza ao tema central da tarefa, enquanto os demais elementos
relacionados reiteram esse tema, evitando a disperso do usurio em
68
percursos que no o auxiliam a obter o resultado esperado de sua
interao.
10.5 Rtulos
Todo boto de ao deve ser representado por um verbo no infinitivo.
O boto que indica a volta da pgina atual para a anterior deve conter o
texto VOLTAR e no VOLTA ou ANTERIOR.
10.6 Ttulo da pgina
Os textos contidos na rea de ttulo devem induzir o usurio s aes
que podem ser realizadas na tela em questo, devendo ser representados
por um verbo no presente do indicativo.
10.7 Tooltip
O texto de um tooltip deve explicar, por meio de um verbo no infinitivo,
a ao associada ao link ao qual a etiqueta pertence. O texto no deve se
ater definio do link.
Em um sistema de sade que permita que o usurio marque uma
consulta com um mdico, ao apresentar as opes de especialidades
mdicas por meio de links, a etiqueta suspensa associada ao link de uma
dada especialidade deve explicar a ao resultante do clique no link, e
no a especialidade em si. Portanto, um texto adequado seria, por
exemplo, marcar com cardiologista e no cardiologista.
10.8 Texto da janela de ajuda
O texto da janela de ajuda, que no corresponde legenda, exibido
fora do vdeo. O contedo do texto da janela de ajuda deve ser um
Elaborao de textos
69
resumo, em linguagem inteligvel ao usurio-alvo, do contedo falado
no audiovisual de ajuda.
As recomendaes a seguir dizem respeito tanto ao contedo audvel da
interface, produzido pelo sintetizador de voz, quanto s mensagens
gesticuladas pelo avatar Libras.
Para um usurio alfabetizado ou que j tenha alguma noo do servio,
o texto da janela de ajuda funciona como um lembrete da funcionalidade
da pgina. Esse texto resumido agiliza a navegao e,
consequentemente, ajuda a aumentar a autoconfiana do usurio.
10.9 Eixo semntico das TICs
Palavras restritas ao eixo semntico das TICs, tais como imprimir,
clicar, mouse etc., podem ser usadas com moderao.
Apesar de tais termos no fazerem parte do vocabulrio cotidiano do
pblico-alvo, existe interesse das pessoas em se apropriar deles,
reforando a sensao de estarem includas digitalmente.
10.10 Recursos multimodais
Os recursos multimodais devem reiterar o eixo central da tarefa que est
em curso.
Os usurios lanam mo de imagens e informao verbal escrita para se
orientar na realizao de tarefas. E os recursos multimodais (imagem,
texto, desenho, audiovisual) devem ter a preocupao de reiterar o eixo
central da tarefa a ser realizada.
70
10.11 Consistncia, redundncia e reiterao
Os elementos de interao que compem a interface do usurio devem
ser empregados de forma consistente, unvoca, redundante e reiterada,
mantendo-se as mesmas expresses quando botes, menus, cones e
textos tm o mesmo sentido/funo.
H usabilidade quando se incrementa a redundncia com o uso
conjugado de cones, imagens (estticas e dinmicas) e palavras (orais e
escritas). A redundncia facilita a memorizao, e constitui, juntamente
com a reiterao, estratgia de ensino da tecnologia oral. Para ser
funcional no sentido de ensino, a redundncia deve se relacionar
consistncia, de modo que preciso propor um repertrio consistente de
cones e palavras simples, sendo a consistncia definida por:
reconhecimento do cone dentro do campo semntico da interao;
reconhecimento da palavra dentro do campo semntico da interao;
univocidade do cone dentro de todo o contexto de interao;
coeso semntica entre cone e palavra;
permanncia de cones e palavras na aplicao.
As estratgias de redundncia e reiterao conduzem familiaridade
com o ambiente, ou seja, se algo principia pelo conhecido, estabelece
um vnculo de proximidade. O uso de palavras associadas a smbolos,
imagens e cones, de modo sinttico e unvoco, permite a construo de
uma suposio que conduz o usurio.
Exemplo: as opes de menu so compostas por um cone ou uma
imagem unvocos (consistncia). Pode-se compreender qual a funo
da opo em questo por meio da leitura do texto escrito na opo, do
cone/imagem associados ou atravs da autoexplicao dada ao usurio
em portugus oral ou em Libras (redundncia). Alm disso, o usurio
pode acionar e ouvir quantas vezes quiser a referida autoexplicao
(bem como ler e reler as imagens/cones e os textos (reiterao).
Os alertas fornecidos pelo sistema (como gravar dados ou configuraes
antes de fechar aplicativos) exemplificam problemas de consistncia e
tendem a ser problemticos. Isso indica que, quando um cone (como o
Elaborao de textos
71
caso do X) usado para representar diferentes funes no caso, sair
da pgina atual e voltar para a pgina anterior , ele pode desnortear o
processo de navegao do usurio. A noo de fechar abas, j
naturalizada nas prticas de letramento digital, um conceito tcnico
no assimilado para sujeitos pouco ou no familiarizados com o
computador.
10.12 Silogismo e sincretismos com
combinao de informaes e
conhecimento prvio
Os textos de contedos universais devem ter proximidade de quem os l.
A proximidade importante porque o usurio tende a confrontar o
enunciado universal com sua experincia prvia.
Em vez de enunciar: "Todo trabalhador que chega aos 65 anos tem
direito de requerer a aposentadoria, possvel enunciar: "Se voc j
tem 65 anos, veja aqui como receber sua aposentadoria. Esse segundo
enunciado anlogo ao primeiro, mas consegue levar o contedo
universal a uma proximidade maior de quem o l.
10.13 Textos curtos e palavras pequenas
Os textos de servio devem ser escritos com frases e palavras mais
curtas, o que exigir a adoo das palavras mais frequentes da lngua em
vez de termos tcnicos e frases com menos subordinao, coordenao,
encaixamentos etc.
A combinao de frases e palavras menores implicaria mudanas
substanciais, pois as palavras menores (mais usuais e corriqueiras)
seriam usadas para criar frases mais curtas, o que resultaria em frases
ainda mais simples.
72
Exemplo de um texto inadequado: Para ter acesso ao servio de
previdncia chamado PREVIDNCIA FCIL, pressione o boto com
desenho do posto da Previdncia Social. O mesmo texto escrito de
maneira adequada: Clique no desenho do posto da previdncia social,
para acessar o servio de aposentadoria.
10.14 Abordagem direta ao cidado
importante produzir textos com menos assuntos relacionados
gerncia dos servios e mais tpicos relacionados diretamente ao
interesse da populao. Para isso, importante observar as seguintes
recomendaes:
fazer referncia direta aos usurios, usando pronomes pessoais (por
exemplo, voc);
empregar menos siglas;
evitar termos tcnicos;
evitar nominalizaes;
evitar referncias em demasia ao prprio servio ou a entidades
responsveis por sua realizao;
evitar referncias em demasia estrutura interna das secretarias e
entidades prestadoras desses servios;
evitar a utilizao de palavras que pressuponham uma projeo de
papis por parte do usurio (como usurio, trabalhador, portador);
utilizar, na medida do possvel, o correspondente popular em
substituio aos termos tcnicos aplicveis ao escopo dos servios;
preocupar-se com a sequncia das informaes para o leitor e a
clareza dos procedimentos colocados;
evitar palavras que sejam exclusivamente tpicas da linguagem
formal ou tcnica, preferindo as utilizadas pelo pblico-alvo. Quando
no houver equivalncia direta de palavras, utilizar a parfrase,
dando preferncia ao vocabulrio oral e cotidiano utilizado pelo
pblico-alvo.
Elaborao de textos
73
Apresentam-se aqui exemplos de conjuntos de palavras identificadas no
contexto dos servios de previdncia e sade do STID e que fazem parte
da circulao oral do pblico-alvo. A pesquisa teve base na disciplina de
Lingustica de Corpus e, para facilitar a escolha do vocabulrio
adequado para as interfaces digitais, optou-se por classificar os
conjuntos de palavras que so consideradas adequadas, parcialmente
adequadas e inadequadas para o pblico com baixo letramento.
Por serem palavras obrigatrias, as diferentes classes gramaticais, tais
como preposio, artigo, pronome e conjuno, podem representar uma
grande parcela do vocabulrio adequado, dependendo do tamanho do
corpus em questo. J o vocabulrio potencialmente adequado
constitudo no apenas por palavras relacionadas ao cotidiano (ex.:
abacaxi, aplauso e caadores), mas tambm por palavras tpicas da
linguagem escrita (ex.: apesar e embora). As palavras classificadas
como parcialmente adequadas devem ser usadas quando no houver
sinnimo mais simples/comum.
Um vocabulrio com grande profuso de termos tcnicos (abortamento
e abscesso) e nomes de rgos/departamentos que fazem parte da
estrutura de servios (ex.: DATASUS e CES) considerado inadequado
ao pblico-alvo. Essas categorias de palavras no contexto dos servios
do STID esto ilustradas na tabela a seguir.
Tabela 1 Exemplos de palavras consideradas adequadas, parcialmente
adequadas e inadequadas ao pblico-alvo
Adequadas
Parcialmente
adequadas
Inadequadas
DEPOIMENTO
DIA
DIREITO
FAMLIA
HOMEM
HORA
IDADE
J
MDICO
ACIDENTE
AGRAVAMENTO
ASSEGURAR
ATENO
ATENDIMENTO
ATIVIDADES
BSICAS
BENEFCIO
CAMPO
ABSORCO
ADOANTE
ANTIOFDICO
BRNQUIO
CALORIA
CITOLOGIA
CUSTO-BENEFCIO
DESMARCAR
IMUNODEFICINCIA
74
Adequadas
Parcialmente
adequadas
Inadequadas
NO
NASCIMENTO
OUTRO
PEDIR
PESSOA
REMDIO
TRABALHAR
TRABALHO
VOC
VOLTAR
CASOS
COMPROVAR
CONSULTA
CONTRIBUIO
DEPENDENTES
ENFERMIDADE
ESPECIALIDADE
MARCAR
UNIDADES
URBANOS
VALOR
VERIFICAR
INCAPACITADOS
INUTILIZADOS
LABORAL
OFTALMOLOGISTA
PECUNIRIO
PEDIATRIA
PREVIDNCIA
RETROSPECTIVO
RETROVIRAIS
SANITRIO
SOBREDOSE

11 cones
As recomendaes aqui sintetizadas em relao ao uso de cones na
interface dos servios do projeto STID resultaram de um estudo mais
extenso, conforme descrito em vila e Gudwin (2009). Esse estudo
surgiu da necessidade de investigar o possvel uso de cones como
facilitadores/habilitadores da interao de usurios iletrados em
interfaces computacionais. Essa facilitao se refere no somente ao uso
de cones para transmitir ideias e informaes, mas tambm s situaes
de interao entre cones e smbolos, isto , de uso concomitante de
textos (simplificados) e cones (na forma de imagens de apoio). O
estudo incluiu a reviso da bibliografia existente sobre criao de cones
e seu uso em interfaces computacionais, e contou tambm com trs
ensaios de campo realizados com usurios representativos do pblico-
alvo do STID, em diferentes localidades do Pas. As diretrizes
enumeradas abaixo tm validade para o uso de cones nos mais diversos
contextos de interface, mas se aplicam, particularmente, no mbito do
projeto STID, a servios de governo eletrnico das reas de sade e
previdncia.
11.1 Consistncia dos cones na interface
Todo cone deve ser usado de forma consistente ao longo de toda a
interface, sempre associado a um mesmo tema, conceito ou ao.
O cone usado para o tema Clnico geral (Figura 28) no deve ser
reaproveitado para outras especialidades mdicas na mesma ou em outra
tela da interface do servio de sade.
76

Figura 28: cone Clnico geral
11.2 Diferenciao dos cones
Todo cone deve ser diferente o bastante dos demais cones em uma
dada tela, de forma a minimizar as confuses. Entretanto, todos eles
devem compartilhar um mesmo estilo, para evitar descontinuidades
estticas.
O idoso ilustrado no cone Cardiologista calvo; j o idoso que
aparece observando o calendrio no cone Consultas que j marquei
possui um volume mdio de cabelos. Ou seja, esses dois personagens
representam um mesmo tipo de pblico, mas so esteticamente
diferentes e possuem caractersticas fsicas particulares para facilitar a
diferenciao.
11.3 Tamanho dos cones
Os cones devem ser grandes o bastante para que o tema representado
seja visvel na interface e de fcil acesso por meio da tela de toque. O
tamanho recomendado a partir de 180 x 180 pixels.
cones
77
No caso das interfaces do STID, foi estabelecida uma diretriz segundo a
qual o nmero de opes de navegao se limita a quatro botes de
opo e, se necessrio, setas de avano ou recuo. Isso assegura espao
suficiente para os cones grandes e reduz o risco de um usurio clicar na
tela e, sem perceber, acessar uma opo diferente da desejada, por conta
da proximidade das opes de navegao.
11.4 Grau de representatividade dos cones
Os temas nos quais se baseiam as imagens dos cones devem, sempre
que possvel, recorrer a elementos concretos do cotidiano do pblico-
alvo e ser estatisticamente consistentes com as experincias de vida da
maioria dos usurios.
Por exemplo, para o tema Aposentadoria, recomendvel uma figura
de um idoso (Figura 29), ainda que haja alguns casos de aposentados
no idosos, enquanto o tema Pediatra (Figura 30) tende a ser mais
eficaz se representado por um personagem do sexo feminino (visto que
entre os usurios pesquisados esse foi considerado o caso mais
frequente).

Figura 29 cone Aposentadoria
78

Figura 30 cone Pediatra
11.5 Elementos representativos
Os cones devem utilizar elementos que tenham sido sugeridos ou
mencionados recorrentemente por usurios representantes do pblico-
alvo.
Foram conduzidas dinmicas de design participativo para identificao
de elementos representativos, como, por exemplo, o uso da cruz
vermelha nos cones de sade, o uso do estetoscpio nas especialidades
mdicas e a imagem da bengala em cones referentes aposentadoria
(sobretudo por idade).
11.6 Interao dos cones com outros
elementos
Para atender ao requisito de redundncia de informaes, tendo em vista
a necessidade de tirar proveito das diferentes habilidades do pblico-
alvo, os cones devem estar associados a, e apoiados por, rtulos e sons
que reforcem o conceito ou a ao que o cone se prope a veicular.
cones
79
Na pgina inicial da aplicao, se o usurio no entender o significado
dos cones, ele pode ouvir um udio que descreva a funcionalidade do
cone. Esse udio deve ter curta durao para que o usurio no desvie a
ateno.
11.7 cones pictricos e fotogrficos
cones baseados em desenhos so mais indicados nas referncias a
conceitos gerais, como pediatra ou remdio, enquanto cones baseados
em fotos so mais apropriados para indicar casos particulares ou
individualizados, como, por exemplo, pediatra Dr. Fbio, um certo tipo
de medicamento ou um determinado posto de sade.
11.8 Tipos fsicos representados nos cones
Os tipos fsicos representados nos desenhos dos cones devem refletir,
tanto quanto possvel, os casos mais frequentes no universo de vivncia
do pblico-alvo.
Se no Brasil a grande maioria dos mdicos cardiologistas formada por
homens brancos e de meia idade, um cone que reflita essa tendncia
(Figura 31) torna a identificao mais eficaz. Conforme foi observado
em nossos ensaios de campo.
80

Figura 31 cone "Cardiologista"
11.9 Redundncia
Os cones devem ser usados em conjunto com textos, de maneira a criar
uma redundncia de conceitos.
Os resultados obtidos em campo mostraram tambm que o uso de cones
pode reforar e complementar as habilidades de leitura das pessoas com
baixo letramento. O efeito combinado de cones e textos pode ser maior
do que a soma dos efeitos isolados de cada uma dessas categorias de
signos.
Essas orientaes so corroboradas por outro estudo empreendido no
mbito do projeto STID e que, a partir de uma outra abordagem,
tambm constatou
[...] que h maior eficincia de usabilidade quando se incrementa a
redundncia pelo uso conjugado de cones, imagens e palavras. A
redundncia facilita a memorizao, e se constitui, juntamente com
a reiterao, na estratgia de ensino da tecnologia oral. Para ser
funcional no sentido de ensino, a redundncia deve se relacionar
consistncia, de modo que preciso propor um repertrio
cones
81
consistente de cones e palavras simples, sendo a consistncia
definida por:
reconhecimento do cone dentro do campo semntico da interao;
reconhecimento da palavra dentro do campo semntico da interao;
univocidade do cone dentro de todo o contexto de interao;
coeso semntica entre cone e palavra;
permanncia de cones e palavras na aplicao. (VILA; COSTA, 2008)

Concluses
O processo de construo do modelo de interao contou com resultados
de pesquisa de uma parceria firmada entre a Fundao CPqD e trs
grupos acadmicos ligados Unicamp e USP (OSORIO; SCHMIDT;
DUARTE, 2008).
Entre outros resultados, foram identificadas particularidades e
necessidades do pblico-alvo na interao com as TICs e foram tambm
coletadas informaes para a construo de cones, modelos de
navegao, projeto da interface e vocabulrio.
O resultado desse trabalho, em paralelo com outras oficinas conduzidas
pelo CPqD, culminou no desenvolvimento de provas de conceito de dois
servios de governo eletrnico um de marcao de consultas em
postos de sade (Inclua Sade) e um de informaes sobre
aposentadoria (Previdncia Fcil).
Esses servios foram implantados em dois telecentros localizados nas
cidades paulistas de Santo Antnio de Posse e Bastos. Nesses locais, a
usabilidade, a acessibilidade e a inteligibilidade das solues foram
testadas junto a representantes do pblico-alvo, resultando em
constantes aperfeioamentos do modelo de interao.
Resultados qualitativos das avaliaes dessas interfaces em campo
apontam para direes promissoras em relao ao uso e apropriao de
servios inclusivos de governo eletrnico. O principal retorno
manifestado pelo aumento da autoestima dos usurios, que nunca se
imaginaram como usurios de uma tecnologia de informao, e pelo
interesse dessas pessoas em expandir a sua experincia e seu
aprendizado em outros contextos, ou seja, o projeto cumpre o objetivo
de ser uma porta de entrada do cidado para a sociedade informacional.
Apesar de o modelo de interao estar diretamente relacionado s
especificidades e aos propsitos do projeto STID, espera-se que ele seja
portado para outros projetos de interface com objetivos similares, seja
84
na Web ou em outras mdias, como a TV interativa, propiciando novas
formas de alcanar a incluso digital de deficientes sensoriais e de
pessoas com baixo letramento, beneficiando esses indivduos e,
consequentemente, a sociedade brasileira.

Referncias
VILA, I. et al. Interaction Models for Digital Inclusion of Low-
literacy, Aged and Impaired Users in Brazil. In: WORKSHOP ON
PERSPECTIVES, CHALLENGES AND OPPORTUNITIES FOR
HUMAN-COMPUTER INTERACTION IN LATIN AMERICA
(CLIHC 2007). Proceedings Rio de Janeiro: CLIHC, 2007.
VILA, I. et al. Personas como facilitadoras da interao com servios
de governo eletrnico. In: LATIN-AMERICAN CONFERENCE ON
HUMAN-COMPUTER INTERACTION (CLIHC), 2009. Extended
Proceedings Mrida: CLIHC, 2009.
VILA, I.; COSTA, R. Ensaios de cones. Projeto STID,
PD.30.12.36A.0008A/RT-06-AA. CPqD-FUNTTEL, 2008 (relatrio
interno).
VILA, I.; GUDWIN, R. Icons as helpers in the interaction of illiterate
users with computers. IADIS INTERNATIONAL CONFERENCE
INTERFACES AND HUMAN COMPUTER INTERACTION 2009,
2009, Carvoeiro. Proceedings ... Lisboa: IADIS, 2009.
VILA, I.; HOLANDA, G. Incluso digital no Brasil: uma perspectiva
sociotcnica. In: SOUTO, A.; DALL'ANTONIA, J.; HOLANDA, G.
(Org.). As cidades digitais no mapa do Brasil: uma rota para a
incluso social. Braslia: Ministrio das Comunicaes, 2006. v. 1,
p. 13-60.
VILA, I.; OGUSHI, C.; BONADIA, G. Modelagem de Uso. Projeto
STID. CPqD-FUNTTEL, 2006 (relatrio). Disponvel em
www.cpqd.com.br/component/docman/doc_download/22-modelagem-
de-uso-stid.html. Acesso em: 11 jan. 2010.
FILGUEIRAS L. et al. Personas para caracterizao da experincia de
uso de tecnologia pela populao digitalmente excluda. In: MELO A.
M et al. (Org.). Usabilidade, Acessibilidade e Inteligibilidade
86
Aplicadas em Interfaces para Analfabetos, Idosos e Pessoas com
Deficincia: Resultados do Workshop. Campinas: CPqD, 2009, 71 p.
Disponvel em:
http://www.cpqd.com.br/file.upload/1749021822/resultados_workshop_
uai.pdf. Acesso em: 11 jan. 2010.
HAYASHI, E. et al. Avaliando a qualidade afetiva de sistemas
computacionais interativos no cenrio brasileiro. In: MELO A. M et al.
(Org.). Usabilidade, Acessibilidade e Inteligibilidade Aplicadas em
Interfaces para Analfabetos, Idosos e Pessoas com Deficincia:
Resultados do Workshop. Campinas: CPqD, 2009, 71 p. Disponvel em:
INSTITUTO PAULO MONTENEGRO. 6 Indicador Nacional de
Analfabetismo Funcional, 2007. Disponvel em:
http://www.ipm.org.br. Acesso em: 11 jan. 2010.
INTERNATIONAL ORGANIZATION FOR STANDARDIZATION.
ISO 9241-400:2007 Ergonomics of human system interaction Part
400: principles and requirements for physical input devices, 2007.
Disponvel em: http://www.iso.org.
MARQUES, M. et al. Especificao Funcional: Servio de Sade para
Agendamento de Consulta, Atendimento e Acompanhamento de
Tratamento Acessa Sade. Projeto STID. CPqD-FUNTTEL, 2007
(relatrio interno).
MELO, A. et al. Usabilidade, Acessibilidade e Inteligibilidade
Aplicadas em Interfaces para Analfabetos, Idosos e Pessoas com
Deficincia: Resultados do Workshop. Campinas: CPqD, 2009. 71 p.
Disponvel em:
OSORIO, A.; SCHMIDT, C.; DUARTE, R. Parceria Universidade-
Empresa para Incluso Digital. In: VIII SIMPSIO SOBRE FATORES
HUMANOS EM SISTEMAS COMPUTACIONAIS, 8., 2008. Anais...
IHC, 2008.
PATACA, D. et al. An e-gov service for retirement applying by illiterate
and disabled people. In: WORKSHOP ON DESIGN & EVALUATION
Referncias
87
OF E-GOVERNMENT APPLICATIONS AND SERVICES.
Proceedings Rio de Janeiro, 2007.
PICCOLO, L. et al. Consolidao dos resultados dos grupos de
pesquisa de novas linguagens e modelos de interao. Projeto STID.
interno).
PICCOLO, L. et al. Construo de um modelo de interao para
servios de governo eletrnico promovendo incluso digital. In:
INTERACTION SOUTH AMERICA 2009. Anais
TAMBASCIA, C.; DALL'ANTONIA, J. Um panorama de experincias
no Brasil. In: tila A. Souto; Juliano C. Dall'Antonia; Giovanni M. de
Holanda. (Org.). As cidades digitais no mapa do Brasil: uma rota para
a incluso social. Braslia: Ministrio das Comunicaes, 2006. v. 1.
p. 83-109.
TAMBASCIA, C. Resultado dos testes em campo. Projeto STID.
interno).

WWW.cpqd.com.br
Rodov|a Camp|uas-Nog|-N|||m
(SP-84O) - |m 118,5 - CEP 18O8G-9O2
Camp|uas - SP - B|as||

Cartilha Stid

Enviado por

Dados do documento

Título original

Direitos autorais

Formatos disponíveis

Compartilhar este documento

Compartilhar ou incorporar documento

Opções de compartilhamento

Você considera este documento útil?

Este conteúdo é inapropriado?

Direitos autorais:

Formatos disponíveis

Cartilha Stid

Enviado por

Direitos autorais:

Formatos disponíveis

modelo de

Você também pode gostar