Buscar

IconesnoDesign-Melo-2019

Faça como milhares de estudantes: teste grátis o Passei Direto

Esse e outros conteúdos desbloqueados

16 milhões de materiais de várias disciplinas

Impressão de materiais

Agora você pode testar o

Passei Direto grátis

Você também pode ser Premium ajudando estudantes

Faça como milhares de estudantes: teste grátis o Passei Direto

Esse e outros conteúdos desbloqueados

16 milhões de materiais de várias disciplinas

Impressão de materiais

Agora você pode testar o

Passei Direto grátis

Você também pode ser Premium ajudando estudantes

Faça como milhares de estudantes: teste grátis o Passei Direto

Esse e outros conteúdos desbloqueados

16 milhões de materiais de várias disciplinas

Impressão de materiais

Agora você pode testar o

Passei Direto grátis

Você também pode ser Premium ajudando estudantes
Você viu 3, do total de 56 páginas

Faça como milhares de estudantes: teste grátis o Passei Direto

Esse e outros conteúdos desbloqueados

16 milhões de materiais de várias disciplinas

Impressão de materiais

Agora você pode testar o

Passei Direto grátis

Você também pode ser Premium ajudando estudantes

Faça como milhares de estudantes: teste grátis o Passei Direto

Esse e outros conteúdos desbloqueados

16 milhões de materiais de várias disciplinas

Impressão de materiais

Agora você pode testar o

Passei Direto grátis

Você também pode ser Premium ajudando estudantes

Faça como milhares de estudantes: teste grátis o Passei Direto

Esse e outros conteúdos desbloqueados

16 milhões de materiais de várias disciplinas

Impressão de materiais

Agora você pode testar o

Passei Direto grátis

Você também pode ser Premium ajudando estudantes
Você viu 6, do total de 56 páginas

Faça como milhares de estudantes: teste grátis o Passei Direto

Esse e outros conteúdos desbloqueados

16 milhões de materiais de várias disciplinas

Impressão de materiais

Agora você pode testar o

Passei Direto grátis

Você também pode ser Premium ajudando estudantes

Faça como milhares de estudantes: teste grátis o Passei Direto

Esse e outros conteúdos desbloqueados

16 milhões de materiais de várias disciplinas

Impressão de materiais

Agora você pode testar o

Passei Direto grátis

Você também pode ser Premium ajudando estudantes

Faça como milhares de estudantes: teste grátis o Passei Direto

Esse e outros conteúdos desbloqueados

16 milhões de materiais de várias disciplinas

Impressão de materiais

Agora você pode testar o

Passei Direto grátis

Você também pode ser Premium ajudando estudantes
Você viu 9, do total de 56 páginas

Faça como milhares de estudantes: teste grátis o Passei Direto

Esse e outros conteúdos desbloqueados

16 milhões de materiais de várias disciplinas

Impressão de materiais

Agora você pode testar o

Passei Direto grátis

Você também pode ser Premium ajudando estudantes

Prévia do material em texto

UNIVERSIDADE FEDERAL DO RIO GRANDE DO NORTE 
CENTRO DE CIÊNCIAS HUMANAS, LETRAS E ARTES 
DEPARTAMENTO DE COMUNICAÇÃO SOCIAL 
 
 
 
ERILDO VITOR MEDEIROS MELO 
 
 
 
 
 
 
ÍCONES NO DESIGN DE INTERFACES 
USER EXPERIENCE E ACESSIBILIDADE DIGITAL. 
 
 
 
 
 
 
 
 
 
 
 
NATAL/RN 
2019 
 
 
ERILDO VITOR MEDEIROS MELO 
 
 
 
 
 
 
ÍCONES NO DESIGN DE INTERFACES 
USER EXPERIENCE E ACESSIBILIDADE DIGITAL. 
 
 
 
 
 
Monografia apresentada ao curso de Comunicação 
Social com habilitação em Publicidade e Propaganda 
da Universidade Federal do Rio Grande do Norte como 
requisito obrigatório para obtenção de título de 
bacharel em Publicidade e Propaganda. 
 
Orientador: Prof. Dr. Luiz Fernando Dal Pian Nobre 
 
 
 
 
 
 
 
 
 
 
 
NATAL/RN 
2019 
 
 
 
 Universidade Federal do Rio Grande do Norte - UFRN 
Sistema de Bibliotecas - SISBI 
Catalogação de Publicação na Fonte. UFRN - Biblioteca Central Zila Mamede 
 
 Melo, Erildo Vitor Medeiros. 
 Ícones no design de interfaces: user experience e acessibilidade 
digital / Erildo Vitor Medeiros Melo. - 2019. 
 55 f.: il. 
 
 Monografia (graduação) - Universidade Federal do Rio Grande do 
Norte, Centro de Ciências Humanas, Letras e Artes, Curso de 
Comunicação Social - Publicidade e Propaganda, Natal, RN, 2019. 
 Orientador: Prof. Dr. Luiz Fernando Dal Pian Nobre. 
 
 
 1. Ícones - Monografia. 2. Acessibilidade - Monografia. 3. 
Experiência do usuário - Monografia. 4. Semiótica - Monografia. 5. 
Design - Monografia. I. Nobre, Luiz Fernando Dal Pian. II. Título. 
 
RN/UF/BCZM CDU 004.92 
 
 
 
 
 
Elaborado por Ana Cristina Cavalcanti Tinôco - CRB-15/262 
 
 
 
 
 
ERILDO VITOR MEDEIROS MELO 
 
 
ÍCONES NO DESIGN DE INTERFACES 
USER EXPERIENCE E ACESSIBILIDADE DIGITAL. 
 
 
Monografia apresentada ao curso de Comunicação 
Social com habilitação em Publicidade e Propaganda 
da Universidade Federal do Rio Grande do Norte como 
requisito obrigatório para obtenção de título de 
bacharel em Publicidade e Propaganda. 
 
 
Aprovada em: __/__/____ 
 
 
___________________________________ 
Prof. Dr. Luiz Fernando Dal Pian Nobre 
Universidade Federal do Rio Grande do Norte 
Orientador 
 
____________________________________ 
Prof. Ms. John Willian Lopes 
Universidade Federal do Rio Grande do Norte 
Membro interno 
 
____________________________________ 
Josenildo Soares Bezerra 
Universidade Federal do Rio Grande do Norte 
Membro interno 
 
 
AGRADECIMENTOS 
 
 
 A minha família, Erildo, Ana, Bia e Vovó Menininha, por todo o apoio e incentivo 
dado durante essa jornada da graduação, ainda mais nos momentos de estresse e 
frustrações, por me ensinarem a ser persistente e não desistir dos meus objetivos. 
 A Bruna Corina, por todo o suporte, incentivo e força, especialmente nos 
momentos finais da graduação, que me fez acreditar em mim e seguir meu caminho 
sempre, independente das dificuldades. 
Ao meu primo Rafael, por ter me apresentado ao curso de Publicidade e ter sido 
como um mentor nessa e em outras caminhadas, servindo como um baú de referências 
e influências. 
Ao meu tio Renato, por sempre ter me incentivado a inovar, buscar novos 
conhecimentos e despertar a curiosidade que culminou neste estudo, que me abriu 
novos horizontes tanto no âmbito pessoal quanto profissional. 
A todos os professores que eu tive na UFRN, principalmente ao professor Dal 
Pian, por todo o apoio, incentivo, confiança e, obviamente, por toda a contribuição junto 
a mim neste trabalho. 
A Rodrigo Lemes, Daniel Furtado, Carla De Bona, Ivan Henrique, Karina Tronkos 
e Welliton Matiola por todo tempo e colaboração neste trabalho através das respostas 
fornecidas no questionário. 
A todos os meus amigos, de inúmeros contextos, mas que posso contar para 
qualquer coisa, por deixarem minha vida mais leve e me darem forças nessa missão 
que é se graduar. 
E por fim, obrigado vida. 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
“Design is really an act of communication, which 
means having a deep understanding of the 
person with whom the designer is 
communicating.” 
 
Donald A. Norman 
 
 
 
RESUMO 
 
 
Durante toda a história da espécie humana as representações imagéticas foram 
utilizadas como forma de transmitir mensagens, conceitos e ideias. No entanto, com a 
evolução das tecnologias, essa linguagem ganhou cada vez mais espaço e, 
atualmente, nos cerca rotineiramente. O presente trabalho objetiva discutir a função dos 
ícones nos produtos digitais, buscando compreender sua eficácia enquanto forma de 
democratização do acesso à comunicação. Para isto, foi preciso entender, de antemão, 
como surgiram as formas de representação denominadas “ícones” e como seu uso foi 
sendo introduzido e desenvolvido com o passar do tempo. Da mesma forma, houve a 
necessidade de explorar os conceitos de “experiência do usuário” e “acessibilidade”, 
tópicos rigorosamente relacionados à inclusão e democratização de conteúdos para a 
sociedade. Para alcançar esses objetivos, realizou-se uma pesquisa qualitativa, através 
de um questionário com roteiro estruturado e aplicado via e-mail com seis profissionais 
da área de tecnologia, sucedida por uma análise das informações obtidas com as 
respostas. A pesquisa buscou aporte teórico em autores como Kate Clair (2009), 
Cynthia Busic-Snyder (2009), Martine Joly (2012) e Donald A. Norman (2006), como 
referências mais importantes. As conclusões deste estudo revelam que os ícones 
cumprem um papel fundamental na democratização de informações e na relação 
usuário x produto no meio digital, uma vez que seu uso afeta diretamente a experiência 
do usuário e acessibilidade em diferentes esferas, sendo, nos dias de hoje, um 
elemento crucial nas interfaces dos produtos que almejam conquistar e fidelizar 
clientes. 
 
Palavras-chave: Ícones. Acessibilidade. Experiência do Usuário. Semiótica. Design. 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
ABSTRACT 
 
 
Throughout the history of mankind imagery representations have been used as a way of 
conveying messages, concepts and ideas. However, with the evolution of technologies, 
this language has gained more and more space and currently surrounds us routinely. 
This paper aims to discuss the function of icons in digital products, seeking to 
understand their effectiveness as a form of democratization of access to communication. 
For this, it was necessary to understand, beforehand, how the forms of representation 
called “icons” arose and how their use was being introduced and developed over time. 
Similarly, there was a need to explore the concepts of “user experience” and 
“accessibility”, topics strictly related to the inclusion and democratization of content for 
society. To achieve these objectives, a qualitative research was conducted through a 
questionnaire with structured script and applied via e-mail with six technology 
professionals, succeeded by an analysis of the information obtained with the answers. 
The research sought theoretical support from authors such as Kate Clair (2009), Cynthia 
Busic-Snyder (2009), Martine Joly (2012) and Donald A. Norman (2006), as the most 
important references. The conclusions of this study reveal that icons play a fundamental 
role in the democratization of information and the user-product relationship in the digital 
environment, since their use directly affects the user experience and accessibility in 
different spheres, being, nowadays, a crucial element in product interfaces that aim to 
win and build customer loyalty. 
 
