AUH2803 - Aspectos Conceituais e Estéticos do Design de Interface

Gustavo Alves Machado | n°11761507

EXERCÍCIO 2 | Análise de ícones das interfaces

INTRODUÇÃO
Os aplicativos selecionados para análise foram escolhidos tendo em vista o uso recorrente
e diário por parte do aluno. Tendo em vista que diferentes versões dos apps possuem leves
diferenças de posicionamento e funcionalidades, segue onde houve cada um dos usos:

1. Whatsapp Web (Uso no navegador Opera GX)

2. Google Play Livros | Visualizador de Epub (Uso no navegador Opera GX)
3. Adobe Illustrator (Uso em OS Windows)

Por fim, vale destacar que nem todos os ícones serão analisados, tendo sido escolhidos
somente os que estão presentes nas telas julgadas como principais.

1. Whatsapp Web

Aplicativo de comunicação, o whatsapp é provavelmente o app mais utilizado pelo aluno no

que tange o envio de mensagens e informações. Como é possível ver, a interface é dividida
em duas partes: uma área maior dedicada para troca de mensagens, e uma menor ao lado,
a qual funciona como um “controlador”. O escopo dos comentários aqui redigidos é definido
pela tela de chat em si.
Aqui já é possível se observar duas tendências que definem em muito a direção visual da
interface: ícones figurativos que fazem referência a objetos físicos e referências ao universo
da escrita e do suporte impresso.

Na parte de cima temos um ícone de lupa, o qual possui o objetivo de facilitar buscas dentro
do histórico do chat. Ele faz referência ao objeto físico usado para amplificar detalhes na
leitura em suportes físicos. Ao seu lado, temos os 3 pontos, discutidos em sala de aula
previamente. Ao em vez da função de “configuração”, como conversado em aula, esse
ícone aparece como um “ver mais”. Sua aparência e significado lembram as reticências; o
que muda é que ao em vez dos pontos estarem na horizontal, eles se encontram na vertical.

Na parte de baixo, há os ícones associados ao envio de mensagens e arquivos. O 3

aparece como um +, mas essa é uma situação onde vale a pena buscar referências em
outras versões do aplicativo. Normalmente o que aparece ali é um símbolo de clipes,
trazendo a ideia do anexo com o suporte físico, como se você estivesse juntando papéis
fisicamente. O 4, por sua vez, abre a tela de emojis. Com uma vasta gama de opções para
seleção, a proposta aqui seria o uso da carinha como o grande representante simbólico
dessa possibilidade de comunicação. Mais do que isso, e conversando com a ideia de
interface amigável/fofa discutida em sala, o emoji escolhido foi especificamente o da carinha
feliz. Por fim, temos o ícone de microfone, objeto físico que possui semelhante função
àquela realizada no aplicativo.
Ao clicar no ícone número 3, que envolve os anexos, surge um pop-up com as opções. As
tendências continuam aqui: o documento, as fotos e os stickers são todos referências ao
suporte impresso. A câmera faz referência a si mesma como objeto, e o contato é a figura
de uma pessoa.

O símbolo de envio de mensagens é particularmente curioso: há a seta para frente, já

convencionada e utilizada em vários aplicativos, mas aqui possuindo um corte no meio.
Esse detalhe faz com que a seta pareça um avião de papel visto de cima. Mesmo a parte
mais abstrata do processo de comunicação on–line, na qual enviamos mensagens através
de uma rede intangível e invisível, é transformada em um processo físico. Se pensarmos
nas capacidades globais de conexão, essa imagem ganha certa proporção cômica: imagine
fazer uma mensagem escrita em um avião de papel, e jogá-lo para alguém até do outro lado
do mundo! Além disso, o avião de papel é em si lúdico. Como abordado em aula e
anteriormente nessa análise, esses pequenos fatores corroboram com a ideia de um design
“amigável” e “divertido”.
2. Google Play Livros

O Google Play Livros é um software voltado para leituras de textos (especialmente em

formato epub).

Considerando a natureza do aplicativo e a vontade de se manter próximo do imaginário da

literatura física, há um conservadorismo esperado nos ícones utilizados. O 2 e o 6 vão para
o lado do figurativo, apresentando uma iconografia que espelha o que seriam objetos em
sua forma física. O ícone 3 e 4, por sua vez, são relacionados respectivamente às opções
de visualização de texto e a lista de conteúdo do livro. Interessante notar como esses
símbolos conversam muito com os aplicativos de edição de texto, como o word. Embora
trata-se de um aplicativo para leitura (propõe-se primariamente uma experiência passiva, de
absorção de conteúdo), os ícones utilizados são parecidos – quando não iguais – aos
aplicativos de edição de textos (proposta oposta, experiência primariamente ativa).

O primeiro ícone é um dos únicos que admite a existência de uma moldura. A pergunta
proposta por ele é a seguinte: “Você quer que a moldura digital (aplicativo) tome conta da
moldura física? (tela)”. Nesta opção os ícones somem, ficando só a barra inferior de seleção
de páginas e o texto em si. O que é exibido na tela começa a se aproximar ainda mais do
que seria um livro impresso.

