A influência das tendências e estilos no design...

1
UNIVERSIDADE DO VALE DO RIO DOS SINOS
CENTRO DE CIÊNCIAS DA COMUNICAÇÃO
CURSO DE COMUNICAÇÃO SOCIAL
HABILITAÇÃO EM PUBLICIDADE E PROPAGANDA
Newton Cavagni Facchini
A INFLUÊNCIA DAS TENDÊNCIAS E ESTILOS NO DESIGN PARA A
INTERNET: REFLEXÕES SOBRE A EXPERIÊNCIA ESTÉTICA DO
USUÁRIO
São Leopoldo
2008

2
UNIVERSIDADE DO VALE DO RIO DOS SINOS
CENTRO DE CIÊNCIAS DA COMUNICAÇÃO
CURSO DE COMUNICAÇÃO SOCIAL
HABILITAÇÃO EM PUBLICIDADE E PROPAGANDA
Newton Cavagni Facchini
A INFLUÊNCIA DAS TENDÊNCIAS E ESTILOS NO DESIGN PARA A
INTERNET: REFLEXÕES SOBRE A EXPERIÊNCIA ESTÉTICA DO
USUÁRIO
Monografia apresentada à Universidade do Vale
do Rio dos Sinos como requisito para a obtenção
do título de Bacharel em Comunicação Social –
Hab.: Publicidade e Propaganda
Orientador: Marcos Nähr
São Leopoldo
2008

3
DEDICATÓRIA
Aos meus pais, Ampélio e Angela,
e, em especial, à Josi, minha Josi.

4
AGRADECIMENTOS
Agradeço a todos que de alguma forma contribuíram para a concretização deste
trabalho, em especial, aos citados a seguir:
· Prof. Marcos Nähr, pela orientação e atenção dispensadas;
· Prof. Dra. Nísia Martins do Rosário, pelas valiosas dicas na disciplina de Pesquisa
em comunicação;
· Prof. Dra. Rosane Kaminski, pela atenção e pelos conhecimentos transmitidos
mesmo à distância;
· À W3Haus, pela importante colaboração com a pesquisa;
· A todos que durante o curso contribuíram de alguma maneira para o meu
aprendizado;
· A todos os meus amigos;
· Às minhas primas Caroline e Paula, pela ajuda e carinho demonstrados;
· À minha irmã Carina, por todos os anos de efetivo apoio.

5
EPÍGRAFE
“Tudo começa pelo olhar.”
(Aristóteles)

6
RESUMO
Este trabalho tem como objetivo apresentar um estudo referente aos aspectos de
função estética em produtos para a internet, assim como, dos seus efeitos com relação à
percepção visual dos usuários. Para isso, aborda a interferência do projeto de branding, das
tendências visuais e do estilo próprio das agências dentro do processo de design. O referido
estudo, considerando o trabalho realizado por uma agência digital gaúcha, tem como desígnio
detectar elementos gráficos que manifestem a influência de estilo e tendências visuais e
procura posicioná-los como aspectos que podem vir a influenciar o resultado visual do
produto e a experiência estética do usuário.
Palavras-chave: processo de design para a internet, tendências, estética, estilo.

7
SUMMARY
This work has as objective presents a study regarding the aspects of aesthetic function
in products for the internet, as well as, of their effects regarding the users' visual perception.
For that, it approaches the interference of the branding project, of the visual tendencies and of
the own style of the agencies inside of the design process. Referred him study, considering the
work accomplished by an agency digital gaucho, he/she has as purpose to detect graphic
elements to manifest the influence of style and visual tendencies and it tries to position them
as aspects that can come to influence the visual result of the product and the user's aesthetic
experience.
Key-words: design process for the internet, tendencies, aesthetics, style

8
LISTA DE ILUSTRAÇÕES
Figura 1: Design Industrial e suas subcategorias .................................................................. 18
Figura 2: Localização do webdesign dentro do esquema proposto por Villas-Boas
(1999)................................................................................................................ 19
Figura 3: Modelo de interface do MS-DOS.......................................................................... 30
Figura 4: Modelo de interface do Second Life...................................................................... 31
Figura 5: Categorias comuns de websites............................................................................. 33
Figura 6: Processo genérico de desenvolvimento de websites............................................... 38
Figura 7: Exemplo de documento de arquitetura da informação ........................................... 42
Figura 8: Exemplo de documento de arquitetura da informação simples............................... 44
Figura 9: Exemplo de documento de arquitetura da informação complexo. .......................... 45
Figura 10: Urinóis................................................................................................................ 56
Figura 11: Interface gráfica do website da Havaianas........................................................... 57
Figura 12: Homepage do website Vinagres Parras ............................................................... 59
Figura 13: Homepage do website Vinagres Prinz................................................................. 60
Figura 14: Arranjo formal com baixíssimo nível de pregnância visual ................................. 64
Figura 15: Homepage do website Pitt Jeans ......................................................................... 66
Figura 16: Unidade visual do website Pitt Jeans................................................................... 67
Figura 17: Cartazes no estilo Art Nouveau........................................................................... 72
Figura 18: Evolução da tipografia. ....................................................................................... 74
Figura 19: Diferença de estilo em websites .......................................................................... 77
Figura 20: Desenhos em Pixel Art ....................................................................................... 79
Figura 21: Interfaces gráficas do estilo web 2.0.................................................................... 80
Figura 22: Logos, ícones, botões e splashes no melhor estilo web 2.0 .................................. 81
Figura 23: Ícones do OS X da Apple.................................................................................... 82
Figura 24: Interface gráfica do OS X da Apple .................................................................... 83
Figura 25: Exemplo de interfaces em HTML ....................................................................... 84
Figura 26: Exemplo de interfaces em Flash ......................................................................... 84
Figura 27: Exemplo de interfaces projetadas em HTML/Flash............................................. 85
Figura 28: Exemplo da influência de tendências visuais....................................................... 86
Figura 29: Sites projetados pela W3Haus............................................................................. 91
Figura 30: Homepage do website Dell Anno........................................................................ 92
Figura 31: Homepage do website Favorita ........................................................................... 92

9
Figura 32: Homepage do website Grendene ......................................................................... 93
Figura 33: Homepage do website Tramontina ...................................................................... 94
Figura 34: Homepage do website Converse All Star............................................................. 95
Figura 35: Homepage do website Telasul............................................................................. 96
Figura 36: Homepages dos websites Ilha Bela e Bibi ........................................................... 96
Figura 37: Projeto gráfico e aspectos de influência............................................................... 98
Figura 38: Projeto gráfico e influências sofridas .................................................................. 99
Figura 39: Projeto gráfico e aspectos de influência..............................................................100
Figura 40: Processo de desenvolvimento e relação site/usuário ...........................................102

10
SUMÁRIO
1 INTRODUÇÃO................................................................................................................ 11
2 CARACTERÍSTICAS GERAIS DO DESIGN.................................................................. 13
2.1 DEFINIÇÃO DE DESIGN......................................................................................... 13
2.2 ÁREAS DO DESIGN ENQUANTO ATIVIDADE PROJETUAL.............................. 16
2.3 ASPECTOS QUE ENVOLVEM O PROJETO DE DESIGN...................................... 19
2.3.1 Aspectos de Função Prática............................................................................... 21
2.3.2 Aspectos de Função Simbólica.......................................................................... 23
2.3.3 Aspectos de Função Estética ............................................................................. 24
3 DESIGN PROJETADO PARA A INTERNET.................................................................. 25
3.1 DESIGN PARA A INTERNET .................................................................................. 25
3.2 CONCEITO DE INTERFACE................................................................................... 28
3.3 TIPOS DE WEBSITES ............................................................................................... 32
3.4 USABILIDADE NA WEB ......................................................................................... 34
3.5 PROCESSO DE DESIGN PARA A INTERNET........................................................ 36
3.5.1 Arquitetura da Informação ................................................................................ 41
3.5.2 Projeto de Interface........................................................................................... 42
3.5.3 Design Gráfico e Branding................................................................................ 46
4 A FUNÇÃO ESTÉTICA NO DESIGN PARA A INTERNET........................................... 50
4.1 CONCEITO DE ESTÉTICA...................................................................................... 50
4.2 RELAÇÃO ENTRE FUNÇÃO ESTÉTICA E FUNÇÃO PRÁTICA.......................... 53
4.3 GESTALT E AS LEIS DA PERCEPÇÃO VISUAL.................................................... 62
5 ESTILO E TENDÊNCIAS NO PROCESSO DE DESIGN DAS AGÊNCIAS DIGITAIS . 70
5.1 ESTILO E DESIGN ................................................................................................... 70
5.2 ESTILO E TENDÊNCIAS NO DESIGN PARA INTERNET..................................... 76
5.2.1 TENDÊNCIAS E ESTILOS VISUAIS .............................................................. 78
6 ESTUDO DE CASO: W3HAUS....................................................................................... 87
6.1 METODOLOGIA APLICADA.................................................................................. 87
6.2 ENTREVISTA COM A AGÊNCIA........................................................................... 87
6.3 CONSIDERAÇÕES SOBRE A ENTREVISTA E ANÁLISE .................................... 90
7 CONCLUSÃO.................................................................................................................104
REFERÊNCIAS .................................................................................................................106
APÊNDICE A – CARTA CONVITE .................................................................................112
APÊNDICE B – INFORMAÇÕES E QUESTIONÁRIO....................................................113
APÊNDICE C – RESPOSTAS OBTIDAS DA AGÊNCIA W3HAUS................................115
APÊNDICE D – E-MAIL 01 PARA ROSANE KAMINSKI ..............................................120
APÊNDICE E – RESPOSTA E-MAIL 01 ..........................................................................122
APÊNDICE F – E-MAIL 02 PARA ROSANE KAMINSKI..............................................125
APÊNDICE G – RESPOSTA E-MAIL 02..........................................................................126

11
1 INTRODUÇÃO
A internet é considerada atualmente um dos meios de comunicação mais importantes e
dinâmicos de todos. Sua importância nesse sentido pode ser mensurada ao se perceber o
número cada vez maior de usuários que se conectam à rede de computadores ao redor do
mundo todos os dias. O aumento considerável do nível de audiência da internet envolve
também o acentuado número de produtos digitais que a recheiam a cada instante. Websites
corporativos e de comércio eletrônico, comunidades virtuais colaborativas, portais de notícias,
ferramentas de busca, sites de entretenimento e blogs são apenas alguns exemplos da
diversidade comunicacional proporcionada por essa hipermídia. Dessa forma, a web, como
também é conhecida a rede mundial de computadores, passa a ser um campo cada vez mais
explorado.
Por outro lado, o projeto de produtos para a web, ou design para a internet, é uma
atividade ainda a ser consolidada se comparada ao design gráfico para mídias impressas, o
qual suporta mais de um século de história gráfica e visual. Com quase duas décadas de
atividade comercial no mundo, a internet pode ser avaliada como um meio visual, sem deixar
de considerar a questão tecnológica que é digna de méritos por proporcionar a sua existência e
seu funcionamento. Contudo, a relação das pessoas com um produto da web é, primeiramente,
visual, ou seja, a comunicação visual é um fator determinante para o sucesso de uma relação
entre um usuário e a entidade que está por trás do website e o identifica com sua marca. Além
disso, é através dos elementos visuais de um produto para a rede que o usuário poderá
facilmente utilizá-lo, o que caracteriza a importância da interface gráfica de um site também
em sua relação utilitária com o usuário. Por último, o conjunto visual de um produto para a
web é decisivo para que o usuário manifeste algum juízo sobre o mesmo. Dessa forma, para
que o usuário tenha uma boa experiência de uso, é imprescindível considerar todas essas
questões. Parece claro que projetar websites que comuniquem, sejam de fácil utilização e
visualmente agradáveis, é hoje o maior desafio dos designers e das agências digitais. Assim, é
essencial entender como os profissionais articulam a questão visual e sua função estética na
realização de seus trabalhos.
Neste trabalho, os aspectos de função estética dos produtos para a internet constituem
a base de todos os estudos, principalmente no que diz respeito à relação estética que se dá
entre um usuário e um produto digital para a web. Sendo assim, pode-se resumir o problema
de pesquisa com duas perguntas:

12
Como ocorre a relação estética entre um usuário e um website?
Qual a participação do projeto gráfico para a internet - o que inclui a influência do
estilo das agências e das tendências visuais - nessa relação estética?
Para respondê-las é preciso averiguar o que vem a ser o design e como funciona o
processo de design para a internet, principalmente no que diz respeito ao projeto gráfico e
projeto de branding (gestão e posicionamento de marca) em um produto para a web. Após,
necessário é que se investiguem as definições de estética, qual sua relação com o design e
como ela se manifesta nos produtos e interfere na percepção visual do usuário. Por fim,
pretende-se verificar como as tendências visuais e estilos das agências influenciam no
resultado visual final dos produtos para a web e como essa constatação pode ser importante
para a questão da experiência estética do usuário. Nesta última etapa, inclui-se um estudo de
caso acerca de uma agência digital gaúcha.
O objetivo geral deste trabalho é analisar o processo de design gráfico das agências
digitais, considerando a interferência de estilos e tendências visuais no resultado gráfico final,
além de investigar os efeitos desse resultado para a percepção estética do usuário acerca do
produto digital. Trata-se de buscar compreender a importância da estética na vida das pessoas
e a importância do estilo para uma agência digital, uma vez que, a relação que ocorre entre
estes dois fatores representa um convite a refletir sobre o papel do design gráfico na
comunicação digital e sobre a importância de se pensar o fator estético já no processo de
design.
Cabe ressaltar que tratar de um assunto como o abordado por este trabalho é altamente
significativo por vários motivos. Pode-se lembrar, primeiramente, da importância do design
gráfico para a comunicação contemporânea. Em se tratando do meio digital, onde a interação
se dá através de interfaces gráficas, o valor do design gráfico fica ainda mais evidente. Assim,
buscar compreender o atual estado do design gráfico feito para a web é compreender o atual
estado da comunicação visual na internet.
Acredita-se na importância do presente trabalho, também, para designers gráficos,
webdesigners (projetistas de produtos para a internet) e, principalmente, para agências digitais
e estudantes e profissionais de publicidade e propaganda, pois, através dele, torna-se possível
uma melhor compreensão de como funciona o processo perceptivo do usuário, com isso
provocando uma reflexão sobre as relações e os efeitos do seu trabalho para com o mesmo.
Além do mais, permite o melhor entendimento das questões relativas à estética, estilo e
tendências visuais, assim como das suas influências no processo de design gráfico.

13
2 CARACTERÍSTICAS GERAIS DO DESIGN
2.1 DEFINIÇÃO DE DESIGN
A expressão design é empregada no nosso dia-a-dia com demasiada freqüência.
Pessoas comuns, que possivelmente desconheciam a existência do termo, hoje são
habitualmente expostas a ele. Para o consumidor leigo, o design geralmente está atrelado a
fatores de caráter visual, ou seja, quando se diz que o design de um carro é moderno, inovador
ou sofisticado, o que o consumidor primeiramente entende é que o aspecto visual do carro é o
portador de tais adjetivos. Em outras palavras, o design é muitas vezes percebido como
sinônimo de aparência e as empresas, sabendo da força desta palavra para as vendas, quando
direcionada a algum objeto de consumo, utilizam-na com entusiasmo. Isso pode ser
facilmente percebido ao se observar a utilização do termo em filmes comerciais de
automóveis, onde um dos objetivos é fazer com que o telespectador perceba design no
produto anunciado. No filme publicitário do Citroën C4 Pallas1
, criado pela agência Euro
RSCG Brasil, o locutor diz “repare neste design” em uma das cenas onde o carro aparece em
movimento. Este é um claro exemplo, portanto, da utilização de design como característica
visual de um produto.
Entretanto, acreditar que design seja sinônimo de aparência é, no mínimo, insuficiente.
Existem definições para o termo que vão além do fator meramente visual. Segundo o
Dicionário Aurélio (1986, p.565) design é “concepção de um projeto ou modelo;
planejamento”. Nessa definição, a palavra design está ligada ao conceito de projeto e
planejamento, além de não fazer referência alguma a aspectos visuais. O próprio dicionário do
Microsoft Office 2000 considera a palavra planejamento sinônimo de design. Essa definição,
mais abstrata e que pouco tem a ver com visual ou aparência, é devido a sua origem. Rafael
Cardoso Denis (2000, p.16) diz, sobre design, que “a origem imediata da palavra está na
língua inglesa, na qual o substantivo design se refere tanto à idéia de plano, desígnio,
intenção, quanto à de configuração, arranjo, estrutura” e conclui que design é “uma atividade
que gera projetos, no sentido objetivo de planos, esboços ou modelos”. André Villas-Boas
(1999, p.51) é ainda mais incisivo ao afirmar que “a noção de projeto é uma das mais caras ao
conceito de design – palavra inglesa cuja melhor tradução seria, justamente, projeto (e não
1
Comercial produzido em julho de 2007 e exibido na televisão brasileira a partir de agosto de 2007.

14
desenho)2
”. Este é um dos motivos pelos quais é tão comum ocorrerem confusões de
entendimento do que vem a ser realmente design, sem, contudo, ignorar a importância do
desenho para a concepção de um projeto. Villas-Boas (1999, p.73-74) lembra que,
[...] o designer recorre freqüentemente ao desenho como recurso para o
desenvolvimento de projetos e para demonstrar a outros as soluções que está
elaborando para um dado problema – mas o cerne de seu ofício não é desenhar, mas
justamente a etapa que a precede: a elaboração destas soluções. Essa diferença pode
parecer uma filura, mas não é: boa parte da dificuldade que nossa profissão tem para
institucionalizar-se socialmente decorre justamente desta confusão [...].
Assim sendo, pode-se perceber que a expressão design está categoricamente associada
ao termo projeto, inclusive no Brasil. Ao contrário de qualquer tipo de criação ou produção
idealizada de maneira impensada, o conceito de projeto se refere a tudo que é desenvolvido
tendo-se por base um plano de concepção. Para Magalhães (apud LUZA, 2003, p.25)
“projetar foi a tradução mais usada no Brasil para design. Portanto, o projeto está relacionado
aos meios e metodologias utilizados pelos designers para produzir um design”. Assim,
observa-se que a relação entre os dois termos – design e projeto - concebe ao design um
caráter de atividade projetual, ou seja, segundo Villas-Boas (1999, p.38),
[...] quando se diz que algo é fruto de um projeto, ou que tal atividade é uma
atividade projetual, o que estamos dizendo é que aquele objeto ou aquela ação é
daquela determinada maneira porque foi pensada para ser assim, inclusive com os
erros que ela carrega (resultados de um mau projeto, e não por um azar ou por um
acaso).
Dessa forma, pode-se dizer que o designer, em suma, é um projetista e a metodologia,
um caminho previamente delineado a ser percorrido para idealizar o projeto. De acordo com
Munari (1998, p.10), “o método de projeto não é mais do que uma série de operações
necessárias, dispostas em ordem lógica, ditada pela experiência. Seu objetivo é o de atingir o
melhor resultado com o menor esforço”. Complementando esta idéia, a metodologia vem a ser
um conjunto de ações que têm como objetivo facilitar e direcionar o projetista na concepção
do design. Ainda sobre metodologia de projeto, Munari afirma que:
[...] no campo do design não se deve projetar sem um método, pensar em forma
artística procurando logo a solução, sem fazer antes uma pesquisa sobre o que já foi
feito de semelhante ao que se quer projetar, sem saber que materiais utilizar para a
construção, sem ter definido bem a sua exata função (MUNARI, 1998, p.10).
Duas coisas são de considerável importância nesta citação: primeiro, a “exata função”
a que o autor se refere, representa a funcionalidade de um produto com design. Por exemplo,
2
É importante deixar claro que desenho, na língua inglesa, é draw, e não design, ou seja, uma semelhança
gramatical que, na gramática portuguesa, comumente causa confusão.

15
um relógio de pulso bem projetado deve exercer, antes de qualquer coisa, a função de exibir
as horas, minutos e segundos com precisão, assim como deve se adaptar ergonomicamente
aos pulsos das pessoas e ser prático e fácil de ser operado. Podem-se considerar tais
características como sendo prático-funcionais, pois contemplam, entre outras qualidades, a
ergonomia, fator este, fundamental e premissa básica que se espera seja cumprida ao se
projetar um relógio de pulso comum. Segundo, quando o autor refere-se ao “pensar em forma
artística procurando logo a solução” está se referindo a mera preocupação visual aplicada
sobre um produto. Dessa maneira, o mesmo relógio pode ser atrativo visualmente, porém,
pode não ser prático ou ergonômico. Este seria o pensamento “artístico” aplicado sobre um
produto sem uma mínima preocupação prático-funcional. Entretanto, se o relógio cumprir os
requisitos funcionais citados acima e, além disso, portar um aspecto visual diferenciado,
poderá ser percebido pelo consumidor leigo como um produto com design não por causa dos
fatores prático-funcionais, e sim pelos visuais. Sobre esse conflito de percepção do design,
Löbach (2001, p.11) diz o seguinte:
As feiras especializadas onde, entre outros, estão expostos os sucessos das empresas
no campo do design, estão abertas ao grande público. Desta forma o leigo se
confronta com o conceito de design e supõe do que se trata sem entender suas
complexas inter-relações. Como carece normalmente de um interesse especial por
estas questões, a sua percepção do design e de sua problemática são apenas
superficiais. Ele decora seu entorno pessoal de modo intuitivo com os respectivos
produtos ou se deixa guiar pelo “bom design” tal como preconizam as revistas de
decoração divulgadas por determinados grupos de interesse.
Este é um exemplo, portanto, assim como Denis já havia comentado, de como a
palavra design está seguidamente atrelada a problemas de definição e a conflitos de caráter
etimológico. Se design é uma atividade projetual que, muitas vezes, inclui em seu arranjo um
estudo metodológico, envolvendo estudo ergonômico, pesquisa de materiais, de custos, entre
outros, por que motivo, para o consumidor leigo, está tão fortemente relacionado ao aspecto
visual e aparente dos produtos? Munari (1998, p.29), defensor da metodologia de projeto
como base do design, é categórico ao afirmar que design é um “tipo de atividade de projeto
que considera também o componente estético”. É neste momento, em que o “pensar de forma
artística”, citado pelo mesmo autor, se encaixa no projeto, o que significa dizer que a
preocupação com os aspectos formais ou visuais, também faz parte do projeto de design.
Deste modo, é possível dizer que o designer é o profissional responsável pelo projeto de
determinado artefato ou produto, sendo que a concepção destes inclui fatores de ordem prática
e estética. Logo, a metodologia ou o processo, serve para delimitar as regras necessárias para
o correto andamento do projeto, visando soluções para uma posterior execução.