Keywords: Icons. Accessibility. User Experience. Semiotics. Design. 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
LISTA DE FIGURAS 
 
Figura 1 - Arte rupestre na Gruta de Lascaux.……………………………………………..16 
Figura 2 - Hieróglifos egípcios....................................…………………………………......17Figura 3 - Exemplos de kanji e suas respectivas traduções……………………………...18 
Figura 4 - Interface de aplicativo de livros simulando uma prateleira.…………………..20 
Figura 5 - Exemplos de logos de grandes empresas que passaram por redesign ........21 
Figura 6 - Alguns elementos presentes na Experiência do usuário.………..……….......22 
Figura 7 - Fluxo de processos na metodologia de Design Centrado no Usuário.……...23 
Figura 8 - Exemplo de utilização do princípio da percepção através do uso de uma 
descrição para vídeo.………………………………………...………………………………..26 
Figura 9 - Interface do Star, estação de trabalho da Xerox lançado em 1981.…...…….28 
Figura 10 - Ícones de “Início”, “Configurações” e “Notificações”.…………………………29 
Figura 11 - Diferentes representações para o ícone de “Menu” no Noun Project………30 
Figura 12 - A palavra “Menu” representada por diferentes famílias tipográficas………..30 
 
 
 
 
 
 
 
 
 
 
 
 
LISTA DE TABELAS 
 
Tabela 1 – Perguntas utilizadas no questionário……………………………………….….33 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
SUMÁRIO 
 
1. INTRODUÇÃO…......................................................……………………………....12 
2. O UNIVERSO DOS ÍCONES NA ERA DIGITAL……………………………….....16 
2.1 Iconografia............................................................................................................16 
2.2 Experiência do usuário.........................................................................................22 
2.3 Acessibilidade.......................................................................................................24 
2.4 Ícones na era digital..............................................................................................28 
3. OBJETO DE ESTUDO: ÍCONES, INTERFACES E ACESSIBILIDADE….……32 
3.1 Aspectos metodológicos………………………………………………………....…...32 
4. ANÁLISE E RESULTADOS…......………………………………………………….34 
5. CONSIDERAÇÕES FINAIS………………………………………………………....38 
REFERÊNCIAS.…………………………………………………………………………..39 
APÊNDICE A – Questionário utilizado na pesquisa.............................................39 
APÊNDICE B – Termo de autorização de uso de imagem e depoimentos.........42 
APÊNDICE C – Transcrição das respostas de Rodrigo Lemes...........................43 
APÊNDICE D – Transcrição das respostas de Karina Tronkos...........................44 
APÊNDICE E – Transcrição das respostas de Ivan Henrique..............................46 
APÊNDICE F – Transcrição das respostas de Welliton Matiola...........................48 
APÊNDICE G – Transcrição das respostas de Daniel Furtado.............................51 
APÊNDICE H – Transcrição das respostas de Carla De Bona..............................55 
 
 
 
 
 
 
 
 
 
 
12 
 
1. INTRODUÇÃO 
 
Com a contínua variação das formas de comunicação no âmbito digital, 
podemos constatar que a utilização de representações imagéticas vem ganhando 
cada vez mais destaque no campo comunicacional nos últimos anos, seja através 
dos emoticons1, no extinto software de mensagens instantâneas MSN 
Messenger2, memes, emojis3, que ocasionalmente passam por um processo de 
atualização e recebem novas “expressões” e, mais recentemente, os stickers4 ou 
figurinhas do WhatsApp. 
No entanto, a utilização de representações de imagens como forma de 
comunicação não é algo recente, nem muito menos um advento da tecnologia 
digital. Basta fazermos uma breve viagem ao passado que também podemos 
encontrar tais representações nas pinturas rupestres e, anos depois, nos 
hieróglifos egípcios, por exemplo. 
Segundo CLAIR e BUSIC-SNYDER (2009), representações puramente 
visuais, como as pinturas rupestres, por exemplo, não podem ser caracterizadas 
como um alfabeto, pois como não há uma padronização no seu uso, diferentes 
interpretações ficam em aberto para o público. O que não se aplica aos hieróglifos 
egípcios. 
Os hieróglifos egípcios são pictogramas (desenhos simplificados que 
representam objetos) que tiveram sua origem por volta de 3.000 a.C e 
funcionavam como um sistema de escrita que representava palavras e sons 
através de pictogramas. 
 
1
 Criados em 1982 pelo norte-americano Scott Fahlman, os emoticons são representações gráficas 
de uma emoção feita através de caracteres que temos disponíveis nos teclados dos computadores 
e celulares, por exemplo. 
2
 Fonte: A história do MSN Messenger, o favorito dos brasileiros. Disponível em: 
https://www.tecmundo.com.br/mercado/133163-historia-msn-messenger-favorito-brasileiros-
video.htm. Acesso em: 7 ago 2019. 
3
 Criados na década de 90 pela empresa japonesa NTT DoCoMo, os emojis são desenhos próprios 
e inéditos, tratados como extensões do conjunto de caracteres ocidentais usados na maioria dos 
sistemas operacionais da atualidade. 
4
 Imagens estáticas para representar emoções de forma diferente dos emojis, palavras ou áudios, 
em que o usuário pode criar as suas próprias ou baixar através de aplicativos. 
https://www.tecmundo.com.br/mercado/133163-historia-msn-messenger-favorito-brasileiros-video.htm
https://www.tecmundo.com.br/mercado/133163-historia-msn-messenger-favorito-brasileiros-video.htm
13 
 
Porém, com o tempo, percebeu-se que a comunicação através de 
pictogramas não englobava o desejo de passar informações mais complexas às 
pessoas, o que ocasionou na combinação dessas representações simples, 
resultando nos ideogramas, utilizados para representar um conceito ou 
mensagens mais elaboradas. 
Ideogramas, em outras palavras, são pictogramas que representam 
alguma coisa diferente de sua intenção original. Por exemplo, o 
pictograma de “mão” transforma-se em ideograma quando é combinado 
com outros símbolos para transmitir os conceitos de “dar”, 
“cumprimentar”, oferecer” ou “tomar” - ações ou conceitos associados de 
alguma maneira com a mão. Os ideogramas marcam o verdadeiro início 
da linguagem escrita. (CLAIR, BUSIC-SNYDER, 2009, p. 16) 
 
No contexto do design, os conceitos de pictograma e ideograma são 
bastante utilizados na forma dos ícones. Além disso, outras atribuições válidas 
para este termo na área do design são a do campo da informática, que define 
ícone como um elemento gráfico que representa determinado objeto, operação ou 
link e, geralmente, é acionável por um clique ou toque, quando utilizado em um 
sistema operacional ou interface gráfica, e a definição da semiótica, a qual 
argumenta que o ícone é um signo que, através da semelhança ou analogia, 
representa outro objeto. 
Outro campo onde a presença de ícones se faz imprescindível é o da 
acessibilidade. De acordo com a World Federation of the Deaf (WFD), 80% dos 
deficientes auditivos possuem baixa escolaridade e/ou problemas de 
alfabetização5, o que nos leva a refletir sobre como acontece a interação desse 
público no meio digital, uma vez que a forma mais eficiente de comunicação entre 
e para com eles é através da língua de sinais que, infelizmente, não está tão 
presente nos ambientes digitais. A língua de sinais, em alguns casos, também se 
utiliza de relações de semelhança e analogia em seus sinais, como no caso dos 
sinais icônicos, por exemplo. 
 
5
 Fonte: Improving multimodal web accessibility for deaf people: Sign language interpreter module. 
Disponível em: 
https://www.researchgate.net/publication/225469903_Improving_multimodal_web_accessibility_for
_deaf_people_Sign_language_interpreter_module. Acesso em: 20 ago 2019. 
https://www.researchgate.net/publication/225469903_Improving_multimodal_web_accessibility_for_deaf_people_Sign_language_interpreter_module
https://www.researchgate.net/publication/225469903_Improving_multimodal_web_accessibility_for_deaf_people_Sign_language_interpreter_module
14 
 
Seria a acessibilidade um dos fatores que contribuíram para a evolução e 
atualização visual dos ícones? Que levou à decadência as representaçõesfeitas 
sob o skeumorfismo (mais detalhista, realista) e favoreceu a ascensão do design 
minimalista no âmbito digital? 
Todavia, mesmo imersos num universo de alfabetos, idiomas e outras 
linguagens, continuamos nos deparando com sinalizações e mensagens repletas 
de pictogramas, ideogramas e ícones, nos revelando que, dependendo da sua 
forma de uso e em qual contexto eles estão inseridos, podem cumprir com os 
seus papéis de facilitadores comunicacionais. 
Dado esse contexto, a presente pesquisa objetivou, principalmente, buscar 
evidências que corroboram para a crescente utilização dos ícones flat no ambiente 
digital atual e, mais especificamente, analisar o papel dos ícones enquanto 
facilitadores de representações imagéticas no âmbito comunicacional e 
compreender a funcionalidade dos ícones para a democratização do acesso à 
comunicação. 
Para tais fins, foi utilizado o método de revisão bibliográfica, mediante 
pesquisa em obras de autores como Kate Clair (2009), Cynthia Busic-Snyder 
(2009), Martine Joly (2012) e Donald A. Norman (2006), por exemplo, e além 
disso, foi realizada uma pesquisa qualitativa por meio de um questionário com 
roteiro elaborado com alguns profissionais do mercado, como Rodrigo Lemes, UX 
Manager no Itaú Unibanco e criador do canal Design Team6 no Youtube, Karina 
Tronkos, UX Designer na Globo.com e criadora do perfil NinaTalks7 no Instagram, 
Ivan Henrique, UX Designer e Desenvolvedor Front-end no Mercado Bitcoin, 
Welliton Matiola, Product Designer e um dos fundadores da UI Lab8, Carla De 
Bona, designer focada em UI/UX e Daniel Furtado, Product Designer e criador do 
canal UXNow9 no Youtube. 
A presente monografia, além desta Introdução, apresenta capítulo de 
fundamentação teórica embasado em obras dos autores citados, intitulado O 
 
6
 Canal Design Team: https://www.youtube.com/channel/UCTkZTDIq25Czsazq2N493Cg 
7
 Perfil Nina Talks: https://www.instagram.com/nina_talks/ 
8
 Perfil da UI Lab: https://www.instagram.com/uilabschool/ 
9
 Canal UXNow: https://www.youtube.com/channel/UCgfaifzmqadwKyCd0lagylQ 
https://www.youtube.com/channel/UCTkZTDIq25Czsazq2N493Cg
https://www.instagram.com/nina_talks/
https://www.instagram.com/uilabschool/
https://www.youtube.com/channel/UCgfaifzmqadwKyCd0lagylQ
15 
 