A grande interrogação circulada, que sempre leva para FAQs e outras formas de ajuda na
utilização do app, é passível de crítica. Esse ícone é acionado quando o usuário se depara
com algo que não sabe como utilizar dentro da aplicação. Aqui a palavra chave é “dúvida”.
Subentende-se que o usuário não sabe utilizar o aplicativo, precisando de resposta. Os
projetistas funcionariam então como mentores que apresentam uma série de respostas (pré
prontas) para ajudar o usuário confuso. Qual o problema dessa relação? Nesse contexto, o
cerne do conflito entre aplicativo/leitor é colocado sempre em cima do leitor. O problema é
no seu entendimento, e não no aplicativo. O símbolo ? Não abre brecha para denúncia,
para crítica, tirando agência de quem o utiliza. Por fim, mesmo não se tratando de uma
análise do ícone em si, vale destacar: a ideia de um FAQ em um site separado evoca
também o uso de um manual físico à parte. Curioso, já que tecnologicamente não seria
difícil de integrar as explicações à própria interface de leitura.

Por fim, embora não se trate de um ícone, vale tecer algumas considerações sobre a foto
de perfil. Elemento comumente presente nas interfaces de aplicações que possuem alguma
espécie de login, é a principal forma de acesso às configurações da conta. Como é a
própria pessoa que faz upload dessa imagem, é como se fosse um ícone mutável. Ficamos
em contato direto com uma representação de nós mesmos constantemente, já que somos
nessa relação um elemento estático da interface.

3. Illustrator

O Adobe Illustrator é um aplicativo para realização de trabalhos gráficos, focado no trabalho

com vetores. Como as áreas de trabalhos são customizáveis e o aplicativo possui inúmeros
ícones, a análise irá se ater à régua de ferramentas padrão que aparece ao ser selecionada
a opção “avançado”.

Os ícones do app parecem seguir também a tendência de referenciar o suporte impresso,

com incontáveis referências a materiais de papelaria. Quando há operações que não podem
ser traduzidas diretamente nas figuras desses objetos físicos, são utilizadas formas
geométricas simples que representam as operações.
 Começando pelos ícones que podem ser considerados materiais de
papelaria: há a figura do lápis, do conta-gotas, do estilete, da borracha e da
caneta tinteiro. As funções que realizam são análogas aos objetos reais,
mas em suporte digital. Há nessa dinâmica, porém, certas inconsistências:
enquanto a caneta gera retas ao clicar em pontos da tela, com o pincel
esse percurso deve ser realizado manualmente com o mouse. Essa
diferença de funcionalidade não é implícita a partir da ferramenta
representada, e deve ser aprendida conforme uso do aplicativo.

Interessante notar que essa lógica do “fazer manual” sai do âmbito da

seleção dos ícones e passa por todo vocabulário utilizado. Todas as peças
gráficas são feitas em “pranchetas”. Nesse sentido, o ícone de mão seria
como se o usuário pegasse fisicamente o que produziu e movesse através
do espaço vazio na tela.

Certas operações desafiam a ideia do fazer físico, pois são funcionalidades

que só podem ser entendidas mais facilmente em um contexto digital que
permite surgimento e edição espontânea de formas. Nesses casos são
utilizadas formas geométricas que tentam representar – com diferentes
graus de abstração – o que é produzido. As ferramentas girar, dimensionar,
espelhar e inclinar seguem essa linha de pensamento. Talvez esses sejam
os ícones mais interessantes, já que não buscam suporte no mundo físico
para facilitar a representação das operações.

4. COMENTÁRIOS GERAIS
A escolha dos aplicativos foi pautada pela busca da diversidade de finalidades: o Whatsapp
Web para comunicação; o Google Play Livros para a leitura; o Illustrator para a realização
de peças gráficas. Essas são algumas das principais operações realizadas diariamente pelo
aluno, e pareceu importante analisar individualmente um exemplo para cada um dos casos.

Nesse sentido, é interessante perceber o quanto os ícones dessas aplicações conversam

entre si, embora funcionem para fins distintos. A experiência de análise foi uma
comprovação prática do que foi discutido com a turma nas últimas semanas: interfaces e
ícones limitados pelas leis das boas práticas de usabilidade, o que faz com que a repetição
constante seja inevitável. Além disso, há também a presença constante da lembrança do
suporte impresso. Considerando que as novas gerações estão cada vez mais trabalhando
diretamente no computador, é interessante como essas comparações tornam-se cada vez
menos úteis em termos didáticos. O que fica é o costume – ou vício – de sempre trazer o
suporte impresso.
Vale também considerar que os aplicativos escolhidos são alguns dos mais utilizados no
mercado. Isso pode ter enviesado de alguma maneira a detecção desses padrões, já que
esses são os que sofrem mais com essas regras de UI previamente estabelecidas.