2 Aula 1 - Cultura da interface

Prévia do material em texto

Quando ouvimos a palavra “interface”, as imagens que saltam ao pensamento são, provavelmente, semelhantes à área de trabalho do nosso
computador e aos botões que podem ser ativados na tela de um aplicativo de celular. Nesse sentido, a interface digital é o que se posiciona entre
homem e máquina fazendo papel de tradutora, possibilitando o entendimento do funcionamento de aparelhos digitais. Essa função é essencial na
comunicação contemporânea, e para conferir esse fato basta observar o uso de smartphones, tablets e outros sistemas eletrônicos.
A concepção de interface, no entanto, ganha uma amplitude ainda mais significativa, se analisamos suas implicações com mais cuidado.
Redes sociais, videogames, celulares e tablets possuem uma enorme quantidade de objetos programados e funções executáveis e oferecem
possibilidades infindáveis de uso, que são reinventadas a cada minuto. Nesse contexto, as tecnologias de comunicação se tornam ambientes digitais
que possuem capacidades expressivas. Hoje, podemos entender as interfaces digitais não apenas como mediadoras, mas como ambientes
complexos.
Desse modo, como podemos dar início a uma compreensão dos elementos básicos da interface e de como ela os usa para comunicar possibilidades
de ação e, posteriormente, configurar um ambiente digital no qual podemos nos expressar culturalmente?
Apresentar o conceito de interface gráfica digital como uma forma de expressão originada ao longo da história dos computadores;
Analisar os diferentes elementos que compõem a linguagem da interface gráfica, mostrando como criam desde ferramentas até ambientes
culturais.
Por já ser algo tão corriqueiro na vida da maioria das pessoas interagir com aparelhos eletrônicos, atualmente, é difícil parar para pensarmos nas
etapas que precisaram ser cumpridas para chegarmos a esse ponto.
O primeiro objetivo desta aula é observarmos brevemente a história do desenvolvimento de interfaces digitais, mostrando como cada momento da
sua evolução introduziu novas características que hoje tornam possível atuarmos em uma cultura da interface.
Que estamos rodeados de computadores de diversos formatos (smartphones, tablets, notebooks e desktops) é algo fácil de notar; já afirmar que
esses objetos ultrapassam a condição de meras ferramentas para tornarem-se verdadeiros agentes que definem nossa cultura é um movimento
mais ousado. Como é possível comprovar isso na realidade?
Como ponto de partida, podemos nos localizar na era pré-interface gráfica, quando os computadores ainda estavam nos seus primeiros anos de
existência. O matemático Alan Turing, um dos inventores da computação moderna, por exemplo, girava e apertava botões diretamente ligados aos
circuitos dos enormes computadores que operava.
Design de Interação e Interfaces Digitais
Aula 1: Cultura da interface
Introdução
Objetivos
História da interface
Início da era dos computadores
Figura 1 - Alan Turing,
Fonte: Wikipedia Commons
Na Segunda Guerra Mundial, o cientista usou essa tecnologia para decifrar códigos alemães. Turing podia alterar o funcionamento dos circuitos e ver
o resultado de sua ação em tempo real, sem abstrações como textos, cursores, entre outros. Para conseguir interagir com um computador nesse
nível, porém, era preciso compreender sua arquitetura, as cadeias de correntes elétricas e as operações complexas que elas executavam.
Ao longo das décadas de 1950 e 1960, usuários menos capacitados podiam interagir com computadores por meio de “linhas de comando”. Bastava
digitar os códigos no teclado e esperar a máquina processar os dados de acordo com a ordem expressada. Ao mesmo tempo que esse modelo de
interface tornava as coisas um pouco mais fáceis, ele possuía a desvantagem de não exibir seus resultados diretamente ao usuário. Era preciso
digitar, por exemplo “apagar arquivo 1”, apertar enter e esperar o computador terminar a execução da ordem.
As linhas de comando eram eficientes para processar e armazenar dados e funções que potencializaram as aplicações práticas dos computadores.
Elas também viriam a ser usadas em videogames baseados em texto, como Colossal Cave Adventure (1977) e Zork (1979). Esses jogos tentavam
simular um ambiente imaginário por meio de letras, nos quais o jogador orientava personagens através de comandos como “ir para o leste”, “pegar
chave”, entre outros.
Os jogos de texto fizeram enorme sucesso nas décadas de 1970 e 1980 e estabeleceram códigos próprios de interação. Segundo Michael Nietsche
(2008), porém, uma interface em que informações visuais transmitem as possibilidades de ação em tempo real são mais acessíveis. Elas permitem
aos jogadores “interagir com o botão de um elevador dentro do espaço virtual de Counter-Strike”, por exemplo, sem precisar compreender códigos
mais complexos, como os comandos utilizados em Zork e outros jogos textuais.
A passagem das linhas de comando para a GUI (graphic user interface) estendeu esse efeito para todas as outras aplicações computacionais. Nos
videogames, isso é claramente visto com a adaptação de Colossal Cave Adventure para o Atari 2600. O jogo Adventure (1979) traduziu os textos e
comandos do seu antecessor para espaços navegáveis através do joystick. Dragões e chaves apareciam como desenhos reconhecíveis, e seus
movimentos e ações eram acompanhados diretamente, sem a necessidade de executar um comando por vez. Nos computadores pessoais, o
mesmo ocorreu: o primeiro mouse, projetado por Douglas Engelbart, passeava pela tela do display transformando os dados que habitavam o disco
rígido do computador em um espaço simulado.
Isso funcionava segundo um sistema de “mapeamento de bits”, desenvolvido por Engelbart com o propósito de vincular os pixels dos monitores às
informações guardadas na máquina. Assim começava a nascer uma nova linguagem de interação, assimilável com muito mais facilidade, além de
oferecer oportunidades novas para a expressão e criação por meio dos computadores (JOHNSON, 2001).
Quando ocorria um movimento do mouse para a direita, o cursor imediatamente obedecia. Quem usava o mouse podia ver o resultado de sua
manipulação imediatamente, o que causava a ilusão de que não havia um intermediário entre homem e máquina: o usuário sentia que estava
manipulando os dados diretamente, assim como Alan Turing – mesmo que essa “mágica” fosse obra de um truque de programação.
Esse primeiro momento da interface gráfica, embora simples, foi o estopim para a constituição de uma cultura digital abrangente e criativa. Segundo
Steven Johnson, embora Engelbart não tenha sido o primeiro a tentar exibir imagens por meio de computadores, ele foi o pioneiro na tentativa de
traduzir as informações binárias em um espaço-informação.
Graphic user interface
Mapeamento de bits
Cultura digital
http://pos.estacio.webaula.com.br/cursos/ATU170/aula1/img/Alan_Turing_Aged_16_(cropped).jpg
A diferença da linguagem visual para a linguagem da interface, portanto, está nas informações e dados que cada interface manipula. As imagens e
os textos são importantes, sem dúvida, mas as funções que eles executam são tão importantes quanto. Na primeira demonstração do uso de mouse,
Douglas Engelbart demonstrou este primeiro passo: o mouse trafegava pelo espaço e permitia clicar em hiperlinks de texto que levavam a um
gráfico ilustrativo.
Sendo assim, esse primeiro elemento da interface, o espaço-informação, poderia ser pensado como uma espécie de palco que viria a ser
preenchido com outras funções. Na primeira demonstração de Douglas Engelbart, podemos ver, por exemplo, o cientista clicando em hiperlinks que
levam a novos espaços com outras informações.
Figura 2 - O Xerox Alto, cujo monitor possuía uma orientação retrato.
Fonte: Wikipedia Commons
O espaço-informação, a partir daí, foi constantemente aprimorado, e desses momentos podemos destacar alguns mais significativos. Um centro de
pesquisa financiado pela Xerox, o Palo Alto Research Center, lançou, em 1973, um dos primeiros computadores para uso individual, o Xerox Alto.
Ele contava com uma interfacegráfica para ser usada com mouse e inaugurou o sistema de interfaces para computadores pessoais usado até hoje.
Mais tarde, esse sistema seria conhecido como WIMP: “windows, icons, menus and pointer” (janelas, ícones, menus e ponteiro). Esses elementos
podem ser pensados como uma espécie de sintaxe ou gramática das interfaces gráficas. Em outras palavras, são formas de comunicar
possibilidades de ação por meio de uma representação espacial, visual e de movimento.
É possível encarar o WIMP como uma sistematização do que Steven Johnson chama de metáforas visuais. Se o espaço pelo qual o mouse trafega é
o palco, as metáforas visuais seriam os atores da peça. A diferença é que cada metáfora visual, como ícones, por exemplo, pelo menos nesse
momento, não atuavam, e sim ofereciam possibilidades de ação aos usuários.
Espaço-informação
Elementos WIMP
http://pos.estacio.webaula.com.br/cursos/ATU170/aula1/img/a01_t08.jpg
Figura 3
Fonte: https://medium.com/@lucasbg/sistemas-operacionais-windows-x-linux-x-macos-be1b752e0ff0
Interface gráfica da área de trabalho do Macintosh (1984). Os elementos WIMP, nessa interface, já eram muito semelhantes na sua configuração às
aplicações contemporâneas. Tanto por parte das interfaces baseadas em Linux, quanto as da Microsoft e da Apple.
Metáforas visuais, portanto, fazem uso da linguagem cotidiana para nos comunicar ações possíveis de serem executadas pelo sistema do
computador: armazenar arquivos, escrever textos, “fechar janelas” etc. Para fins didáticos, podemos eleger essas metáforas como o segundo
elemento básico da linguagem da interface gráfica digital.
Atores importantes contribuíram para a solidificação desse sistema de interface realizando melhorias aqui e ali e desenvolvendo novas funções,
articuladas pelo espaço-informação. Podemos destacar a linhagem dos primeiros microcomputadores da Apple, do Apple II, passando pelo Apple
Lisa até o primeiro Macintosh.
A Apple, sob o comando da dupla Steve Wozniak e Steve Jobs, teve importante papel na popularização das interfaces baseadas em linguagem
gráfica. Logo a IBM entrou na disputa com a Apple, com preços mais competitivos. O mercado rapidamente seria dominado pelos computadores
pessoais (PC). As interfaces gráficas WIMP são os nossos canais de comunicação para lidar com esses sistemas.
No entanto, seguindo a hipótese de Steven Johnson (2001), precisamos pensar a interface não apenas como uma facilitadora de tarefas corriqueiras
como armazenar documentos, por exemplo. A interface gráfica digital torna-se, para o autor, aquilo que dispara uma mudança que gera uma nova
categoria cultural. Como isso acontece? Johnson defende sua proposta com uma análise do romance e da TV e como esses representam a vida
cotidiana nos séculos XIX e XX, respectivamente.
As mudanças da Revolução Industrial foram capturadas em romances como os de Charles Dickens. O rádio, a TV e o cinema transmitiram ao público
as narrativas que exploravam a modernização ocorrida no século XX. Na sociedade pós-moderna do final do século XX e do início do século XXI, o
tema a ser representado é o excesso de informação. A interface faria o papel duplo de facilitar nosso tráfego em meio a esse mar de dados, ao
mesmo tempo que mapeia nossa vida e a representa nas telas dos aparatos digitais. Todos os campos da vida cotidiana são representados e
vivenciados na interface: trabalho, lazer, amor, amizade etc.
É possível, portanto, perceber a diferença entre guardar um arquivo e criar ambientes culturais computacionais. As interfaces traduzem a linguagem
computacional para a linguagem cotidiana (KITTLER, 1995). A linguagem computacional é feita de processos elétricos e dados binários (bits). O
mapeamento de bits permite dar forma a esses dados. Por exemplo, pode-se criar imagens e movimentá-las, deletá-las, armazená-las etc.
O próximo passo é compreender como as interfaces gráficas conseguem simular um espaço simbólico que se expande para além da tela de um
monitor. A tela de um celular, por exemplo, é muito menor do que a quantidade de dados que ela pode mostrar com seus pixels. Para podermos
exibir vários dados e selecionar quais queremos ver (e quando), a interface cria uma dimensão de profundidade para sua linguagem. Propomos esse
como o terceiro elemento da linguagem da interface.
A área de trabalho (ou desktop) nasceu de uma inovação de Alan Kay, no Xerox PARC, que criou um espaço permanente no qual diversas aplicações
apareceriam e poderiam ser substituídas por outras. Segundo Steven Johnson, essa inovação dá ao computador mais do que espacialidade: ela traz
profundidade. Quando minimizamos um arquivo PDF e abrimos um vídeo, estamos sendo agentes de uma metáfora: seria como guardar uma folha
de papel na gaveta e pegar uma outra para ler. Assim, o que podemos ver no monitor é apenas o que está na nossa frente naquela hora: o espaço
profundo da interface se amplia para além da tela e para o que está “atrás”, guardado na memória interna do disco rígido.
Profundidade da interface e a criação de ambientes
Excesso de informação
Espaço simbólico
http://pos.estacio.webaula.com.br/cursos/ATU170/aula1/img/0_sSbv3ahcrgY4RMAo.gif
Figura 4 - Alan Kay
Fonte: Wikipedi Commons
Os designers de interface possuem a intrigante tarefa de comunicar formas de se locomover por esse espaço profundo, por meio de ações que
devem ser facilitadas pela organização do espaço em si. Johnson compara esse trabalho com o da arquitetura: quando escolhe as posições das
saídas e escadas em um edifício, o arquiteto possui um objetivo em mente. Em um prédio residencial, essas posições serão diferentes de como
seriam em um shopping; enquanto um prioriza elementos de praticidade cotidiana, o segundo leva em conta a necessidade de fazer o cliente
caminhar em volta do shopping por mais tempo a fim de, obviamente, maximizar as chances de o seu usuário comprar algo.
De forma semelhante, Alan Kay introduziu a metáfora do desktop de modo a facilitar a vida dos usuários de computadores, quando esses
realizassem tarefas simples. E sua inovação foi aperfeiçoada em diferentes frentes com diferentes efeitos. A batalha de sistemas operacionais travada
pela Microsoft e pela Apple, por exemplo, sugere como duas interfaces podem produzir atitudes culturais distintas a partir de suas organizações
espaciais e das informações que elas veiculam ao usuário.
Figura 5
Depois do Macintosh, lançado em 1984, a interface gráfica dos computadores da Apple prezaram pela fluidez nessa comunicação, enquanto os PCs
ainda conservavam a herança das linhas de comando e dos códigos mais complexos. Daí nasceu a visão, não necessariamente correta, de que a
Apple priorizava o trabalho artístico e visual nas suas aplicações. Essa visão ignora o fato de que a criação de imagens pode servir não
necessariamente como fim, mas como meio de comunicação com o usuário.
Como a introdução de uma dimensão de profundidade produz uma linguagem que cria ambientes? Vamos expandir o que entendemos por
ambiente no restante da Aula; por enquanto, podemos dizer que as interfaces, através da sua profundidade, podem ser mais do que ferramentas
para produzir resultados pragmáticos. Elas servem como lugares de expressão, de vivência e experiência. A internet torna isso evidente quando une
pessoas através de seus ambientes digitais, mas mesmo um computador na década de 1980 servia como ambiente de criação e manifestação da
cultura da época.
Macintosh x PC
A ação na inferface
http://pos.estacio.webaula.com.br/cursos/ATU170/aula1/img/a01_t12.png
http://pos.estacio.webaula.com.br/cursos/ATU170/aula1/img/figura5.jpg
Figura 6 - Telas da interface Magic Cap.
Fonte: www.researchgate.net [https://www.researchgate.net/figure/Figura-82-Interface-do-Magic-Cap-desenvolvido-para-PDAs-com-a-metafora-
de-uma-mesa-de_fig10_308971864]
Existe uma diferença fundamental entre essas interfaces e a interface WIMP do Macintosh: as janelas do Macintosh não possuem as mesmas
propriedades das janelas de uma casa real. A diferença entre a janela doMacintosh e a janela “de verdade” é o que torna a metáfora efetiva: a
metáfora vincula um processo da vida concreta (cada janela exibe uma paisagem) a um processo digital (abrir uma janela para ver um editor de texto
ou outra janela para ver um editor de imagens, por exemplo). Cada janela da interface exibe uma aplicação. Mas essas “janelas” podem ser movidas,
minimizadas e encerradas, ações impossíveis com uma janela “de verdade”.
Figura 7 - Tela da interface do Microsoft Bob.
Fonte: https://s2.glbimg.com
[https://s2.glbimg.com/OiJob0upQFQFsgoP1UbNygITZmU=/0x0:600x375/984x0/smart/filters:strip_icc()/i.s3.glbimg.com/v1/AUTH_08fbf48bc0524
877943fe86e43087e7a/internal_photos/bs/2020/o/f/A80VrXSkWxUBmuSeHdiw/bob.jpg]
O Microsoft Bob e o Magic Cap ignoravam essa diferença necessária entre o que a metáfora visual “imita” e o que ela executa de fato. Eles criaram
simulações de salas de trabalho, e não metáforas. O espaço-informação de uma área de trabalho não deve se aproximar totalmente da experiência
de uma sala de trabalho convencional. As duas aplicações tentaram simular processos cotidianos no computador, possibilitando experiências
familiares, mas que, assim como no cotidiano, podem facilmente tornarem-se tediosas e difíceis. O que os designers dessas ferramentas ignoraram é
que a tecnologia digital permite eliminar pequenos tédios e dificuldades, guardando apenas o familiar e a necessidade.
A organização do espaço-informação é um processo que depende diretamente da ação que o usuário faz dele. Sendo assim, é importante
reconhecer as unidades fundamentais da interface e quais espécies de espaço-informação podem ser construídos com diferentes combinações de
metáforas visuais. Igualmente importante é saber que tipos de ações os usuários desempenham. Podemos reduzir as ações dos usuários a algumas
categorias básicas, seja uma interface complexa, como a de um jogo eletrônico ou software de edição de vídeo ou uma interface mais simples, como
a de um site corporativo.
A primeira pista é o conceito de mapeamento de bits desenvolvido por Douglas Engelbart. Para Steven Johnson, relacionar os dados do computador
a uma lógica espacial cria uma metáfora visual. A pesquisadora Katheryn Hayles (1999) leva essa forma de pensar a outro nível. Descrevendo a
experiência de navegar em um espaço simulado digitalmente, a autora diz que “as fronteiras relevantes são definidas menos pela pele e mais pelo
círculo de feedbacks que conecta corpo e simulação, em um circuito integrado de forma biotecnológica”.
Que tipo de ação podemos exercer nessas interfaces? Obviamente, as mais variadas possíveis. Como dito anteriormente, porém, vamos começar das
mais simples. Se pensarmos as interfaces como ambientes digitais, precisamos de mecanismos para explorar esses ambientes. Para entender como
a exploração acontece, é possível recorrer à pesquisa de Hans Moravec (1988). Trabalhando com robótica no MIT, esse cientista percebeu que jamais
conseguiríamos criar robôs inteligentes e racionais se nem ao menos sabemos programá-los para executar tarefas aparentemente simples, como
abrir portas ou diferenciar uma fruta de uma granada de mão.
Organização do espaço-informação
Tipos de ação na interface
http://pos.estacio.webaula.com.br/cursos/ATU170/aula1/img/a01_t14a.png
https://www.researchgate.net/figure/Figura-82-Interface-do-Magic-Cap-desenvolvido-para-PDAs-com-a-metafora-de-uma-mesa-de_fig10_308971864
http://pos.estacio.webaula.com.br/cursos/ATU170/aula1/img/a01_t14b.webp
https://s2.glbimg.com/OiJob0upQFQFsgoP1UbNygITZmU=/0x0:600x375/984x0/smart/filters:strip_icc()/i.s3.glbimg.com/v1/AUTH_08fbf48bc0524877943fe86e43087e7a/internal_photos/bs/2020/o/f/A80VrXSkWxUBmuSeHdiw/bob.jpg
Figura 8
Fonte: https://www.gradiva.pt/autores/8998/hans-moravec
Moravec percebeu que o comportamento exploratório é presente na natureza e executado pelos animais mais primitivos. A partir disso, seu grupo no
MIT começou a tentar simular esse comportamento em robôs. O que isso pode ter a ver com interface? Hans Moravec dividiu as ações básicas da
exploração de ambientes, e é justamente isso que nos pode ser útil para pensar o mesmo tipo de comportamento nos ambientes simulados pelas
interfaces gráficas.
A primeira habilidade que compõe o comportamento exploratório é o movimento. Moravec mostrou que a inteligência animal só pôde se
desenvolver graças ao movimento. Seres vivos que não possuem essa capacidade, como as árvores, não desenvolveram qualquer coisa que
possamos chamar de inteligência. Mobilidade nos permite chegar a espaços com informações novas, que por suas vezes podem nos nutrir de forma
positiva ou negativa. Só com o movimento podemos chegar às fontes de diferença necessárias para a realização de tarefas novas.
A pista que o mapeamento de bits nos dá é que o movimento também foi a primeira habilidade desenvolvida na cultura da interface, com o mouse
de Engelbart. Não é à toa que Steven Johnson elegeu esse como o momento inaugural da cultura da interface: ele é o primeiro passo para a
constituição de ambientes digitais. O círculo de feedbacks (HAYLES, 1999) entre um ser humano, o mouse, o computador e a tela produziram a
capacidade de representar a movimentação e a locomoção, as habilidades mais básicas e fundamentais da cultura da interface.
Porém, não se pode parar aqui. O movimento puro e simples só é funcional se aplicado de forma sistemática. É preciso ter alguma ideia de onde
queremos chegar, o que queremos achar e como faremos pra voltar para o lugar de onde saímos. A habilidade de construir relações entre diferentes
pontos do espaço é a navegação. Navegar significa coordenar o próprio movimento para evitar ameaças, otimizar o trajeto e as ações que se precisa
realizar no caminho.
Obviamente não é coincidência que o verbo “navegar” é usado frequentemente para se referir à experiência de agir na internet. E também não é
coincidência que muitos sites, há alguns anos, possuíam “mapas” que esquematizavam as conexões entre as páginas, com a meta de facilitar o uso.
Hoje a maioria das interfaces procura construir esse mapa de forma intuitiva; elas são planejadas de modo a permitir que os usuários identifiquem as
possibilidades de ação imediatamente e possam fazer o que desejam da forma mais fluida. Cada função de uma interface se posiciona em pontos do
espaço-informação.
Portanto, a capacidade de fazer com que o usuário ache e execute uma função de forma “intuitiva” é construir mecanismos de navegação (mesmo
que sutis), ou seja, mecanismos que o ajudem a construir um plano de movimento e ação no ambiente.
As últimas habilidades identificadas por Moravec na prática da exploração são o reconhecimento e a manipulação. Logicamente, mais do que nos
movimentar e navegar, geramos mudanças nas interfaces com as quais interagimos. É assim que criamos cadeias de feedbacks que nos permitem
entender como elas funcionam e agir novamente para ver e criar coisas novas. A manipulação, porém, exige antes o reconhecimento de funções.
Outra tarefa importante do designer de interface, portanto, é mostrar ao usuário o que é possível fazer naquele ambiente.
Novamente, a raiz desse processo está no mundo concreto. O psicólogo James J. Gibson (1986) já havia demonstrado, em sua pesquisa sobre a
percepção visual, que um ambiente nos informa a todo momento o que podemos fazer nele. O chão possibilita sustentação, e uma árvore informa
que podemos descansar sob a sua sombra. Essas possibilidades são diferentes para cada organismo: um pássaro enxerga em uma árvore a
possibilidade de pousar ou construir um ninho, e a água possibilita sustentação a certos insetos, mas não a seres humanos.
Movimento
Círculo de feedbacks
Reconhecimento e manipulação
http://pos.estacio.webaula.com.br/cursos/ATU170/aula1/img/a01_t16.png
Gibson deu o nome de affordances às possibilidades de ação que cada elemento do ambiente informa a cada organismo. Esse conceito serviu
perfeitamente aos designers, já que seu trabalho é justamente possibilitar, através da forma dada a objetos,um certo tipo de ação possível. Nesse
sentido, por mais que não pensemos nisso imediatamente, cada objeto do dia a dia, desde maçanetas até portas de emergência, é pensado com o
objetivo de comunicar e possibilitar seus usos desejáveis através de sua forma, cor, peso, textura etc. (NORMAN, 1990; 1999).
Figura 9: Abrir manualmente uma torneira é um exemplo de affordance.
Fonte: Wikipedia Commons
Esses atributos são concebidos com um usuário ideal em mente. Uma criança, por exemplo, pode não ter altura para usar uma maçaneta, e os
problemas de acessibilidade nas grandes metrópoles são falhas de quem não prevê a existência de deficientes físicos em espaços urbanos. Isso
mostra que as ações possíveis dependem tanto do instrumento quanto do usuário; os processos são feitos em conjunto pelos dois, e as affordances
surgem quando eles se unem.
O mesmo se pode aplicar a interfaces gráficas digitais. Elas são organizadas computacionalmente e espacialmente de forma a possibilitar a
integração entre usuário e máquina; desse pareamento, affordances únicas emergem. Mas qual seria a essência das interfaces em relação a uma
xícara, uma porta ou uma calculadora? Todos esses são objetos aos quais nos conectamos para gerar processos únicos.
No contexto dessa pergunta, volta a ser importante pensar as interfaces digitais como ambientes que produzem condições de manifestação da
cultura humana. É seguro afirmar que esses ambientes devem ser analisados segundo suas particularidades, e o design das interfaces determina o
que se pode fazer neles, como essas ações podem ser achadas e executadas e ainda pode possibilitar a formação de novas conexões entre os
elementos da interface para se expressarem criativamente (algo que acontece nas redes sociais, por exemplo, com bastante frequência).
Durante a última aula, falamos sobre computadores e suas interfaces. Ao longo da história mais recente da tecnologia digital, novos suportes
começaram a ganhar importância na comunicação entre as pessoas. Sobretudo, estamos falando de smartphones e tablets, aparelhos que possuem
uma diferença fundamental em relação aos computadores: a maioria dos modelos mais usados e cobiçados, como o iPhone e a linha Galaxy da
Samsung, usam telas sensíveis ao toque – não há ponteiro ou mouse. Apesar disso, é possível dizer que suas interfaces fazem uso dos mesmos
conceitos básicos que estudamos aqui.
Affordances
Interfaces gráficas digitais
Atividade proposta
http://pos.estacio.webaula.com.br/cursos/ATU170/aula1/img/figura8.jpg
Como podemos relacionar a interface do iPhone com os seguintes conceitos: mapeamento de bits/espaço-informação; metáforas visuais; e
profundidade da interface?
Chave de resposta: Mapeamento de bits/espaço-informação: 
No que se refere a esse tipo de recurso, um smartphone touch-screen (como o iPhone) faz algo análogo ao que o mouse de Engelbart
introuduziu há décadas atrás. Afinal, ele usa mecanismos de detecção e rastreamento de toques e movimento do dedo e vincula esses
processos a uma representação que aparece na tela (um ícone se movendo, uma janela se abrindo etc.). Isso é possível porque um espaço-
informação foi criado pela vinculação entre o espaço da tela sensível ao toque e os dados armazenados no disco rígido do aparelho. 
Metáforas visuais: Praticamente todas as imagens que provocam alguma mudança quando tocadas comunicam que mudanças serão
essas. Essa comunicação é feita através de metáforas visuais: ícones que representam aplicativos são os exemplos mais claros. Por suas
vezes, as interfaces desses aplicativos provavelmente farão uso de imagens que podem ser tocadas para produzir as funções da aplicação:
a visualidade dessas imagens comunica possibilidades de interação (affordances). 
Profundidade da interface: Os smartphones mantêm uma das mais importantes características das interfaces gráficas digitais, a
profundidade, e faz isso através do gerenciamento do espaço-informação. Quando usamos múltiplos aplicativos simultaneamente, por
exemplo, os mecanismos que executamos para navegar entre as janelas denota a profundidade da interface, que simula um espaço maior
que a tela do telefone.
Exercícios de fixação
Os computadores, antes da invenção do mouse, exigiam um entendimento relativamente complexo de seu funcionamento. Com o uso do mouse,
demonstrado pela primeira vez por Douglas Engelbart, é possível que o usuário compreenda suas ações sem necessariamente entender como um
computador funciona. Como é possível explicar esse fenômeno?
O mouse aparenta ser mais fácil de ser usado porque usa um código mais complexo e com mais possibilidades. O usuário precisa pensar em
cada ação que está fazendo e raciocinar logicamente para usar esse código da melhor maneira.
Engelbart programou o mouse de forma que quem o movimentasse pudesse ver o resultado da ação imediatamente exposto na tela. Em pouco
tempo, o usuário aprende o que cada movimento causa sem necessariamente perceber esse aprendizado.
O mouse é controlado por movimento, o que quer dizer que existe uma dimensão não digital no processo de interação. Assim, é possível
ultrapassar a linguagem da máquina, que é intraduzível para o ser humano.
O mouse é eficiente porque o usuário não precisa compreender os resultados visuais das suas ações na tela. Isso facilita o processo de interação
para pessoas pouco acostumadas com tecnologia, que podem compreender suas ações apenas através do movimento.
O “truque de programação” usado por Engelbart, e que é repetido até hoje, é o mapeamento de bits. Ele é responsável por construir o palco no qual
a cultura da interface se manifesta. Como é possível descrever esse truque em poucas palavras?
Mapeamento de bits é uma metáfora usada para descrever a manipulação de dados brutos. Embora possa parecer, esses dados não estão
vinculados ao espaço bidimensional da tela. Eles estão encerrados na memória interna do aparelho e não produzem efeitos visuais e espaciais.
O mapeamento de bits é uma forma de perceber o movimento do mouse e transformá-lo em dados. O usuário movimenta o mouse (ou outra
ferramenta), e a máquina mapeia esse processo e transforma a tela em uma simulação bidimensional.
Mapeamento de bits é o processo de simular um espaço bidimensional no interior do disco rígido do computador. O papel da interface é apenas
exibir imageticamente a forma que esses dados assumem no interior da máquina.
Mapear bits significa ligar os pixels (as menores unidades da imagem exibida em uma tela de computador) aos dados binários armazenados no
disco rígido. Engelbart ligou a memória do computador ao espaço da tela, possibilitando que esse espaço fosse manipulado com ferramentas
como o mouse.
Apresentamos na aula o conceito de espaço-informação, sendo possível descrevê-lo como uma linguagem que informa através de uma organização
espacial que permite a ação do usuário. Qual seria um exemplo incorreto desse conceito?
Um site pode construir através das suas cores, fontes do texto e formato dos menus e botões, informando ao usuário certas características, como
tradição, bom humor, seriedade etc. Tudo depende da visualidade imaginada pelos designers.
Uma página na internet pode exibir no seu topo diversas bandeiras de países que indicam os idiomas nos quais ela está disponível. O usuário
pode clicar e lê-la em outra língua.
Um editor de texto simula um espaço bidimensional em forma de página, que nos permite digitar e formatar um texto e ver como ele será
impresso.
Uma editor gráfico permite, através de ferramentas diversas, alterar o brilho, as cores, as dimensões e até mesmo a forma de imagens. As
possibilidades de manipulação são comunicadas pelo espaço da interface.
Se o espaço-informação é a base para a construção da interface, a metáfora visual seria um dos tipos de peças que compõem seu cenário. Como é
possível descrever sua função?
Metáfora visual é o processo que ocorre quando o usuário manipula uma imagem no computador. Embora ele visualize a imagem na tela, a
metáfora é feita nos circuitos internos da máquina.A metáfora visual é uma simulação das tarefas que fazemos no dia a dia. Os designers de interface tentam transferir para o mundo digital
processos como guardar arquivos. Quanto mais parecidos eles forem com a realidade, mais eficiente a metáfora visual será.
A metáfora visual é um recurso para estabelecer a identidade visual da interface. E a aparência dos objetos é mudada de acordo como a vontade
do designer, que influencia o usuário através de cores e formas.
A metáfora visual indica uma tarefa possível de ser realizada através de uma imagem, ícone, botão ou forma manipulável na tela. Por exemplo,
um “botão” com um “X” desenhado é uma metáfora que indica a possibilidade de encerrar uma aplicação na interface.
Para Steven Johnson, o erro das interfaces Magic Cap e Microsoft Bob é levar a função das metáforas visuais muito ao pé da letra. Por que esse erro
gera consequências tão graves?
As interfaces eliminaram muitas etapas presentes em tarefas cotidianas. Para compreender uma metáfora visual, o usuário precisa realizar a
tarefa exatamente da maneira como ele a executa no seu dia a dia, mesmo que isso signifique uma experiência tediosa.
O erro gera consequências ruins, pois a tela do computador não conseguia, principalmente naquela época, simular espaços compreensíveis para
o usuário. Dessa forma, ela se torna pouco eficiente, pois resulta em um espaço pouco convincente.
As interfaces possuem design visual muito pobre, misturando muitas cores e formas numa mesma tela. Isso confunde o usuário, que pode não
perceber a metáfora visual que indica a função desejada naquele momento.
Porque no computador temos a possibilidade de eliminar etapas tediosas de um determinado processo. Por exemplo, se quisermos sair de um
navegador web e abrir um jogo, basta trocar de janelas. As interfaces citadas obrigavam o usuário a percorrer muito mais etapas, como se mover
por um espaço virtual muito amplo para trocar de aplicação.
Uma das premissas para tratarmos as interfaces gráficas como formas de expressão cultural é a de que elas podem criar ambientes, e não apenas
ferramentas com usos pragmáticos. Com isso em mente, considere as afirmações:
I. As interfaces são fundamentais para armazenar as memórias culturais no nosso mundo. Isso as torna ambientes responsáveis por organizar os
verdadeiros componentes da nossa cultura.
II. Podemos chamar as interfaces digitais de ambientes porque os dados binários aos quais elas se associam formam ambientes matemáticos no
interior dos discos rígidos dos computadores.
III. Além de finalidades “práticas” como guardar documentos em arquivos, o usuário pode explorar a interface para descobrir maneiras de criar e
compartilhar dados e informações, aumentando as possibilidades de expressão individual e colaborativa.
IV. As interfaces oferecem a possibilidades de ação e manifestação de relações de amizade, trabalho e trocas culturais em geral.
Quais delas representam corretamente as motivações que nos permitem chamar certas interfaces de ambientes digitais?
I e III
I, II e IV
II, III e IV
III e IV
Ao criar a metáfora do desktop, Alan Kay inventou um mecanismo que facilita a ação do usuário e cria profundidade para a interface. Por que esse
desenvolvimento é tão importante para a produção de ambientes digitais nos computadores?
O desktop funciona como a principal área de atuação do usuário. Sendo assim, essa profundidade significa que o usuário precisa manipular
menos aplicações e tem menos possibilidades de ação, o que o impede de “se perder” no meio delas.
O desktop reúne todas as ferramentas práticas de um computador: possibilita acessar pastas e guardar documentos. Sendo assim, sua função é
facilitar a principal finalidade dos computadores: armazenagem de dados.
Sabemos que dados binários podem representar imagens, vídeos, sons e várias outras formas expressivas. Dar profundidade à interface significa
possibilitar que o usuário experimente, manipule e execute esses dados na ordem que achar melhor, pois pode organizá-los no espaço virtual
com mais eficiência.
O desktop adiciona profundidade, pois ele é a primeira camada do espaço-informação. Ele é feito a partir do mapeamento de bits e, portanto,
possibilita a simulação de um ambiente.
Para a autora Katherine Hayles, existem duas maneiras de pensar a relação entre humano e máquina. Tudo depende do ponto de vista sob o qual
consideramos a relação entre os dois. O ponto de vista antigo, para Hayles, posiciona uma barreira entre nós e o que é maquinal. Como é possível
resumir a proposta da autora para repensar essa dicotomia?
É preciso repensar a diferença entre ser humano e máquina. Se compreendermos que não é possível estabelecer uma comunicação totalmente
efetiva, chegaremos à conclusão de que os ambientes digitais são, no fundo, máquinas de calcular e processar dados.
A autora propõe que os computadores irão romper com a lógica das relações humanas. As pessoas passarão a se relacionar apenas através do
mundo digital. Como isso é inevitável, resta apenas criar condições propícias para essas relações digitais.
Hayles alega que não existe diferença entre humano e máquina. No contexto da tecnologia atual, é possível perceber que os computadores
estão cada vez mais complexos, e já não há diferenças entre interagir com eles ou com outras pessoas.
Podemos relevar a diferença que existe entre humano e máquina e pensar as trocas de informações que podem ocorrer entre eles. Assim,
compreendemos um fluxo contínuo de comunicação que nos possibilita agir em um ambiente digital, por exemplo.
Nesta aula:
Compreendeu o conceito de interface gráfica digital como um espaço organizado de forma a permitir ações do usuário;
Investigou os componentes da interface: o espaço-informação criado pelo mapeamento de bits, as metáforas visuais que o ocupam e sua
profundidade;
Percebeu que esse tipo de organização pode dar origem a ambientes digitais exploráveis, que abrigam a possibilidade de manifestações
criativas e culturais.
Na próxima aula:
O uso da palavra interatividade no contexto da tecnologia digital e como podemos problematizá-la;
Uma discussão mais cuidadosa do que significa interagir com mídias digitais e suas interfaces.
GIBSON, James J. The Ecological Approach to Visual Perception. Londres: Psychology Press, 1986.
Hayles, N. Katherine. How We Became Posthuman: Virtual Bodies in Cybernetics, Literature, and Informatics. Chicago: University of Chicago Press,
1999.
JOHNSON, Steven. Cultura da interface: como o computador transforma nossa maneira de criar e comunicar. Rio de Janeiro: Jorge Zahar Editor, 2001.
KASTRUP, Virgínia. A invenção de si e do mundo: Uma introdução do tempo e do coletivo no estudo da cognição. Belo Horizonte: Autêntica, 2007.
KITTLER, Friedrich. There is no software. 1995. Disponível em: http://www.ctheory.net/articles.aspx?id=74 [http://www.ctheory.net/articles.aspx?id=74] .
Acesso: 07 fev. 2014.
MORAVEC, Hans. Mind Children: The future of robot and human intelligence. Cambridge, Massachussetts: Harvard University Press, 1988.
NITSCHE, Michael. Video Game Spaces: Image, Play, and Structure in 3D Worlds Cambridge: The MIT Press, 2009.
NORMAN, Donald. The Design of Everyday Things. New York: Doubleday, 1990.
NORMAN, Donald. Affordance, conventions, and design. Interactions, v. 6, n. 3, p. 38-43, 1999.
Propomos a exploração como a principal forma de se comportar nas interfaces gráficas. Qual das alternativas a seguir não representa um motivo
pelo qual podemos dizer que exploramos os ambientes digitais?
Ambientes digitais são navegáveis. Isso significa que temos diversas rotas possíveis de serem seguidas e diversos destinos aos quais podemos
chegar. Para não chegarmos ao destino errado, é preciso planejar as ações e escolher o melhor percurso.
Ambientes digitais são navegáveis. Como são digitais, funcionam numa lógica binária. Navegar nos ambientes significa compreender sua
natureza matemática e saber fazer exatamente o que queremos.
É possível se movimentar em ambientes digitais.Como os dados do computador são mapeados pela interface, o resultado é uma simulação
espacial que nos permite a locomoção: mudar de pastas, arquivos, mover o cursor e a barra de rolagem. Todas essas ações representam o
movimento em um ambiente.
É possível se movimentar em interfaces gráficas. Cada uma delas estipula suas regras de movimentação. Por exemplo, em um jogo como
Adventure, o jogador move o quadrado pelos corredores com “paredes” que impedem o movimento. Em um site, os hiperlinks e botões podem
nos mover para outras áreas.
A affordance, para o psicólogo James Gibson, é a possibilidade de ação que surge do pareamento entre dois ou mais elementos em um ambiente,
ação essa que só pode acontecer quando eles se unem. Nos ambientes digitais, esses elementos podem ser pessoas e funções da interface, por
exemplo. Qual das opções a seguir não representa uma affordance?
Em um computador, é possível computar qualquer problema calculável de forma binária e representar qualquer dado armazenável dessa
maneira.
Uma pessoa pode usar um microfone e o botão “REC” em um software de gravação de som para criar um arquivo digital de áudio com sua voz.
É possível usar o recurso de criação de grupos do Facebook para organizar uma comunidade com o objetivo de traduzir um artigo ou texto de
forma colaborativa.
Um pesquisador pode usar um mecanismo de busca em um site de notícias para organizar um banco de dados com todas as matérias sobre um
determinado assunto.
Síntese
Próxima aula
Referências
http://www.ctheory.net/articles.aspx?id=74