universo dos ícones na era digital. Após este capítulo, foi apresentado o objeto de 
estudo, no Capítulo 3 e, por fim, no Capítulo 4, a análise e resultados obtidos 
através do estudo e análise das respostas obtidas na pesquisa, concluindo-se 
com as considerações finais e referências. 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
16 
 
2. O UNIVERSO DOS ÍCONES NA ERA DIGITAL 
2.1 ICONOGRAFIA 
 
 Do grego “eikonographía”, a iconografia pode ser classificada como um 
conjunto de imagens correspondente a determinado assunto10. 
Durante o período pré-histórico, nossos ancestrais faziam desenhos nas 
paredes das cavernas e outras superfícies como forma de registro de eventos 
relevantes em seu cotidiano, o que mais tarde foi classificado como pintura 
rupestre. 
Dessa forma, acredita-se que a criação e utilização de pictogramas, 
representações simplistas de objetos, tenha sido o pontapé inicial para o 
desenvolvimento da maioria das linguagens escritas (CLAIR, BUSIC-SNYDER, 
2009). 
 
Figura 1. Arte rupestre na Gruta de Lascaux. 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
Fonte: Disponível em: https://pt.wikipedia.org/wiki/Lascaux. Acesso em: 29 ago 2019. 
 
10
 Fonte: Iconografia. Disponível em: http://michaelis.uol.com.br/busca?id=xR04Q. Acesso em: 29 
ago 2019. 
https://pt.wikipedia.org/wiki/Lascaux
http://michaelis.uol.com.br/busca?id=xR04Q
17 
 
Os egípcios, por exemplo, utilizavam pictogramas para se comunicar 
através da sua escrita dos hieróglifos, que teve origem por volta de 3.000 a.C. 
Diferentemente das pinturas rupestres, que não são classificadas como um 
alfabeto por não possuírem uma padronização e consistência no seu uso, os 
hieróglifos receberam essa categorização. Contudo, mesmo com essas 
características alfabéticas, suas representações não eram apropriadas para 
expressar ideias mais abstratas e complexas como emoções, ações e outros 
conceitos, o que levou à sua evolução. 
As linguagens baseadas em pictogramas evoluíram para se tornar 
sistemas de escrita com a representação de pensamentos abstratos em 
vezes de simplesmente representar objetos. À medida que os 
pictogramas passaram a ter significados que iam além da simples 
representação visual de algo tangível, foram se transformando em um 
meio um pouco mais complicado de escrever, conhecido como 
ideogramas. O ideograma é a combinação de dois ou mais pictogramas 
com o propósito de representar um conceito. (CLAIR, BUSIC-SNYDER, 
2009, p. 15) 
 
 
Figura 2. Hieróglifos egípcios. 
 
 
 
 
 
 
 
 
 
 
 
 
Fonte: Disponível em: https://aventurasnahistoria.uol.com.br/noticias/reportagem/como-ler-textos-
em-hieroglifo.phtml. Acesso em: 30 ago 2019. 
 
Os japoneses se utilizam de ideogramas em sua comunicação combinando 
o kanji11, da escrita chinesa, com outros dois alfabetos de origem japonesa. Desse 
modo, suas palavras são escritas através da soma dessas representações ou, às 
 
11
 Fonte: Kanji – O que é e como aprender. Disponível em: 
https://www.aulasdejapones.com.br/kanji/. Acesso em: 30 ago 2019. 
https://aventurasnahistoria.uol.com.br/noticias/reportagem/como-ler-textos-em-hieroglifo.phtml
https://aventurasnahistoria.uol.com.br/noticias/reportagem/como-ler-textos-em-hieroglifo.phtml
https://www.aulasdejapones.com.br/kanji/
18 
 
vezes, uma representação já é considerada uma palavra. Esse aspecto tão 
característico, a junção da escrita chinesa com a japonesa, pode ser explicado 
através do fato de que, de acordo com CLAIR, BUSIC-SNYDER (2009), diferentes 
culturas desenvolveram seus ideogramas específicos que refletem valores como 
crenças e estruturas política, social e econômica. 
 
Figura 3. Exemplos de kanji e suas respectivas traduções. 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
Fonte: Disponível em: https://nihongoautodidata.com.br/alfabeto-japones-kanji-hiragana-katakana/. 
Acesso em: 01 set 2019. 
 
Atualmente, pictogramas e ideogramas também podem ser encontrados na 
forma de ícones, principalmente em interfaces digitais como aplicativos de 
celulares e tablets, sites e softwares de computador. ZHANG (2015) relaciona 
essa presença constante dos ícones no meio digital com a sua facilidade de 
compreensão, uma vez que não é necessário traduzir um ícone para outro idioma, 
o que é explicado através da semiótica. 
https://nihongoautodidata.com.br/alfabeto-japones-kanji-hiragana-katakana/
19 
 
A semiótica, ciência que estuda os signos12, divide o signo em três 
categorias: ícone, índice e símbolo. A primeira, foco deste estudo, é explicada por 
JOLY (2012) como a classe dos signos que “mantém uma relação de analogia 
com aquilo que ele representa”, ou seja, há uma relação de semelhança entre 
aquilo que representa e o que está sendo representado. Já a segunda, “mantém 
uma relação causal de contiguidade física com aquilo que eles representam”, 
como uma pegada na areia deixada por uma pessoa ou animal, por exemplo. 
Sobre a terceira, o símbolo, a autora refere-se como sendo a classe que “mantém 
com o seu referente uma relação de convenção”, a exemplo das bandeiras para 
os países e a pomba para simbolizar a paz. 
Em seu livro “Introdução à Análise da Imagem”, dentre outros temas, JOLY 
(2012) também aborda três tipos de mensagens que podem constituir uma 
mensagem visual: a plástica, a icônica e a linguística. Os elementos que 
compõem uma mensagem plástica são aqueles como cores, formas, texturas e 
composição, os elementos plásticos. A mensagem icônica é formadaatravés das 
representações figurativas, também denominadas signos icônicos. Por fim, a 
mensagem linguística é aquela formada pela parte textual. 
No campo do design, outro conceito bastante adequado para os ícones é o 
da informática, que os descreve como elementos gráficos que representam 
determinados objetos, operações ou links e, geralmente, são acionáveis por um 
clique ou toque, quando utilizados em um sistema operacional ou interface gráfica. 
Nesse âmbito, há diversos estilos de ícones, de forma que ZHANG (2015) faz uma 
analogia entre os estilos disponíveis e os pesos das fontes que utilizamos para 
escrever trabalhos e textos no computador, como se cada ícone tivesse um 
“negrito”, “itálico” e “sem serifa”, por exemplo. De tantos estilos, os presentes no 
skeumorfismo e no flat design foram os que ganharam uma maior popularidade 
devido às suas aplicações no cotidiano da sociedade. 
O skeumorfismo é um tipo de design que se baseia na realidade, ou seja, 
seu objetivo é criar elementos que possuam um elevado grau de semelhança e 
 
12
 Fonte: Afinal, o que é semiótica?. Disponível em: 
http://www.usabilidoido.com.br/arquivos/afinal_o_que_e_semiotica_amstel.pdf. Acesso em: 31 ago 
2019. 
http://www.usabilidoido.com.br/arquivos/afinal_o_que_e_semiotica_amstel.pdf
20 
 
fidelidade ao objeto real. Os ícones desse estilo foram bastante utilizados nas 
interfaces dos anos 90 e início dos anos 2000, como nas primeiras gerações do 
sistema operacional Windows e iOS, por exemplo, fazendo uso de simulação 3D e 
cores vivas. 
 
Figura 4. Interface de aplicativo de livros simulando uma prateleira. 
Fonte: Disponível em: https://medium.com/tend%C3%AAncias-digitais/skeumorflat-eab69c984157. 
Acesso em: 03 set 2019. 
 
Já o flat design, que surgiu como uma tendência estética como forma de 
substituir o skeumorfismo, conseguiu se perpetuar e vem sendo utilizado há um 
bom tempo. A principal característica do flat é o minimalismo. Podemos dizer que 
o seu principal objetivo é representar de forma simples e objetiva aquilo que 
precisa ser passado ao público. Diferentemente do skeumorfismo, o flat não se 
utiliza de efeitos em suas representações, dando uma atenção maior aos 
elementos geométricos, as cores e a tipografia. O estilo ganhou tanta 
popularidade que foi adotado por algumas empresas no processo de repaginação 
nas suas identidades visuais. 
 
 
https://medium.com/tend%C3%AAncias-digitais/skeumorflat-eab69c984157
21 
 
Figura 5. Exemplos de logos de grandes empresas que passaram por redesign. 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
Fonte: Disponível em: https://medium.com/tend%C3%AAncias-digitais/skeumorflat-eab69c984157. 
Acesso em: 03 set 2019. 
 
 
 
 
 
 
https://medium.com/tend%C3%AAncias-digitais/skeumorflat-eab69c984157
22 
 
2.2 EXPERIÊNCIA DO USUÁRIO 
 
 Criado no início dos anos 90 pelo professor, cientista cognitivo e co-
fundador da Nielsen Norman Group, Donald Norman13, o termo “experiência do 
usuário” (do inglês “user experience” ou “UX”) representa todo um campo 
multidisciplinar que integra diversas áreas presentes em um produto ou serviço, 
passando por aspectos como branding, design, usabilidade e funcionalidades14. 
Em uma entrevista concedida durante a UX Conference, em São Francisco, 
Norman disse que experiência do usuário “é tudo relacionado a sua experiência 
com o produto”15, de forma que, em algumas vezes, você nem precisa estar perto 
do produto, mas apenas falando sobre ele para alguém. Muitos acabam 
confundindo UX com UI (de “user interface”), campo responsável por tratar da 
interação entre usuário e interface, no entanto, MATIOLA (2015) esclarece essa 
distinção afirmando que o “UX Design trabalha com as emoções e experiências 
dos usuários” e “o UI é justamente a ponte responsável por fazer com que essas 
experiências aconteçam”. 
 
Figura 6. Alguns elementos presentes na Experiência do usuário. 
 
 
 
 
 
 
 
 
Fonte: Disponível em: https://www.toromarketplace.com/artigos/performance/toro-a-importancia-da-
experiencia-do-usuario-para-o-e-commerce. Acesso em: 05 set 2019. 
 
13
 Fonte: About Don Norman. Disponível em: https://jnd.org/about/. Acesso em: 03 set 2019. 
14
 Fonte: What is User Experience (UX) Design?. Disponível em: https://www.interaction-
design.org/literature/topics/ux-design. Acesso em: 03 set 2019. 
15
 Fonte: Don Norman e o termo “UX”. Disponível em: https://uxdesign.blog.br/don-norman-e-o-