16
É válido, portanto, questionar sobre os significados do termo design, pois é visível o
uso descabido da expressão em todos os meios. Design, portanto, não é sinônimo de aparência
visual. Neste trabalho, o design será tratado como sendo, além de uma atividade projetual, o
fruto do processo projetual que, além de outros, também considera, em seu planejamento, os
aspectos de função prática e função estética. Rudinei Kopp especifica esse pensamento por
um outro ângulo. Para o autor, design é:
[...] atividade que privilegia o planejamento e organização (desde um edifício até
uma caixa de fósforo) de elementos estético-funcionais, um conjunto viabilizado
pelas possibilidades técnicas disponíveis numa determinada época e lugar, visando à
efetivação dos objetivos traçados para o produto em questão (KOPP, 2004. p.41).
Segundo o autor, entende-se por produto “uma ampla gama de possibilidades:
edificações, embalagens, fachadas, jornais, livros, automóveis, cadeiras, painéis comerciais,
eletrodomésticos, porcelanas, cortinas, relógios etc”. Neste trabalho, será utilizada a mesma
definição para produto, inclusive considerando todo tipo de material projetado para a internet
como websites, portais, hotsites (sites promocionais de curta duração), entre outros.
2.2 ÁREAS DO DESIGN ENQUANTO ATIVIDADE PROJETUAL
As atividades ligadas ao design surgem após o impacto da primeira Revolução
Industrial. Foi a partir desta que se deu início à cultura da industrialização, da qual se faz parte
até hoje. Entretanto, é interessante definir também os motivos pela qual uma atividade
projetual conhecida como design vem a surgir nessa época. De acordo com Denis (2000,
p.17), “a passagem de um tipo de fabricação, em que o mesmo indivíduo concebe e executa o
artefato, para um outro, em que existe uma separação nítida entre projetar e fabricar, constitui
um dos marcos fundamentais para a caracterização do design”. Ao se referir sobre o indivíduo
que concebe e executa um artefato, o autor fala do artesão que, através do sistema artesanal de
produção, era até então o responsável pela concepção e execução dos objetos de consumo da
sociedade pré-industrial. De certa forma, este profissional não deixou de existir por causa da
industrialização, mas perdeu muito do seu espaço para um novo indivíduo que viria a fazer
uma grande diferença no processo produtivo industrial: o designer. Ainda segundo Denis, “a
diferença entre design e artesanato reside justamente no fato de que o designer se limita a
projetar o objeto para ser fabricado por outras mãos ou, de preferência, por meios mecânicos”.
Porém, o autor ressalva que é difícil estabelecer qual foi o momento preciso em que ocorreu
essa passagem.

17
Contudo, levando em consideração que o design – ou desenho industrial, como foi
nomeado no Brasil – surge como uma necessidade da sociedade industrial, ou que ao menos
foi aceito com entusiasmo por ela e, principalmente, pelas indústrias, pode-se, assim,
enquadrá-lo em duas áreas que possibilitaram o seu surgimento e evolução até os dias de hoje.
No que se deve às atividades voltadas ao projeto de produtos industriais, têm-se o design de
produtos e, do outro lado, as atividades projetuais direcionadas à comunicação visual, como o
design gráfico. Ambas surgiram relativamente no mesmo período histórico, favorecidas pelas
necessidades sociais e culturais da época e, posteriormente, seguiram caminhos muitas vezes
confluentes, outras vezes conflitantes, influenciadas na maior parte do tempo por movimentos
ora artístico-culturais, ora político-sociais, porém, sempre caracterizadas por serem atividades
que valorizavam, acima de tudo, o planejamento e o projeto, distinção essa que, de acordo
com Denis (2000), as diferenciam do artesanato e artes-plásticas, por exemplo.
Algum tempo passado desde o início da era industrial, a atividade de design sofreu
várias intervenções de caráter estrutural e conceitual, algumas delas devido ao surgimento de
novas tecnologias como o advento da fotografia, as máquinas de produção em larga escala da
indústria automotiva e de impressão em larga escala da indústria gráfica e imprensa, entre
outras. Muitos anos depois, já em meados do século XX, as novas tecnologias de
comunicação favoreceram o desenvolvimento de outras disciplinas do design com o
surgimento da televisão na década de 30 e, posteriormente, do computador pessoal na década
de 80. A internet, que viria a se tornar um fenômeno social nos anos 90 também cedeu espaço
para a atuação do designer.
No Brasil, de acordo com Villas-Boas (1999), a atividade de design – ou desenho
industrial, conforme nomenclatura erroneamente adotada, segundo o autor, pelo Ministério da
Educação - pode ser dividida em duas habilitações: projeto de produto e programação visual,
segundo o que pode ser entendido através do esquema abaixo:

18
Figura 1: Design Industrial e suas subcategorias
Fonte: VILLAS-BOAS, 1999
Segue uma descrição do que o autor entende por cada uma delas:
· Projeto de Produto – uma das duas habilitações profissionais do desenho industrial,
conforme regulamentado pelo MEC. Em linhas gerais, o projeto de produto é a
habilitação que capacita o profissional a projetar objetos cuja conformação prioritária é
tridimensional, com grande enfoque nas questões de usabilidade, funcionalidade dos
mecanismos envolvidos, resistência de materiais empregados (bastante diversos) e uma
conformação estética que transmita subjetivamente valores que alcancem o usuário que
ele pretende atender.
· Programação Visual – a outra habilitação corrente do desenho industrial. A
programação visual pode se dividir em diversas sub-áreas que têm como ponto comum o
ordenamento de elementos visuais textuais e não-textuais com objetivo comunicacional
expresso. Em geral, objetos de programação visual têm suportes preponderantemente
bidimensionais e são realizados para reprodução, mas isto não é uma regra aplicável a
todas as suas subáreas. Além do design gráfico, são sub-áreas da programação visual,
entre outras, o design informacional, o design de embalagens, o design de interface
(especializado no layout de interfaces homem-máquina), o design de hipermídia ou
webdesign (centrado no uso de multimeios no processo comunicacional informatizado), o
design de letreiros e sinalização corporativa (que prioriza veiculação de identidade visual,
como os sistemas sinalizadores internos de empresas, shoppings e feiras).
Assim, fica claro que o design é uma atividade projetual voltada a várias áreas. Neste
trabalho, quer-se deixar bem saliente a existência de uma área em especial, que é o design

19
para a internet ou webdesign, atividade esta pertencente à programação visual e muito ligada
ao design gráfico. Dessa forma, o webdesigner, ou o designer para a internet, como o próprio
nome sugere, utiliza a internet como mídia de atuação. Abaixo, recriou-se o esquema proposto
por Villas-Boas posicionando o webdesign no seu devido lugar dentro do organograma que
considera, de forma hierárquica, as áreas do design:
Figura 2 - Localização do webdesign dentro do esquema proposto por Villas-Boas (1999)
Fonte: VILLAS-BOAS, 1999
Portanto, a internet possibilitou o surgimento dessa nova disciplina de design e, mais
de quinze anos depois do seu surgimento, a web continua a ser um campo de incontáveis
possibilidades de criação, interpretação e relacionamento, onde o valor do visual e seus efeitos
sobre o usuário devem ser muito considerados. Assim sendo, antes disso ser aprofundado é
importante compreender que design para a internet é, acima de tudo, design, e sendo assim,
possui características que condizem em todas as suas áreas de atuação.
2.3 ASPECTOS QUE ENVOLVEM O PROJETO DE DESIGN
Um produto de design sempre deve ser projetado partindo da premissa que sugere
haver um determinado problema e que o objetivo da atividade de design é solucioná-lo. De
acordo com Alexandre Amorim dos Reis (2003, p.8-9),
[...] em design, a fase inicial de um projeto se constitui em pensar o problema, em
procurar definir se o problema foi colocado com clareza e se estão disponíveis os
dados suficientes para que se alcance, ao final do processo, a satisfação das
necessidades do público a que se dirige o produto.

20
Nesse sentido, o produto projetado a partir do design sempre o é feito com o intuito de
que realize determinadas funções. Uma das funções de um website corporativo, por exemplo,
é disponibilizar conteúdo para acesso e também comunicar a imagem da empresa para
determinado público, assim como uma das funções de um hotsite é possuir características de
apelo comercial ou promocional em determinado período. Comunicar, informar,
disponibilizar conteúdo, ser uma ferramenta de vendas ou de negócios, compor um ambiente
de relacionamento e interação, entre outras, são algumas das funções de um produto para a
internet. Em cada projeto, no entanto, há maneiras distintas de resolver problemas e encontrar
soluções, preferencialmente por meio de planejamento. Mas, independente de quais forem os
objetivos finais de um produto, existem dimensões básicas que sempre serão consideradas em
projetos de design. Alguns autores divergem de outros ao utilizarem termos diferentes para
caracterizar essas dimensões. Villas-Boas, referindo-se à atividade de design gráfico –
portanto, a mais próxima do design para a internet – sugere que, ao olhar para alguma coisa
que parece ser um produto de design gráfico, deve-se analisá-la mediante quatro enfoques:
[...] a cara que ele tem, para o que ele serve, como ele foi idealizado e, finalmente, o
que imaginamos ou o que os outros imaginam que este objeto significa
simbolicamente. Ou, em outros termos: analisarmos seu aspecto formal, seu aspecto
funcional-objetivo (ou simplesmente, funcional), seu aspecto metodológico e,
finalmente, seu aspecto funcional subjetivo (ou simbólico) (VILLAS-BOAS, 1999,
p.21-22).
Por outro lado, Kaminski (2004), também se referindo ao design gráfico diz que “um
projeto desse tipo deve levar em conta os aspectos de funcionalidade prática, de funções
simbólicas e também de funções estéticas”. De certa forma, os dois autores propõem a
existência dos mesmos aspectos em um projeto de design, mesmo que utilizando termos
diferentes para descrevê-los e levando em consideração que o aspecto metodológico, proposto
por Villas-Boas (1999) e já visto com Munari (1998), está, a critério deste trabalho,
invariavelmente incluído em qualquer bom projeto. Ambos os autores – Villas-Boas (1999) e
Kaminski (2004) – concordam, pelo menos, que existem aspectos de função prática – ou
funcional objetivo - e aspectos de função simbólica – ou funcional subjetivo. Em um ponto,
no entanto, os dois autores divergem. Villas-Boas assegura que o terceiro aspecto que deve
ser levado em consideração em projetos de design é o aspecto formal, ou seja, o aspecto
aparente, visível e superficial de um produto de design, que considera tanto sua forma física
quanto seus elementos informativos. De outro modo, Kaminski afirma que o terceiro aspecto
é o de função estética. Este aspecto também é basicamente condicionado pela forma aparente
dos produtos, porém, é o conceito de estética empregado pela autora para explicar esse

