1
UNIVERSIDADE DO VALE DO RIO DOS SINOS
CENTRO DE CIÊNCIAS DA COMUNICAÇÃO
CURSO DE COMUNICAÇÃO SOCIAL
HABILITAÇÃO EM PUBLI...
2
UNIVERSIDADE DO VALE DO RIO DOS SINOS
CENTRO DE CIÊNCIAS DA COMUNICAÇÃO
CURSO DE COMUNICAÇÃO SOCIAL
HABILITAÇÃO EM PUBLI...
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 c...
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...
7
SUMMARY
This work has as objective presents a study regarding the aspects of aesthetic function
in products for the inte...
8
LISTA DE ILUSTRAÇÕES
Figura 1: Design Industrial e suas subcategorias .....................................................
9
Figura 32: Homepage do website Grendene ......................................................................... 93
Fig...
10
SUMÁRIO
1 INTRODUÇÃO......................................................................................................
11
1 INTRODUÇÃO
A internet é considerada atualmente um dos meios de comunicação mais importantes e
dinâmicos de todos. Sua...
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 - ...
13
2 CARACTERÍSTICAS GERAIS DO DESIGN
2.1 DEFINIÇÃO DE DESIGN
A expressão design é empregada no nosso dia-a-dia com demasi...
14
desenho)2
”. Este é um dos motivos pelos quais é tão comum ocorrerem confusões de
entendimento do que vem a ser realmen...
15
um relógio de pulso bem projetado deve exercer, antes de qualquer coisa, a função de exibir
as horas, minutos e segundo...
16
É válido, portanto, questionar sobre os significados do termo design, pois é visível o
uso descabido da expressão em to...
17
Contudo, levando em consideração que o design – ou desenho industrial, como foi
nomeado no Brasil – surge como uma nece...
18
Figura 1: Design Industrial e suas subcategorias
Fonte: VILLAS-BOAS, 1999
Segue uma descrição do que o autor entende po...
19
para a internet ou webdesign, atividade esta pertencente à programação visual e muito ligada
ao design gráfico. Dessa f...
20
Nesse sentido, o produto projetado a partir do design sempre o é feito com o intuito de
que realize determinadas funçõe...
21
aspecto que faz com que sejam escolhidas as suas definições para dar prosseguimento a este
trabalho.
2.3.1 Aspectos de ...
22
receptividade acabou atraindo de toda a Europa figuras e idéias inovadoras
relacionadas ao fazer artístico e arquitetôn...
23
De outro modo, no design projetado para a internet, o funcionalismo levaria em consideração
os aspectos de função práti...
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
pos...
25
3 DESIGN PROJETADO PARA A INTERNET
3.1 DESIGN PARA A INTERNET
No capítulo inicial, definiu-se que design é uma atividad...
26
industrial. Mesmo sendo distribuído em escala quase ilimitada e consumido por um
público de massa, ele pode ser produzi...
27
construir os primeiros sites pessoais e comerciais em uma época onde muito pouco se sabia
sobre a web e poucas pessoas ...
28
O webdesigner, de certa forma, pode ser considerado um profissional com
conhecimento de design e de internet, o qual po...
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 w...
30
Figura 3: Modelo de interface do MS-DOS
Fonte: <http://www.knak.com.br/william/files/promptdos.png>
Entretanto, pode-se...
31
Figura 4: Modelo de interface do Second Life
Fonte: <http://christiano.blog.br/wp-content/uploads/2007/06/secondlife.jp...
32
função prática, o que significa dizer que são justamente os aspectos que promovem algum tipo
de interação entre homem-c...
33
· Entretenimento – Jogos e brincadeiras, normalmente utilizados para lançamentos de
produtos.
· Promocionais – Sites cu...
34
a internet. Na parte de cima tem-se, em ordem, as interfaces gráficas do Google – site de
busca -, Last FM – comunidade...
35
agregando facilidade de utilização ao produto. Segundo Renata Zilse (2003),
[...] usabilidade não é definitivamente um ...
36
[...] não há necessidade de sacrificar a beleza pela usabilidade nem, já que estamos
falando nisso, a usabilidade pela ...
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 promo...
38
Figura 6: Processo genérico de desenvolvimento de websites
Fonte: MEMÓRIA, 2005, p.11
Segundo Memória (2006), os termos...
39
briefing (informações a respeito de um trabalho a ser realizado) à finalização do produto:
· Briefing ou conceito – Def...
40
8 - Programação e integração de software;
9 - Testes e controle de qualidade
10 - Lançamento e marketing;
11 - Manutenç...
41
branding ou, como será considerado neste trabalho, projeto de design gráfico. Embora as
outras etapas também assumam pa...
42
que explica o funcionamento de cada elemento da página. Esse documento é usado
tanto pelos designers de interface e bra...
43
devem ser levados em consideração no projeto de uma interface. É por esse motivo, segundo
Memória (2006, p.30), que:
[....
44
Figura 8: Exemplo de documento de arquitetura da informação simples
Fonte: <http://webinsider.uol.com.br/img/wireframe_...
45
Figura 9: Exemplo de documento de arquitetura da informação complexo
Fonte: <http://webinsider.uol.com.br/img/wireframe...
46
parte do projeto. Os tratamentos de erros têm de ser todos pensados e previstos,
dirigindo-se ao usuário de forma simpá...
47
localização do seu conteúdo. Mesmo que tais funções estejam de acordo com a proposta
estrutural e navegacional do proje...
A influência das tendências e estilos no design...
A influência das tendências e estilos no design...
A influência das tendências e estilos no design...
A influência das tendências e estilos no design...
A influência das tendências e estilos no design...
A influência das tendências e estilos no design...
A influência das tendências e estilos no design...
A influência das tendências e estilos no design...
A influência das tendências e estilos no design...
A influência das tendências e estilos no design...
A influência das tendências e estilos no design...
A influência das tendências e estilos no design...
A influência das tendências e estilos no design...
A influência das tendências e estilos no design...
A influência das tendências e estilos no design...
A influência das tendências e estilos no design...
A influência das tendências e estilos no design...
A influência das tendências e estilos no design...
A influência das tendências e estilos no design...
A influência das tendências e estilos no design...
A influência das tendências e estilos no design...
A influência das tendências e estilos no design...
A influência das tendências e estilos no design...
A influência das tendências e estilos no design...
A influência das tendências e estilos no design...
A influência das tendências e estilos no design...
A influência das tendências e estilos no design...
A influência das tendências e estilos no design...
A influência das tendências e estilos no design...
A influência das tendências e estilos no design...
A influência das tendências e estilos no design...
A influência das tendências e estilos no design...
A influência das tendências e estilos no design...
A influência das tendências e estilos no design...
A influência das tendências e estilos no design...
A influência das tendências e estilos no design...
A influência das tendências e estilos no design...
A influência das tendências e estilos no design...
A influência das tendências e estilos no design...
A influência das tendências e estilos no design...
A influência das tendências e estilos no design...
A influência das tendências e estilos no design...
A influência das tendências e estilos no design...
A influência das tendências e estilos no design...
A influência das tendências e estilos no design...
A influência das tendências e estilos no design...
A influência das tendências e estilos no design...
A influência das tendências e estilos no design...
A influência das tendências e estilos no design...
A influência das tendências e estilos no design...
A influência das tendências e estilos no design...
A influência das tendências e estilos no design...
A influência das tendências e estilos no design...
A influência das tendências e estilos no design...
A influência das tendências e estilos no design...
A influência das tendências e estilos no design...
A influência das tendências e estilos no design...
A influência das tendências e estilos no design...
A influência das tendências e estilos no design...
A influência das tendências e estilos no design...
A influência das tendências e estilos no design...
A influência das tendências e estilos no design...
A influência das tendências e estilos no design...
A influência das tendências e estilos no design...
A influência das tendências e estilos no design...
A influência das tendências e estilos no design...
A influência das tendências e estilos no design...
A influência das tendências e estilos no design...
A influência das tendências e estilos no design...
A influência das tendências e estilos no design...
A influência das tendências e estilos no design...
A influência das tendências e estilos no design...
A influência das tendências e estilos no design...
A influência das tendências e estilos no design...
A influência das tendências e estilos no design...
A influência das tendências e estilos no design...
A influência das tendências e estilos no design...
A influência das tendências e estilos no design...
A influência das tendências e estilos no design...
Próximos SlideShares
Carregando em…5
×

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

1.054 visualizações

Publicada em

0 comentários
1 gostou
Estatísticas
Notas
  • Seja o primeiro a comentar

Sem downloads
Visualizações
Visualizações totais
1.054
No SlideShare
0
A partir de incorporações
0
Número de incorporações
2
Ações
Compartilhamentos
0
Downloads
8
Comentários
0
Gostaram
1
Incorporações 0
Nenhuma incorporação

Nenhuma nota no slide

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

  1. 1. 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. 2. 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. 3. 3 DEDICATÓRIA Aos meus pais, Ampélio e Angela, e, em especial, à Josi, minha Josi.
  4. 4. 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. 5. 5 EPÍGRAFE “Tudo começa pelo olhar.” (Aristóteles)
  6. 6. 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. 7. 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. 8. 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. 9. 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. 10. 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. 11. 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. 12. 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. 13. 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. 14. 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. 15. 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. 16. 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. 17. 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. 18. 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. 19. 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. 20. 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. 21. 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. 22. 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. 23. 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. 24. 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. 25. 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. 26. 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. 27. 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. 28. 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. 29. 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. 30. 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. 31. 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. 32. 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. 33. 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. 34. 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. 35. 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. 36. 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. 37. 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. 38. 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. 39. 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. 40. 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. 41. 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. 42. 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. 43. 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. 44. 44 Figura 8: Exemplo de documento de arquitetura da informação simples Fonte: <http://webinsider.uol.com.br/img/wireframe_01.jpg>
  45. 45. 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. 46. 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. 47. 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)

×