termo-ux-6dffb3f8d218. Acesso em: 03 set 2019. 
https://www.toromarketplace.com/artigos/performance/toro-a-importancia-da-experiencia-do-usuario-para-o-e-commerce
https://www.toromarketplace.com/artigos/performance/toro-a-importancia-da-experiencia-do-usuario-para-o-e-commerce
https://jnd.org/about/
https://www.interaction-design.org/literature/topics/ux-design
https://www.interaction-design.org/literature/topics/ux-design
https://uxdesign.blog.br/don-norman-e-o-termo-ux-6dffb3f8d218
https://uxdesign.blog.br/don-norman-e-o-termo-ux-6dffb3f8d218
23 
 
Sobre a importância de fornecer uma boa experiência para o usuário, 
VIDAL (2018) deixa claro que, no ambiente digital, não basta os sites e aplicativos 
atuarem apenas de forma eficiente, mas também de forma agradável e 
memorável. 
UX não é oferecer experiências como recompensa, é planejar a 
experiência da experiência. É pensar em como deixar uma sensação 
positiva causada por um evento exclusivo, por uma viagem, por uma 
mensagem personalizada, pela navegação em um site ou aplicativo, pelo 
atendimento com carinho e atenção, que é o que marca a vida das 
pessoas. (VIDAL, 2018) 
 
 Dito isto, a experiência do usuário possui uma forte relação com a filosofia 
do design centrado no usuário, “uma metodologia usada por desenvolvedores e 
designers para garantir que estão criando produtos que atendem às necessidades 
dos usuários” (LOWDERMILK, 2013). Através de entrevistas, pesquisas, testes, 
brainstormings e outros métodos de investigação e elaboração de ideias, os 
profissionais buscam compreender alguns aspectos importantes na jornada de 
uso do produto que podem ser decisivos na experiência final do usuário, como o 
contexto de sua utilização e as reais necessidades de quem irá utilizá-lo, para a 
partir daí, elaborar soluções e avaliar sua eficácia junto aos usuários. 
 
Figura 7. Fluxo de processos na metodologia de Design Centrado no Usuário. 
Fonte: Disponível em: https://www.interaction-design.org/literature/topics/ux-design. Acesso em: 09 
set 2019. 
 
https://www.interaction-design.org/literature/topics/ux-design
24 
 
2.3 ACESSIBILIDADE 
 
“Facilidade de acesso; qualidade do que é acessível”16. Dessa forma, o 
termo “acessibilidade” se relaciona principalmente à criação de produtos, 
aparelhos, serviços ou ambientes que possam ser utilizados por pessoas com 
necessidades especiais. 
No Brasil, a Constituição foi publicada em 1988 e visava assegurar os 
direitos individuais e sociais de todos os brasileiros, inclusive de pessoas com 
deficiência. Foi a partir dela que as portas para a criação e implementação de 
outras regras visando à inclusão e à acessibilidade dentro do território nacional 
foram abertas, a exemplo da Lei de Cotas17, com foco na inclusão de PCDs - 
abreviatura para “Pessoas com Deficiência” - no mercado de trabalho, publicada 
em 1991. 
No entanto, somente nos anos 2000 foi lançada uma lei que tratava 
exclusivamente de acessibilidade. Propondo a redução de “barreiras e de 
obstáculos nas vias e espaços públicos, no mobiliário urbano, na construção e 
reforma de edifícios e nos meios de transporte e de comunicação” (BRASIL, 
2000), a Lei Nº 10.09818, de 19 de dezembro de 2000 foi decretada como forma 
de oferecer e garantir autonomia e oportunidade para todos. 
Além destas e outras leis, em 2016 entrou em vigor a LeiBrasileira de 
Inclusão. A LBI19 atua como uma das leis de acessibilidade mais amplas na 
Constituição Brasileira, sendo inspirada pelo protocolo da convenção da ONU 
sobre os Direitos das PCDs, que visava assegurar o direito total e igual às 
pessoas com deficiência. A lei aborda desde o relacionamento entre órgãos 
públicos, privados e deficientes até tópicos específicos voltados à tecnologia e 
 
16
 Fonte: Acessibilidade. Disponível em: 
http://michaelis.uol.com.br/busca?r=0&f=0&t=0&palavra=acessibilidade. Acesso em: 05 set 2019. 
17
 Fonte: LEI Nº 8.213. Disponível em: http://www.planalto.gov.br/ccivil_03/leis/l8213cons.htm. 
Acesso em: 04 set 2019. 
18
 Fonte: LEI Nº 10.098. Disponível em: http://www.planalto.gov.br/ccivil_03/LEIS/L10098.htm. 
Acesso em: 05 set 2019. 
19
 Fonte: LEI Nº 13.146. Disponível em: http://www.planalto.gov.br/ccivil_03/_ato2015-
2018/2015/lei/l13146.htm. Acesso em: 09 set 2019. 
http://michaelis.uol.com.br/busca?r=0&f=0&t=0&palavra=acessibilidade
http://www.planalto.gov.br/ccivil_03/leis/l8213cons.htm
http://www.planalto.gov.br/ccivil_03/LEIS/L10098.htm
http://www.planalto.gov.br/ccivil_03/_ato2015-2018/2015/lei/l13146.htm
http://www.planalto.gov.br/ccivil_03/_ato2015-2018/2015/lei/l13146.htm
25 
 
reformas estruturais, além de tratar sobre as punições para quem não cumprir 
suas exigências. 
Já no mundo virtual, a acessibilidade é orientada através da Web Content 
Accessibility Guidelines (WCAG) 2.1, a segunda atualização após a primeira 
versão das diretrizes publicadas em 2008, a WCAG 2.0, depois de uma 
recomendação da W3C (World Wide Web Consortium) em 1999. As diretrizes da 
WCAG 2.1 foram desenvolvidas através da colaboração entre profissionais de 
todo o mundo, visando oferecer um padrão para a acessibilidade dos conteúdos 
na web a nível internacional. 
As Diretrizes de Acessibilidade para Conteúdo Web (WCAG) 2.1 definem 
a forma de como tornar o conteúdo da Web mais acessível para pessoas 
com deficiência. A acessibilidade abrange uma vasta gama de 
deficiências, incluindo visual, auditiva, física, de fala, intelectual, de 
linguagem, de aprendizagem e neurológica. Embora estas diretrizes 
cubram uma ampla diversidade de situações, elas não são capazes de 
abordar as necessidades das pessoas com todos os tipos, graus e 
combinações de deficiências. Estas diretrizes tornam também o conteúdo 
da Web mais acessível por pessoas idosas, cujas habilidades estão em 
constante mudança devido ao envelhecimento, e muitas vezes melhoram 
a usabilidade para usuários em geral. (W3C, 2018) 
 
 Este documento pode ser dividido em cinco princípios: Perceptível, 
Operável, Compreensível, Robusto e Conformidade. Cada um destes possui suas 
diretrizes específicas (totalizando 18), que podem ser avaliadas por meio de 
critérios de sucesso através das técnicas apresentadas na própria declaração. 
O primeiro princípio, Perceptível, trata sobre a necessidade de o conteúdo 
ser apresentado em mais de uma forma. Como adicionar legendas nos vídeos e 
descrições alternativas para imagens, por exemplo, além de solicitar o suporte 
para leitores de tela por parte dos sites. Este princípio contém quatro diretrizes, 
cada uma com suas especificidades. 
 
 
 
 
 
 
26 
 
Figura 8. Exemplo de utilização do princípio da percepção através do uso de uma descrição para 
vídeo. 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
Fonte: Disponível em: https://www.appai.org.br/inclusao-de-deficientes-visuais-no-facebook-
atraves-da-hashtag-pracegover/. Acesso em: 18 set 2019. 
 
Já o princípio “Operável”, aborda a facilidade de uso que o usuário deve ter 
durante a sua interação e navegação pela interface, de forma que ele consiga 
realizar suas operações sem barreiras ou dificuldades de acesso. Suas cinco 
diretrizes, que vão desde a navegação através do teclado até o excesso de cores 
e iluminação que possam atuar como gatilho para ataques epiléticos são alguns 
exemplos que podemos encontrar nesta seção do documento. 
O terceiro tópico, da compreensão, possui três diretrizes, com um maior 
enfoque no conteúdo textual dos sites, contendo pontos sobre a legibilidade dos 
textos, objetividade e clareza das informações passadas ao usuário, de modo que 
o site seja acessível à pessoas com dislexia, aqueles que possuem algum nível de 
dificuldade com leitura ou não tenham repertório dentro do contexto em que 
aquele site se encontra, por exemplo. 
Sobre o princípio da robustez, o documento trata exclusivamente da 
codificação do site, com uma única diretriz. Um website robusto é aquele que está 
pronto para suportar as tecnologias assistivas atuais, como leitores de tela, e 
https://www.appai.org.br/inclusao-de-deficientes-visuais-no-facebook-atraves-da-hashtag-pracegover/
https://www.appai.org.br/inclusao-de-deficientes-visuais-no-facebook-atraves-da-hashtag-pracegover/
27 
 
aqueles que possam ser navegados através do uso do teclado, para pessoas com 
deficiência motora. 
O último princípio, que contém cinco diretrizes, apresenta os requisitos 
necessários para as páginas web estarem em conformidade com a WCAG 2.1, 
funcionando apenas como uma seção informativa, de forma que o autor da página 
possa se certificar do grau de conformidade do seu site com as normas 
apresentadas pela W3C. 
Em relação aos graus de conformidade citados pela WCAG 2.1, estes são 
divididos em três graus: A, o mais baixo, ou seja, o de menor acessibilidade, AA, 
com um grau mais elevado de acessibilidade e, por fim, o AAA, aquele que possui 
uma maior acessibilidade dentre os três níveis. 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
28 
 
2.4 ÍCONES NA ERA DIGITAL 
 
 De acordo com a Pesquisa Anual de Consumo de Conteúdo realizada em 
2018 pela Adobe (Adobe Consumer Content Survey20), os usuários de produtos 
digitais vem sendo menos tolerantes com experiências ruins no meio tecnológico. 
Segundo o estudo, 39% dos entrevistados afirmaram se sentir incomodados com 
conteúdos mal escritos ou mal projetados (28%). Além disso, 21% dos 
participantes disseram que a não otimização de produtos para seus dispositivos 
também é um fator frustrante nessa relação. 
 NORMAN (2006), aponta que para projetar design para pessoas é 
necessário seguir alguns princípios fundamentais como visibilidade, feedback, 
restrições, mapeamento, consistência e affordances. Tais conceitos nos ajudam a 
compreender os motivos de alguns produtos satisfazerem seus usuários e outros 
causarem experiências tão frustrantes. 
 Assim, podemos relacionar os princípios da visibilidade e da consistência 
diretamente à utilização de ícones, uma vez que essas representações passaram 
a compor as interfaces como uma forma de linguagem, buscando facilitar a 
compreensão de mensagens e tornar a interação usuário x produto mais simples e 
intuitiva. 
Figura 9. Interface do Star, estação de trabalho da Xerox lançado em 1981. 
 
 
 
 
 
 
 
 
Fonte: Disponível em: https://medium.com/ui-lab-school/%C3%ADcones-em-ui-design-dicas-de-
como-utilizar-esse-recurso-nos-seus-projetos-cf6816cf2403. Acesso em: 23 out 2019. 
 