21
aspecto que faz com que sejam escolhidas as suas definições para dar prosseguimento a este
trabalho.
2.3.1 Aspectos de Função Prática
Os aspectos de função prática, ou também chamados de prático-funcionais, são
aqueles que apresentam as funções utilitárias dos produtos, ou seja, aquilo que indica que os
produtos servem para alguma coisa e que foram projetados para acatar as necessidades de um
determinado público. Todo produto possui aspectos de função prática, que promovem
experiências de funcionalidade objetiva para o usuário. Em produtos para a internet, a função
de uso é essencial. Todo website é projetado com o intuito principal de comunicar alguma
coisa para um determinado público e esta é, portanto, uma de suas funções. Mas, além disso,
deve possibilitar e facilitar o acesso e a navegação do usuário e, por esses motivos, os
aspectos prático-funcionais de um site também são todos aqueles que possibilitam ao usuário
utilizá-lo, de preferência, da maneira mais fácil possível. No projeto de design para a internet,
esse aspecto de funcionalidade prática com enfoque na facilidade de uso é conhecido como
usabilidade, e será mais bem tratado no próximo capítulo.
Uma observação importante que deve ser feita é sobre a familiaridade gramatical entre
os termos funcionalidade e funcionalismo. Segundo Reis (2003, p.10), “deve-se esclarecer
que não se pode confundir funcionalidade com funcionalismo, o primeiro termo refere-se à
capacidade de um artefato cumprir as funções a ele pretendidas, o segundo é relacionado à
teoria que submete a forma à função”. Para que se compreenda melhor a teoria do
funcionalismo é interessante conhecer alguns momentos da história do design.
A teoria funcionalista foi expressamente utilizada por integrantes da Bauhaus, escola
de arquitetura e design fundada em 1919 por Walter Gropius em Weimar, Alemanha, e por
mais uma série de artistas, designers e arquitetos obstinados, inicialmente, em contribuir para
o ensino das artes e ofícios. Segundo Moraes (1997, p.32), “a Bauhaus seria a tentativa,
através do ensino, de unir a arte aplicada e as belas-artes. Seria uma escola de estudo e
pesquisa de melhor qualidade da produção industrial e da experiência com o novo”.
Entretanto, a escola alemã passou por fases distintas em relação à sua proposta de estudos e
ensino. Segundo Denis (2000, p.119),
[...] no período inicial sob a direção de Gropius (1919-1928), a Bauhaus esteve
sempre preocupada em agregar pessoas e propostas das mais diversas tendências.
Suas portas estavam abertas para praticamente qualquer novidade e essa

22
receptividade acabou atraindo de toda a Europa figuras e idéias inovadoras
relacionadas ao fazer artístico e arquitetônico.
Fica claro que a escola, em seu início, tinha uma corrente preocupação em agregar o
ensino das artes ao fazer industrial, pensamento este que remetia à fase inicial da
industrialização do movimento Arts and Crafts, idealizado por Willian Morris e que tinha
como um dos objetivos aproximar o artesanato do fazer industrial, contrariando assim as
tendências que, aos poucos, dispensavam o trabalho do artesão neste meio. Contudo, ainda
segundo Denis (2000, p.21), “a Bauhaus foi perdendo aos poucos o seu utopismo inicial e,
após a saída de Gropius, foi se adequando a uma visão menos grandiosa do ensino do design”.
Com o passar dos anos, os ideais iniciais da Bauhaus foram se extinguindo devido às
diferenças na forma de pensar dos integrantes em relação ao ensino das artes e do design que,
nas suas diversas fases, foram se diversificando no controle da escola. Afirma ainda:
[...] os aspectos que foram aproveitados posteriormente pelo campo do design
refletem apenas o verniz desses ideais elevados. Contrariando a vontade de alguns
dos seus idealizadores, A Bauhaus acabou contribuindo muito para a cristalização de
uma estética e de um estilo específicos no design: o chamado ‘alto’ Modernismo que
teve como preceito máximo o Funcionalismo, ou seja, a idéia de que a forma ideal
de qualquer objeto deve ser determinada pela sua função, atendendo-se sempre a um
vocabulário formal rigorosamente delimitado por uma série de convenções estéticas
bastante rígidas (DENIS, 2000, p.121-122).
Sobre a questão de a forma ser determinada pela função, no que diz respeito aos
princípios do funcionalismo, Löbach (2001, p.88), diz que “aplicado ao funcionalismo,
significa que os produtos associados a este conceito surgiram de uma escola intelectual na
qual predominavam os aspectos funcionais. Entretanto, não fica claro a que aspectos
funcionais se refere”, ou seja, o conceito de função, neste caso, poderia ser tanto de ordem
prática, quanto estética ou simbólica. Porém, o autor explica que “no passado, o conceito de
funcionalismo foi aplicado de forma unidimensional, quase de modo exclusivo para o
ambiente onde se destacavam as funções práticas”. Já Rosane Kaminski3
(Apêndice E) diz
que, “nos tempos da Bauhaus, chegou-se a afirmar que quanto mais adequado à sua função –
prática ou simbólica –, mais belo seria o produto. Por isso, dizia-se que ‘a forma segue a
função’”. De qualquer maneira, a teoria funcionalista atribui o valor da forma à função que o
produto tende a desempenhar, ou seja, o pensamento formal aplicado ao produto é substituído
pelo pensamento técnico e voltado aos aspectos práticos. Através destes, a forma ideal é
concebida, método que originou uma identidade inconfundível do design do alto modernismo.
3
Em entrevista, através de mensagem eletrônica, no mês de março de 2008.

23
De outro modo, no design projetado para a internet, o funcionalismo levaria em consideração
os aspectos de função prática de um website como será visto mais adiante, submetendo a ele o
resultado final de seu aspecto visual.
2.3.2 Aspectos de Função Simbólica
Os aspectos de função simbólica em um produto de design são aqueles que geram
significados e promovem experiências subjetivas. De acordo com Löbach (2001), a função
simbólica é manifestada, em um produto de design, através dos aspectos de função estética,
isto é, os mesmos elementos que compõem um arranjo formal e promovem percepções
estéticas, servem para gerar percepções simbólicas.
Pode-se dizer ainda que um produto de design com aspectos de função simbólica
possui valor simbólico, o que é mais evidente em se tratando de produtos industriais como
carros, relógios, jóias, etc. Sobre o valor simbólico dos produtos de design, Costa Junior diz
que:
[...] é caracterizado pela identificação do produto com o contexto e atributos sociais,
religiosos, econômicos, associados à classe social, econômica e religiosa a qual o
consumidor pertence. [...] o mercado de bens de consumo privilegia a exploração do
valor simbólico dos produtos como ferramenta de marketing de venda. A sociedade
humana, em especial a sociedade capitalista, procurou no decorrer da sua história, no
que se refere ao consumo de bens, organiza-se por conta de um sistema social que
distingue os indivíduos em grupos, classes ou camadas hierarquizadas por símbolos
de status. Essa característica representa tão somente um ponto de vista do sistema
social, porém fundamenta a importância dos conceitos de valor simbólico no
processo de consumo de bens (COSTA JUNIOR, 2007, p.5 apud CARPES
JUNIOR, 2004, p.3).
Assim sendo, o valor simbólico dos produtos passa a ser um grande diferencial para o
mercado de bens de consumo, levando em consideração as condições que são necessárias para
que o consumidor seja afetado por esses valores. A representação simbólica dos produtos para
a internet é menos relevante do que para produtos industriais, já que estes últimos atuam
como bens de consumo, ao contrário de websites, por exemplo, que funcionam como meios
de comunicação e relação entre empresas e usuários. Por esse motivo, os aspectos de função
simbólica não serão tão considerados neste trabalho. Porém, isso não significa que produtos
projetados para a internet não possuam valor simbólico, já que a relação entre um usuário e
um site pode ser manifestada das mais diversas maneiras.

24
2.3.3 Aspectos de Função Estética
Os aspectos de função estética em um produto de design são, portanto, aqueles que
possuem valor estético e promovem a experiência estética. Segundo Kaminski (2004, p.44),
“quando um autor diz: ‘a estética desta peça de design’, está certamente querendo se referir à
função estética que resulta de determinado arranjo formal”. Em design gráfico, por exemplo,
os arranjos formais elaborados a partir de cores, imagens, texturas, e tipografias, sobre uma
determinada superfície, são os principais elementos que ajudam a promover experiência
estética. Villas-Boas (1999), no entanto, se refere aos aspectos que possuem função estética
no design gráfico como sendo aspectos formais, ou seja, o visual de um produto de design,
que envolve desde sua superfície aos elementos visuais que configuram seu arranjo formal.
De certa forma, os aspectos formais ou visuais, em um produto de design, são os principais
responsáveis por promover experiência estética. Contudo, no design para a internet, os
aspectos de função estética não se prendem apenas a elementos de caráter visual, podendo
muito bem ser aceitos elementos sonoros para promover tais experiências. Isso significa que
em um website, por exemplo, os aspectos de função estética são todos aqueles elementos que,
de uma forma ou outra, são percebidos pelos usuários, através dos sentidos. Cores, imagens,
texturas, tipografias, músicas, sons, movimentos, animações e mais uma série de elementos
comumente usados no design para internet projetado atualmente, são as referências do que
vêm a ser os aspectos de função estética em um produto para a internet.
No entanto, pelo ponto de vista de Duarte Jr. (2003), a maioria dos estudiosos sobre o
assunto diz que a relação que se tem com objetos de uso – websites, por exemplo – é apenas
uma relação de uso com objetos mais ou menos agradáveis, e não uma relação que produza
alguma experiência estética. Por isso, para falar sobre estética e experiência estética é
primeiramente necessário saber o que vem a ser a estética e uma experiência estética
propriamente dita. No capítulo 4, encontram-se melhores definidos os significados destes
termos e a importância dos aspectos de função estética em sites para a internet. Antes disso,
porém, é necessário conhecer um pouco sobre o que é o design para a internet, atividade
projetual que é o foco deste trabalho.

25
3 DESIGN PROJETADO PARA A INTERNET
3.1 DESIGN PARA A INTERNET
No capítulo inicial, definiu-se que design é uma atividade projetual que considera
aspectos de função prática, simbólica e estética. O design digital, ou mais especificamente o
webdesign – design projetado para a internet – possui os mesmos desígnios e se baseia nos
mesmos aspectos do design em geral. Porém, possui diferenças muito salientes em relação a
todas as outras áreas. Para comparar a web com outras áreas, Radfahrer diz que:
[...] o meio digital tem várias particularidades que nunca existiram antes e é
completamente diferente de todas as outras mídias, mas leva pedaços de todas elas.
[...] a web é ágil como o rádio, abrangente como o jornal, rica como o videogame,
envolvente como a TV, em alguns casos móvel como o celular. Também pode ser
cativante como a correspondência, profunda como consulta a um especialista,
imprevisível como um papo de boteco (RADFAHRER, 1999, p.73).
Mesmo com todas essas semelhanças teóricas, é possível dizer que a principal e
fundamental diferença entre o design feito para a internet e todos os outros está na própria
internet e na relação que o usuário assume com ela, ou seja, a lógica de funcionamento e uso
do meio digital é completamente diferente das outras mídias, como veremos adiante. No
entanto, o design feito para a internet mantém, em relação a todos os campos do design, uma
afinidade muito evidente com o design gráfico para mídia impressa, tanto é que muitos dos
princípios usados na concepção de design para a internet, no que se deve aos aspectos formais
e de comunicação visual, são de certa forma, herança do design gráfico. Por esse motivo,
muitos designers gráficos acabaram apostando na internet como novo espaço para exercer sua
profissão, o que contribuiu muito para o fortalecimento do design para a internet no âmbito
visual, mas muito pouco no tecnológico e funcional, já que o meio impresso é completamente
diferente do digital nestes aspectos.
Sobre a relação entre projetar um produto para a web – como se optou por considerar
neste trabalho toda criação feita para a internet – e outras facetas do design em geral, Denis
(2000, p.209) explica que:
[...] quando um designer é contratado para criar uma homepage ou um site na
internet, ele gera um objeto que não é nem gráfico, no sentido de ser fruto de um
processo de impressão, e nem produto, no sentido de ser um artefato tangível.
Porém, é evidente que esse objeto é tanto produto, no sentido de ser uma
mercadoria, quanto gráfico, no sentido de ser eminentemente voltado para a
transmissão de informação visual; e é igualmente evidente que não deixa de ser um
objeto de design, na acepção mais pura da palavra. Aliás, curiosamente, o objeto
virtual acaba sendo gerado por um processo muito mais artesanal que propriamente
Formatado: Fonte: Itálico