20
 Fonte: 2019 Adobe Brand Content Survey. Disponível em: 
https://www.slideshare.net/adobe/2019-adobe-brand-content-survey. Acesso em: 23 out 2019. 
https://medium.com/ui-lab-school/%C3%ADcones-em-ui-design-dicas-de-como-utilizar-esse-recurso-nos-seus-projetos-cf6816cf2403
https://medium.com/ui-lab-school/%C3%ADcones-em-ui-design-dicas-de-como-utilizar-esse-recurso-nos-seus-projetos-cf6816cf2403
https://www.slideshare.net/adobe/2019-adobe-brand-content-survey
29 
 
Devido sua simplicidade, fácil reconhecimento, adaptabilidade, variedade 
de formatos, apelo estético e informativo, dentre outros atributos, os ícones se 
tornaram populares e foram ganhando espaço no meio digital. Tanto é que hoje 
dificilmente encontramos alguma interfaceque não possua ao menos as 
representações de “casa”, “engrenagem” ou “sino”, comumente utilizados para 
representar as ações de “início”, “configurações” e “notificações”, respectivamente. 
 
Figura 10. Ícones de “Início”, “Configurações” e “Notificações”. 
 
 
 
 
 
 
 
 
Fonte: Autoria própria. 
 
A presença dessas formas se fez tão fundamental com o passar do tempo 
que, para contribuir com a consistência e a criação de padrões de uso, atualmente 
temos repositórios e bibliotecas de ícones disponíveis na internet, como o 
Flaticon21, Icons822 e Font Awesome23, alguns dos acervos que se tornaram 
essenciais para que os designers pudessem ter acesso a uma variedade de 
ícones e, além disso, fossem capazes de realizar testes com os usuários tendo em 
vista selecionar os ícones que comunicassem da forma mais clara e objetiva 
possível a mensagem pretendida. 
Sobre essa variedade de formas e tipos de representações, ZHANG (2015) 
afirma que os ícones funcionam como tipos de uma família tipográfica, de modo 
que quando procuramos um ícone para “menu”, encontramos diversas variações. 
 
21
 Flat Icon: https://www.flaticon.com/. 
22
 Icons8: https://icons8.com/. 
23
 Font Awesome: https://fontawesome.com/. 
https://www.flaticon.com/
https://icons8.com/
https://fontawesome.com/
30 
 
Assim, cada uma dessas diferentes interpretações para “menu” podem ser 
encaradas como a mesma palavra escrita em diferentes famílias tipográficas. 
 
Figura 11. Diferentes representações para o ícone de “Menu” no Noun Project. 
Fonte: Disponível em: https://medium.com/@wenting_zhang/getting-fluent-at-the-language-of-
iconography-3415d03d0a8f. Acesso em: 13 ago 2019. 
 
 
Figura 12. A palavra “Menu” representada por diferentes famílias tipográficas. 
Fonte: Disponível em: https://medium.com/@wenting_zhang/getting-fluent-at-the-language-of-
iconography-3415d03d0a8f. Acesso em: 13 ago 2019. 
 
 Essa diversidade de representações contribui para que os profissionais 
tornem o aspecto visual do produto mais homogêneo que, por conseguinte, 
impacta na experiência do usuário, deixando a interação mais agradável. 
Além do aspecto visual, os ícones também impactam na UX quando sua 
fácil compreensão simplifica a assimilação de funções dentro de um aplicativo ou 
https://medium.com/@wenting_zhang/getting-fluent-at-the-language-of-iconography-3415d03d0a8f
https://medium.com/@wenting_zhang/getting-fluent-at-the-language-of-iconography-3415d03d0a8f
https://medium.com/@wenting_zhang/getting-fluent-at-the-language-of-iconography-3415d03d0a8f
https://medium.com/@wenting_zhang/getting-fluent-at-the-language-of-iconography-3415d03d0a8f
31 
 
site, por exemplo. Assim, em alguns casos, faz-se possível a diminuição de textos, 
o que torna a navegação com uma menor carga de informação e mais intuitiva. 
Ainda, é bastante comum encontrarmos ícones associados a 
funcionalidades dentro dos produtos digitais, o que ocorre devido às suas 
características de responsividade e universalidade. 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
32 
 
3. OBJETO DE ESTUDO: ÍCONES, INTERFACES E ACESSIBILIDADE. 
 
A principal temática deste estudo é a utilização dos ícones nas interfaces, 
com seu foco voltado para o uso dessas representações como uma forma de 
ampliação da acessibilidade nos produtos digitais. 
A motivação para este recorte surgiu através da busca pela compreensão 
em como os ícones podem aperfeiçoar a interação entre pessoas com deficiências 
(principalmente os surdos) e produtos digitais, visto que a maioria das pessoas 
surdas não possui uma boa compreensão da língua escrita e/ou falada, ou não a 
compreendem de forma total. Além disso, a intenção de apreender a eficácia da 
comunicação realizada por representações visuais foi um fator crucial para 
demarcar a abordagem deste estudo. 
Para isso, além da pesquisa de revisão bibliográfica, foi realizada uma 
pesquisa qualitativa com Rodrigo Lemes, Daniel Furtado, Ivan Henrique, Welliton 
Matiola, Karina Tronkos e Carla de Bona, profissionais da área de tecnologia que 
lidam corriqueiramente com questões voltadas à experiência do usuário. A 
escolha dos profissionais se deu através de suas presenças nas redes sociais 
enquanto “autoridades” na área, de forma que quase todos criam conteúdo 
voltado para UX, compartilhando experiências e ensinamentos para outros 
profissionais, estudantes e outros públicos. 
Através da pesquisa foi possível coletar informações sobre a utilidade dos 
ícones na área dos produtos digitais, se eles causam algum impacto na 
experiência do usuário, como sua utilização pode funcionar como um fator de 
acessibilidade dentro de sites ou aplicativos e o que os profissionais acreditam 
que venha a acontecer com o emprego de ícones no cenário tecnológico. 
 
3.1 ASPECTOS METODOLÓGICOS 
 
 Para a coleta de dados utilizamos o método de pesquisa qualitativa através 
de um questionário com roteiro elaborado, buscando uma construção de sentido 
através da análise das respostas obtidas. 
33 
 
 A pesquisa foi aplicada entre os dias 23 de setembro e 11 de outubro via e-
mail, uma vez que todos os participantes atuam fora de Natal. Foram feitos cinco 
questionamentos-chave (Tabela 1) que buscavam adquirir o ponto de vista dos 
profissionais acerca da utilização dos ícones no meio digital, sobre seu poder de 
comunicação e impacto na experiência do usuário. O perfil dos participantes 
variava entre Designer, Desenvolvedor Front-end, UX Designer, Product Designer 
e UX Manager. 
 
Tabela 1 – Perguntas utilizadas no questionário. 
1 
A utilização de ícones nas interfaces digitais impacta na experiência dos 
usuários? Explique o seu ponto de vista. 
2 
Com base nos seus conhecimentos e experiências, de que forma os 
ícones em produtos digitais podem funcionar como um fator de 
acessibilidade? 
3 
De que modo você enxerga a presença dos ícones nos produtos digitais 
atualmente? 
4 
Quando se faz necessário, onde você ou colegas de trabalho procuram 
ícones para utilizar em seus trabalhos? 
5 Qual sua visão para o futuro em relação ao uso de ícones? 
 Fonte: Elaborada pelo autor, 2019. 
 
Durante a pesquisa não foi encontrada nenhuma rejeição ou limitação, de 
forma que todos os participantes tiveram tempo suficiente para retornarem com 
suas respostas e argumentos a respeito das perguntas que foram enviadas. 
Todos os participantes demonstraram possuir conhecimento sobre a temática do 
estudo, que resultou em pontos de vista de grande valor para este trabalho, os 
quais podem ser conferidos nos Apêndices C, D, E, F, G e H. 
 
 
 
 
34 
 
4. ANÁLISES E RESULTADOS 
 
 Por meio de um questionário roteirizado, os seis participantes responderam 
a cinco questões com o objetivo de compreender a função e eficácia dos ícones 
nos produtos digitais, além de comentar o que eles esperam para o futuro com 
relação ao uso dessas representações no meio digital. O roteiro utilizado na 
pesquisa pode ser encontrado no Apêndice A deste trabalho. 
 A partir da primeira pergunta “A utilização de ícones nas interfaces digitais 
impacta na experiência dos usuários? Explique o seu ponto de vista.” foi possível 
compreender que os ícones podem impactar na experiência dos usuários de 
diversas formas, uma vez que quando a representação é fácil de ser associada ou 
já é bem disseminada, sua percepção se torna mais rápida do que a do texto, 
deixando as interfaces mais amigáveis. Entretanto, seu uso pode causar um 
impacto negativo no usuário quando ele se sente enganado por um ícone. Ou 
seja, quando há uma falha entre a associação da forma e a ação que pretende ser 
realizada, o usuário pode se sentir frustrado. 
Usuários têm modelos mentais que são construídos por anos de uso de 
outras interfaces e, nos casos de ícones, de observação de outros 
objetos/animais/cenas. Se um ícone correspondeem aparência e 
utilização ao modelo do usuário a experiência é boa - todo mundo gosta 
de se sentir inteligente! O contrário - ícone reconhecido e ação diferente, 
ou ícone não reconhecido, causam confusão. A ambiguidade pode piorar 
uma experiência. (FURTADO, 2019) 
 
 Quando questionados sobre como os ícones podem atuar como um fator 
de acessibilidade, todos os participantes concordaram que essas representações 
são fundamentais para facilitar a interação entre usuário x interface. Rodrigo 
Lemes comentou que quando trabalhou no desenvolvimento de produtos digitais 
para o público infantil, os ícones contribuíram bastante para a retenção das 
crianças quanto ao uso do produto e para o entendimento da sua proposta. Ivan 
Henrique e Welliton Matiola pontuaram a importância de seu uso enquanto 
suporte para pessoas que possuem deficiências visuais como o daltonismo. De 
modo que quando há dificuldade para compreender uma mensagem através da 
sua cor, um ícone pode facilmente complementar o seu sentido. Além disso, os 
ícones podem servir de apoio às funcionalidades acessíveis, como “Modo 
35 
 