26
industrial. Mesmo sendo distribuído em escala quase ilimitada e consumido por um
público de massa, ele pode ser produzido por uma única pessoa de começo a fim, o
que subverte a divisão entre projeto e fabricação. Apesar disso, seria no mínimo
impreciso, ou até mesmo um pouco perverso, descrever a criação de objetos virtuais
como uma espécie de artesanato.
Ao levar em consideração o que foi dito pelo autor, pode-se chegar a duas conclusões.
Em primeiro lugar, que o design gráfico não se restringe somente à mídia impressa, podendo
ser muito bem aceito chamarmos de design gráfico aquilo que é projetado com a finalidade de
comunicar visualmente, o que é o caso, por exemplo, dos websites e tudo o que é projetado
para a internet e outros meios digitais. Kopp (2004, p.41) já afirmava isso ao dizer que “de um
modo geral, gráfico está relacionado com o que comunica alguma coisa através do registro
(seja a escrita, ilustrações, traços etc) visual sobre uma superfície qualquer”. Porém, é comum
chamar de gráfico apenas o que é projetado para ser comunicado através de meios impressos.
Segundo o autor,
[...] nos dias atuais, compreende-se, geralmente, como gráfico aquilo que é passível
de ser produzido/reproduzido através dos sistemas de impressão da indústria gráfica
[...]. No entanto, o universo gráfico abarca um leque bem maior. Apesar de
apresentar características muito peculiares, o design para vinhetas de televisão ou
cinema é um derivado do design gráfico. Da mesma forma, o design para interfaces.
Há características próprias, mas é impossível pensar o design para web sites, por
exemplo, sem lançar mão do conhecimento com a manipulação dos elementos
gráficos mínimos: as imagens verbais e não verbais (KOOP, 2004, p.41).
Logo, fica claro que o design gráfico faz parte do design para a internet no que diz
respeito aos elementos formais inseridos no projeto, que nada mais são que os responsáveis
por comunicar visualmente os produtos para a web.
Retomando as palavras de Denis (2000) anteriormente mencionadas, percebe-se que,
em segundo lugar, ao se referir ao processo de design para a internet, o autor faz menção ao
método individual e artesanal de criação que pode substituir o processo multidisciplinar. É
fato que criar e desenvolver produtos para a internet pode ser feito por um único indivíduo, o
que não significa dizer que o resultado desta prática seja sempre positivo, assim como muitos
websites projetados em equipe não possuem um bom nível de qualidade, mesmo que cada
indivíduo atuante no projeto seja responsável por uma disciplina em específico. É
interessante, portanto, compreender que, como novo meio de comunicação, a internet gerou,
em seu início, novos mercados e, simultaneamente, novas possibilidades de atuação
profissional, o que provocou o surgimento de um novo tipo de profissional conhecido como
webmaster. Para Memória (2006, p.9), “o webmaster foi a pessoa que descobriu a internet”,
no sentido de ter sido o primeiro indivíduo a transformar a rede em um mercado de atuação ao

27
construir os primeiros sites pessoais e comerciais em uma época onde muito pouco se sabia
sobre a web e poucas pessoas tinham acesso a ela. As críticas hoje feitas à figura do
webmaster são muitas, a maioria devido ao fato de ser ele um profissional com vago domínio
de todas as disciplinas que envolvem projetos para a internet, ou seja, é o sujeito que, sozinho,
elabora todas as etapas para a construção de websites, assim como o artesão a que Denis
(2000) havia se referido, ao falar sobre a possibilidade de um site ser elaborado por uma única
pessoa do começo ao fim. No decorrer deste capítulo, percebe-se que projetar para a internet,
como afirmam a maioria dos autores no assunto, é um trabalho de envolvimento
multidisciplinar. Mas é fácil compreender a existência do webmaster no início da era da
internet ao pensarmos que, como tudo era novidade, ainda não existiam normas e estudos
estabelecidos e criteriosos que poderiam definir como devia ser projetado de forma adequada
um produto para a web.
Nos dias atuais, no entanto, projetar profissionalmente para a internet é uma tarefa
muito competitiva e que exige cooperação disciplinar. Segundo Memória (2006, p.9),
“projetos sérios para a internet são essencialmente multidisciplinares, envolvendo diferentes
áreas do conhecimento”. A partir deste ponto de vista, a figura do webmaster já não faz mais
sentido para o mercado web atual. Cada vez mais, o aperfeiçoamento em uma só área é levado
em consideração para se contratar um profissional de internet. Para Cesar Paz, presidente da
AG2, agência digital gaúcha, “a especialização permitiu a produção de projetos web em escala
e uma profissionalização das estruturas de desenvolvimento”. Já de acordo com Memória
(2006, p.9),
[...] a presença de profissionais especializados em diferentes disciplinas está cada
vez maior nos dias atuais. Cada área de conhecimento trabalha diferentes partes do
sistema que, desenvolvidas separadamente, contribuem para o aperfeiçoamento de
um todo, melhorando a qualidade do produto final.
Através dessas palavras, percebe-se que projetar para a internet exige conhecimentos
distintos, o que é mais facilmente encontrado trabalhando-se com profissionais de áreas
distintas. Isso confunde a visão que geralmente se tem do design para a internet e,
principalmente, do chamado webdesigner, ou seja, o designer da web. Ao contrário do termo
webmaster – ou “mestre da web” em uma tradução direta – que já entrou em desuso, o termo
webdesigner é comumente considerado, tanto no meio profissional como no acadêmico.
Porém, se projetar para a internet é um trabalho multidisciplinar, fica difícil definir quem é o
webdesigner, já que o termo, a princípio, enfatiza um profissional completo dentro dos limites
do design para a internet.

28
O webdesigner, de certa forma, pode ser considerado um profissional com
conhecimento de design e de internet, o qual possui capacidade suficiente para projetar para a
web. Porém, mesmo esperando que o webdesigner seja um projetista apto para trabalhar com
web, o mercado da internet e as agências digitais, cada vez mais, desmembram seu
conhecimento e dividem-no entre profissionais distintos, exigindo assim que cada etapa do
projeto, como ainda será visto neste capítulo, seja desenvolvida por profissionais cada vez
mais especializados.
3.2 CONCEITO DE INTERFACE
Entender o que vem a ser uma interface e qual o seu verdadeiro sentido na relação dos
usuários com websites é, talvez, o maior desafio para se compreender a importância do design
feito para a internet nos dias de hoje. De acordo com Radfahrer (1999, p.106), uma interface é
“o ponto de contato entre um ser humano e uma máquina”. Por este ponto de vista, podemos
dizer que, em computadores, a interface pode ser o mouse e o teclado, já que mediam o
contato entre o usuário e a máquina, que é o computador. Entretanto, este não é o conceito de
interface que se quer utilizar neste trabalho. Johnson, referindo-se à interface, diz que:
[...] em seu sentido mais simples, a palavra se refere a softwares que dão forma à
interação entre usuário e computador. A interface atua como uma espécie de
tradutor, mediando entre as duas partes, tornando uma sensível para a outra. Em
outras palavras, a relação governada pela interface é uma relação semântica,
caracterizada por significado e expressão, não por força física (JOHNSON, 2001,
p.17).
Dessa forma, o conceito de interface que aqui interessa é o de interface gráfica do
usuário – ou GUI (Graphic User Interface) na sua sigla original em inglês – que vem a ser a
superfície, espaço ou ambiente gráfico dos softwares e sistemas a qual é utilizada pelo usuário
para interagir com o computador. Segundo Johnson, a GUI foi:
[...] desenvolvida inicialmente pelo Palo Alto Research Center da Xérox na década
de 1970 e depois popularizada pelo Macintosh da Apple. [...] a adoção generalizada
da GUI operou uma mudança colossal no modo como os seres humanos e os
computadores interagem, e expandiu enormemente a capacidade de usar os
computadores entre pessoas antes alienadas pela sintaxe misteriosa das interfaces
mais arcaicas das “linhas de comando” (JOHNSON, 2001, p.19).
Como um bom exemplo do que vem a ser uma interface gráfica pode-se citar, entre as
mais conhecidas, a do Microsoft Windows, com seus ícones, janelas, barras de ferramentas e
outros elementos gráficos que, juntos, disponibilizam ao usuário os instrumentos necessários
para que o mesmo possa utilizar o software e interagir com o computador.

29
No que se deve a produtos para a internet, a interface é a superfície responsável pela
mediação entre um usuário e um website, ou, segundo Radfahrer (1999, p.106), uma interface
é:
[...] a cara dos websites ou programas multimídia, o intérprete entre um computador
(que entende de cliques do mouse e impulsos elétricos) e seu usuário. É o ambiente
gráfico do produto digital, o canal de comunicação do usuário final com o conteúdo
de um sistema de computador. Em outras palavras, é onde tudo acontece.
Nesse sentido, pode-se dizer que o design feito para a internet é essencialmente design
de interface, pois, segundo afirmou o autor, tudo o que acontece em um site ocorre através de
uma interface. E para que tudo aconteça através de uma interface é necessário que todos os
elementos – sejam eles de função prática ou estética – façam parte dela. Dessa forma, uma
interface deve ser fundamentada em aspectos funcionais, que possibilitem ao usuário poder
utilizá-la, e também baseada em elementos visuais que, além de prestarem funções práticas ao
site – desenho de ícones, por exemplo – também sejam responsáveis por promover
experiências visuais agradáveis. Uma interface baseada somente na funcionalidade prática
pode tornar-se fria e, conseqüentemente, não proporcionar experiência de agrado ao usuário.
Um exemplo desse tipo de interface é o antigo MS-DOS, com o qual era necessário interagir
através de linhas de comando – como já foi mencionado por Johnson (2001) – em uma
superfície totalmente preta e estática, completamente diferente das interfaces gráficas as quais
se está acostumado a lidar hoje em dia, repletas de cor, sons, formas e animações.