Noturno”, “Alto contraste” e “Aumentar texto”, sinalizando para o usuário que estas 
funções estão disponíveis para uso. Daniel Furtado e Karina Tronkos também 
abordaram o cuidado que é necessário para a sinalização dos ícones em forma de 
texto para pessoas que utilizam leitores de tela. Uma vez que elas não 
conseguem visualizar a representação, é imprescindível a presença de um rótulo 
que descreva a ação que pretendida por aquele ícone, e não a descrição da forma 
em si. Carla De Bona comentou sobre a praticidade que é associar um ícone 
quando já possuímos um entendimento anterior àquela experiência, de forma que 
não é necessária uma leitura para interagir. 
Ter um ícone em vez de um texto pode ser mais acessível sim, desde 
que não seja um ícone que esteja "reinventando a roda" e sim algo 
intuitivo e simples de se compreender. Quanto para deficientes visuais, 
você deve considerar que alguém não pode ver a tela porque está 
usando um leitor de tela de áudio, então é necessário garantir que exista 
um texto equivalente para o ícone, para que o usuário do leitor de tela de 
áudio possa entender seu significado. (TRONKOS, 2019) 
 
 Desse modo, ficou claro que, em termos de acessibilidade, a utilização dos 
ícones cumpre um papel de democratização da informação, uma vez que contribui 
para a inclusão de pessoas que possam encontrar dificuldades na interação com 
os produtos digitais, como pessoas com daltonismo, surdos, cegos, crianças e 
pessoas com baixa escolaridade, por exemplo. No entanto, essa integração de 
públicos deve ser realizada com cautela, de forma clara e intuitiva, objetivando a 
fácil associação e compreensão das mensagens que pretendem ser passadas. 
Sobre a presença dos ícones nos produtos digitais, todos os participantes 
apontaram que, atualmente, eles estão presentes de forma consolidada no meio 
digital. Rodrigo Lemes afirmou que “hoje estamos em outro patamar de como os 
ícones se comunicam e sua importância”, através da crescente comunicação por 
meios visuais ao invés da comunicação verbal. Karina e Daniel pontuaram o 
cuidado com a consistência dos ícones nas interfaces, buscando um equilíbrio 
entre o seu papel funcional e o estético, de modo que é necessário realizar uma 
pesquisa antes de se definir os ícones que estarão presentes no produto. Ivan 
Henrique chamou atenção para o fato de que os ícones estão (e precisam estar) 
em constante evolução, de acordo com a compreensão dos objetos que nos 
cercam atualmente. Apontando a representação do “disquete” para a função de 
36 
 
“salvar” que se consolidou nas interfaces, mas que os usuários nascidos a partir 
dos anos 2000 não tiveram contato com o objeto físico, podendo não 
compreender a sua mensagem. 
Deve se aproveitar a "bagagem" que o usuários trazem de fora do seu 
produto e se manter em um nível conservador e seguro para seus 
usuários. Em outras palavras, evitar "criar" um símbolo novo caso ele já 
exista de forma constante no meio digital, e se o fizer que seja de 
maneira clara e simples. (HENRIQUE, 2019) 
 
Já Welliton comentou sobre a redução da carga cognitiva quando ícones são 
inseridos em meio a informações que exigem uma maior concentração para o seu 
entendimento, de modo que, quando utilizados da forma certa, eles são de fácil 
associação. Por fim, Carla De Bona abordou a pluralidade de telas que temos hoje 
em dia e a facilidade de aplicação distribuição dos ícones nessas telas, de modo 
que uma interface pode ser visualizada em um computador, em um smartphone e 
um smartwatch, por exemplo. 
 Sendo assim, pudemos compreender que tais representações 
conquistaram seu espaço no meio digital devido seus benefícios tanto como 
comunicadores quanto fatores estéticos, que além de tornarem a associação das 
informações mais leve e prática, acabam fazendo parte da proposta visual do 
produto. Todavia, para que essa presença permaneça de forma agradável e 
sólida, há uma necessidade de estudos e pesquisas junto aos novos públicos que 
vem surgindo, tendo em vista os novos contextos de uso e aplicações dos objetos 
transformados em ícones. 
 Na penúltima pergunta “Quando se faz necessário, onde você ou colegas 
de trabalho procuram ícones para utilizar em seus trabalhos?”, a maioria dos 
participantes citou bibliotecas online que disponibilizam ícones para download e 
pagos, como Feather Icons, Font Awesome, Flaticon, Icons8, Noun Project e 
Envato Elements, por exemplo. Além disso, foram citadas as bibliotecas de ícones 
de empresas como Google e Apple, por já possuírem uma consolidação no 
mercado e apresentarem uma gama bastante consistente de ícones. Ainda, 
alguns afirmaram que desenham seus próprios ícones, dependendo do contexto e 
aplicação do projeto. 
37 
 
 Acerca de suas previsões em relação ao uso dos ícones no futuro, os 
participantes demonstraram estar otimistas com relação a isso, mas com algumas 
ressalvas. Rodrigo acredita que nossa comunicação será cada vez mais repleta 
de iconografias, de modo que um dia nos comunicaremos por hieróglifos 
modernos. Karina crê que essas representações continuarão presentes no meio 
digital por causarem um impacto real nos seus usuários. Já Ivan e Welliton 
também acreditam que eles vão permanecer à nossa volta e, com revoluções 
como as da realidade aumentada e realidade virtual, os ícones podem suprir um 
papel fundamental nessas tecnologias. Contudo, em outras revoluções, como no 
caso das interfaces auditivas como VUIs (Voice User Interfaces) e chatbots, eles 
podem ser dispensados. Daniel possui um olhar de que será cada vez mais difícil 
termos representações como verdades universais, como no caso do “disquete”, de 
modo que atualmente podemos encontrar diversas representações para a mesma 
funcionalidade. Sendo assim, ele acredita que teremos que investir um maior 
tempo em pesquisas antes de escolher os ícones dos produtos. Por fim, Carla 
defende que por conta da maturidade de IoT, a pluralidade de gadgets e o 
aumento do público de nativos digitais, os ícones serão cada vez mais explorados 
e criados, de forma que as novas representações irão necessitar de um período 
de aprendizado antes de se consolidarem no meio digital. 
 Logo, foi possível compreender que por mais que os ícones venham sendo 
utilizados há tempos, o potencial de evolução e adaptação presente nessas 
formas favorece sua estabilidade no ambiente digital e, da mesma forma que vem 
acontecendo desde os hieróglifos egípcios, serão necessárias novas 
transformações e processos de aprendizado para que eles continuem cumprindo 
suas funções no futuro. 
 
 
 
 
 
 
38 
 
5. CONSIDERAÇÕES FINAIS 
 
 Como visto anteriormente, a comunicação através de representações 
visuais não é uma novidade para a nossa sociedade, sendo uma prática que vem 
se aprimorando desde a pré-história.Assim, tal evolução causou um forte impacto 
na forma em que essa linguagem se insere no mundo nos dias de hoje. 
No presente trabalho constatamos que as diversas qualidades dos ícones, 
como a capacidade de sintetizar, em formas simples, conceitos e ideias, sua 
adaptabilidade em variados tamanhos de telas, sua facilidade de aplicação, dentre 
outros, foram fatores fundamentais para sua participação no cotidiano da 
sociedade, sobretudo no mundo digital. 
Ainda, foi possível compreender por meio da semiótica que a analogia é 
responsável por estabelecer as relações entre o objeto real e sua representação, 
simplificando as associações necessárias para assimilar a mensagem. No entanto, 
a possibilidade de ruídos e falhas nessa comunicação nos indica a necessidade 
de estudos e pesquisas acerca do contexto de uso, bagagem cultural do público e 
forma de interação, por exemplo, antes da implementação dos ícones nos 
produtos digitais. 
Percebemos também, que numa comunidade digital como a qual 
integramos, com uma diversidade de pessoas, obstáculos, circunstâncias, níveis 
de conhecimento, infraestrutura e outros fatores diversos, os ícones se tornaram 
elementos essenciais nos produtos direcionados a esse grupo, impactando 
diretamente na experiência dos usuários, um agente determinante na captura e 
fidelização de clientes nos dias de hoje. 
Dito isso, acreditamos que os ícones continuarão passando por processos 
de evolução e adaptação, visando contribuir cada vez mais com a experiência de 
usuários, com a democratização do acesso às tecnologias e informações. 
 
 
 
 
39 
 
REFERÊNCIAS 
 
ABRAMOVICH, Giselle. “5 Consumer Trends That Are Shaping Digital Content 
Consumption”. Disponível em: https://cmo.adobe.com/articles/2019/2/5-consumer-
trends-that-are-shaping-digital-content-consumption.html#gs.bxrzyu. Acesso em: 
23/10/2019. 
 
AGNI, Edu. “Don Norman e o termo UX”. Disponível em: 
https://uxdesign.blog.br/don-norman-e-o-termo-ux-6dffb3f8d218. Acesso em: 
03/09/2019. 
 
AGRELA, Lucas. “Como usar, adicionar ou fazer figurinhas no WhatsApp”. 
Disponível em: https://exame.abril.com.br/tecnologia/como-usar-adicionar-ou-
fazer-figurinhas-no-whatsapp/. Acesso em: 07/11/2019. 
 
AMSTEL, Frederick van. “Afinal, o que é semiótica?”. Disponível em: 
http://www.usabilidoido.com.br/arquivos/afinal_o_que_e_semiotica_amstel.pdf. 
Acesso em: 31/08/2019. 
 
BLOG, Hand Talk. “5 fatos que você deveria saber sobre a comunidade 
surda”. Disponível em: https://blog.handtalk.me/5-fatos-comunidade-surda-libras/. 
Acesso em: 20/08/2019. 
 
BRASIL. “LEI Nº 8.213, DE 24 DE JULHO DE 1991”. Disponível em: 
http://www.planalto.gov.br/ccivil_03/leis/l8213cons.htm. Acesso em: 04/09/2019. 
 
BRASIL. “LEI Nº 10.098, DE 19 DE DEZEMBRO DE 2000”. Disponível em: 
http://www.planalto.gov.br/ccivil_03/LEIS/L10098.htm. Acesso em: 05/09/2019. 
 
https://cmo.adobe.com/articles/2019/2/5-consumer-trends-that-are-shaping-digital-content-consumption.html#gs.bxrzyu
https://cmo.adobe.com/articles/2019/2/5-consumer-trends-that-are-shaping-digital-content-consumption.html#gs.bxrzyu
https://uxdesign.blog.br/don-norman-e-o-termo-ux-6dffb3f8d218
https://exame.abril.com.br/tecnologia/como-usar-adicionar-ou-fazer-figurinhas-no-whatsapp/
https://exame.abril.com.br/tecnologia/como-usar-adicionar-ou-fazer-figurinhas-no-whatsapp/
http://www.usabilidoido.com.br/arquivos/afinal_o_que_e_semiotica_amstel.pdf
https://blog.handtalk.me/5-fatos-comunidade-surda-libras/
http://www.planalto.gov.br/ccivil_03/leis/l8213cons.htm
http://www.planalto.gov.br/ccivil_03/LEIS/L10098.htm
40 
 
BRASIL. “LEI Nº 13.146, DE 6 DE JULHO DE 2015”. Disponível em: 
http://www.planalto.gov.br/ccivil_03/_ato2015-2018/2015/lei/l13146.htm. Acesso 
em: 09/09/2019. 
 