30
Figura 3: Modelo de interface do MS-DOS
Fonte: <http://www.knak.com.br/william/files/promptdos.png>
Entretanto, pode-se perceber que a evolução de uma interface gráfica, como a do MS-
DOS, para a do Windows dos dias de hoje se deve primeiramente a implicações de caráter
tecnológico e, posteriormente, como conseqüência dessa evolução, de caráter formal. Essa
simples condição tecnológica é suficiente para justificar o porquê do design digital ser tão
ímpar em relação ao design para outros meios e também esclarece o porquê dos aspectos
gráficos das interfaces web estarem atrelados a fatores tecnológicos. O MS-DOS, por
exemplo, possui uma interface fria e estática devido ao limite tecnológico da informática da
época. Hoje, com plataformas de desenvolvimento mais avançadas, ciberespaço como o
Second Life, por exemplo, podem utilizar metáforas tridimensionais com o intuito de imitar o
mundo real.

31
Figura 4: Modelo de interface do Second Life
Fonte: <http://christiano.blog.br/wp-content/uploads/2007/06/secondlife.jpg>
Com algumas barreiras tecnológicas já superadas, outros motivos, como a necessidade
social de informar e comunicar através da internet, criam novas linguagens e contribuem para
a concepção de interfaces mais dinâmicas, interativas e visualmente aperfeiçoadas.
[...] a representação de toda essa informação vai exigir uma nova linguagem visual,
tão complexa e significativa quanto as grandes narrativas metropolitanas do romance
do século XIX. Já podemos ver os primeiros movimentos dessa nova forma em
designs recentes de interface que foram além da metáfora bidimensional do desktop
para chegar a ambientes digitais mais imersivos: praças, shopping centers,
assistentes pessoais, salas de estar. À medida que a infosfera continuar crescendo
exponencialmente, as metáforas usadas para descrevê-la crescerão também, tanto em
escala quanto em complexidade. A ágora do século XX pode perfeitamente se
deslocar para o ciberespaço, mas não irá muito longe sem arquitetos de interface que
desenhem os projetos (JOHNSON, 2001, p.20).
De certa forma, o autor prevê que o conceito de interface e as atuais metáforas usadas
para descrevê-las podem ultrapassar barreiras dimensionais e, por conseguinte, os limites que
separam produtos usáveis dos não usáveis, ou seja, quanto maior for a vontade de se criar
interfaces complexas e mais parecidas com o mundo real, maior também precisará ser a
responsabilidade de projetá-las de maneira adequada para que o usuário possa facilmente
interagir com elas e desfrutar experiências agradáveis de uso. Nesse sentido, fica claro
perceber a importância das interfaces gráficas de usuário no que se deve a seus aspectos de

32
função prática, o que significa dizer que são justamente os aspectos que promovem algum tipo
de interação entre homem-computador que caracterizam, para o design, o que vem a ser uma
interface em seu sentido literal. Para Nielsen (2000, p.11), “há basicamente duas abordagens
fundamentais ao design: o ideal artístico de expressar-se e o ideal da engenharia de resolver
um problema para o cliente”. De certa forma, a interface gráfica de usuário pode comportar as
duas características. Porém, alguns projetos de interface evidenciam mais os aspectos de
função prática, já outros evidenciam mais os aspectos de função estética. Conhecendo os
principais tipos de websites, pode-se entender isso de forma mais clara. Percebe-se, no
entanto, que cada um estará voltado para atender a um determinado tipo de público e para
disponibilizar um determinado tipo de conteúdo.
Neste trabalho, o enfoque está direcionado aos aspectos de função estética dos
produtos para a internet, o que necessariamente envolve o projeto de interface gráfica.
Entretanto, não se pode falar sobre esses aspectos sem antes compreender melhor a faceta
que, para alguns, é a mais importante no design para a internet e que está diretamente
relacionado com o projeto de interface: a usabilidade.
3.3 TIPOS DE WEBSITES
Assim como no design gráfico, onde para cada problema é sugerido um tipo de
produto gráfico para solucioná-lo – como folder para divulgação da empresa, catálogo para
divulgação dos produtos, embalagem para exposição do produto no ponto de venda, etc. – no
design que é feito para a internet, a estratégia funciona da mesma maneira. Dependendo de
qual for o cliente e a sua necessidade com relação à internet, é importante saber que tipo de
produto deve ser projetado para supri-la com eficácia no meio digital. Radfahrer (1999, p.149)
indicou, há quase dez anos, os tipos de websites comerciais mais comuns. Seriam eles:
· Institucionais – Divulgam a empresa, faturamento, histórico e abrangência mundial.
Concentram-se mais em dados institucionais que em produtos ou serviços.
· Produtos – Concentram a comunicação em produtos, características e benefícios.
São voltados exclusivamente para o público-alvo.
· Profissionais – Para a divulgação de serviços prestados por autônomos.
· Serviços – Endereços de consultoria e venda de serviços específicos. Muitos
concentram um grande volume de informação, para mostrar a expertise e evidenciar
a necessidade da contratação de um profissional.

33
· Entretenimento – Jogos e brincadeiras, normalmente utilizados para lançamentos de
produtos.
· Promocionais – Sites curtos com promoções, também chamados de hotsites:
concentram a informação em poucas telas para chamar a atenção do visitante sem
desviá-lo do curso original da sua leitura.
· Educativos – Endereços digitais que visam transmitir muitas informações para
educar o público-alvo. Normalmente utilizados por instituições e associações.
· Comunidades – Grupos de discussão sobre temas específicos, formando espaços
maleáveis, controlados pelos próprios usuários.
Já se passaram oito anos e é evidente que todos estes tipos de websites ainda são
inteiramente considerados. O que se tem de novo atualmente são sites cada vez mais
colaborativos, sejam eles corporativos, educativos, hotsites ou comunitários, onde a
interferência dos usuários favorece a dinâmica do conteúdo. Um tipo de site que não foi
citado pelo autor, talvez por não ser considerado comercial, mas que merece nossa atenção é o
portal, focado em disponibilizar conteúdo informativo como notícias, vídeos, etc. Os blogs
também são exemplos de sites colaborativos muito populares e cuja importância deve ser
considerada, assim como os sites de busca, com o exemplo máximo do Google. Para
identificar os mais comuns, toma-se como exemplo a figura abaixo:
Figura 5: Categorias comuns de websites
Fontes: <http://www.google.com.br>; <http://www.lastfm.com>; <http://oglobo.globo.com/pais/noblat/>;
<http://www.g1.com.br>; <http://www.cocacola.com.br>; <http://www.skol.com.br>
Na figura acima, há seis exemplos de categorias de websites ou produtos digitais para

34
a internet. Na parte de cima tem-se, em ordem, as interfaces gráficas do Google – site de
busca -, Last FM – comunidade virtual com base na colaboração – e o blog do Ricardo Noblat
– exemplo de blog. Na parte de baixo, temos as interfaces do G1 – portal de notícias -, Coca-
Cola – site institucional – e da Skol – hotsite. Estes são alguns exemplos de produtos digitais
para a internet. O conceito de interface é, portanto, válido para todos. Entretanto, pode-se
perceber numa rápida olhada que a interface gráfica do Google é bem diferente da interface
do hotsite da Skol. Esse é um exemplo fundamental que nos faz entender que os aspectos das
interfaces são, primeiramente, definidos pelos objetivos que devem ser alcançados através
delas. A interface do Google prioriza a funcionalidade prática, pois é evidente que esse
aspecto é mais importante em um site de buscas, onde o objetivo maior é encontrar de forma
rápida e fácil endereços para outros sites. Não há, na interface do Google, elementos que não
sirvam para um propósito prático. Já na interface gráfica do hotsite da Skol, é muito mais
evidente a presença de elementos visuais que, aparentemente, não possuem nenhuma função
prática. O objetivo do hotsite, neste sentido, não é tão focado na funcionalidade prática, o que
também não significa que ele seja difícil de ser usado ou não funcione plenamente. A
diferença está na proposta de cada um. Dessa forma, pode-se compreender melhor o que
Nielsen (2000) nos havia dito sobre os ideais artísticos de se expressar – evidenciados em
aspectos de função estética – e os ideais da engenharia em fazer as coisas funcionarem –
evidenciados em aspectos de função prática –, ambos voltados para produtos web.
Neste trabalho, o enfoque está direcionado aos aspectos de função estética dos
produtos para a internet, o que necessariamente envolve o projeto de interface gráfica.
Entretanto, não se pode falar sobre esses aspectos sem antes compreender melhor a faceta
que, para alguns, inclusive para Nielsen, é a mais importante no design para a internet e que
está diretamente relacionado com os aspectos de função prática do projeto de interface: a
usabilidade.
3.4 USABILIDADE NA WEB
Os aspectos de função prática de um produto para a internet devem permitir que o
mesmo funcione e seja utilizado pelos usuários, o que não significa dizer que tais aspectos
fazem com que o produto possa ser utilizado com facilidade. Possibilidade de uso e facilidade
de uso são facetas completamente diferentes ao se tratar das necessidades e, principalmente,
dos limites dos usuários. É nesse momento que a usabilidade se encaixa no projeto de design,

35
agregando facilidade de utilização ao produto. Segundo Renata Zilse (2003),
[...] usabilidade não é definitivamente um conceito novo (e, diga–se de passagem, a
palavra já está um tanto gasta). Na verdade, os ergonomistas vêm martelando há
cerca de 50 anos o que pode também ser chamado de amigabilidade, ou projetado
ergonomicamente, ou design centrado no usuário, ou desenvolvimento de produto
orientado para o consumidor.
Já para Amstel (2006), “usabilidade é sinônimo de facilidade de uso. Se um produto é
fácil de usar, o usuário tem mais produtividade: aprende mais rápido a usar, memoriza as
operações e comete menos erros”. Em websites a usabilidade está associada aos elementos de
função prática, mas, necessariamente, na maneira como estes elementos são projetados, tendo-
se em vista a fácil interação do usuário através de uma interface gráfica. Ainda segundo
Amstel, “sempre que houver uma interface, ou seja, um ponto de contato entre um ser
humano e um objeto físico [...] ou abstrato [...], podemos observar a usabilidade que esse
objeto oferece”. Isso deixa claro que o conceito de usabilidade não se aplica somente a
projetos digitais, pois projetos com foco na facilidade de uso podem levar em consideração
qualquer tipo de produto. Norman (2006, p.15), ao referir-se à usabilidade para o design diz
que “está na hora de trazê-la para seu lugar de direito no processo de desenvolvimento de
produto”. A citação do autor tem relação com as críticas que o mesmo faz sobre os produtos
do dia-a-dia que são projetados sem as devidas preocupações com questões de usabilidade.
Contudo, o autor faz uma ressalva ao dizer que “isso não significa que a usabilidade tenha
precedência sobre tudo o mais”.
Entretanto, no meio digital, é muito comum autores defenderem a usabilidade dos sites
como sendo o mais importante em projetos web, assim como o fazem Jakob Nielsen e outros
chamados “gurus” da internet. Muitos deles, inclusive o próprio Nielsen, determinam que a
usabilidade está acima de qualquer coisa.
Embora eu reconheça que haja necessidade de arte, alegria e diversão na Web,
acredito que o principal objetivo da maioria dos projetos da web seja facilitar aos
clientes o desempenho de tarefas úteis (NIELSEN, 2000, p.11).
Seu ponto de vista é muito válido, pois de nada adiantará um website ser considerado
bonito e atrativo se não oferecer condições de uso. Porém, o excesso de convicção do autor
sobre esse assunto faz supor que a união da usabilidade com outras dimensões do design,
como a função estética, por exemplo, pareça impossível. De outro modo, Norman (2006a,
p.15), afirma que “todas as grandes criações de design têm um equilíbrio e uma harmonia
apropriados entre beleza estética, confiabilidade e segurança, usabilidade, custo e
funcionalidade”. Sobre isso, o autor ainda diz que:

36
[...] não há necessidade de sacrificar a beleza pela usabilidade nem, já que estamos
falando nisso, a usabilidade pela beleza. Não há necessidade de sacrificar custo ou
função, tempo para manufaturação ou vendas. É possível criar coisas que sejam ao
mesmo tempo criativas e usáveis, ao mesmo tempo prazenteiras e completamente
utilizáveis. A arte e a beleza desempenham papéis essenciais em nossas vidas. Bons
designs incluem tudo isto – prazer estético, arte, criatividade – e ao mesmo tempo
são usáveis, de fácil operação e prazerosos (NORMAN, 2006b, p.15).
Deste modo, defende-se neste trabalho que a usabilidade é fundamental em projetos
web, mas não necessariamente mais importante que outros aspectos. Interfaces frias e pouco
atrativas podem não promover experiências de uso prazerosas, mesmo que sejam muito fáceis
de serem utilizadas. Pode-se dizer, portanto, que o embate existente entre estética e
usabilidade, por exemplo, é o mesmo que se costuma fazer entre forma e função. Para tal, já
se concluiu que essas duas dimensões, quando equilibradas em um projeto, tornam-se
aspectos que diferenciam o design ruim do bom design, ou seja, quando atuam conectadas
apenas engrandecem a qualidade do projeto.
Este capítulo aborda, também, em qual etapa do projeto a usabilidade é levada em
consideração e qual equipe é responsável pelo design de interface com foco na usabilidade.
3.5 PROCESSO DE DESIGN PARA A INTERNET
Tendo em vista que uma interface gráfica é o meio de interação entre o homem e o
computador, pode-se dizer que todo processo de design a ser elaborado tem como objetivo
projetar e desenvolver interfaces gráficas funcionais, que justamente possibilitem interação. E
é no momento do processo de design que as muitas disciplinas que envolvem o projeto se
unem para alcançar tal objetivo. Segundo Renata Zilse (2003), “mais complexo que o
desenvolvimento de uma peça gráfica, o desenvolvimento de mídias interativas envolve uma
série de conhecimentos específicos, onde o principal deles é a Ergonomia”. Assim, a autora
salienta a importância da facilidade de uso em websites. Já para Memória (2006, p.10), “um
produto bem projetado envolve muito mais do que apenas um conteúdo de qualidade.
Questões como facilidade de uso, desempenho e design gráfico também são importantes”.
Dessa forma, o autor lembra que, além da importância do conteúdo para um website, outros
fatores contribuem para que o usuário tenha uma experiência agradável ao se relacionar com o
mesmo, o que inclui a forma como são projetados os aspectos visuais e de função prática.
Ainda para Memória, a contribuição desses aspectos somados à questão da fluidez que o site
promove, são responsáveis por gerar a “experiência perfeita”. É interessante, neste caso,
compreender-se a que tipo de experiência o autor se refere. Foi visto que aspectos de função

37
estética têm como objetivo promover experiências estéticas, assim como aspectos de função
prática têm como função promover experiências de funcionalidade prática. A “experiência
perfeita” a qual Felipe Memória se refere é a soma de todas as experiências de usuário que um
produto para a internet pode gerar. Nesse caso, ela engloba experiências referentes à
facilidade de uso, aos aspectos visuais, ao conteúdo e tantas outras que, quando somadas,
possibilitem a fluidez total mencionada pelo autor. A interatividade, inclusive, é uma forma
de um produto promover experiências diferenciadas. No entanto, para que o usuário tire
proveito de uma “experiência perfeita” ou, caso isso for impossível, ao menos prazerosa, é
importante que cada etapa do processo de design seja bem conduzida pelas equipes
responsáveis por cada disciplina. De acordo com Zilse (2003), “[...] o desenvolvimento web é
um dos processos mais multidisciplinares que existem. Dependendo, claro, do tamanho do
site em questão, a equipe pode contar com cerca de 10 profissionais diferentes”. Assim sendo,
é no momento do processo de design que a multidisciplinaridade, geralmente atrelada a
agências digitais de maior porte, é levada em consideração e contribui para o sucesso do
projeto. Memória (2006) nos apresenta um gráfico utilizado por Van Duyne, Landay e Hong
que simboliza um processo genérico de desenvolvimento de websites baseado em avaliações
de usuários.

38
Figura 6: Processo genérico de desenvolvimento de websites
Fonte: MEMÓRIA, 2005, p.11
Segundo Memória (2006), os termos utilizados no gráfico têm o seguinte significado:
· Levantamento de dados: conhecimento do público-alvo e suas necessidades,
conceituação e objetivos dos usuários no website.
· Criação: geração de idéias que podem ou não ser aproveitadas para
desenvolvimento futuro.
· Refinamento: aperfeiçoamento do código, conteúdo e imagens finais do site.
· Produção: desenvolvimento do protótipo funcional.
· Implementação: desenvolvimento do código, conteúdo e imagens finais do site.
· Lançamento: disponibilização do website para uso real.
· Manutenção: atualização do site existente, com análise de métricas de sucesso e
preparação para o redesign.
A união dessas etapas fornece um claro exemplo de como funciona a metodologia de
projeto de websites e de como várias disciplinas envolvem-se no processo. Entretanto, não
existe uma só metodologia que defina a melhor maneira de projetar websites. Cada agência ou
equipe de profissionais pode conceber seu próprio modelo metodológico. Radfahrer (2001,
p.167) propõe quatro fases padrão que compõem um processo de desenvolvimento, do

39
briefing (informações a respeito de um trabalho a ser realizado) à finalização do produto:
· Briefing ou conceito – Definição do foco do website, seu consumidor, objetivos de
marca e vendas a ser apresentado. Essa fase procura conhecer o cliente, seu
consumidor e o que o levaria a gastar algum dinheiro para acessar a internet. É a
parte mais difícil e mais importante.
· Estrutura ou roteiro – Como vai ser a navegação através do endereço, a ordem das
páginas e todas as alternativas de visitação. É a hora da definição do mapa,
conjuntos de dados e arquitetura da informação.
· Interface – Design de estruturas informativas, barras de navegação e relação
computador-usuário. O design estrutural, projeto gráfico e direção de arte
acontecem aqui, formando a “cara” do site.
· Programação ou manutenção – escolha da tecnologia e sua utilização na
viabilização do projeto, sua consistência, auditoria e manutenções periódicas.
Neste modelo sugerido por Radfahrer (1999), também fica fácil perceber como a
multidisciplinaridade é importante para um projeto. Uma equipe com foco em atendimento e
planejamento, por exemplo, tende a ser mais qualificada para cumprir a etapa do briefing do
que a da programação. Da mesma forma, profissionais responsáveis pela programação,
geralmente com background em ciências da computação e tecnologia, possivelmente seriam
mais qualificados para assumir essa etapa do que diretores de arte e designers gráficos.
Assim, fica claro o motivo de projetos maiores serem geralmente multidisciplinares.
Entretanto, manter equipes com diferentes backgrounds proporciona custos maiores para a
agência, o que prova o porquê de agências menores muitas vezes adotarem metodologias
sintetizadas ou, em última instância, não utilizarem metodologia alguma.
Radfahrer (1999) ainda propõe um modelo próprio de processo de desenvolvimento,
porém, salienta que procura absorver a cultura de cada cliente para projetar sites da forma
mais personalizada possível. Contudo, as etapas que geralmente segue são as seguintes:
1 - Definição das necessidades e objetivos da empresa em um ambiente digital [...];
2 - Desenvolvimento do conceito (comercial, criativo, técnico) e seus objetivos;
3 - Especificações, planejamento e cronograma;
4 - Organização dos grupos de informação e seu fluxo, design estrutural;
5 - Design, texto e direção de criação;
6 - Produção de conteúdo;
7 - Integração de conteúdo;

40
8 - Programação e integração de software;
9 - Testes e controle de qualidade
10 - Lançamento e marketing;
11 - Manutenção;
12 - Acompanhamento do usuário.
Sobre essa metodologia, o autor afirma que:
[...] essas etapas são feitas individualmente, mas, no correr do processo, muitas delas
acabam se acumulando, invertendo ou simplesmente englobadas por outras.
Consideramos, para o processo como um todo, quatro grandes fases: Lápis
(definição e estrutura – 1 a 4); Photoshop (design e produção visual – 5 a 7); Código
(programação e testes – 8 e 9); e Manutenção (lançamento, atualização e suporte –
10 a 12). Para cada fase é bom contar com profissionais ou equipes especializadas
(RADFAHRER, 1999, p.171).
Assim sendo, pode-se notar a importância da metodologia e da multidisciplinaridade
para projetos digitais, assim como a verificação de modelos diferentes, porém, com mesmas
características e objetivos. Para este trabalho, optou-se por descrever e utilizar como
referência o processo de design sugerido por Mauro Pinheiro e citado por Memória (2006,
p.32):
1) Demanda/Definição da estratégia
2) Benchmark
3) Levantamento de funcionalidades desejadas (brainstorm)
4) Macroarquitetura da informação
5) Verificação da viabilidade tecnológica
6) Continuação do projeto
a. Detalhamento da arquitetura da informação
b. Desenho da experiência do usuário
c. Projeto da interface
d. Projeto de branding
e. Ajustes
7) Implementação
8) Desenvolvimento
9) Lançamento
A escolha deste processo deve-se ao fato dele ter sido elaborado de tal forma que
facilita a compreensão e a localização estrutural de três etapas importantes para o
entendimento deste trabalho: arquitetura da informação, projeto da interface e projeto de

41
branding ou, como será considerado neste trabalho, projeto de design gráfico. Embora as
outras etapas também assumam papéis fundamentais, como o Benchmark, que é uma fase de
pesquisa, seja da concorrência ou não, ou a Macroarquitetura da informação, que é uma
primeira “planta-baixa” do projeto, as três etapas destacadas representam o momento exato da
criação, ou seja, da formação estrutural, navegacional e visual do projeto. É também nessas
etapas que a definição de design como atividade projetual que considera aspectos de função
prática, simbólica e estética torna-se consideravelmente visível. Dessa forma, ainda que não
exista uma metodologia padrão que possa ser utilizada por qualquer agência, visto que cada
uma pode optar por processos próprios ou personalizados dependendo de cada projeto, as três
etapas escolhidas e que serão vistas no decorrer deste capítulo são fundamentais para qualquer
projeto web, mesmo que muitas vezes possam se resumir a uma só equipe ou se fundir em
uma só etapa.
3.5.1 Arquitetura da Informação
A arquitetura da informação tem como meta organizar estruturalmente as informações
e conteúdo de produtos para a internet. Segundo Radfahrer (1999, p.122),
[...] antes de se fazer um website é preciso planejar sua estrutura e mapa. Isso se faz
com lápis e papel, imaginando as principais áreas e suas conexões. Todo site, por
menor que seja, tem que ter um diagrama com tudo o que existe nele. Só assim dá
para conhecê-lo rapidamente e ter acesso a todas as informações.
Ainda segundo o autor, “são comuns os websites do tipo ‘beco sem saída’, em que o
único caminho é voltar para a homepage. Ou aqueles em que o visitante é forçado a passar por
várias páginas intermediárias, [...], até chegar à informação”. Nesses casos, fica clara a
inexistência de um planejamento voltado a organização estrutural do website. “É para acabar
com esse tipo de problema que existe a arquitetura de informação, que visa a organização de
grandes massas de dados, preparando rotas de acesso a eles” conclui Radfahrer. Levando em
consideração o processo de design no site da Globo.com, Memória (2006, p.29), afirma que
“as equipes de arquitetura da informação e design de interface dão ênfase às questões de
usabilidade e experiência do usuário”. Mais especificamente sobre a equipe de arquitetura da
informação, o autor diz o seguinte:
[...] a equipe de arquitetura da informação faz o levantamento e a categorização de
todas as informações que existirão nos sites. Eles estimam a quantidade de páginas,
o conteúdo e as funcionalidades existentes em cada uma delas, bem como a
importância de cada informação presente na tela. Além da arquitetura da informação
propriamente dita (...), o grupo é responsável pelo documento de descrição de telas,