CLAIR, Kate; BUSIC-SNYDER, Cynthia. Manual de tipografia: a história, a 
técnica e a arte. 2. ed. Porto Alegre: Bookman, 2009. 
FOUNDATION, Interaction Design. “What is User Experience (UX) Design?”. 
Disponível em: https://www.interaction-design.org/literature/topics/ux-design. 
Acesso em: 03/09/2019. 
 
GRILO, André. “Acessibilidade no Design de Interação: exemplos e 
recomendações”. Disponível em: https://medium.com/tableless/acessibilidade-no-
design-de-intera%C3%A7%C3%A3o-exemplos-e-
recomenda%C3%A7%C3%B5es-86c059ef9e2f. Acesso em: 20/08/2019. 
 
JAPONÊS, Aulas de. “Kanji – O que é e como aprender”. Disponível em: 
https://www.aulasdejapones.com.br/kanji/. Acesso em: 30/08/2019. 
 
JND.ORG. “About Don Norman”. Disponível em: https://jnd.org/about/. Acesso 
em: 03/09/2019. 
 
JOLY, Martine. Introdução à Análise da Imagem. 14 ed. Campinas: Papirus 
Editora, 2012. 
 
MICHAELIS, Dicionário. “Acessibilidade”. Disponível em: 
http://michaelis.uol.com.br/busca?r=0&f=0&t=0&palavra=acessibilidade. Acesso 
em: 05/09/2019. 
 
MICHAELIS, Dicionário. “Iconografia”. Disponível em: 
http://michaelis.uol.com.br/busca?id=xR04Q. Acesso em: 29/08/2019. 
 
http://www.planalto.gov.br/ccivil_03/_ato2015-2018/2015/lei/l13146.htm
https://www.interaction-design.org/literature/topics/ux-design
https://medium.com/tableless/acessibilidade-no-design-de-intera%C3%A7%C3%A3o-exemplos-e-recomenda%C3%A7%C3%B5es-86c059ef9e2f
https://medium.com/tableless/acessibilidade-no-design-de-intera%C3%A7%C3%A3o-exemplos-e-recomenda%C3%A7%C3%B5es-86c059ef9e2f
https://medium.com/tableless/acessibilidade-no-design-de-intera%C3%A7%C3%A3o-exemplos-e-recomenda%C3%A7%C3%B5es-86c059ef9e2f
https://www.aulasdejapones.com.br/kanji/
https://jnd.org/about/
http://michaelis.uol.com.br/busca?r=0&f=0&t=0&palavra=acessibilidade
http://michaelis.uol.com.br/busca?id=xR04Q
41 
 
NORMAN, Donald A. O design do dia a dia. Rio de Janeiro: Rocco, 2006. 
 
SOUZA, Ramon de. “Você sabe qual é a diferença entre emoticons e emojis?”. 
Disponível em: https://www.tecmundo.com.br/web/86866-voce-sabe-diferenca-
entre-emoticons-emojis.htm. Acesso em: 07/11/2019. 
 
VIEIRA, Jéssica. “Ícones em UI Design: dicas de como utilizar esse recurso 
nos seus projetos”. Disponível em: https://medium.com/ui-lab-
school/%C3%ADcones-em-ui-design-dicas-de-como-utilizar-esse-recurso-nos-
seus-projetos-cf6816cf2403. Acesso em: 23/10/2019. 
W3C. “Diretrizes de Acessibilidade para Conteúdo Web (WCAG) 2.1”. 
Disponível em: http://www.w3c.br/traducoes/wcag/wcag21-pt-BR/. Acesso em: 
10/09/2019. 
 
ZHANG, Wenting. “Some Icons Are Verbs, Some Icons Are Nouns”. Disponível 
em: https://medium.com/@wenting_zhang/getting-fluent-at-the-language-of-
iconography-3415d03d0a8f. Acesso em: 13/08/2019. 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
https://www.tecmundo.com.br/web/86866-voce-sabe-diferenca-entre-emoticons-emojis.htm
https://www.tecmundo.com.br/web/86866-voce-sabe-diferenca-entre-emoticons-emojis.htm
https://medium.com/ui-lab-school/%C3%ADcones-em-ui-design-dicas-de-como-utilizar-esse-recurso-nos-seus-projetos-cf6816cf2403
https://medium.com/ui-lab-school/%C3%ADcones-em-ui-design-dicas-de-como-utilizar-esse-recurso-nos-seus-projetos-cf6816cf2403
https://medium.com/ui-lab-school/%C3%ADcones-em-ui-design-dicas-de-como-utilizar-esse-recurso-nos-seus-projetos-cf6816cf2403
http://www.w3c.br/traducoes/wcag/wcag21-pt-BR/
https://medium.com/@wenting_zhang/getting-fluent-at-the-language-of-iconography-3415d03d0a8f
https://medium.com/@wenting_zhang/getting-fluent-at-the-language-of-iconography-3415d03d0a8f
42 
 
APÊNDICE A - Questionário utilizado na pesquisa. 
 
1. A utilização de ícones nas interfaces digitais impacta na experiência dos 
usuários? Explique o seu ponto de vista. 
 
2. Com base nos seus conhecimentos e experiências, de que forma os ícones em 
produtos digitais podem funcionar como um fator de acessibilidade? 
 
3. De que modo você enxerga a presença dos ícones nos produtos digitais 
atualmente? 
 
4. Quando se faz necessário, onde você ou colegas de trabalho procuram ícones 
para utilizar em seus trabalhos? 
 
5. Qual sua visão para o futuro em relação ao uso de ícones?43 
 
APÊNDICE B - Termo de autorização de uso de imagem e depoimentos. 
 
UNIVERSIDADE FEDERAL DO RIO GRANDE DO NORTE – 
UFRN CENTRO DE CIÊNCIAS HUMANAS, LETRAS E ARTES 
DEPARTAMENTO DE COMUNICAÇÃO SOCIAL CURSO DE 
PUBLICIDADE E PROPAGANDA 
 
TERMO DE AUTORIZAÇÃO DE USO DE IMAGEM E DEPOIMENTOS 
 
Eu _____________________________________, CPF 
_______________________, RG ______________, depois de conhecer e 
entender os objetivos, procedimentos metodológicos, riscos e benefícios da 
pesquisa, bem como de estar ciente da necessidade do uso de minha imagem 
e/ou áudio, especificados no Termo de Consentimento Livre e Esclarecidos 
(TCLE), AUTORIZO, através do presente termo, o pesquisador (Erildo Vitor 
Medeiros Melo) do projeto de pesquisa intitulado “ÍCONES NO DESIGN DE 
INTERFACES: USER EXPERIENCE E ACESSIBILIDADE DIGITAL” a realizar a 
gravação que se faça necessária e/ou a colher meu depoimento sem quaisquer 
ônus financeiros a nenhuma das partes. Ao mesmo tempo, libero a utilização 
desta gravação para fins científicos e de estudos (livros, artigos, slides e 
transparências), em favor do pesquisador da pesquisa, acima especificados, 
obedecendo ao que está previsto nas Leis que resguardam os direitos das 
crianças e adolescentes (Estatuto da Criança e do Adolescente – ECA, Lei N.º 
8.069/ 1990), dos idosos (Estatuto do Idoso, Lei N.° 10.741/2003) e das pessoas 
com deficiência (Decreto Nº 3.298/1999, alterado pelo Decreto Nº 5.296/2004). 
 
Natal - RN, ___ de ______ de ______. 
 
_______________________ _______________________ 
 Participante da pesquisa Pesquisador responsável pelo projeto 
44 
 
APÊNDICE C - Transcrição das respostas de Rodrigo Lemes, UX Manager no Itaú 
Unibanco e dono do canal Design Team no Youtube. 
 
1. Creio que eles são peças fundamentais na comunicação e representação de 
ideias. Não podemos deixar de lembrar como a semiótica traz relevância para os 
ícones e como o design usa disso para poder ser claro e facilitar interfaces para 
serem amigáveis. Um ícone mal construído pode com certeza criar ruídos da 
comunicação e ser extremamente danoso para a experiência. 
 
2. Quando falamos sobre dificuldades cognitivas os ícones vem como elementos 
fundamentais para facilitar e servir para cobrir essas dificuldades. Já tive 
experiência em desenvolver produtos digitais para crianças, e os ícones são 
fundamentais como elementos de retenção para crianças e para o entendimento 
da proposta do produto. 
 
3. Sem sombra de dúvidas hoje estamos em outro patamar de como os ícones se 
comunicam e sua importância. Com a potencialização de consumo digital cada 
vez mais acentuada, comunicação não verbal e somente visual, são elementos 
que toda interface precisa ter. Não é atoa que o ícone de salvar, mesmo sendo um 
disquete, que gerações atuais nem sabem o que é fisicamente isso, mas sabem 
do seu significado como elemento visual para guardar algo, se mantém como 
elemento presente em várias interfaces atuais e não há como trocarmos esse 
elemento, já sendo algo intrínseco em nossa cultura digital. 
 
4. No nosso caso, na empresa que atuamos desenvolvemos nossa própria 
biblioteca de ícones, sendo importantíssimo esse elemento como parte da nossa 
identidade visual. Mesmo em outras empresas que já tive que atuar, ícones de 
própria autoria sempre foram prioritários para nosso time de design. 
 
5. Como já citei, é fato que não existe mundo sem ícones e com o mundo digital 
isso é reforçado cada vez mais. É uma ida sem volta, nossa cultura humana e a 
45 
 
comunicação realizada por ela é estruturada e será cada vez mais em 
iconografias, são atalhos informativos fundamentais e principalmente universais. 
Minha visão de futuro sobre isso, um dia talvez não teremos mais palavras, mas 
talvez vamos voltar para os hieróglifos modernos chamados ícones. 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
46 
 
APÊNDICE D - Transcrição das respostas de Karina Tronkos, UX Designer na 
Globo.com e dona do perfil NinaTalks no Instagram. 
 
1. Com certeza! Ícones ajudam com o reconhecimento rápido por exemplo. O 
disquete como botão de salvar, setinha como botão de salvar, casinha para home, 
dentre outros. Mas é necessário ter cuidado para eles serem facilmente 
reconhecidos e que ajudem em vez de atrapalhar. O que torna um ícone excelente 
é o fato dele ser facilmente compreendido sem a leitura do label. Indo mais para o 
lado de produto e marca, é possível transmitir a personalidade da marca por meio 
dos ícones! Eles certamente podem melhorar o apelo estético de um design. 
 
2. O primeiro ponto que veio a minha mente foi para pessoas que não sabem ler. 
Ter um ícone em vez de um texto pode ser mais acessível sim, desde que não 
seja um ícone que esteja "reinventando a roda" e sim algo intuitivo e simples de se 
compreender. Quanto para deficientes visuais, você deve considerar que alguém 
não pode ver a tela porque está usando um leitor de tela de áudio, então é 
necessário garantir que exista um texto equivalente para o ícone, para que o 
usuário do leitor de tela de áudio possa entender seu significado. 
 