42
que explica o funcionamento de cada elemento da página. Esse documento é usado
tanto pelos designers de interface e branding, quanto pelos profissionais de
tecnologia (MEMÓRIA, 2006, p.29).
Um documento de arquitetura da informação semelhante ao citado pelo autor pode ser
visto no exemplo abaixo.
Figura 7: Exemplo de documento de arquitetura da informação
Fonte: <http://www.usabilidoido.com.br/imagens/diagrama_navegacao.png>
É através dele, portanto, que o projeto passa a ter uma primeira organização estrutural
e, a partir do mesmo, é dado início ao design de interface. Dessa forma, a equipe de
arquitetura da informação planeja a distribuição do conteúdo do website para ser
posteriormente moldado funcionalmente pela equipe de design de interface.
3.5.2 Projeto de Interface
Vimos anteriormente que uma interface gráfica é responsável por promover a
interação do usuário com o computador e que aspectos que promovam a facilidade de uso

43
devem ser levados em consideração no projeto de uma interface. É por esse motivo, segundo
Memória (2006, p.30), que:
[...] a equipe de design de interface preocupa-se com a usabilidade e a interação
humano-computador de tudo o que é projetado na criação. São os responsáveis pela
facilidade de uso e aprendizado, memorização, tratamento de erros e até mesmo pela
capacidade de agradar o usuário.
Tais características fazem dos designers de interface os responsáveis por promover a
usabilidade nos produtos para a internet. Para isso, porém, eles precisam manter uma relação
muito estreita com a equipe de arquitetura da informação. Sobre a equipe de design de
interface do site da Globo.com, o mesmo autor diz que:
[...] eles usam os documentos de arquitetura de informação para se guiar e projetar a
página: hierarquizar informações, pensar o funcionamento da navegação, montar
uma estrutura de layout e de grid distribuídos de forma agradável, abordar tipos de
interação etc. Eles projetam os wireframes, que são como uma planta-baixa do site,
prevendo cada detalhe e funcionalidade que será utilizada (MEMÓRIA, 2006, p.30).
Entretanto, Leonardo Oliveira (2003), ao dizer que “o wireframe é um documento que
se torna cada vez mais fundamental para o trabalho do arquiteto de informação”, mostra que,
em alguns processos, as funções destinadas às equipes de design de interface e arquitetura da
informação se confundem. Porém, indiferente de qual for o profissional ou equipe destinada a
exercer tais funções, o importante é conhecer as etapas fundamentais de um bom projeto web.
Para este trabalho, no entanto, definiu-se que as duas equipes têm como foco a usabilidade.
Contudo, será levado em consideração que o arquiteto de informação é o responsável pelo
mapa do site e pela distribuição e categorização do conteúdo, assim como o designer de
interface ou projetista de interface é o responsável por projetar o wireframe e o site com foco
na facilidade de uso e navegação, mesmo que ambas as disciplinas venham a se transformar
em uma só em certos momentos do projeto ou em processos utilizados por agências distintas.
Deste modo, o wireframe, assim como o sitemap ou documento de arquitetura da
informação, como já visto, é um elemento fundamental no processo de design de interface e é
elaborado na fase pós-arquitetura da informação, ou seja, se utiliza do banco de informações
coletado na arquitetura da informação para formar um pré-layout4
do website. É no wireframe
que o arranjo navegacional da interface é estruturado e projetado, levando-se em consideração
a usabilidade e a interação do usuário com o site. Nas figuras 08 e 09 podemos ver, de acordo
com Leonardo Oliveira, exemplos de wireframes utilizados no projeto do site Webinsider:
4
O termo layout, para este estudo, significa, além do esboço do projeto, o resultado gráfico da interface.

44
Figura 8: Exemplo de documento de arquitetura da informação simples
Fonte: <http://webinsider.uol.com.br/img/wireframe_01.jpg>

45
Figura 9: Exemplo de documento de arquitetura da informação complexo
Fonte: <http://webinsider.uol.com.br/img/wireframe_01.jpg>
Assim, ao contrário do documento de arquitetura da informação que apresenta um
organograma do site, o qual define a organização do conteúdo de forma hierarquizada, pode-
se perceber que o wireframe funciona como um primeiro esboço no qual, através de espaços
de informação previamente definidos e cuidadosamente planejados, é possível prever como o
usuário irá navegar pelo site. É também no projeto do wireframe que o designer de interface
insere, de forma prática, os primeiros vestígios de sua preocupação com a usabilidade. Um
wireframe bem projetado é sinal de uma interface amigável e planejada para facilitar a
experiência de uso do usuário e sua interação com o site. Sobre isso, Memória (2006, p.164)
afirma que:
[...] o design da interface tem de basear-se no público-alvo, nos objetivos do produto
e nas principais tarefas. A interface tem de ir direto ao ponto, ser simples, previsível
e óbvia, transparente para o usuário. A navegação e os elementos das páginas devem
ser consistentes, mantendo o mesmo comportamento ao longo do site, que também
deve adotar as convenções da Web. Os textos devem ser curtos e claros, pois fazem

46
parte do projeto. Os tratamentos de erros têm de ser todos pensados e previstos,
dirigindo-se ao usuário de forma simpática e educada.
Outro ponto fundamental no design de interface é a questão da padronização. Para
Memória (2006, p.58), “a padronização das interfaces é um conceito básico e um dos mais
importantes para quem projeta produtos para a internet”. O autor se refere, neste caso, às
convenções de interface, ou seja, aos elementos das interfaces que, para nela estarem
inseridos, devem preferencialmente considerar as soluções previamente ditadas pelos testes de
usabilidade – baseados na facilidade de aprendizado e memorização do usuário – que
acabaram se tornando padrão para o design de interface. O posicionamento da marca da
empresa, no canto superior esquerdo da interface, assim como o campo de busca na parte
superior da tela são apenas dois exemplos dessas convenções, geralmente utilizadas em
portais ou sites corporativos com muito conteúdo e muitas páginas.
Assim sendo, as informações e os espaços previamente definidos pela equipe de
design de interface, juntamente com as convenções dos elementos de interface, além de serem
pensados com foco na usabilidade, serão posteriormente utilizados pelos profissionais de
design gráfico e branding para poderem dar prosseguimento ao projeto. Serão esses
profissionais os responsáveis pelo projeto gráfico e visual do website.
3.5.3 Design Gráfico e Branding
Embora brevemente abordado até aqui – levando em consideração a quantidade de
estudos já feitos na área e que não foram citados neste trabalho – pode-se constatar que o
design para a internet tem como base os aspectos de função prática da interface, e esta, por
conseguinte, é o meio de interação entre o usuário e um computador ou um sistema, como um
website. É importante ressaltar, também, as duas etapas fundamentais no processo de design:
a arquitetura da informação e o design de interface propriamente dito. Cada uma delas possui
características próprias e funções determinantes para o sucesso do projeto e para a interação
do usuário com o produto final. Contudo, ambas as etapas são responsáveis por exercer
funções de cunho prático-funcional, pois consideram aspectos voltados à navegabilidade e
usabilidade. Os sitemaps e wireframes, vistos anteriormente, demonstram esse caráter de
funcionalidade prática do projeto, pois contêm informações pensadas de forma a promover
experiências de uso. No entanto, um produto para a internet não se resume às regras que
promovem facilidade de uso ou a mapas de navegação que determinam e orientam a

47
localização do seu conteúdo. Mesmo que tais funções estejam de acordo com a proposta
estrutural e navegacional do projeto e sejam essenciais para um pleno funcionamento e
facilidade de uso, a forma que tudo isso terá também será determinante para o sucesso do
produto final. E quando se fala sobre forma na internet, se está falando dos aspectos visuais
do site e de todos aqueles que, de um jeito ou de outro, permitem a utilização do site por meio
de uma interface gráfica, comunicam visualmente e promovem experiências estéticas. Para
que isso aconteça, é necessário que o produto também seja projetado graficamente. Neste
caso, a equipe responsável pelo design gráfico dos projetos web é formada por designers
gráficos e chamada de equipe de design gráfico. Caso esta equipe também seja responsável
pelo posicionamento e gerenciamento da imagem e marca do cliente na web, pode ser
chamada de equipe de branding. Em muitos casos, no entanto, não se costuma diferenciar
branding de design gráfico. Memória (2006, p.31), sobre a equipe responsável pelo design
gráfico e gerenciamento de marca do site da Globo.com, afirma que:
[...] a equipe de branding concentra seu trabalho no design gráfico, na parte visual
[...]. Eles são responsáveis pela comunicação da mensagem que deve ser transmitida,
refletindo os atributos da marca e sua personalidade, além das características
emocionais a que o produto deve estar associado. Os profissionais de branding
normalmente têm background em design, com ênfase em comunicação visual ou
publicidade e propaganda.
Por branding pode-se entender o trabalho de construção e gerenciamento de marca que
é elaborado junto ao mercado e, principalmente, junto ao público de interesse. Em relação a
produtos para a internet, esse gerenciamento deve levar em consideração todos os atributos
que a marca carrega consigo para que seja possível desenvolver um trabalho coerente, que
reflita a imagem corporativa da empresa, considerando sua personalidade e identidade visual.
De certa forma, o branding enquanto gerenciamento de marcas é muito mais que o simples
gerenciamento gráfico de produtos. Mauro Pinheiro, em seu modelo metodológico, refere-se à
equipe de projeto de branding mais como uma equipe voltada ao projeto gráfico e de
identidade visual do que propriamente voltada à gestão de marca, pois o branding, em seu
significado real, abarca um leque muito mais abrangente o qual engloba planejamento
estratégico, construção e gerenciamento de marca. O que se deve considerar, no entanto, é o
projeto de branding para a internet, onde a necessidade é o posicionamento de uma marca no
meio digital. Muitas agências digitais trabalham com agências especializadas em branding ou
em parceria com agências de publicidade para conduzir seus trabalhos. Algumas não se
envolvem na questão do processo de branding e posicionamento da marca na web e apenas
conduzem o plano já traçado pelas agências off-line (agências de comunicação tradicionais)

A influência das tendências e estilos no design...

A influência das tendências e estilos no design...

Recomendados

Recomendados

Mais conteúdo relacionado

Mais procurados

Mais procurados (20)

Semelhante a A influência das tendências e estilos no design...

Semelhante a A influência das tendências e estilos no design... (20)

A influência das tendências e estilos no design...