3. Vejo eles presentes em todos os produtos! Inclusive, podemos usar como 
exemplo a Apple e a Google que tem o seu próprio sistema de ícones. A questão 
é buscar sempre a consistência e usar os ícones de forma funcional e não apenas 
decorativa. O ideal é que eles sejam forma e função. 
 
4. Em aplicativos nativos nós utilizamos os próprios da Apple e do Google, no 
trabalho eu sigo os do Design System próprio da empresa e para projetos 
pessoais ou eu produzo os meus próprios ou uso de sites como Flaticon, Noun 
Project e Icons8. 
 
47 
 
5. Eles continuarão sendo usados pois são super úteis e podem de verdade 
melhorar a experiência do usuário. É só imaginar todos os ícones de um app 
tendo de ser trocados para texto. Seria simplesmente uma zona! 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
48 
 
APÊNDICE E - Transcrição das respostas de Ivan Henrique, UX Designer e 
Desenvolvedor Front-end no Mercado Bitcoin. 
 
1. Impacta com certeza. O uso de ícones em interfaces digitais ajudam a 
complementar o entendimento de elementos interativos quando texto não é 
suficiente. Cumprem também um papel de semiótica assim como sombras e 
gradientes ao dar a impressão correta a botões ou elementos clicáveis. Ícones 
também colaboram quando estão em um papel de "bagagem cognitiva" para o 
usuário: quando uma forma ou um ícone estão tão disseminados na percepção 
dos usuários que a percepção é mais rápida através de ícones do que o próprio 
texto (ícones de play, pause, disquete de salvar, etc). Finalmente, auxiliam a dar 
percepções de "estado" e "semáforo" quando cores não são suficientes. Usuários 
com daltonismo, por exemplo, que não teriam a compreensão direta de um 
elemento em vermelho, simbolizando alerta, poderia receber um ícone de 
"exclamação" e assim, se beneficiar do entendimento como um usuário não 
portadores da condição visual. 
 
2. Como já mencionado acima, em casos de daltonismo, complementando o 
feedback de cores. Ícones podem ser elementos inclusivos para usuários sem 
alfabetização (https://www.youtube.com/watch?v=MGMsT4qNA-c - esse vídeo 
mostra um caso interessante de um bebê que consegue utilizar completamente 
um aplicativo construído completamente a base de ícones). Ícones trazem 
também o efeito de entendimento universal, quando padronizados, por exemplo o 
ISO Dot que estabeleceu pictogramas para diversos tipos de cenário e condições 
rotineiras, incluindo comunicações para PcD. Ainda nos produtos digitais, diversos 
sites e aplicativos já contam com ícones dessa padronização para habilitar 
funcionalidades de assistência como "texto grande" ou ícones de "modo de alto 
contraste". 
 
3. Acredito que é um elemento consolidado, importantemas que está (e de fato 
deve continuar) em constante evolução. O próprio ícone universal de "salvar 
https://www.youtube.com/watch?v=MGMsT4qNA-c
49 
 
documento" é um disquete. Apesar de ter sua compreensão disseminada, o objeto 
de um disquete já é um símbolo obsoleto, que não tem referência do mundo real, 
ou skeumórfica, para muita gente, sobretudo usuários nascidos a partir dos anos 
2000. Algumas plataformas estão mudando essa iconografia para uma 
representação mais atual, como por exemplo, uma nuvem simbolizando a subida 
de um arquivo em referência ao "salvar na nuvem", mais de acordo com tempos 
atuais, onde memória física está perdendo relevância. Particularmente, acredito 
que ícones devem ser usados com segurança. Deve se aproveitar a "bagagem" 
que os usuários trazem de fora do seu produto e se manter em um nível 
conservador e seguro para seus usuários. Em outras palavras, evitar "criar" um 
símbolo novo caso ele já exista de forma constante no meio digital, e se o fizer, 
que seja de maneira clara e simples. 
 
4. Preferencialmente em bibliotecas "padrão" e respeitando plataformas já nativas. 
Por exemplo, o Material Design tem seu kit de ícones, a Apple também tem a sua 
(ionicons), a web utiliza bastante a iconografia do Bootstrap. Quando o produto 
exige um polimento visual maior, ou a marca tem uma guideline muito rica e 
específica, criamos uma iconografia, mas muito próxima do que o mercado 
oferece. Apenas adaptando o branding. 
 
5. Acredito que seja algo que existe e que vai existir em todo o espectro de 
interação visual. Há duas novas revoluções acontecendo: a de interações de 
"realidade virtual e realidade aumentada" (AR, VR), que acredito que os ícones 
tenham um papel fundamental nesse período de fixação e "onboarding" da nova 
tecnologia. Contudo há outras revoluções que devem dispensar o uso de ícones 
por se tratarem de interações auditivas, como VUIs (voice user interfaces) e e 
chatbots, por exemplo. Essas tecnologias estão procurando seu "ícone" para 
chamar de seu, como notificações sonoras, vinhetas curtas e pontuações de som. 
Podcasts por exemplo utilizam com frequência "vírgulas sonoras" que cumprem 
uma função parecida com ícones nessas, tentando passar percepções sem a 
50 
 
necessidade de ser tão verboso e fazer também com que o usuário grave 
cognitivamente esses sons e se acostumem com eles. 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
51 
 
APÊNDICE F - Transcrição das respostas de Welliton Matiola, Product Designer e 
um dos fundadores da UI Lab. 
 
1. Os ícones tem um impacto significativo na interface, principalmente em 
aplicativos que são obrigados a lidar com diferentes tamanhos de dispositivos. 
Vemos hoje muitos apps que fazem uso da bottom bar e na grande maioria das 
situações ela é composta apenas por ícones. Nesse sentido, quando o ícone é 
reconhecido pelo usuário o impacto é mais positivo do que um menu apenas com 
texto. 
 
2. É uma pergunta interessante e depende de quais aspectos da acessibilidade 
queremos atingir e qual o objetivo. Hoje muitas interfaces oferecem mudanças e 
usam ícones para sinalizar isso, como por exemplo a opção de utilizar modo 
noturno ou aumentar tamanho de fontes. 
 
3. Acredito que é quase impossível não usar ícones atualmente. Muitos produtos 
digitais trabalham com informações pesadas e quando você coloca um ícone claro 
e objetivo para o usuário, você diminui a carga cognitiva que ele precisa 
desprender para entender aquilo. 
 
4. Hoje existem bibliotecas de ícones muito boas, uma delas é o Feather Icons e 
ela está disponível no site para download e em plugins para quase todos os 
softwares que trabalham com criação de interface. 
 
5. Se levarmos em conta o próximo nível de interfaces que os usuários irão 
interagir, podemos dividir o futuro em duas etapas. A primeira é a utilização de 
mais ícones se pensarmos que o VR se tornará popular no futuro. A segunda é a 
não utilização de ícones pois as interfaces não serão visuais, mas sim por 
comando de voz. 
 
 
52 
 
APÊNDICE G - Transcrição das respostas de Daniel Furtado, Senior Product 
Designer na Wezen e dono do canal UXNow no Youtube. 
 
1. O uso de ícones impacta a experiências dos usuários tanto para o bem, quanto 
para o mal. Quando designers escolhem ícones para representar uma 
determinada palavra ou ação, isso pode causar um "acerto" ou "erro" de 
interpretação. Usuários têm modelos mentais que são construídos por anos de 
uso de outras interfaces e, nos casos de ícones, de observação de outros 
objetos/animais/cenas. Se um ícone corresponde em aparência e utilização ao 
modelo do usuário a experiência é boa - todo mundo gosta de se sentir inteligente! 
O contrário - ícone reconhecido e ação diferente, ou ícone não reconhecido, 
causam confusão. A ambiguidade pode piorar uma experiência. Novamente, 
ninguém gosta de se sentir burro ou ser enganado. No meu trabalho fazemos 
muito mais a retirada de ícones ambíguos do que a colocação de novos ícones. É 
melhor para o usuário a certeza de um rótulo "Incluir um Produto" do que uma 
"caixinha" que somente um grupo reconhece. Em um caso específico havia um 
ícone de uma máscara (que parecia a do filme O Máscara) e o rótulo era 
"Máscara". Quando perguntamos para o pessoal o que aquilo queria dizer a 
resposta foi "é para copiar e colar uma formatação". Trocamos o ícone por um 
botão com rótulo "Aplicar Formatação" e a quantidade de acerto dos usuários 
(medida num teste) foi muito maior. 
 
2. Ícones possuem a capacidade de serem reconhecidos visualmente por usuários 
independente do idioma falado. Para usuários não alfabetizados o ícone é melhor 
do que uma palavra. Porém é importante lembrar que ícones não podem ser 
vistos por usuários deficientes visuais e, nesse caso, é importante que exista 
também um rótulo (mesmo que invisível) para descrever a ação. É importante que 
o rótulo não seja a descrição do ícone em si e sim a ação. Um exemplo desse 
cuidado - estou escrevendo esse texto no Gmail e existe na barra um ícone com 
um cadeado e um relógio em cima. Eu não conheço a ação desse ícone (nunca 
cliquei nele) e assumo, olhando, que deve ser algo como "ativar temporariamente 
53 
 
a segurança". Uma descrição do ícone como "Cadeado com Relógio em Cima" 
não dá nenhuma explicação sobre a ação realizada. Passando o mouse por cima 
eu descubro que a ação é "Ative/Desative o modo confidencial". É um caso típico 
onde o rótulo traz muito mais informação do que o ícone em si. 
 
3. Hoje as pessoas usam muitos ícones sem uma pesquisa prévia sobre o 
entendimento daquele símbolo gráfico pelos usuários. É muito comum aplicarem 
ícones apenas como fator "estético" e não pensarem no fato "entendimento". 
Quando planejamos a interface em dispositivos pequenos, como smartphones, é 
importante tentar colocar as informações de maneira condensada. Nesse caso é 
preciso lembrar que utilizar 8 ícones que não fazem sentido é pior para a 
experiência do que utilizar 3 que façam. É possível utilizar técnicas para 
determinar quais ícones usar - cardsorting é um exemplo. Pode-se fazer isso 
mostrando ícones para usuários e pedir um significado/ação ou o contrário, 
mostrar uma palavra/ação e perguntar que ícone a melhor representa. 
 
4. Em bibliotecas ricas, como a Font Awesome ou no Icons8. Também usamos 
muito o Envato Elements. 
 
5. Imagino que cada vez vai ser mais difícil existir ícones que sejam axiomas - 
uma verdade universal. As primeiras interfaces gráficas eram praticamente iguais 
para todos os usuários - sempre o ícone da lixeira do Windows era igual. Por 
muitos anos fomos expostos ao ícone de disquete para salvar - que fazia sentido 
no contexto da época. 
Hoje cada aplicativo pode escolher o ícone que quiser para representar ações 
praticamente idênticas. Ou seja, é mais complicado um ícone ser "universal" do 
que era

Continue navegando