RWD Ed34 by Erivanildo.thegenius

&

We

bd

esi

gn

o

utu

bro

20

06

::

ano

3 :

: n

34

::

ww

w.r

evi

staw

eb

de

sig

n.c

om

.br

outubro 2006 :: ano 3 :: nº 34 :: www.revistawebdesign.com.br

Reportagem: Conheça as transformações ocorridas no design para webEstudo de caso: A era dos sites como estratégia de brandingEspecial: Cobertura do Fórum Internacional de Design e Tecnologia Digital

R$ 8,90

9 7 7 1 8 0 6 0 0 9 0 0 9 43000

I SSN 1806 - 0099

E D I T O R A

DESIGNARTEAmpliando suas fontes de inspiração

“Vamos lá, Picasso, essa tela é pra ontem!!!”

Nossa última reunião de pauta aqui na Arteccom foi bastante

rica e estimulante: falaríamos sobre arte nesta edição! É um assunto

interessante e essencial.

Como Carol ina Lesl ie, da AgênciaCl ick (página 39) , expl ica

bem que a arte não tem que agradar nenhum públ ico e a função

do designer é justamente encontrar soluções ou, s implesmente,

“agradar” este mesmo públ ico, por que design e arte estão tão

próximos, andam tão juntos? A ponto do designer, numa agência de

publicidade, ser chamado de “diretor de arte”? Na minha cabeça,

fico imaginando um diretor de arte mais ou menos assim:

- “Vamos lá, Picasso, essa tela é pra ontem, viu?”

Brincadeiras à parte, acho que um designer deve, ao invés de

se sentir um artista, conhecer muito de arte e interpretá-la como

formas de expressão. Um art i s ta , no seu momento de cr iação,

chora, ri, sofre, sente angústia e, finalmente, encontra uma maneira

de extravasar seus sentimentos, através de formas, cores, sons,

ocupação do espaço...

Um designer também pode chorar, sorrir, sofrer, se o objetivo

for encontrar soluções inovadoras para seus cl ientes. Ou seja, a

arte deve servir apenas como uma grande fonte de inspiração. E,

com esse objetivo, preparamos várias páginas para a sua imersão

no mundo da arte.

Boa leitura.

Editorial Equipe

Criação e edição

Produção gráfica

Distribuição

www.arteccom.com.br

www.prolgrafi ca.com.br

www.chinaglia.com.br

A Arteccom é uma empresa de design, especializada na criação de sites e responsável pelos seguintes projetos:Revista Webdesign :: www.arteccom.com.br/webdesignCurso Web para Designers :: www.arteccom.com.br/cursoEncontro de Web Design :: www.arteccom.com.br/encontroPortal Banana Design :: www.bananadesign.com.brProjeto Social Magê-Malien :: www.arteccom.com.br/ong

Adriana Melo

:: A

Art

ecco

m n

ão s

e re

spon

sabi

liza

por

info

rmaç

ões

e op

iniõ

es c

ontid

as n

os a

rtig

os a

ssin

ados

, bem

com

o pe

lo t

eor

dos

anún

cios

pub

licitá

rios.

:: N

ão é

per

mit

ida

a re

pro

duç

ão d

e te

xtos

ou

imag

ens

sem

aut

oriz

ação

da

edit

ora.

Dire ção Geral Adriana [email protected]

Direção de RedaçãoLuis [email protected]

Criação e DiagramaçãoCamila [email protected] [email protected]

IlustraçãoBeto [email protected]

PublicidadeBruno Pettendorfer

Débora [email protected]

Gerência de TecnologiaFabio Pinheiro [email protected]

FinanceiroCristiane [email protected]

Atendimento e AssinaturasLuanna [email protected]

4 :: quem somos

9

menu :: 5

apresentação

pág. 4 quem somos

pág. 5 menu

contato

pág. 6 emails

pág. 6 fale conosco

fique por den tro

pág. 8 métricas e mercado

pág. 10 direito na web

pág. 11 post-it

e-mais

pág. 38 debate: Adaptar-se

pág. 44 e-mais: Virais na web

pág. 48 especial: FIND

pág. 51 estudo de caso: Bicmusic

pág. 54 tecnologia na web: CSS Hacks

pág. 56 tutorial: Caminhando pelo HTML - Parte 5

com a palavra

pág. 58 mercado de trabalho: Cesar Paz

pág. 60 marketing: René de Paula Jr.

pág. 62 bula da Catunda: Marcela Catunda

pág. 64 webdesign: Luli Radfahrer

portfólio

pág. 12 agência: Cappuccino/HZTA

pág. 18 freelancer: Renato Loose

matéria de capa

pág. 20 entrevista: Design e arte

pág. 28 reportagem: Design na web

fale conosco pelo site www.arteccom.com.br/webdesign

:: Os emails são apresentados resumidamente. :: Sugestões dadas através dos emails enviados à revista passam a ser de propriedade da Arteccom.

6 :: emails

Olá, pessoal da minha revista

predileta! Como acompanho

vocês há um bom tempo (desde

sua estréia, diga-se de passagem),

gostaria de sugerir um tópico

super importante e que a maioria

dos sites deve ter: a Política de

Privacidade. Como constituí-la,

que benefícios e qual segurança

ela fornece ao site. É isso.

Obrigada!Fernanda [email protected]

Ótima sugestão, tanto é que ela

se tornou tema da coluna “Direito

na web”. Vá até a página 10 e boa

leitura!

Direito na web Assunto: Política de privacidade

Direito na web Assunto: Flash, ActionScript...

Que tal uma reportagem a

respeito do que há de novo e

“realmente útil” no ActionScript

3.0 do Adobe Flash 9? Ou algo

do tipo “o que seria da web

sem o Adobe Flash”, quais suas

contribuições, seus problemas, seu

crescimento na utilização em web

sites, o que é viável e inviável.

Parabéns pelo canal aberto para

sugestões.Misael [email protected]

Oi, Misael.

Ótimas sugestões! Estes temas

são boas pautas para as seções

Tecnologia na Web e Tutorial.

Pensamos em procurar algum

profi ssional fera em ActionScript

para desenvolver um tutorial para a

revista. O que acha? Abraços!

Direito na web Assunto: Referências

Sugestão de pauta: a revista

digital internacional (feita por

brasileiros) IDEAFIXA (www.

ideafi xa.com). Se valer a pena,

entrem em contato! Obrigada.Janara [email protected]

Obrigado pela indicação,

Janara. Na verdade, já tínhamos

conhecimento do trabalho de

vocês, excelente por sinal! Em

setembro, lançamos uma nova

seção (Post-it) e colocamos a

Assunto: Acessibilidade

Gostaria de saber se em alguma

edição vocês já fi zeram matérias

sobre acessibilidade na web.

Estou fazendo meu trabalho de

conclusão do curso de Publicidade

e Propaganda e estou levantando

o máximo de informações

possíveis. Obrigado!Fernando [email protected]

Fizemos sim! A reportagem saiu

Gostei muito da Coleção Brasil

Design, mas tenho uma dúvida

em relação aos profi ssionais que

atuam no exterior. Levando em

consideração a difi culdade para

conseguir um visto de trabalho

permanente no exterior, gostaria

de saber como estes profi ssionais

conseguem a sua permanência

no exterior de forma legal,

para realizar trabalhos e se

estabelecerem em empresas sem

problemas com passaportes e

extradições de estrangeiros?Leandro [email protected]

Durante o workshop Conexão

(www.arteccom.com.br/conexao),

André Matarazzo respondeu

justamente esta questão. Segundo

ele, é bom sair do Brasil com o

visto resolvido. Se você puder

conseguir dupla cidadania, melhor

ainda. Geralmente, as grandes

agências procuram ajudar os

profi ssionais estrangeiros a resolver

este problema.

Direito na web Assunto: Trabalho no exterior

Sou do colégio FECAP e estou

produzindo um trabalho de

conclusão de curso. Gostaria de

saber se poderiam nos ajudar e

nos enviar os nomes das maiores

empresas presentes no mercado

de web. Obrigada.Janaina [email protected]

Como vai, Janaína? Sobre sua

dúvida: qual o segmento do

mercado web que você quer

informações (provedores de

hospedagem, agências interativas

etc.)? Se forem os provedores de

hospedagem, uma boa pedida

é acessar o site da Hostmapper

(www.hostmapper.com.br/ranking-

hospedagem-de-sites.html), que

aponta as 50 maiores empresas.

Sobre as agências, procure entrar

em contato com o pessoal da

AGADi (www.agadi.com.br) e

APADI (www.apadi.com.br).

Direito na web Assunto: Maiores empresas do mercado

na edição nº15, de março de 2005.

Uma boa pedida é acessar o site do

projeto do SERPRO, desenvolvido

justamente sobre esta área (http://

www.serpro.gov.br/acessibilidade).

IDEAFIXA como uma das principais

referências para o trabalho de

designers. Todo mês vamos incluir

alguma publicação que pode servir

como referência no trabalho criativo

de nossos leitores.

Envie sugestões e críticas para [email protected]

8 :: métricas e mercado

Esse é o tempo, em termos de horas navegadas no domicílio,

dos usuários brasileiros. O Brasil é o primeiro colocado na cate-

goria, fi cando a frente de países como Japão, EUA e França.

Fonte: Ibope//NetRatings (www.ibope.com.br)

20h39min

52%

... dos usuários corporativos serão depen-

dentes da prática de mobilidade para os

próximos dois anos, segundo previsão da

Associação Brasileira de e-business. O ce-

lular foi considerado o dispositivo móvel

mais adequado. Fonte: Associação Brasileira

de e-business (www.ebusinessbrasil.com.br)

Pesquisa aponta um aumento de 21% no número de in-

ternautas residenciais que acessaram sites de vídeos e

filmes em julho de 2006. Em junho, foram 3,4 milhões de

usuários únicos domiciliares. Segundo o Ibope, o maior

acesso à banda larga tem incentivado um maior consumo

de conteúdo áudio-visual.

Fonte: Ibope//NetRatings (www.ibope.com.br)

Vídeos e filmes

Este foi o faturamento total do comércio eletrônico nacio-

nal, nos seis primeiros meses de 2006. O índice de cresci-

mento nominal foi de 79%. No mesmo período de 2005,

foram apurados 974 milhões.

Fonte: Web Shoppers – 14ª Edição (www.webshoppers.com.br)

R$ 1 bilhão e 750 milhões

Você utiliza CSS Hacks para a criação de um site?

Total de votos: 272

Sim - 64%

Não - 36%

acesse e participe!

www.arteccom.com.br/webdesign

Média Salarial Brasil - Agosto/2006Analista Júnior Desenvolvimento de Internet / Sistemas Web 2.455,00 (Fonte: 195 respondentes)

Analista Pleno Desenvolvimento de Internet / Sistemas Web 3.753,00 (Fonte: 329 respondentes)

Analista Sênior Desenvolvimento de Internet / Sistemas Web 4.830,00 (Fonte: 335 respondentes)

Analista Programador(a) Web 2.866,00 (Fonte: 223 respondentes)

Coordenador(a) de Projetos Web 5.852,00 (Fonte: 180 respondentes)

Editor/Produtor de Conteúdo Web 2.456,00 (Fonte: 40 respondentes)

Webdesigner Estagiário 584,00 (Fonte: 112 respondentes)

Webdesigner Trainee 1.418,00 (Fonte: 87 respondentes)

Webdesigner 2.303,00 (Fonte: 177 respondentes)

Web Development 3.422,00 (Fonte: 46 respondentes)

Webmaster 2.442,00 (Fonte: 183 respondentes)

Fonte: 20º Edição da Pesquisa Salarial Catho (www.catho.com.br)

métricas e mercado :: 9

ViuIsso? Por Michel Lent Schwartzman - [email protected]

Site: www.viuisso.com.br

Notícias e comentários sobre comunicação digital, internet e publicidade

YouTube começa a reaver ‘dindim’

Páginas especiais para artistas como Paris Hilton e co-

merciais em vídeo são estratégias do maior site de vídeos do

mundo para tentar começar a equilibrar seus gastos de cerca

de US$ 1 mi mensais, só em tráfego de dados.

O site, inaugurado em fevereiro de 2005, é o maior fenô-

meno de audiência do mundo, servindo mais de 100 milhões

de vídeos por dia e efetivamente ameaça uma série de mode-

los já estabelecidos. A questão é ver em quanto tempo e de

que forma ele vai encontrar seu ponto de equilíbrio financeiro

e se tornar um verdadeiro negócio rentável.

Leia as notícias: http://www.techcrunch.com/2006/08/22/pa-

r is-hi lton-storms-youtube/ e http://www.bluebus.com.br/show.

php?p=1&id=71407.

Google’s Click-to-call: do search ao telefone em um click

Direto do blog do Marcelo Sant’Iago (http://poucas-e-

boas.blogspot.com): o novo sistema de ‘click-to-call’ que o

Google está apresentando e que deve estar disponível no

Brasil em breve. Ao pesquisar um assunto no Google e encon-

trar um anúncio pago com um ícone de telefone ao lado, será

possível clicar e receber uma ligação imediata do anunciante.

A junção “internet+telefone” seria risível e impensável oito

ou dez anos atrás. A maioria das conexões era discada e mui-

to pouca gente tinha celular. Hoje em dia faz todo sentido.

Teste o ‘click-to-call’ (http://tinyurl.com/zkpza).

MTV segue onda do YouTube e lança Overdrive?

Acho que não...

Notícia da Folha Onl ine

(http://www1.folha.uol.com.br/

folha/informatica/ult124u20504.

shtml) fala do lançamento do

MTV Overdrive (só para quem usa

Windows e tem o Window Media

Player - http://mtv.terra.com br/

mtvoverdrive/) no Brasil.

O site, que já existe nos Estados Unidos há um ano, se-

ria a resposta da MTV para o sucesso do YouTube que, recen-

temente, anunciou que pretende ter em seu acervo, todos os

videoclipes já feitos no mundo. Fui conferir o novo site e dei

de cara com problemas de configuração, DRMs, incompati-

bilidades com browser, Macintosh etc. Bater no YouTube já

saindo de cara com tantas restrições? I don’t think so...

FaleBenQ encerra concurso com 100 vídeos

O concurso ‘Fa leBenQ’

(www.falebenq.com.br), cria-

do pela 10’Minutos Interacti-

ve para a marca taiwanesa de

eletrônicos recém-chegada ao

Brasil, foi encerrado no final de

agosto contando com a parti-

cipação de mais de 100 vídeos criados por usuários com o

objetivo de ensinar a falar ‘BenQ’ (‘benquíu’). Desde vídeos

simples, criados com webcam, até animações elaboradas em

desenho animado participaram do projeto, em que os usuá-

rios colocavam suas criações no YouTube e então enviavam

os vídeos para o site FaleBenQ. Até a data, os vídeos já ha-

viam sido visualizados mais de 200 mil vezes.

Gilberto Martins de Almeida

Advogado formado na PUC/RJ,

com Mestrado na USP e cursos

em Harvard e no M.I.T. Ex-

Gerente Jurídico da IBM, onde

trabalhou por 11 anos, no Brasil

e nos EUA. Sócio de Martins de

Almeida - Advogados, escritório

especializado.

Envie sua dúvida para:

[email protected]

Particularidades de uma Política de Privacidade

Em tempos de alto valor da “infor-

mação” (senha pessoal, dados cadastrais,

hábitos de navegação, compras efetuadas,

número de cartão de crédito etc.), é natural

que os proprietários de websites cada vez se

preocupem mais quanto a alegações de vio-

lação de privacidade, especialmente quando

elas são acompanhadas de pretensão de in-

denizações, enquadramento criminal, habe-

as data etc. O tema está em evidência não

apenas em razão do noticiário envolvendo a

Google (Orkut) e o Ministério Público.

Mas, afinal, o que vem a ser uma Po-

lítica de Privacidade? Legalmente, é uma

estipulação unilateral que funciona como

contrato de adesão para os que freqüen-

tem o website que a tenha adotado. Como

contrato de adesão, há uma parte em que

se tem liberdade para definir regras a se-

rem seguidas pelos visitantes, e há outra

parte em que o contrato não pode contra-

riar a lei sob pena de ser nulo.

A Política de Privacidade é composta

de quê? Isso depende, em primeiro lugar,

do tipo de website, público-alvo, objetivos

comerciais, necessidades de segurança,

dentre outros fatores a serem considera-

dos sob medida, caso a caso. Em assuntos

de direito de privacidade, a palavra-chave

é proporcionalidade. Portanto, essa “cus-

tomização” é fundamental, sob pena de

a omissão de um item, ou a incompatibi-

lidade de outro, fazerem ruir a Política. Ou

seja, desconfie de modelos pré-prontos.

À parte as adaptações individuais ne-

cessárias, o conteúdo básico de uma Política

de Privacidade pode incluir regras e avisos

10 :: direito na web

sobre quais informações serão compartilha-

das, qual a segurança contra invasões e apro-

priações indevidas, quais as áreas de acesso

restrito, quais as situações e os procedimentos

para liberar informações às autoridades, quais

conhecimentos e dados serão considerados

como segredos comerciais, qual será o esco-

po de atividades passíveis de monitoramento

eletrônico, além de, preferencialmente, um

campo em branco para o internauta clicar caso

aceite receber e-mail marketing.

E o que ela não deve conter? Regras

confl itantes com as do Termo de Uso ou com

outras normas ou práticas do site, informe

inverídico sobre sigilo ou sobre não uso co-

mercial de dados, promessa não cumprida de

monitoramento e de segurança são apenas

alguns exemplos do que, infelizmente, por

desconhecimento das implicações legais, ain-

da grassa no mercado.

Os benefícios que ela proporciona são,

em primeiro lugar, de evitar mal-entendidos

e expectativas equivocadas, ao esclarecer

claramente quais são as regras aplicáveis, e

em segundo lugar, de proteger a privacidade

do próprio site e das pessoas que o freqüen-

tam, na medida em que previne responsabili-

zação cível ou criminal. Terceiro, legitima, nas

condições que especifica, o uso de cookies,

web bugs, e envio de spam, contribuindo

para a sustentação comercial e econômica

do site, de forma legal.

Como se vê, Políticas de Privacidade

são tudo, menos “política”. No fundo, são

um equilíbrio entre direitos e interesses

opostos, que costuma servir bem quando o

trabalho é de alfaiataria.

Como constituí-la, que benefícios e qual segurança ela fornece ao site?

Fernanda Prevedello ([email protected])

A web 2.0 com a cara do Brasil!Os projetos brasileiros que

utilizam os conceitos de web

2.0, como Videolog.tv (www.

videolog.tv), Gazzag (www.

gazzag.com.br), Camiseteria

(www.camiseteria.com), Aprex

(www.aprex.com.br), entre

outros, estão fazendo sucesso

no exterior! Para se ter uma idéia, o tema foi analisado recentemente

por Richard MacManus (http://tinyurl.com/zukx3), consultor web e

colunista do site ZDNet (http://tinyurl.com/f329t).

Participe do Post-it! Envie sugestões para [email protected].

Livro do mês“Ergodesign e Arquitetura da

Informação: trabalhando para o

usuário”

Autor: Luiz Agner

"A época de bibliografia brasileira

escassa na área de criação e

desenvolvimento de sites parece

ter chegado ao fim. Isso porque, nos últimos dois anos, uma

série de autores nacionais vem contribuindo para tornar esta

realidade diferente. Um deles é Luiz Agner, professor da

UniverCidade e PUC-Rio, em recente lançamento pela Quartet

Editora (www.quartet.com.br). Com uma linguagem simples e

objetiva, o livro apresenta uma série de questões envolvendo

Arquitetura da Informação, Ergodesign e Usabilidade,

mostrando como estes temas funcionam como ferramentas

estratégicas na construção de ambientes interativos. Como diz

Peter Morville, no texto de apresentação do livro: 'a educação

é a chave para o sucesso. Somente compartilhando o nosso

conhecimento, nós podemos ter a esperança de superar a

disciplina e de construir uma comunidade."

07/10 - Webmarketing (www.fiti.org.br)

12 a 15/10 - RDesign Lorena (www.fatea.br/rdesign/index.php)

28/10 - Intercon (www.imasters.com.br/intercon/2006)

18/11 - 11º EWD - POA (www.arteccom.com.br/encontro)

21/11 - 11º EWD - Curitiba (www.arteccom.com.br/encontro)

23/11 - 11º EWD - Brasília (www.arteccom.com.br/encontro)

25/11 - 11º EWD - São Paulo (www.arteccom.com.br/encontro)

Agenda de eventos

Dicas

post-it :: 11

Fique por dentro

das dicas, eventos,

livros e referência

s

que movimentam o mundo

do design na web

Peixe Grande entra na fase de votaçãoSe os políticos entram, neste mês, na reta final de suas campanhas

eleitorais, outubro representa também o início da corrida para as

agências e os profissionais freelancers buscarem votos que vão

garantir lugar na fase final do “III Concurso Peixe Grande”. Entre no

site www.arteccom.com.br/webdesign/peixegrande e confira quem

são os concorrentes nesta pescaria.

Referências criativasConhecer o trabalho de outros profissionais e agências é uma forma

de ficar atualizado sobre as novas tendências e as técnicas que

vêm sendo utilizadas no mercado. Confira alguns bons exemplos:

K2 Internet (www.k2.pl), Platinum FMD (www.platinumfmd.com.

br), Emil Kozak (www.emilkozak.com) e Glauco Diogenes (www.

glaucodiogenes.com.br). Conhece outras boas referências? Então,

mande um e-mail para [email protected].

Banco de dados sobre o design brasileiroEssa vai para a lista de favoritos: o portal DesignBrasil (www.

designbrasil.org.br), uma iniciativa do Ministério do Desenvolvimento,

Indústria e Comércio Exterior, traz uma série de informações relevantes

para quem trabalha na área: agenda de eventos, artigos, banco de

profi ssionais, dicas etc.

Nova geração do design na webDando continuidade ao trabalho de divulgação da produção

universitária na área do design na web, indicamos a monografia “O

Ícone Interfacial: Estudo e Análise Conceitual e Tecnológica” (http://

tinyurl.com/fgv2r), apresentada por Eduardo Loureiro, na conclusão

do curso de Comunicação Social da Uni-BH. Se você possui ou

conhece algum trabalho acadêmico interessante, envie sua sugestão

para [email protected].

Segundo a Wikipédia, o cappuccino é uma bebida

de origem italiana. Sua fórmula apresenta os seguintes

e lementos : “1 /3 de ( ca fé ) e spresso , 1 /3 de l e i te

vaporizado e 1/3 de creme vaporizado do leite”. No Brasil,

a tradicional receita foi adaptada e o chocolate em pó

começou a fazer parte desta mistura.

Em 2006, foi a vez do mercado interativo experimentar

o sabor de uma nova receita, no qual design e tecnologia

surgem como os principais ingredientes responsáveis pela

geração de uma nova agência disposta a colocar seu nome

definitivamente na história da internet brasileira.

“A Cappuccino/HZTA (www.cappuccinohzta.com.

br) foi criada a partir da fusão entre empresas que já

atuavam no segmento: a Cappuccino, especial izada

na área de design, e a HZTA, focada em soluções para

web. Unidas, elas criaram uma agência de comunicação

digital, que alia os pontos fortes de ambas, oferecendo

ao mercado soluções digitais, com base em planejamento,

criação e tecnologia nesse setor”, explica Cláudio Roberto

Tucunduva, sócio da agência.

D e c a r a , o p r i m e i ro d e s a f i o s e r i a u n i f i c a r o

posicionamento das duas antigas empresas a uma nova

rea l idade. “Para que isso acontecesse, rea l izamos

diversas reuniões entre os departamentos para reforçar

o posicionamento da nova empresa e o redesenho dos

processos. A partir da fusão, o foco se tornou atender

de maneira mais personalizada clientes que enxergam

a internet como investimento, trabalhando sempre em

soluções específicas para as necessidades particulares de

cada cliente”, afirma Cláudio.

Investimento em pesquisa e tecnologia

Ass im como acontece em outros segmentos, a

concorrência na área de internet f ica a cada dia mais

acirrada e exige que as agências interativas procurem

aspectos que determinem um bom diferencial. Pensando

nisso, a Cappuccino/HZTA vem destinando recursos em

pesquisa e tecnologia.

“O objetivo é que o resultado de nosso trabalho possa ser

visualizado em qualquer tipo de mídia digital, ou seja, podemos

pensar em uma campanha com conteúdo para internet, celular,

palm, CD-ROM etc. Um outro diferencial é que atuamos

como o ‘braço digital’ de outras agências de publicidade e

comunicação que ainda não tem prática no desenvolvimento

de trabalhos para a internet”, revela Cláudio.

Além disso, o conhecimento e a experiência de

sua equipe na área de ilustrações se tornou uma ótima

oportunidade para a criação de uma unidade de negócios

exclusiva. “Assim, muitas de nossas criações digitais têm

um tom individualizado, pois suas ilustrações foram criadas

aqui. Vendemos também mais este serviço (ilustrações)

para as agências para ser usado em campanhas on-line ou

off-line”, aponta Leonardo Gibran, sócio da agência.

Localização estratégica

A Cappuccino/HZTA está localizada estrategicamente

em São Paulo, considerado o grande pólo urbano do Brasil

e o principal centro comercial de internet no país. “Não há

como negar que a cultura da internet (e das outras mídias

digitais) é difundida com maior força e penetração na

Grande SP, seja através da imprensa, de eventos e cursos

que acontecem freqüentemente e outros fatores em geral.

12 :: portfólio agência - cappuccino/hzta

o resultado da fusão entre design e tecnologia

portfólio agência - cappuccino/hzta :: 13

Isso faz com que o mercado tenha conhecimento suficiente

para disponibilizar verbas para ações mais agressivas em

relação às soluções digitais”, analisam Anderson Bordim e

Vitor Elman, sócios da agência.

Porém, engana-se quem pensa que a área de atuação

da agência se restr in ja apenas a São Paulo. “Temos

também clientes de fora, que nos contataram em busca de

um diferencial e qualidade de trabalho, além de clientes

na Europa e EUA para os quais nossos preços ainda são

bastante viáveis”, acrescentam.

De olho no “banco de referências”

Arquitetura de informação passando pelo design

de interface. Estes são alguns dos principais temas em

pauta no processo de cr iação da Cappuccino/HZTA.

E para manter sua equipe atualizada com o que há de

mais moderno no mercado, a agência cr iou, em sua

intranet, um banco de dados para que os profissionais

possam cadastrar as principais referências de trabalho e

compartilharem o conhecimento.

“ P a s s a m o s u m a p a r t e d o t e m p o d e c r i a ç ã o

b u s c a n d o n o v a s t e n d ê n c i a s a t r a v é s d a i n t e r n e t .

Criamos um banco interno de sites favoritos, que vem

crescendo progressivamente. Através dessa ferramenta,

compartilhamos nosso conhecimento e nossas influências

entre toda a equipe. Nesse banco, temos referências do

que se está fazendo em todo o mundo, desde designers

australianos a poloneses. Assim, conseguimos ter um

panorama global, onde, às vezes, nem a l íngua é uma

barreira, pois o design e o conceito falam mais alto”,

apontam Anderson e Vitor.

Outra estratégia é o investimento em cursos de

aperfeiçoamento, conforme a área e a necessidade de cada

departamento. “Incentivamos o sentimento do desafio

criativo da operação, sem competitividade predatória,

dando liberdade de opinar nos processos de trabalho.

Apoiamos ainda a realização de atividades estimulantes

como shiatsu, happy hour e prática de esportes, como

futebol, boliche, kart, entre outros”, diz Cláudio.

Preparando-se para o futuro

A evolução nos meios de acesso à internet tem

permitido a util ização de novos recursos na criação e

desenvolvimento de interfaces digitais. Diante dos desafios

que estão por vir, a Cappuccino/HZTA estuda de que forma

pretende se inserir dentro deste contexto.

“As agências já começam a pensar em conteúdos

para criação digital não somente para a internet, mas para

outras mídias que começam a ser cada vez mais utilizadas

comercialmente, como palm, celular, entre outros. Além

disso, cada vez mais os clientes querem conhecer detalhes

sobre retorno do investimento feito, uma vez que com a

internet, o feedback do usuário e a medição dos resultados

das ações são imediatos”, afirma Cláudio.

Dentre os projetos futuros da agência, o especialista

aponta a evolução nas ações estratégicas da empresa e a

expansão de sua área de negócios. “Queremos trabalhar

cada vez mais com a inteligência do negócio voltada a

mídias on-line, focados no atendimento dos clientes como

contas, pensando sempre em vender não só ferramentas,

mas também planejamento estratégico das ações on-line,

adequando às realidades on-line e off-line de cada cliente.

Como metas para os próximos dois anos, pretendemos abrir

filiais no Sul e no Nordeste e melhorar a nossa captação de

projetos na Europa e nos EUA”, complementa.

“Criamos um banco interno de sites favoritos, que vem crescendo progressivamente. Através dessa

ferramenta, compartilhamos nosso conhecimento e nossas infl uências entre toda a equipe”

(Anderson Bordim e Vitor Elman)

Sócios da Cappuccino/HZTA reunidos

14 :: portfólio agência - cappuccino/hzta

A oportunidade de desenvolver hotsites promocionais para o canal

Sony surgiu através da rede de contatos mantidos pela agência. Dentre os

trabalhos já realizados, um dos destaques foi o hotsite da promoção anual

direcionada aos chamados “fãs de carteirinha” do canal.

“Eles precisavam de um hotsite que interagisse com o usuário e tivesse

uma seqüência de atividades e/ou jogos que pudesse criar um ranking entre

os participantes. Ao final da promoção, os líderes do ranking ganhariam prê-

mios. Desenvolvemos todo o conceito da campanha. A home do site era um

braço com uma tatuagem do Sony e, ao fundo, um painel com várias fotos,

imãs e imagens de personagens das séries, como seria realmente um quarto

de um fã dos seriados”, relata Vitor Elman.

Segundo ele, a criação buscou algumas referências do canal, como as

“manchas” no contorno do site, além da própria linguagem moderna, dinâ-

mica e ousada. “O site procurou passar também a mesma atitude que o canal

tem na televisão. Conforme o usuário passa o mouse por cima da imagem do

braço tatuado, a pessoa (dona do braço) se movimenta e o fundo se altera,

dando uma idéia de um espaço maior. A leitura e a navegabilidade são fáceis.

A fonte seguiu a linha jovem, como se fosse ‘rabiscada’ ou escrita à mão.

A curiosidade é que o braço tatuado pertence a um dos nossos designers,

que inicialmente ‘posou’ só para a realização de um primeiro layout, mas o

resultado ficou tão bom que foi usado em definitivo”, revela.

Cases- Hotsite “Seriexpert 2005”Canal Sony

www.sonypictures.com.br/canalsony

Tecnologias utilizadas: Action Script, Flash e Photoshop

“As agências já começam a pensar em conteúdos

para criação digital não somente para a internet, mas

para outras mídias que começam a ser cada vez mais

utilizadas comercialmente, como palm, celular, entre

outros” (Cláudio Tucunduva)

- Samba Comunicação

www.sambacom.com.br

Tecnologias utilizadas: Action Script, Flash, PHP e

Photoshop

- Shop Tour

www.shoptour.com.br

Tecnologias utilizadas: Flash, Illustrator, JavaScript e

Photoshop

A qualidade no trabalho e o pronto atendimento presta-

do mesmo em serviços menores foram aspectos fundamentais

para que a agência conquistasse, aos poucos, a confiança do

Shop Tour. “Quando eles sentiram a necessidade de que o site

fosse reformulado, e acompanhasse a mudança de estratégia

do canal, passaram para nós o briefing. Assim, o desafio era

desenvolver um novo conceito: o site deveria deixar de ser

somente um espaço corporativo e se tornar uma área comer-

cial, onde a programação da TV também poderia ser vista pelo

cliente, em qualquer hora ou local. E foi baseado nisso que

iniciamos a criação”, conta Vitor.

Dessa forma, foram feitos alguns estudos de combinação

cromática e tipografia para que fosse alcançada a identidade

visual desejada. “As cores são predominantemente as do canal,

porém foi adicionada uma paleta de cores de apoio com tons

mais sóbrios (muitos tons pastéis), que combinaram com o azul

tradicional do canal. Essas cores foram utilizadas para reforçar

a segmentação do site (automóveis, imóveis etc.). Sobre a tipo-

grafia, foi usada a fonte ‘Helvetica Condensed’ que dá peso à

leitura, sem serifa para colaborar com a idéia de modernidade

e requinte”, relata.

No final, diz Vitor, o site acaba funcionando como uma

“Central de Vídeos”. “Por isso, criamos ‘volumes’ dando a

impressão de tridimensionalidade e com várias opções de

controle para cada vídeo. O fato legal desse case é a idéia de

usar os vídeos integrados ao layout, que deu ao site uma idéia

bastante próxima do conceito do programa na televisão”.

Tendo como base o tema “Nossa pegada é outra”, o

desaf io deste case seria cr iar um site que apresentasse

os principais projetos da Samba Comunicação e passasse

o conceito da agência , com um v isual que remetesse a

idéia do “samba raiz”, com esti lo.

“O ponto de partida da criação foram algumas fotos

que i lustrariam um l ivro institucional da própria agência

(eram fotos artísticas da Escola de Samba Mangueira). Sur-

giu a idéia de usar as fotos compostas num layout com

‘rabiscos’ por cima das fotos, que se tratam na verdade

de animações, que dão uma idéia de ritmo e movimento às

imagens. Do caos dos rabiscos sai uma unidade visualmente

organizada e bonita, remetendo ao próprio conceito do

samba, que traz uma melodia em meio ao caos de tantos

instrumentos”, explica Vitor.

E as animações existentes dentro do site estão perfeitamente

integradas com o conceito defi nido no briefi ng. “A brincadeira

interessante é a interatividade das imagens, pois conforme se

mexe o mouse há a animação e a velocidade do movimento varia

conforme a velocidade do mouse, dando a idéia de que o usuário

comanda o ritmo do samba. Foi utilizada uma fonte mais séria

e elegante e com boa legibilidade para contrabalançar com os

outros elementos visuais do site. Outra curiosidade é que nossa

equipe criou o layout sem ter visto o livro institucional da agência

(que fi caria pronto um pouco depois). Quando fomos apresentá-lo,

a equipe da agência disse que o livro estava seguindo um layout

bastante similar, com a idéia dos rabiscos sobre a foto”.

portfólio agência - cappuccino/hzta :: 15

se tudo. Placas, cores, arquitetura, grafites, stickers.

Um bom designer deve ser observador. Entender o que

acontece à sua volta, absorver e moldar à sua maneira de

trabalhar as imagens. Guardando mais fontes, a inspira-

ção pode vir de onde menos se espera, além de confe-

rir originalidade ao trabalho. Também retiro muitas

lições do cinema, em especial, o europeu”.

E analisando o portfólio de Renato, é possível

afi rmar que as ilustrações representam o seu dife-

rencial. Um exemplo está presente no site Milícia

Missões Urbanas (www.miliciavitoria.com). “A

intenção da imagem é mostrar que é possível

a convivência pacífi ca entre pessoas de dife-

rentes culturas. Como se trata de um ambiente

típico das grandes cidades, utilizei a imagem

distorcida de prédios e postes como forma de

representar o caos, a aglomeração e as fusões

tão comuns à vida urbana. Para as cores, pensei

em tons mais frios e desgastados, contrastando

levemente com o colorido dos personagens”.

Ou seja, este é um segmento com boas

oportunidades para os designers na web. “O

leque é amplo e pode, por exemplo, trazer para

rede um profi ssional que antes só trabalhava

com impresso. Para quem já está na internet,

as ilustrações podem valorizar ainda mais o

trabalho. Se o designer souber criar e mani-

pular bem uma imagem desenhada, ele ganha

em valorização e exclusividade de estilo”.

Desenhar sempre foi uma prática presente na vida de

Renato Loose e talvez seja um bom indício para explicar a sua

escolha pelo design. “A partir do momento em que comecei a

utilizar computadores, tive vontade de trazer os traçados para

o plano digital. Foi então que, por conta própria, comecei a

procurar e estudar quais seriam os melhores softwares para

trabalhar. Ao mesmo tempo, fui atrás de livros sobre design

para conhecer melhor a evolução dos processos de criação e

as escolas e correntes de maior importância”, revela.

Além do conhecimento autodidata, Renato buscou com-

pletar sua formação cursando Comunicação Social na Univer-

sidade Federal do Espírito Santo (UFES). “Ela me ajudou nos

processos de criação, afi nal, comunicação verbal e visual têm

sempre o mesmo objetivo: passar uma mensagem. Fiquei mais

objetivo e incisivo naquilo que me proponho a fazer. Aprendi

tendo contato com pessoas que já trabalhavam na área utili-

zando elementos que fazem parte tanto do ambiente visual,

quanto do escrito. Sem contar o fácil acesso a materiais como

livros para pesquisas de imagens e referências diversas”.

O resultado não poderia ter sido melhor: hoje ele conta

com uma boa base referencial e de infl uências para realizar seu

trabalho. “A base são os mangás. Depois vieram infl uências da

rua, do grafi te e dos stencils, assim como elementos da cultura

underground, especialmente a estética de tatuagens tradi-

cionais e suspensões. A partir de estudos mais aprofundados,

incluí elementos de décadas passadas - destaque para os anos

50 e 60 - e, de vez em quando, esbarro na pop art, inspirado

pelos trabalhos de Roy Liechtenstein”.

Outro caminho para buscar novas referências é aguçar

o instinto de observação. “Nas ruas, presto atenção em qua-

Para participar desta seção, cadastre seu portfólio no site da revista: www.revistawebdesign.com.br.

www.miliciavitoria.com“A parte vetorial foi desenvolvida no Flash MX. Para as cores e fi nalização, optei pelo Photoshop 7”

18 :: portfólio freelancer - Renato Loose

ILUSTRAÇÕES QUE MARCAM O ESTILO DE UM DESIGNERContato: [email protected]

Site: www.cafeina.info

vai usar. E é aí que nos encaixamos na história, e passamos

a fazer parte dela.

Por outro lado, no que se entende por design hoje,

dentro de uma ótica artística, é plenamente possível

desenvolver projetos de utilização alternativa, que podem

ser altamente subjetivos e próximos até do antiuso. Nesse

cenário se enquadram os experimentalistas, que buscam

um tipo de reação mais sensorial, de semânticas totalmente

específicas, heterogêneas, dentro de universos distintos,

sejam eles culturais, comerciais, didáticos, humanistas,

matemáticos, psicológicos, estéticos.

O designer que pára de olhar o mundo com o olhar difuso,

amplo, capaz de compreender várias realidades, corre o risco

de virar uma engrenagem na linha de produção de sites, no

melhor estilo “corte e costura” de HTML. Vai passar a apertar

um parafuso, ao invés de compreender toda a engrenagem.

E é por isso que devemos, além de estudar a história da arte,

fi rmar nossa posição como artistas designers - mentes capazes

de compreender as expressões artísticas não apenas como

uma superfi cialidade decorativa ou bela, e sim, uma interface

capaz de comunicar utilizando modelos não-usuais, linguagens

não-verbais, fora do “logos”, da razão cotidiana; capazes de

questionar o que não se quer questionado; de propor o que

não se quer proposto; de causar o estranhamento, dando lugar

ao controverso. Enfi m, capazes de compreender o mundo

pictórico muito além da forma.

Wd :: Ao longo do tempo, os movimentos artísticos

vêm exercendo uma grande influência na produção do

design. Em termos de internet, talvez um dos melhores

Nesta entrevista, Ronaldo Gazel, artista plástico,

designer e diretor de arte na BHTEC e:house (www.bhtec.

com.br), fala como as referências fora do mundo tecnológico

podem contribuir na construção de ambientes digitais mais

criativos e funcionais, além de ressaltar a importância da

história da arte como base para o trabalho do designer.

Wd :: Por que e como o conhecimento da história

da arte serve como base para trabalho de um designer

na internet?

Gazel :: A arte reflete o tempo em que é produzida.

Conhecer a história da arte, ainda que apenas alguns pontos

dela, é fundamental para entendermos os questionamentos

e paradigmas que permearam as épocas e as respostas

que o homem/artista deu (e ainda dá) a elas. Na verdade,

a história da arte, estando intimamente ligada à literatura,

à filosofia, à antropologia, à história, à religião, enfim, a

um sem-número de expressões humanas, acaba tendo

uma importância fundamental na vida de todas as pessoas.

Quanto mais longe da arte, mais perto do controle, do

sistema, do pensar “massificado”, pasteurizado.

É preciso entender a história do design, para ser um

designer mais completo, mais consciente, mais coerente. É

preciso saber como surgiu o movimento do design; saber

como o relacionamento dos objetos e do ser humano foi se

sofisticando com o passar do tempo. É importante porque

uma interface é uma superfície de trabalho, de uso. E é

por isso que somos designers da web, projetamos, como

um designer projeta um espremedor de suco, ou uma

cadeira, interfaces que um grupo de pessoas certamente

Design e arte são campos distintos do conhecimento humano. Porém, nada impede que

ambos sejam utilizados em harmonia para a construção de representações que ajudem a tornar

mais compreensíveis e sofisticados os objetos e a maneira na qual vivemos em sociedade.

20 :: entrevista - design e arte

entrevista- design e arte :: 21

exemplos esteja no site das Havaianas (www.havaianas.

com.br) e algumas campanhas on-line da Coca-Cola na

França (www.coca-colablak.fr e http://secure.coca-cola.

fr). Quando a arte deve ser aplicada em benefício do

design na web?

Gazel :: A arte pode trazer enormes benefícios para o

design na web, sendo uma linguagem não-verbal, capaz de

despertar naquele que tem contato com ela, percepções e

diálogos muito mais sofisticados (ou simples, diretos!) do

que as narrativas e approachings das interfaces focadas em

percepções utilitárias puras. E o maior desses benefícios

se chama coerência estética. Essa coerência pode ser

percebida no excelente site das Havaianas, evidenciando o

fato de que a ousadia em termos de linguagem, da difusão

de valores semióticos sutis, fora do padrão midiático

tradicional de informação, dispostos juntos a uma feliz

combinação de fatores estéticos e expectativas sensoriais

(revertidas de alguma forma em resultados positivos),

transforma o lugar-comum dos pressupostos, das “doxas”

pictóricas, dos pré-conceitos estabelecidos todos os dias.

Por isso mesmo, sites como esse, que felizmente têm

surgido em número cada vez maior, fazem tanto sucesso:

eles mostram que o caminho da arte no design na web é

muito promissor, e dá resultados.

Wd :: Sobre a interação entre design e arte, podemos

afirmar que a principal diferença entre estes dois campos

do conhecimento seja o compromisso com o público, ou

seja, o designer tem compromisso com o público e o artista

vive sem a necessidade e a pressão de fazer concessões?

Gazel :: O perfil do artista hoje não pode ser traçado

de modo simples, porque na pós-modernidade - período

no qual vivemos, e que resgata todas as motivações e

contradições do passado recente (movimentos modernos)

em um timing assombrosamente rápido - há uma tal

especificidade de propostas, conceitos e estéticas que

permite ao artista, virtualmente, qualquer tipo de relação

com o público, inclusive compromisso e descompromisso.

Mesmo que uma proposta, em princípio, nos conduza

a uma percepção romantizada do artista, como se ele

não estivesse se importando para o público, não sofresse

qualquer tipo de pressão, isso na verdade pode mostrar

o contrário: a adequação do artista a nichos de mercado

preparados para receber/consumir as suas características

sui-generis, ou seja: para o artista, há um mercado em

qualquer situação. Veja que paradoxo, digamos quase

zen-budista: o artista busca gerar um reflexo altamente

pessoal; uma linguagem, uma “poiesis” própria, buscando

o coeficiente de “arte” em um trabalho artístico, seja ela

um vídeo, uma pintura, uma performance, um website

- linguagem essa que, apesar de desuniversalizada na

origem, tende a se comunicar com o senso-comum, tanto

na aceitação, quanto no estranhamento.

Já o designer normalmente trabalha com fins

utilitários extremamente bem definidos, e por isso a

pressão por coerência artística passa a ser mínima, em

favor de uma adequação máxima aos padrões estéticos

aceitos por um grupo majoritário - ou pseudomajoritário;

padrões estéticos que são verdadeiros “lugares comuns”.

Então, voltamos à história da “doxa”, do “ouvi dizer”, da

informação não-questionada e não-questionável. Quanto

menos vontade de reavaliar os valores e conceitos tidos

como inexoráveis, mais subvalorizada será a profissão de

design, pois a pressão que passa a se exercer sobre nós,

designers, acaba sendo a mesma que um carregador de

caixas: produção braçal, e não mental.

Wd :: A interação homem-computador é considerada

por especialistas mais fria e distante, além de criar um

sentimento individualista entre as pessoas. Buscar

referências nos movimentos artísticos pode ser um

caminho para proporcionar emoção e afinidade dentro

de um projeto digital?

22 :: entrevista - design e arte

Gazel :: O cubismo representa o atonal, um universo

no qual o simbolismo é completamente descartado,

cujas formas não remetem ao mundo e a seus símbolos,

mas sim à personalidade pura do geométrico. Alexander

Calder (http://tinyurl.com/fbqu9), com seus mobiles, foi

o artista que mais conseguiu se aproximar desse ideal

cubista, na minha opinião: suas esculturas remetem a um

mundo absolutamente próprio, que não dá margens a

interpretações baseadas nas questões do cotidiano.

O site internacional da Leo Burnett, apesar de gerar

uma ótima sensação de profundidade, não tem uma

influência cubista acentuada, já que, cognitivamente, ele

é permeado por símbolos e letras, para a compreensão do

conteúdo. Um site genuinamente cubista haveria de ser

muito abstrato, com o mínimo de textos e imagens reais.

Ainda que fosse em uma camada específica da interface,

separando a arte cubista do conteúdo publicitário.

Wd :: Considerando o contexto político-econômico

atual, permeado por guerras, intolerância religiosa

e injustiças sociais, é possível imaginar um resgate de

conceitos aplicados pelo movimento Dadaísta como

referência para projetos interativos?

Gazel :: Se analisarmos bem, todos os períodos da

história foram permeados por esse tipo de acontecimento.

Sempre houve muitas guerras, muita intolerância - e

para cada época, uma contestação própria. Os artistas

modernistas eram naturalmente “engajados”.

Mas, nos dias de hoje, na dita pós-modernidade, tudo

é fragmentado - inclusive a crítica social. Encontram-se

vários exemplos de movimentos de caráter contestador

intrínseco, que fazem a crítica dentro de cenários

específicos, quase nunca universais. O artista pode não

falar da guerra como fez Picasso ao pintar “Guernica” -

até porque o impacto de uma pintura como guernica, nos

dias de hoje, seria outro (afinal, muita água passou desde

então) - mas ele critica a seu modo, uma crítica que se

desuniversalizou desde a pop art, mas que se mantém viva

em movimentos como o “sticker art” ou o “street bombing”

- a arte urbana que envolve tantos artistas de diferentes

áreas, que pintam, grafitam pela cidade, em superfícies

autorizadas (ou não!), levantando questões urbanas ou

simplesmente rasgando o cinza das ruas com cores vivas,

intensas, volumes e tipografias sui-generis.

Na internet, se houvesse um “street bombing”, seria

Gazel :: Um cão, um cavalo, um boi são incapazes de

realizar gestos e ações que não sejam voltadas para a sua

própria existência física, sua preservação. Já o ser humano

é capaz de observar, gestualizar, modificar a natureza

pelo simples prazer estético, pela necessidade natural de

mimese, sem qualquer relação com a sobrevivência.

Quando a interface digital (homem-computador)

passa a desconsiderar ações e reações menos utilitárias,

aumentando o caráter prático em detrimento do

sensorial, não-prático, corremos o risco de nos

robotizarmos, perdendo a habilidade de questionar, de

trocar pontos-de-vista, de negar o utilitário e promover o

puramente estético/existencial. Por isso, sim, é louvável

buscarmos referências nos movimentos artísticos para

criarmos interfaces um pouco mais humanas, que tornem

o ato de interagir um processo cada vez mais semelhante

ao agir natural do homem.

Wd :: No livro “Vanguarda Européia e Modernismo

Brasileiro”, Gilberto Mendonça Teles explica

que a técnica da pintura cubista procurava

“apresentar a realidade através de estruturas

geométricas, desmontando os objetos

para que, remontados pelo espectador,

deixasse transparecer uma estrutura

superior, a forma plástica essencial e

verdadeira da beleza”. De que forma

esta técnica pode ser utilizada

pelo design na web? O site

internacional da Leo Burnett

(www. leobur net t . com)

pode ser apontado como

um exemplo?

entrevista - design e arte :: 23

algo como uma área completamente livre dentro das

interfaces (ou invadida!), que pudesse ser preenchida com

arte. E, de certa maneira, eles também escandalizam, ao

seu modo, como pretendiam os dadaístas. A diferença é

que o engajamento é desnecessário, o mais importante é

desenvolver a linguagem.

Quanto ao resgate do Dadaísmo em projetos

interativos, sim, é sempre uma ótima idéia! Afinal, Dadaísmo

é sempre bem-vindo em qualquer situação, justamente para

nos deslocar da linearidade dos ponteiros do relógio, do

logos, do racionalismo. Ele é um movimento absolutamente

atual, contestador em essência, e seus “jogos”, experiências

como o “cadáver delicioso” (http://tinyurl.com/mrbgf)

- espécie de colcha de retalhos de palavras, frases e

desenhos, ajudam-nos a reconstruir o pensar e o perceber.

Um “cadáver delicioso” é um ótimo ponto de partida para a

criação de um projeto interativo digital dadaísta.

Wd :: Acessando o site da agência Modernista!

(www.modernista.com), somos remetidos aos anos

20, período no qual o mundo assistiria ao ápice do

surrealismo (http://tinyurl.com/kurew), considerado

um dos últimos movimentos de arte moderna. Como a

aplicação do inconsciente pode ajudar no processo de

criação de uma interface digital?

Gazel :: Esse site da Modernista! é um bom exemplo

de como se comporta a arte nos dias de hoje, tanto no

meio internet, quanto em qualquer outro. É perfeitamente

possível voltar no tempo e fazer uma releitura dos valores

peculiares que formam o cerne de cada “manifesto” do

período moderno. A diferença é que, naquela época, havia

a nítida impressão de que o universalismo das propostas

poderia ser percebido e vivenciado como uma verdade, uma

razão, sem prever suas contradições, sua transformação em

outras verdades, tão efêmeras quanto o próprio homem.

No período da modernidade, havia uma visão

romantizada, de um mundo inteiro para ser conquistado

pela arte, ainda que por caminhos completamente

opostos, como os futuristas italianos, que traziam

o fascismo como uma grande virtude, um caminho;

e o cubismo, que desconsiderava qualquer valor do

mundo real, auto-suficiente em sua atonalidade. Eles

não poderiam existir sozinhos como verdade maior,

como comprovou o tempo, mas foram absolutamente

fundamentais, como todo movimento dentro da história.

E se descobriu, findando-se a modernidade, que nenhum

dos movimentos estava mais ou menos próximo de uma

“verdade” artística - justamente porque essa “verdade”,

ao ser encontrada, logo estaria superada.

Podemos, então, conhecendo as características, as

razões estéticas de cada movimento moderno, entender

suas circunstâncias, seus cenários - não simplesmente

reviver aquilo - mas criar uma relação entre uma questão

atual vista sob aquela ótica. Essa é a receita para se

beber da fonte moderna e criar algo novo. E é por isso

que não basta ter o conhecimento “dóxico”, superficial,

sensorial, sobre uma época (apesar disso ser fundamental),

entender sua picturalidade, suas formas, seu movimento,

sua disposição, seu equilíbrio. É preciso conhecer a história

da arte e ver que nenhum estilo surgiu ao acaso, mas sim

possuem origens claras - e desdobramentos que chegam

até os dias de hoje, conseqüentemente. A partir desse

estudo fica muito fácil associar um projeto conceitualizado

hoje a uma estética moderna, seja qual for o movimento:

cubismo, surrealismo, expressionismo etc.

No caso do surrealismo, é preciso mergulhar de cabeça

na psicanálise, e estar pronto para ir além da linguagem

comum, das percepções concretas, sensibilizando-se para

os reflexos do inconsciente como feedback emocional para

a interface - o que parece bem subjetivo, porém plenamente

possível com interesse e muito estudo.

Wd :: No livro “Iniciação à História da Arte”, da

Martins Fontes Editora, H.W.Janson e Anthony F.Janson

apontam que “ao contrário do Dadaísmo, a Pop Art não

é motivada pelo desespero ou animosidade contra a

24 :: entrevista - design e arte

civilização atual; considera a cultura comercial sua matéria-

prima, uma fonte inesgotável de material pictórico, mais do

que um mal a ser combatido”. O uso da cultura de massa, tão

emanada pelos seguidores da Pop Art, é uma linha conceitual

que pode ajudar a aproximar os ambientes digitais de seu

público-alvo?

Gazel :: A Pop Art foi o último dos grandes movimentos

modernos, e sua contribuição mais importante para a história

da arte, ao meu ver, foi a mudança de percepção a respeito da

apropriação e transformação de “memes” coletivos, ícones de

massa, considerando uma “cultura pop”. A cultura pop, por

sua vez, surgiu graças aos métodos industriais de criação e

produção pictórica, a prevalescência da imagem de massa, em

detrimento do conteúdo (também de massa, no entanto, de

segunda ordem).

Os clássicos exemplos “lata de sopa campbells” e as

interferências na Marilyn Monroe e Mao Tse Tung demonstram isso

com perfeição. É o início da era do consumo de imagens, à maneira

industrial. Que vivemos até hoje, como num “pop” transgênico e

muito acelerado. Poderíamos incluir aqui o kitsch e o neopop, mas

seriam apenas categorizações para as transgenias diversas pelas

quais passa a Pop Art até hoje. Continuamos consumindo o pop,

construindo e desconstruindo sua forma e conteúdo de forma

compulsiva, caótica, de modo cada vez mais veloz. Os ícones pop

surgem e morrem quase no mesmo instante.

O que mais me atrai na Pop Art é sua possibilidade de

“cheating art”, ou seja, de fazer uma arte “trapaceando”, através

dos meios de massa - inclua-se nessa categoria o sampling e a

intervenção sobre todo tipo de imagem “lugar-comum”, desde

logotipos conhecidos por todo o mundo até personagens

(humanos ou não) pop extremamente regionalizados. A

identificação com os “memes” acaba por facilitar a transmissão

do que está agregado a ela - no caso, a arte. E é justamente nisso

que vejo a grande possibilidade de se trabalhar o pop dentro

dos ambientes digitais, aproveitar essa identificação quase

insuperável (felizmente, quase) para se fazer ouvir. Uma

espécie de comensalismo.

Wd :: Segundo a Wikipédia (http://tinyurl.

com/go7pj), o minimalismo representa uma

série de movimentos artísticos e culturais

ocorridos durante o século XX. Analisando

a parte conceitual do movimento (“jogo de

volumes e formas que esteja reduzido às suas

configurações não mais que essenciais as suas

entrevista - design e arte :: 25

funções”), é certo dizer que a criação e o desenvolvimento

de sites focados na usabilidade segue a mesma linha de

pensamento?

Gazel :: De certa maneira sim, o movimento pró-

usabilidade busca enxergar e remover qualquer tipo

de ruído dentro da interface, com objetivo de chegar a

um coeficiente mínimo ideal de uso. É uma ótima causa.

O problema é que, assim como o próprio movimento

Minimalista (e todos os demais movimentos modernos),

o movimento pró-usabilidade, na minha percepção,

acaba por acreditar (pela força da doutrina e do hábito)

que só existe a realidade do uso, desconsiderando

o contraditório - que seria, nesse caso, a corrente

experimentalista, e que, na publicidade, poderíamos

encontrar dividida em vários sub-movimentos, sendo o

mais importante deles o da “inversão de expectativa”

- modo menos traumático de apresentar estéticas

pouco usuais a um público heterogêneo, abrangente,

valendo-se de um gradiente entre o antiuso e o próprio

uso, deixando o espectador/consumidor transtornado

sensorialmente, abalado por alguns instantes, para,

no melhor estilo catártico, trazê-lo de volta ao mundo

cartesiano. Pronto, fez-se a mágica.

O mundo está girando numa velocidade espantosa,

enquanto escrevo esse texto. Nós também, nossa

mente, nossos gostos, nossos paradigmas estão prontos

para mudança, a cada instante. Acreditar numa linha

unidirecional, em relação ao ideal do design na web, é

pura ilusão. É preciso considerar o antiuso, os reflexos da

própria frustração e a transformação que ela gera. Existem

também sites que não têm qualquer relação com uma boa

usabilidade (no sentido atual a que esse termo remete),

mas que usam a estética minimalista de modo primoroso,

cada qual a seu modo.

Wd :: A Enciclopédia Itaú Cultural de Artes Visuais

revela que “a liberdade de experimentação, o retorno

às intenções expressivas e o resgate da subjetividade”

são algumas das principais linhas de pensamento do

Neoconcretismo (http://tinyurl.com/gtnad). Diante de

sua experiência na área, você acredita que os projetos

experimentais on-line ainda são um campo pouco

explorado? Quais conceitos do Neoconcretismo poderiam

ser aplicados no design na web?

Gazel :: Em se tratando de design na web comercial,

que precisa se ater a objetivos e regras já

muito bem estabelecidas pela publicidade

(ou pela gerência de TI), sim. É quando a

interface precisa ser o mais racional possível,

controlável, categorizada, sistemática. Isso

pode ser visto com mais intensidade nas

interfaces unicamente funcionais, que de tão

sistematizadas, acabam por virar “monstros”

de organização, desumanizando ao máximo a

linguagem entre o usuário e a interface.

A habilidade do designer em compreender

os princípios dos quais a interface pode - e

deve - se utilizar, sem se ater a regras gerais,

“doxas” incontestáveis, clichês pictóricos - que

normalmente nos levam a uma pasteurização das

interfaces - é que vai fazer a diferença na hora de

conceitualizar a proposta.

A partir do conceito certo, sem subestimar

e nem superestimar o público (e a própria

interface), encontraremos o caminho mais

interessante, mais adequado aos objetivos

(práticos e subjetivos) - pautando-se, dessa

forma, por diversos valores semióticos e também

por necessidades utilitárias, cada qual com sua

maneira de ser avaliada - ainda que o resultado

disso seja, esteticamente, um picturalismo

abstrato, uma subjetividade irritante (aos olhos do

ser cartesiano), contrária aos critérios universais de

avaliação atuais.

Se esse for o caminho encontrado, é preciso

encará-lo de forma corajosa. Isso porque nenhum

sistema de análise de interfaces que conheço

consegue sair da esfera racional, do empirismo

utilitário, até mesmo para lidar com os valores mais

sensoriais, menos racionais - quando tratam destes,

fazem-no de modo rasteiro.

Tenho em mente que devemos mudar nossa

opinião a cada instante, girar em torno da idéia

inicial pelo menos uma dezena de vezes antes de nos

definirmos pelo conceito final. Assim, por exemplo,

se optamos por usar a simplicidade da forma básica,

dos planos geométricos simples, podemos pesquisar o

cubismo ou o neoconcretismo. O importante é saber o

porquê da escolha.

Radicado nos EUA, o carioca Nando Costa é criador

do projeto Brasil Inspired (www.brasilinspired.com), no

qual incentiva e divulga os trabalhos de design desen-

volvidos no país.

Apostando na experimentação, seu trabalho é um

bom exemplo de como tal conceito pode ajudar o de-

sign digital a se tornar mais criativo. Nesta entrevista,

ele fala sobre influências, cores, tipografia etc., além de

analisar os desafios existentes na caminhada do profis-

sional que vai para o exterior.

Wd :: Em entrevista para a revista Zupi (http://

tinyurl.com/mzpot), você confidenciou que tem “...tra-

balhado tanto nos últimos anos que quase sinto que

perdi um pouco da minha identidade”. Essa sensação

já passou? Quais fatores constroem ou desconstroem

a identidade e o estilo de um designer?

Nando :: Acho que esse efeito já passou. Devo ter

dito isso quando tinha a minha empresa (chamada Nakd),

no Rio de Janeiro. Naquela época, como atuava como

diretor de criação, a minha função, além designer, era

guiar o estúdio, os designers e animadores com quem eu

trabalhava, e também interagir com os clientes, pagar as

contas e até lidar com as burocracias.

No fim dos dois anos de minha experiência na Nakd,

eu e minha esposa (Linn Olofsdotter - www.olofsdotter.

com) estávamos esgotados e acho que isso nos afetou de-

mais, nos deixou sem inspiração. Mas depois tudo passou

e, hoje em dia, trabalhando como freelancer, me sinto

muito mais confiante e feliz com o que faço.

Sobre sua segunda pergunta, não sei exatamente

como responder, pois isso depende muito de uma pessoa

para outra. Não há regra. No meu caso, o fato de o meu

trabalho ter perdido força, eu imagino que deve ter sido

causado por cansaço, exaustão mesmo. Atualmente, con-

entrevista - André Matarazzo :: 27

28 :: design na web: construindo sua história

Arquitetura, escrita, pintura, utensílios domésticos, vestimentas. É através da descoberta e da

pesquisa de diversos objetos do passado que tornamos possível a reconstrução e o entendimento dos

fatos e dos acontecimentos da história.

Quando falamos de design na web, tratamos de um segmento que ainda engatinha para escrever

definitivamente suas páginas na história deste campo do conhecimento. No livro “Uma introdução à

história do design”, Rafael Cardoso aponta que “...talvez o maior desafio para o designer envolvido

com a rede seja de encontrar soluções que resistam, por sua qualidade e densidade, a essa proli-

feração tumorosa de informações parciais...”.

Diante disso, estudar os elementos que ajudaram a construir a prática do

design pode ser o primeiro passo para garantir um diferencial neste mercado.

“O conhecimento da história é uma das melhores formas de entrar em

contato com questões profundas como identidade, representação,

cultura. Acho que o designer, como todo criador, tem que

buscar o autoconhecimento. E, por trabalhar com a

coletividade, tem que buscar conhecer a socie-

dade também. A história é o autoconheci-

mento coletivo”, argumenta o escritor.

Design na web:construindo sua historia

design na web: construindo sua história :: 29

“Ach

o que

o d

esig

ner,

como to

do criad

or, te

m que

bus

car o

auto

conh

ecim

ento

.

E, p

or tra

balhar

com a

colet

ividad

e, te

m que

bus

car c

onhec

er a

socie

dade

também

”

Rafael C

ardoso

des30 :: design na web: construindo sua história

Da Revolução Industrial à Era da Informação

Quais características históricas poderiam nos ajudar a

entender a evolução do design? À primeira vista, os efei-

tos da industrialização em nossa sociedade são conside-

rados o grande marco para a transformação no modo de

produção do design, pois até então o ofício era realizado

de maneira artesanal.

“Não tínhamos design propriamente dito, tínhamos

artesanato que eventualmente poderia ser desenvolvido

com alguns padrões e repetições, mas não era regra.

Podemos dizer que o design viveu três fases distintas: na

primeira fase, seu empenho era em modular produtos para

serem seriados, ou seja, facilitar a produção. Na segunda

fase, o design tinha que construir valores simbólicos e

agregar valor ao produto. Nesse momento de sociedade

da informação no qual vivemos, parece que estamos vol-

tando um pouco no tempo. A grande quantidade de ferra-

mentas e tecnologias nos dá a oportunidade de construir

produtos para web que sejam quase artesanais. Embora

se use toda ciência de comunicação visual e se pense em

comunicar para a massa, cada projeto ganha uma atenção

quase artesanal”, analisa o designer Guilherme Marconi.

Levando em conta o peso que a Revolução Indus-

trial exerceu na forma como o design evoluiu ao longo do

tempo, é certo considerar que o surgimento da internet

representa também uma nova etapa em sua história?

“Ainda falta distância crítica para avaliar se o surgi-

mento da internet terá o mesmo peso histórico que teve

a industrialização. Afinal, quando falamos da chamada pri-

meira Revolução Industrial, estamos falando de um dos

acontecimentos mais transformadores em toda a história

da humanidade, de importância equivalente ao início da

agricultura ou das cidades há milhares de anos. Prefiro

pensar na internet como parte de um quadro maior, abran-

gendo a telefonia e a informatização - ou seja, o descola-

mento radical entre o tempo em que as informações são

transmitidas e o tempo em que as pessoas e as mercado-

rias são transportadas. Isto sim representa uma nova revo-

lução, a qual vem se adensando de maneira crítica desde

meados da década de 1980. Para o design, as plataformas

e programas de computador desenvolvidos desde então

me parecem tão importantes quanto à própria web, que

teria outra cara e estrutura se não fosse por eles”, explica

Rafael Cardoso, professor associado do Departamento de

Artes e Design da PUC-Rio.

Do HTML ao AJAX: como as tecnologias mudam a

história do design na web

Na busca por uma linha que norteie a prática do

design na internet, a grande dificuldade para se determi-

nar uma história envolve a escassez de registros e acervos

que produzam um espaço com material confiável de con-

sulta. São poucos, mas os exemplos existentes já ajudam

a traçar um perfil da área. Estamos falando do UOL Histó-

ria (saiba mais, na página 36) e do Internet Archive (www.

webarchive.org).

Apesar das dificuldades, o depoimento e a prática de

quem trabalha na área servem como um bom caminho para

analisarmos de que forma este segmento de mercado cresceu

e se transformou ao longo dos seus 11 anos de existência.

“A principal transformação no design para a web

é a busca de sua própria identidade. Desde o seu surgi-

mento, no final do século passado, a web é uma grande

tela em branco à procura de quem a preencha, tanto que

já foi considerada a maior exposição de arte interativa do

mundo. HTML, CSS, Flash, scripts, gerenciadores de con-

teúdo... Cada inovação abre um número enorme de possi-

bilidades, e a maior glória do designer é explorá-las inces-

santemente. A maior transformação provocada pela web

é a constante reinvenção de seus conteúdos e formatos,

além, é claro, da gigantesca democratização do acesso

aos meios de produção”, aponta Luli Radfahrer, professor-

doutor da ECA-USP.

Para Marcelo Gluz, gerente de criação na Globo.com,

a evolução do design sempre esteve vinculada às desco-

bertas tecnológicas. Principalmente quando estudamos as

transformações ocorridas nas tecnologias disponíveis para

o desenvolvimento de ambientes digitais. “A primeira é

o surgimento do CSS, que permite mudar o visual de um

site rapidamente, sem que se tenha que mexer nas estru-

na busca por talentos :: 31

“O simples fato de a internet se utilizar de tabelas de

HTML, com ângulos retos e precisão numérica, traz

uma atmosfera ‘Bauhausiana’ ao design interativo”

Marcelo Gluz

design na web: construindo sua história :: 31

turas. O CSS também é importante quando se fala em deixar o usuário

personalizar seu espaço. Outro ponto que merece atenção é a possibi-

lidade de interagir com o dado sem mudar de página. A primeira tec-

nologia que possibilitou isso foi o Macromedia Flash e agora apareceu

o AJAX, tornando a experiência do usuário ainda mais fluida. Os sites

se parecem cada vez mais com softwares residentes no lado do cliente.

Já o aumento progressivo da banda não é um marco, mas um vetor que

aponta a direção das próximas mudanças. Cabe aos designers usarem a

banda com sabedoria, o que nem sempre ocorre”.

Bauhaus aplicada na web?

Analisando a história do design, é inegável o valor que os concei-

tos produzidos pela Bauhaus exerce nas diferentes gerações de profis-

sionais, por defender a funcionalidade no design, sendo a estética uma

conseqüência.

Tanto é que a influência da escola alemã parece se refletir em

determinados projetos de design para a web. “Todo bom design feito

após a Bauhaus traz forte influência dela. Ela rompeu com o Art Nou-

veau em busca de um design mais racionalista, onde a forma deve ser

fundamentada na função. Da mesma maneira, por sua natureza intera-

tiva, a web repele adornos supérfluos e exige grande esforço funcio-

nal. O simples fato de a internet se utilizar de tabelas de HTML, com

X

Relaciona-se especialmente com a 2ª Revolução Industrial em curso na Europa, com

a exploração de novos materiais e os avanços tecnológicos na área gráfi ca, como a

técnica da litografi a colorida que teve grande infl uência nos cartazes. Caracteriza-se

pelas formas orgânicas, valorização do trabalho artesanal, entre outros.

Fonte: Wikipédia (http://pt.wikipedia.org/wiki/Art_nouveau)

Art Nouveau

ângulos retos e precisão numérica, traz uma atmosfera ‘Bauhausiana’

ao design interativo. Não me agrada a idéia de disfarçar as tabelas com

curvas. É preferível buscar soluções estéticas que assumam as caracte-

rísticas da mídia”, afirma Marcelo Gluz.

É justamente neste ponto que os especialistas ressaltam a impor-

tância de se trabalhar a funcionalidade e a estética como aliados em

um projeto de design. “A Bauhaus foi uma experiência histórica rica e

maravilhosa, de grande relevância para o contexto da Alemanha, nas

décadas de 1920 e 1930. É, ainda, uma lição importante de que é possí-

32 :: design na web: construindo sua história

vel realizar grandes projetos com pouco mais do que pai-

xão e boas idéias. Infelizmente, a forma como o legado da

Bauhaus foi apropriado nos últimos 40, 50 anos tem sido

contra-producente para o design, especialmente no Bra-

sil. Essa idéia que as pessoas costumam fazer de funcio-

nalidade é inteiramente equivocada. ‘Função’ não existe,

pelo menos no sentido funcionalista, com F maiúsculo.

‘Função’ como contraposição à ‘Estética’ é um desastre

conceitual, que só tem prejudicado o design. Recomendo

aos designers que esqueçam tudo que acham que sabem

sobre a Bauhaus e retornem às fontes para ver o que ela

foi mesmo. Foi uma escola plural, antes de tudo, onde as

divergências e as dissidências eram respeitadas”, alerta

Rafael Cardoso.

Dessa forma, a dica é avaliar como os pontos posi-

tivos e negativos de cada conceito vão ser aplicados na

prática. “Usabilidade é a Bauhaus da web. Como a escola

alemã, ela tem seu lado positivo - colocou a forma a ser-

viço da função e eliminou efeitos sem significado apa-

rente. No entanto, tanto os axiomas da Bauhaus como

os princípios da usabilidade devem ser vistos como um

poste: servem de iluminação para quem está sóbrio, de

apoio para quem está bêbado. O apego excessivo à dita-

dura do funcional - representado por muitos portais de

serviços e por clientes e designers com preguiça criativa -

acaba por gerar um material monótono, rígido, estúpido.

E isso é o contrário do design”, orienta Luli Radfahrer.

Escola americana no design na web

Quando falamos do design brasileiro, a ESDI (Escola

Superior de Desenho Industrial) é um marco em nossa his-

tória, pois foi o primeiro curso de design em nível supe-

rior criado no país. Em termos de influência, os ideais

da Escola de Ulm foram considerados como o principal

modelo referencial para a ESDI.

Hoje, justamente pelo fato de a história do design na

web ainda ser um processo recente e em construção, as

opiniões sobre uma possível infl uência da escola americana

nos projetos brasileiros se tornam bastantes divergentes.

“Não acredito nisso, até porque não há uma ‘escola

americana’. NYU, CalArts e Berkeley são muito diferentes

entre si e têm em comum apenas o fato de estarem nos

Estados Unidos. Há coisas muito boas feitas no Reino Unido,

na Suécia, no Japão e no Brasil, sem influência de teórico

algum (senão o designer brasileiro não estaria tão ‘na moda’

em empresas estrangeiras). O que há é um mercado muito

grande e bastante capitalizado nos EUA, que torna as inicia-

tivas produzidas lá muito mais visíveis”, diz Luli.

Para Marcelo Gluz, existe um meio termo envol-

vendo esta questão. “Bebemos muito do que é produzido

nos EUA, mas não existe somente uma escola americana,

assim como nem todos faziam design funcionalista na Ale-

manha. Não acho que haja hoje uma grande revolução na

maneira de fazer, ensinar e compreender design como

houve naquela época, mas vejo a indústria americana pro-

curando novas maneiras o tempo todo. Acho muito inte-

ressante o conceito de projetar plataformas interativas em

vez de sites. O Google Maps (http://maps.google.com) e

o YouTube (www.youtube.com) são bons exemplos disso.

É possível consumir a ‘experiência YouTube’ de ver vídeos

em centenas de blogs mundo afora. Não só no site do You-

Tube. Outra manifestação importante do design americano

contemporâneo é o processo criativo baseado em proto-

tipação constante da IDEO (www.ideo.com). Ele cai como

uma luva em projetos de internet e favorece a inovação”.

Um ponto de vista interessante neste debate refere-

se às tecnologias envolvidas com o design na web.

“A escola americana é a grande influência quando se fala

em tecnologia, não só no Brasil como em vários lugares

“A escola americana é a grande infl uência quando se fala em tecnologia, não só no Brasil como em vários lugares do mundo. Mas vejo uma infl uência mais ligada aos conceitos de tecnologia do que propriamente ao design” André Nogueira

X

É considerada a mais signifi cativa tentativa de se restabelecer

uma ligação com a tradição do design alemão. Foi sucessora da

Bauhaus por seus métodos de ensino, disciplinas lecionadas, ideais

políticos e por também acreditar que o design tinha um importante

papel social a desempenhar.

Fonte: Wikipédia (http://pt.wikipedia.org/wiki/Escola_de_Ulm)

Escola de Ulm

ícones, quando usar? :: 33

34 :: design na web: construindo sua história

X

Um jogo de computador e/ou videogame que permite a milhares

de jogadores criarem personagens em um mundo virtual dinâmico

ao mesmo tempo na internet.

Fonte: Wikipédia (http://pt.wikipedia.org/wiki/MMORPG)

MMORPG

do mundo. Mas vejo uma influência mais ligada aos con-

ceitos de tecnologia do que propriamente ao design.

Acho que o design interativo brasileiro já tem uma iden-

tidade própria bastante forte”, cita André Nogueira, dire-

tor de arte da Simples Consultoria.

O que determina os limites do design na web

Na evolução de sua história, o design na web encon-

tra alguns desafios para o seu desenvolvimento. O pri-

meiro deles seria a visão de que a interação homem-com-

putador é mais fria e distante, além de criar um senti-

mento mais individualista entre as pessoas.

Em comparação com as outras áreas de conhecimento

(design gráfi co e de produto), podemos considerar o pensa-

mento acima como uma das principais limitações (gerando

novos desafi os) para o exercício da prática na web?

“O computador, tal como conhecemos hoje, está

falido. Estamos a cada dia reinventando as tecnologias.

Parece que quase 90% da população possui celulares. O

número de pessoas com acesso à tecnologia é cada vez

maior e vertiginoso. E sabemos bem que quanto mais pes-

soas assimilam a tecnologia, novos conceitos surgem, bem

como novas tecnologias se desenvolvem. A cada dia que

passa, as pessoas têm mais experiência digital e os sites

vão deixando de ser aglomerados de botões frios para se

transformarem em parte da experiência simbólica das pes-

soas”, analisa Guilherme Marconi.

Assim, o designer precisará compreender muito bem

as transformações causadas pela inserção da tecnologia

no cotidiano de nossa sociedade para que os projetos na

área possam transpor os possíveis obstáculos existentes.

“Não sei se a interação humano-computador é mais

fria. Isto me parece bem discutível. Mais distanciada, tal-

vez, no sentido de ser algo que intermedia as relações

humanas, como o fazem também o telefone e a televisão

(tudo que é ‘tele-’, aliás, que vem do grego, para dis-

tante). Não vejo isto como algo específico à web. É um

fenômeno mais amplo da Era Industrial, com sua revolu-

ção nos transportes e na comunicação. Temos a ilusão de

que está tudo perto (imagens instantâneas do último con-

flito no Oriente Médio, por exemplo) e, ao mesmo tempo,

paradoxalmente, essa proximidade nos parece ilusória.

Você fala com alguém em outro continente pelo Skype,

com webcam, e parece que a pessoa está ali, mas não

está. Fica um vazio, que só pode ser suprido pelo tátil.

Temos aí um desafio imenso para o designer de web, não

é? Se você acrescenta a isto o fato que vivemos numa

sociedade onde todo mundo fecha os vidros ao parar no

sinal de trânsito, para afastar quem está perto, o desafio

para o design fica ainda maior”, aponta Rafael Cardoso.

Ou seja, como diz Luli Radfahrer, para se fazer coi-

sas para o século XXI, é necessário pensar como alguém

do século XXI. “A interação homem-máquina, por exem-

plo, não é mais fria como era. E não estou falando de

malucos que conversam com o carro para que a gasolina

não acabe, mas de situações bastante corriqueiras: você

recebe cartões virtuais, briga por MSN, gesticula falando

ao celular e se entristece ao receber um e-mail ruim. Em

comparação com as outras áreas, um blog é muito mais

quente que um jornal, o YouTube, muito melhor que a TV,

MMORPGs mais eficientes que fliperamas. É necessário

se livrar de preconceitos e abraçar as novas tecnologias

para se criar um design relevante”, ressalta.

Trabalhando com a interatividade

Em 2000, no livro “Projetando Websites”, Jakob Niel-

sen, considerado um dos gurus da usabilidade na web,

apontava que o “conteúdo era o rei”, em detrimento da

estética visual de um site. Nos dias atuais, a discussão

está mais focada no desenvolvimento de interfaces digi-

tais, onde o usuário e a sua interação nestes ambientes

passam a ser a grande prioridade para o sucesso de pro-

jetos nesta área.

Dessa forma, já não é mais um exagero afirmar que

o conceito de interatividade modifica profundamente a

prática do design na web. “Acredito que o ‘dado é o rei’,

justamente porque creio em design centrado no usuário.

O designer deve focar seus esforços em potencializar a

design na web: construindo sua história :: 35

experiência do usuário em facilidade, rapidez e agradabilidade. Muitas

vezes, o designer precisa carregar mais a mão nos grafismos para vender

melhor o dado, mas normalmente os grafismos excessivos mais atrapalham

do que ajudam o usuário”, diz Marcelo Gluz.

Segundo o especialista, o que Nielsen não previa em 2000 era que o

entendimento do usuário sobre o que é a internet evoluísse e os dogmas pre-

cisariam acompanhar essas transformações. “O que era difícil em 2000, em

2006 pode ser fácil e em 2012 pode se tornar ridículo. Um sistema interativo

deve manter o usuário desafi ado para que não se torne monótono. Mas tam-

bém não deve ser um obstáculo entre o usuário e a informação. Esse impor-

tantíssimo equilíbrio depende do momento histórico e do nível social e etário

do usuário, e, portanto, não deve ser eternizado em dogmas de usabilidade”.

“O avanço tecnológico e o surgimento de serviços web2 customizáveis (como

o código-fonte do Google Earth, por exemplo) traz desafi os que vão além do

funcional, comercial, coletivo e HTML. Blogs e comunidades como o Orkut,

por exemplo, são lugares em que a questão da funcionalidade não faz mais

sentido - o indivíduo vai para lá se divertir, se surpreender, pesquisar, fuçar.

Isso faz com que o usuário se torne mais consciente dos recursos e opções,

o que muda completamente a relação do visitante com a interface, e, natural-

mente, o design”, complementa Luli Radfahrer.

“Design gráfico: uma história concisa”

Autor: Richard Hollis

Editora: Martins Fontes

Dicas de leitura:

“Uma introdução à história do design”

Autor: Rafael Cardoso

Editora: Edgard Blücher

“A principal transformação no design para a web é a busca

de sua própria identidade” Luli Radfahrer

36 :: design na web: construindo sua história

Um acervo na história do design na web nacionalBate-papo: Márion Strecker, diretora de conteúdo do UOL

Nesta entrevista, conheça os principais aspectos envol-

vendo a evolução do design das páginas iniciais do portal,

além da importância do “UOL História” (http://sobre.uol.

com.br/historia).

Wd :: No Brasil, não temos um órgão ou entidade

que registre ofi cialmente a história da criação e o desen-

volvimento de sites. A própria produção bibliográfi ca na

área ainda é escassa. Dessa forma, como surgiu a idéia de

registrar a história do UOL e qual a sua importância?

Márion :: Criamos esse site porque achamos que, se

nós não fi zéssemos esse trabalho, ninguém faria e a história

se perderia. A cada aniversário do UOL, fazemos um balanço

do que foi realizado e atualizamos o site UOL História. Como

na internet não temos grandes limitações de espaço, pode-

mos nos dar ao luxo de escrever a história da internet e da

empresa e mantê-las publicadas, para informação do público.

Wd :: De 1995 aos dias atuais, quais foram as prin-

cipais transformações e marcos no design para web (por

exemplo, no início, o posicionamento do logotipo da

empresa apresentava um grande destaque e ocupava um

espaço muito maior do que o apresentado atualmente)?

Márion :: Quando foi ao ar, em abril de 1996, o UOL

tinha apenas oito canais e uma marca desconhecida. Por

isso, havia um logotipo grande na home page. Hoje, o UOL

tem mais de mil canais que disputam arduamente espaço na

primeira página do portal. Além disso, a marca UOL ficou

muito conhecida, por isso pudemos diminuir sua dimensão.

Primeiro tivemos de desenhar o site para o Mosaic, que

era o software navegador que as pessoas usavam em meados

dos anos 90. Depois, redesenhamos para Netscape e, mais

tarde, para Internet Explorer, o navegador que a Microsoft

resolveu instalar junto com o Windows e se tornou o mais

popular do planeta. Para atender ao maior público possível,

precisamos sempre estar atentos aos navegadores usados e

fazer com que nossas páginas funcionem bem em todos eles.

No começo do UOL, as pessoas usavam modem de

14.400 bits por segundo! Depois, vieram os modems de

28.800 bps, 56 kbps e nos últimos anos estamos vendo evo-

lução semelhante na velocidade chamada de “banda larga”.

No começo, desenhávamos as páginas sabendo que a

maior parte do público usava monitores confi gurados para

largura de 480 pixels. Hoje, a maioria ainda usa confi guração

de 800 pixels, mas uma boa parte já adotou confi guração de

1.024 pixels. Cada mudança dessas afeta profundamente o

desenho de um site.

Wd :: Considerando todas essas mudanças, é certo

afirmar que a evolução do design na web está direta-

mente atrelada à evolução tecnológica?

Márion :: Sim, o design na web depende direta-

mente das tecnologias disponíveis para a criação, da

velocidade das conexões e das características de har-

dware e software usados pelo grande público. Não

adianta nada fazermos páginas maravilhosas se elas não

puderem ser transmitidas rapidamente e visualizadas

corretamente pela maioria das pessoas.

É possível criar versões diferentes para velocidades e

para equipamentos diferentes. Fazer isto num site pequeno

é fácil. Fazer isto num portal do tamanho do UOL, com mais

de sete milhões de páginas diferentes e centenas de parcei-

ros de conteúdo, cada qual com sua marca e seu “look &

feel”, é muito mais complicado.

Wd :: Hoje, o conceito de Web 2.0 vem causando

uma grande discussão sobre a criação e o desenvol-

vimento de sites. Como o UOL interpreta toda essa

movimentação e quais modificações ela vem trazendo

para o design na web?

Márion :: Atrás do conceito de Web 2.0 estão os

recursos que permitem que o público interfira na maneira

de ver informações ou mesmo páginas na internet. É sen-

sacional. Já estamos usando esses recursos em alguns

dos nossos serviços interativos.

Wd :: O UOL já projeta que tipo de modificações o

futuro trará para as empresas que trabalham com servi-

ços de internet, principalmente no segmento de sites?

Márion :: Mais da metade dos nossos assinantes

já usa conexão em alta velocidade. Quase metade do

nosso público já possui monitor configurado em 1.024

pixels. Quando a grande maioria do público estiver

nessa nova situação, veremos um novo e grande salto

no design da internet. Já temos algumas amostras disso

aqui e ali, principalmente nos EUA. Parece inevitável

também que a web se torne cada vez mais multimídia,

com uso mais intenso de animações, áudios e vídeos,

além de mais interatividade.

Analisando a comunicação visual utilizada pelos

supermercados, por exemplo, é possível descobrir o

perfi l de cliente que cada marca deseja atingir. Fazendo

um paralelo desta realidade com o mundo digital,

podemos dizer que o público-alvo é quem dita as

características de um site?

É preciso

ao usuário?

38 :: debate - adaptar-se

debate - adaptar-se :: 39

:: Ana Starling

Designer e ilustradora - Estúdio Ana Starling

www.anastarling.com

“Fiquei imaginado os sites numa prateleira de supermer-

cado. A primeira impressão seria uma linha quase contínua,

de uma única cor, com alguns retângulos em proporções 3x4,

destoantes, que saltam aos olhos como um popup.

Essa linha de produtos diferentes, dispostos todos

juntos no mesmo espaço, vistos ao mesmo tempo. Nessa

rede, por natureza globalizada, a comunicação é comu-

mente homogênea. Parece mais difícil distinguir o

público específico ou o que, e como, ele

deve ser interpretado e representado

nesse meio. Talvez pela influência dos

recursos tecnológicos disponíveis, pela

maçante repetição estética originada por es-

ses recursos e pelo próprio meio, pela pouca

exploração do digital, que permite, cada vez

mais, a personalização e novos caminhos para

a comunicação.

Mas quem é esse público digital? O mesmo

dos supermercados? O que está no supermercado

está realmente direcionado para o seu público? Na

rede dos três W’s, os navegadores podem navegar

por oceanos mais distantes e traçar caminhos mais

longos, mais personalizados. Explorar o meio é per-

mitido, possível. Mas isso poderá surgir e acabar

submerso no meio ditatorial comercial.”

“Fiquei imaginado os sites numa prateleira de

supermercado. A primeira impressão seria uma

linha quase contínua, de uma única cor, com alguns

retângulos em proporções 3x4, destoantes, que

saltam aos olhos como um popup”“Antes de discutir o que pode influenciar a qualidade

de um site, temos que ter em mente o que é um bom site.

A meu ver, um site de qualidade é aquele que atende os

objetivos de negócios da empresa, às necessidades de

seus clientes e faz isso de uma maneira clara, simples e,

acima de tudo, agradável.

Um site projetado para meninas de 14 a 18 anos não

deve agradar a um executivo de 40. E isso é ótimo. Pode

ser que esse site também não agrade a quem o projetou e

isso faz parte do processo de design. Temos que lembrar

sempre que o público-alvo pode ser bem diferente de nós

e que algumas escolhas devem ser feitas de modo racional

e não emocional.

Muitos diretores de arte acreditam que o público-

alvo pode estragar seu layout, porque vêem seu trabalho

como arte, quando deveriam vê-lo como design. A arte é

uma forma de expressão que, em geral, tem mais valor se

não faz concessões a nenhum público. O design, pelo con-

trário, é uma ciência preocupada em encontrar soluções,

o que não pode ser feito sem se levar em conta às pessoas

e suas necessidades.”

:: Carolina Leslie

Arquiteta de informação na AgênciaClick

www.lulileslie.com

“Um site de qualidade é aquele que atende os

objetivos de negócios da empresa, às necessidades

de seus clientes e faz isso de uma maneira clara,

simples e, acima de tudo, agradável”

“Sim e não. Explico: depende da intenção do designer, sua bagagem cultural, imagética e técnica, processo e prazo

de produção, remuneração etc. Interesses de ambas as partes, concomitantes ou não, também influenciam o resultado

final, para o bem ou para o mal.

Apenas definição de público-alvo é insuficiente para se começar a decidir. Precisamos de mais informações, dados

concretos, números. Você pode tomar a decisão de criar um layout extremamente leve e colorido (supondo que isso

agradará o ‘povão’), mas arbitrariamente o produz para uma resolução de tela de 1024x768 pixels. E aí, o porquê desta

decisão? Quais os impactos da mesma? Por que não? É correta? Virtualmente impossível de responder sem obter mais

informações.

Decisões como esta acontecem às dezenas em uma velocidade incrível quando se projeta algo para a internet.

Muitas vezes, o público-alvo nem sequer é o cliente do seu cliente, mas um misto das vontades pessoais dele com as

necessidades do mercado que ele quer (ou acredita) atuar. Misture isso com sua interpretação da situação e pronto:

você tem mais um projeto disponível para que o mundo todo acesse.

Esta analogia apresentada (supermercado) serve como faísca para iniciar discussões mais profundas que inde-

pendem bastante do tipo de trabalho visual em pauta: pode ser um cirurgião plástico ou um designer de interiores, no

final são seres humanos que tomam as decisões, algumas vezes baseadas em fatos concretos, noutras não, mas sempre

sujeitos a ‘errar’.”

:: Rhawbert Costa

Sócio da Nitrocorpz Design

www.nitrocorpz.com

“Você pode tomar a decisão de criar um layout extremamente leve e

colorido (supondo que isso agradará o ‘povão’), mas arbitrariamente o

produz para uma resolução de tela de 1024x768 pixels. E aí, o porquê

desta decisão?”

40 :: debate - adaptar-se

“O público-alvo é sempre o principal ponto a ser considerado quando

se vai fazer qualquer comunicação, tanto on-line quanto off-line. Cada

segmento de mercado tem necessidades e aspirações diferentes e co-

nhecer esse perfil auxilia a agência ou o estúdio no direcionamento para

a comunicação de seu cliente.

Quando penso na criação de um website, isso não é diferente: sem-

pre levo em consideração quem está do outro lado da tela e um estudo

de seu perfil é essencial para que o usuário possa desfrutar ao máximo as

informações e os serviços disponíveis para ele no site.

Partindo desse ponto, parece claro dizer que o público-alvo dita o

caminho a ser seguido pela comunicação de um site. Isso seria trivial se

não estivéssemos falando de uma mídia tão dinâmica como a internet, no

qual podemos ir até o limite do que o usuário espera e surpreendê-lo com

algo a mais - e quase que, de maneira instantânea, analisar os resultados

positivos ou negativos.

Geralmente, essas inovações criam um novo hábito no consumidor

que estava acostumado apenas com o mesmo e acabam virando referência

para os próximos sites que vão ter o conteúdo semelhante ao seu. Elas

são responsáveis, em sua grande maioria, pelas novas tendências que são

seguidas por todos, mas só as que são assimiladas pela grande audiência

da internet se estabelecem como parte relevante nos sites comerciais.

Minha conclusão é que existe uma via de mão dupla, onde de um

lado estão designers e desenvolvedores criando e desenvolvendo novas

tecnologias e aplicações para a internet e do outro o público-alvo que, a

cada dia, usa a internet de maneira mais intensa e torna-se mais crítico em

relação ao que é útil e o que pode ser descartado nos sites.”

Rodrigo Manfredi

Diretor de arte da Submarino.com

www.rodrigomanfredi.com

“Quando penso na criação de um website, isso não é diferente:

sempre levo em consideração quem está do outro lado da tela e

um estudo de seu perfi l é essencial”

debate - adaptar-se :: 41

Participação dos assinantesO público-alvo dita a qualidade do seu site?

Se você é assinante, participe desta seção pelo site www.arteccom.com.br/webdesign/clube

vencedor!

Paulo [email protected]

Não necessariamente. Por exemplo, um site com apelo popular não signifi ca que seja melhor ou pior em termos de qualidade. Para

um público “requintado”, a visão de um site como este é diferente da do público-alvo; o mesmo ocorreria se fosse ao contrário.

Aqui a qualidade se aplica a ambos, mas o que dita isso é ponto de vista de um público. Outro público, outro ponto de vista.

Julio [email protected]

Acredito que exerça uma certa influência, porém não será o público-alvo em si o fator determinante para a qualidade do

site. Um site de qualidade será sempre aquele que busque um diferencial, mesclando informação de forma clara e design

moderno e ousado.

Vânia [email protected]

Nosso “freguês” é o usuário e suas críticas, sugestões e comentários que norteiam o nosso trabalho. Obviamente buscamos

sempre surpreendê-los, antecipando suas necessidades e imprimindo um padrão de qualidade a altura do público-alvo.

Anderson [email protected]

A qualidade do site está diretamente relacionada com o grau de exigência do seu público-alvo. Isso acontece não só com

sites, mas com programas de televisão, estilos musicais, moda, arquitetura etc.

O autor da melhor resposta ganha prêmios.

Michel [email protected]

O público defi ne o fi m do site ou a “tribo” a qual ele pertence. A qualidade é atingida exatamente quando o site supre as

necessidades de seu público e só vai conseguir realmente atingir seus objetivos, isto é, ter acessos, quando for considerado

interessante por esse público.

participe e ganhe prêmios!

42 :: debate - adaptar-se

e-mais - sites políticos :: 43

44 :: e-mais - virais na web

Provavelmente, você recebeu no ano passado uma

imagem, onde o desafio era descobrir, dentre os diversos

objetos que a ornamentavam, referências a bandas de

pop/rock. Ou, ainda, foi estimulado pela indicação de

um amigo a entrar no site www.subservientchicken.com

e digitar ações para que uma galinha “louca” fizesse o que

você pedisse.

Cr iat iv idade e estratégia para d isseminar uma

i n f o r m a ç ã o , f u g i n d o d o f o r m a t o d e p ro p a g a n d a

tradicional. Os exemplos acima são alguns dos bons

casos de campanhas virais, que hoje se tornaram uma das

principais ferramentas para as grandes marcas espalharem

seus planos de comunicação ao mercado. Ou seja, elas

representam para a internet a tradução da velha tática do

boca-a-boca.

“Marketing viral é uma ferramenta de guerrilha e uma

forma de colocar uma marca na web como informação e

não como propaganda. É transformar o produto ou serviço

de uma empresa em um conteúdo divertido e inovador com

o objetivo de que o consumidor passe a mensagem para

frente. Gerar um boca-a-boca on-line”, explica Marcelo

Coelho, da Espalhe (www.espalhe.inf.br), agência de

marketing de guerrilha do Brasil. “A verdade é que ‘viral’

hoje é sinônimo de bom, de marcante, de web de primeira.

Sendo bom e marcante, a peça tem a capacidade de ser

passada para frente no boca-a-boca”, acrescenta André

Matarazzo, sócio da Gringo.nu (www.gringo.nu).

Virais como conseqüência da Web 2.0?

Analisando os recentes projetos lançados no mercado,

é possível afirmar que o atual conceito de participação

ativa dos usuários na evolução dos ambientes interativos

explique o crescimento das campanhas virais pela web e o

investimento de grandes marcas neste tipo de projeto?

P a r a R i c a rd o F i g u e i r a , d i re t o r d e c r i a ç ã o d a

A g ê n c i a C l i c k ( w w w. a g e n c i a c l i c k . c o m . b r ) , a l g u n s

pontos podem esclarecer melhor essa percepção sobre

participação interativa, viralidade e investimento. “O

primeiro deles é que o consumidor é, por natureza, um

formador de opinião. Alguém que, de alguma forma,

passa por experiências que lhe proporcionam vantagens,

benefícios ou não. É alguém que vive em redes sociais, seja

no trabalho, entre amigos de faculdade ou simplesmente

por af in idade de interesse. Trocando em miúdos, o

consumidor é alguém capaz de gerar o bom e velho boca-

a-boca, e a diferença é que a internet tornou-se uma

ferramenta de amplificação disso em larga escala, com uma

Virais na web:uma “nova” fórmula para se propagar informação?

e-mais - virais na web :: 45

dimensão e velocidade absurdas”, diz.

Outra questão envolve a transformação na forma

como a mensagem é transmitida. “Se antes a propaganda

era baseada em emissão e recepção, hoje ela não só pode

como deve transformar um receptor em também emissor.

Na minha opinião, essa é uma das grandes diferenças da

propaganda moderna para a propaganda tradicional, onde

a mensagem deve ter potencial de reação e o meio deve

permitir a sua redistribuição”, afirma.

A conseqüência desse cenário para quem trabalha com

ambientes digitais é um maior investimento das grandes

empresas em formatos de sites que vão além do tradicional

modelo institucional. “Muitos usuários procuram uma

relação mais emocional com a marca (e vice-versa), e esse

tipo de relação é mais fácil de ser construído através de

sites periféricos ao site ‘institucional’. É por isso que existe

tanto espaço para hotsites, campanhas menores, virais.

Hoje, as marcas usam vários canais on-line e não apenas o

seu .com.br”, aponta Matarazzo.

Trabalhando com os riscos

Os riscos envolvidos em campanhas virais são grandes,

pois seu sucesso dependerá exclusivamente de sua afinidade

com o público-alvo para espalhar seus objetivos, além da

necessidade de se passar uma espontaneidade. Dessa forma,

existe alguma forma para se medir os riscos antes de lançar

uma campanha desse tipo?

“O viral mais fácil é aquele que se espalha dentro

de um target determinado, por af in idade. Mas tem

também o v ira l que se espalha para todos os lados,

indeterminadamente. São as ‘grandes idéias’ da web que

todos sabemos e comentamos. Normalmente, o viral vem

acompanhado de riscos sim, e nem sempre mensuráveis.

Entendo que conceitualmente seja arriscado, mas em

compensação o projeto é mais barato (viral de verdade

se espalha sem comprar mídia, por exemplo, que é cara)

e o alcance do possível estrondo é fenomenal, fora que

quando algo cativa o usuário emocionalmente, o payback

de brand awareness é gigantesco. Em tudo na vida,

quanto maior o risco, maior possível o ganho envolvido”,

afirma André Matarazzo.

As etapas na criação de um viral

Segundo os especialistas, as etapas na hora de se

criar uma campanha viral pela web seguem a mesma

l inha ut i l i zada para outros t ipos de campanhas on-

line. “Definição, planejamento, criação e produção. A

viralização ocorre (ou não) uma vez que a campanha já

está no ar. Se o usuário se identificar, ela emplaca. Se não,

não decola. Na nossa experiência, não é recomendável se

confiar 100% no viral como estratégia de divulgação. É

necessário investir em formas tradicionais de divulgação,

pelo menos no começo da campanha”, aponta Michel Lent

Schwartzman, diretor geral da 10’Minutos Interactive

(www.10minutos.com.br).

Traçar o perfil do público-alvo também é um bom

caminho para se garantir o sucesso dessas campanhas.

“Primeiro de tudo, conhecer profundamente o público

primário a ser atingido, seus valores e seus hábitos com

os meios interativos. Após entender exatamente em quem

você vai provocar a ‘reação’, é imprescindível projetar o

tipo de ‘reação’ a ser provocada e, principalmente, qual

é a mensagem residual que ela vai transmitir. Por fim,

disponibilizar e desenvolver meios para que as pessoas

possam repassar as suas experiências ou convidar novos

participantes para a ação”, orienta Ricardo Figueira.

Fa lando no desenvolv imento de s i tes voltados

para campanha virais, colocar o termo “indique/envie

para um amigo” parece ter se tornado uma ferramenta

padrão. “Quanto mais fácil para o consumidor repassar a

mensagem, maior será o retorno, por isso a mecânica de

‘indique um amigo’ é tão popular. Mas, mesmo esta simples

mecânica, pode ser incrementada de alguma maneira. Um

exemplo é o ‘Share the Love!’, da Amazon: um esquema

X

Ou prazo para recuperação do capital. É um indicador voltado

à medida do tempo necessário para que um projeto recupere o

capital investido.

Fonte: USP (http://tinyurl.com/meojo)

Payback

X

Refere-se ao conhecimento que o público tem da marca.

Fonte: Revista FAE BUSINESS (http://tinyurl.com/lm72j)

Brand awareness

para indicar o produto que você comprou, dando descontos

para amigos e comissão na venda para quem indicou. Tudo

isso por trás de uma bonita mensagem de ‘compartilhe o

amor”, cita Ricardo Cavallini, diretor de operações da Euro

RSCG 4D (www.eurorscg4d.com.br).

A tática é investir na curiosidade para que o usuário

fique tentado a descobrir a informação que se deseja

espalhar. “Geralmente, são sites simples, que visam sempre

a facilidade para o usuário transmitir a mensagem para

o seu grupo de influência. Mas isso não é uma regra. O

site www.oquetemnocopovermelho.com.br, por exemplo,

provoca o usuário a participar e descobrir o enigma. A

própria navegação do site é complicada para instigar a

ânsia do visitante pela descoberta. Hoje, para conquistar o

usuário, precisamos oferecer algo ousado e atraente para

que ele se sinta orgulhoso de ter achado aquele site e

recomende para todos os seus amigos. Uma grande forma

de fazer isso é permitir que o usuário participe. Deixe

que o internauta, por exemplo, produza um conteúdo

com a informação da sua empresa e possibilite que ele

distribua facilmente para os amigos. Métodos muito usados

ultimamente são o ‘Envie para um amigo’, a personalização

da mensagem e o RSS”, indica Marcelo Coelho.

46 :: e-mais - virais na web

Exemplos de campanhas virais

- Algoz - Fiat (www.algoz.com.br)

- Burger King - Subservient Chicken

(www.subservientchicken.com)

- Crossbar - Nike (http://tinyurl.com/lyxgy)

- “Do you see music?” - Virgin

(http://tinyurl.com/8ackj)

- Fale Benq (www.falebenq.com.br)

- Grocery Store Wars (www.storewars.org)

- Marc Ecko (www.stillfree.com)

- “Neither this site nor Mozilla is connected with

Microsoft” (www.ie7.com)

- Sith Sense (http://tinyurl.com/zx9cw)

- Spread Internet Explorer

(www.spreadinternetexplorer.com)

- Super Bonder Reality Test

(http://infectous.plugin.com.br/reality)

- Whopperettes (www.whopperettes.com)

Fontes: André Matarazzo, Marcelo Coelho, Michel Lent, Ricardo Cavallini

e Ricardo Figueira

Principais etapas na criação de virais

1) Identif icar um diferencial que irá viral izar o

produto;

2 ) Te r u m a i d é i a i n o v a d o r a e m c i m a d e s t e

diferencial;

3 ) Ident i f i car os d i sseminadores desta idé ia

na web: b logue i ros , jo rna l i s tas , usuár ios de

l i s tas de d iscussões ou usuár ios de redes de

relacionamento;

4) Traçar uma estratégia para a viralização da idéia:

onde atacaremos? Quais disseminadores tentaremos

conquistar primeiro?;

5) Soltar o viral.

Fonte: Marcelo Coelho

(Espalhe - www.espalhe.inf.br)

Dicas de leitura

- “O marketing depois

de amanhã”

(www.depoisdeamanha.com.br)

Autor: Ricardo Cavallini

Editora: Digerati Books

“Blog corporativo”

(www.blogcorporativo.net)

Autor: Fábio Cipriani

Editora: Novatec

estudo de caso - Samambaia :: 47

48 :: FIND

Se vocês me perguntarem qual foi a primeira im-

pressão que tive do Fórum Internacional de Design e

Tecnologia Digital - FIND, posso dizer que o evento foi

o mais legal que eu participei nos últimos anos. Isso por-

que todas as palestras tiveram um nível excelente, com

trabalhos extraordinários e diferentes pontos de vista.

Um bom exemplo disso foi o culto a simplicidade: do

“Less is more”, defendido pelos primeiros palestrantes,

versus o “Less is bore”, do Stefan Sagmeister.

Falando nele, considerei a sua presença a maior

“surpresa” do evento, pois muitos aqui no Brasi l não

conheciam seu trabalho, que é simplesmente genial e

inspirador. Stefan levou o público ao êxtase com seus

projetos experimentais supercriativos e loucos. Falou

da dificuldade em deter o crescimento de seu estúdio,

o que faz com que tenha liberdade para poder escolher

seus cl ientes e fazer apenas trabalhos interessantes.

Como o custo se mantém baixo e, para ele, “dinheiro

não é importante”, a Sagmeister Inc. pôde sair do con-

vencional.

Sagmeister causou polêmica ao afirmar outra coisa

que também concordo totalmente, mas que pode pa-

recer muito estranho vindo de um designer: nem todo

mundo precisa de uma marca. Reparei isso quando minha

mulher me pediu uma marca para a empresa de eventos

que ela estava abrindo, já com alguns clientes. Meu pon-

to é o seguinte: a marca é irrelevante neste momento.

Vai trazer zero clientes a mais. Precisamos pensar no que

realmente importa: o produto.

E foi isso que Stefan defendeu na mesa-redonda.

Recusou receber $ 20 mil de um cliente, afirmando que

ele não precisava de uma marca e bolou uma outra es-

O FIND na visão de um designerPor Felipe MemóriaDesigner da Globo.com e professor da PUC-Rio. Mediador da mesa-redonda realizada durante o evento.

Networking e visita aos estandes dos patrocinadores durante o coffee-break

Gui Borchert se preparando para sua palestra sobre criatividade e inspiração

Mais de 500 profi ssionais lotaram o Copacabana Palace para prestigiar o evento

PJ Pereira respondendo a pergunta de um participante on-line

Sagmeister se preparando para a mesa-redonda Inamoto apresentando um dos cases da AKQA

FIND :: 49

tratégia para a empresa, dando gratuitamente idéias de

onde o dinheiro deveria ser realmente investido para

fazer o negócio andar. Sagmeister sai da mesmice e da

mediocridade. Virou ídolo e foi aplaudido de pé.

Já PJ Pereira e Rei Inamoto abriram o FIND com

uma apresentação bem feita e organizada, mostrando um

bom nível de entrosamento. A dupla da AKQA abordou

muitos conceitos do uso da internet como fonte de en-

tretenimento, como plataforma para jogos on-line.

Dentre os cases, destaque para as campanhas en-

volvendo games, que são um prato cheio para abordar a

questão da experiência do usuário. Os cases mostravam

integração do produto com celular e e-mail, idéias com

potencial de viralidade e principalmente possibilidade

de pessoas interagirem. O vídeo da campanha do X-Box

mostrou exatamente isso, com a multiplicação dos joga-

dores. O slogan genial do produto diz tudo: “X-Box live:

It’s good to play together”.

Outra visão importante, destacada por Rei, ressal-

tava como eles tomam extremo cuidado em não aplicar a

tecnologia simplesmente por ela existir, pelo desejo de

aplicá-la. Como prova disso, apresentaram um case da

Microsoft em que eles usaram um enorme e tradicional

GIF animado no fundo da página.

Em seguida, Gui Borchert foi dogmático em relação

à busca contínua pela excelência. Para isso, apresentou

cases interessantes da RGA, em que existiam limitações

de projeto, como: briefing simples demais, trabalhos que

poderiam não ser interessantes num primeiro momen-

to (como o cartão de natal da empresa e o Nike Run),

mas que tiveram um resultado surpreendente através de

abordagens diferentes e criativas.

Um ponto interessante de sua palestra, no qual me

identifiquei imediatamente, foi a força de vontade e a

quantidade de horas de trabalho. Tal posicionamento

causou até certa polêmica também na mesa-redonda.

O ponto principal, muito bem destacado pelo PJ no

debate, é o seguinte: por mais que você seja talentoso

e consiga fazer coisas sensacionais em oito horas diárias

de trabalho, sempre vai aparecer alguém tão talentoso

quanto você que trabalhe mais horas. E o mercado é as-

sim, competitivo. Não é realmente muito popular afirmar

isso, mas concordo totalmente que coisas extraordiná-

rias são pagas com olheiras.

Fotos: Odilon Jr. ([email protected])

PJ Pereira, Adriana Melo, Gui Borchert, Stefan Sagmeister,

Rei Inamoto e Felipe Memória

O gerenc iamento estratégico de uma marca,

também conhec ido pe lo nome de branding, vem

sofrendo profundas transformações diante do uso cada

vez maior da internet no cotidiano das pessoas.

Dessa fo rma , a s a ções on - l i ne se to r na ram

i m p o r t a n t e s f e r r a m e n t a s d e a p r o x i m a ç ã o e

re lac ionamento com o púb l i co -a lvo das grandes

empresas. Um exemplo recente desse cenário aparece

no hotsite da campanha BIC Music (www.bicmusic.com.

br), que apresenta o mundo musical como temática

para os novos isqueiros ilustrados da empresa.

“ O p ro j e t o é u m a a ç ã o 1 0 0 % d e b r a n d i n g ,

objetivando rejuvenescimento de marca e aproximação

com seu target. Além disso, a BIC decidiu lançar a

campanha de divulgação exclusivamente pela internet,

por se tratar de um tema musical e bastante vinculado

ao público jovem, que tem uma afinidade altíssima

com a internet”, explica Heloísa Ticianell i , gerente

de Marketing e Novos Negócios da EverMedia (www.

evermedia.com.br), responsável pelo planejamento e

criação da campanha.

Para sabermos mais detalhes do desenvolvimento

deste projeto, além de Heloísa, conversamos também

com Douglas Bocalão, coordenador de cr iação da

agência. Confira a seguir.

Wd :: Em termos de internet, já se tornou comum

no mercado in te r nac iona l a s g randes empresas

investirem no conceito de entretenimento na hora

de se cr iar e desenvolver campanhas interativas,

tendência que começa a vingar no Brasil. Quais são os

desafios na hora de se trabalhar com tais projetos?

Heloísa :: É uma forma de fazer uma aproximação da

empresa com o seu target, e não simplesmente vender

um produto. É achar pontos comportamentais do seu

público-alvo e criar uma aproximação fundamentada nos

seus hábitos e gostos a fim de fazer parte o maior tempo

possível não só da sua rotina, mas também do lazer.

Wd :: Falando na interface gráfica do hotsite,

vemos que os isqueiros personalizados da campanha

BIC Music receberam um destaque com as ilustrações

de cada estilo musical (Rock, Soul, Eletrônica, Hip Hop

e Pop Rock). De que forma vocês trabalharam a criação

destas ilustrações para que elas pudessem se encaixar

dentro do projeto gráfico?

Douglas : : Todas as i lustrações passam a idéia

de movimento, cores e da liberdade de expressar seu

próprio est i lo musical . A idéia pr incipal é que cada

50 :: estudo de caso - Bicmusic

A era dos sites como estratégia de branding

Branding xÉ o conjunto de ações ligadas à administração das marcas, nas

mais diversas áreas, com o objetivo de manter ou ampliar sua

posição no mercado e consolidá-la cada vez mais na mente dos

consumidores.

Fonte: Desafio21 (http://tinyurl.com/khgrb)

Quais influências e como vocês definiram esta etapa

dentro do processo de criação?

Douglas :: Nossa principal influência foi a street

a r t ( a r t e d e r u a ) , o n d e a d i v e r s i d a d e d e c o re s e

de formas orgânicas é muito grande. A r iqueza de

deta lhes que podemos encontrar passeando pelas

r u a s é i m p re s s i o n a n t e . Vo c ê p o d e v e r c a r t a z e s ,

grafites, placas de trânsito e até sinalização de lojas

que podem inspirar e trazer aquele estalo que faltava

na criação de um site.

Wd : : A t ipograf ia do projeto é inspirada em

fontes fantasia e parece ter recebido um tratamento

especial . Como a sua escolha se insere dentro do

conceito geral do hotsite?

Douglas :: A tipografia também sofreu influência

da a r te de rua . Na ma ior ia dos t í tu los , ap l i camos

contornos caracter í s t icos de graf i t i smo, a lém das

cores fo r tes e marcantes . Ut i l i zamos a famí l i a de

fonte Bauhaus, que apesar de ser uma fonte clássica,

estudo de caso - Bicmusic :: 51

usuário possa olhar para o site e se identificar com ele.

Além disso, todos os estilos musicais trabalhados no

site têm características marcantes. Buscamos trazer uma

identidade forte também para o layout. Para chegarmos

neste resultado, a equipe saiu a campo para estudar

referências gráficas em casas noturnas, muros grafitados

e capas de disco. O mix de tudo isso resultou em formas

orgânicas, setas, curvas e cores harmoniosas.

Wd : : Vocês ut i l izaram muitas setas e traços

ornamentados para indicar as seções do hotsite e

orientar a navegação do usuário, além delas ilustrarem

a própria marca do projeto. Que tipo de estudos vocês

fizeram para definir o estilo gráfico a ser utilizado?

Douglas :: Faz parte da nossa metodologia o processo

de imersão, onde vamos buscar referências gráficas

mundiais, seja por meio de livros, revistas, observando as

pessoas na rua ou buscando sites pela internet.

Mas não podemos confundir imersão com meditação.

Apenas pensar no assunto não traz resultado, é preciso

muito esforço, rascunhos, estudo de cores, versões

preliminares, até alcançarmos o layout desejado.

Neste caso, definimos que as formas uti l izadas

no hotsite tinham que expressar movimento - um dos

elementos primordiais na música. Quisemos ambientar o

hotsite para trazer as mesmas sensações de uma balada.

Wd :: A combinação cromática do hotsite é puxada

para tons fortes, porém elas ficaram bem harmoniosas.

“A equipe saiu a campo para estudar referências gráficas em casas noturnas , muros grafitados e capas de disco” (Douglas Bocalão)

Todos os 52 samples foram criados exclusivamente

para a BIC. O mixer é a sustentação do concurso cultural.

Quem gosta de música vai entrar no site, criar a sua,

divertir-se com os downloads e concorrerá a iPods. Os

vencedores ainda poderão ter suas músicas em MP3 no

seu próprio iPod.

Wd : : A inda sobre tecno log ia , a EverMed ia

c r i o u u m a v e r s ã o Wa p d o h o t s i t e . D i a n t e d a

experiência com este projeto, vocês poderiam citar

os principais desafios no desenvolvimento de sites

para dispositivos móveis?

D o u g l a s : : U m a d a s p r i n c i p a i s b a r re i r a s é a

d ivergência entre as tecnologias das operadoras e

www.bicmusic.com.br

transmite modernidade e se encaixa perfeitamente com

a comunicação criada para o site.

Wd :: O hotsite foi projetado para resoluções de

tela acima de 1024x768 pixels. Por que vocês adotaram

este padrão, já que as estatíst icas no Brasi l a inda

apontam um certo equilíbrio nesta área?

Douglas :: Na verdade, o hotsite prioriza a resolução

1024, mas também atende a 800x600. O usuário tem

uma experiência maior com a resolução 1024, já que

visualiza mais elementos na tela. Porém, a navegabilidade

continua sem nenhum comprometimento em 800x600.

Mas acreditamos que a tendência seja a resolução 1024.

Wd : : Um dos destaques do pro jeto está na

disponibilidade da ferramenta BIC Web Mixer, no qual

o produtor musical Veiga criou, com exclusividade, os

52 samples disponíveis por lá. Como surgiu a idéia de

criar um mixer on-l ine e que tipo de tecnologia foi

utilizada para que ele pudesse se tornar funcional?

Heloísa :: A BIC está lançando uma série limitada

temática de música. A EverMedia ficou responsável por

toda estratégia exclusivamente on-line. A idéia foi criar

uma experiência inovadora para quem aprecia música e, a

partir daí, surgiu a idéia do BIC Web Mixer. A ferramenta

foi toda desenvolvida em Flash 7.0 e ASP.

52 :: estudo de caso - Bicmusic

Tecnologia na web :: 53estudo de caso - Bicmusic :: 53

“Nossa principal inf luência foi a street art (arte de rua), onde a diversidade de cores e de formas orgânicas é muito grande” (Douglas Bocalão)

das diferentes plataformas dos aparelhos. Podemos

comparar a atual fase dos dispositivos móveis com a

época em que o Netscape ainda brigava com o Internet

Explorer e os designers quebravam a cabeça para criar

sites compatíveis com os dois browsers. O mais sensato

a fazer é seguir os padrões de desenvolvimento da W3C

(The World Wide Web Consortium - www.w3.org) e criar

wapsites simples, com navegação objetiva e fácil.

W d : : A s s i m c o m o a c a m p a n h a , a s u a

divulgação será feita especificamente em mídia on-

l ine e focada em portais voltados para o público

jovem (Vírgula, Jovem Pan e MTV). Quais fatores

influenciaram nesta decisão?

Heloísa : : A campanha está focada no públ ico

j ovem, po i s é o que tem ma io r a f i n idade com a

música. Por sua vez, é quem passa mais tempo na

web. O Bras i l está entre os pa íses que mais

gastam tempo na web e esse índice vem

crescendo signif icat ivamente. Por esta

razão, veio a escolha do invest imento

exclusivo neste canal e nos portais com

perfis jovem e musical.

Wapsite da BIC Music xNo wapsite desenvolvido pela Evermedia para a BIC Music,

o internauta pode acessar a página por meio do browser

do celular e fazer o download de 15 ringtones (toques para

celular), escolhendo a música e o formato que preferir. Além

disso, as músicas produzidas pelo próprio usuário poderão ser

baixadas, via cabo, para os celulares compatíveis com MP3.

Tecnologia na web

Reúna um grupo de desenvolvedores web em uma mes-

ma sala e faça a seguinte pergunta: “quem nunca precisou

utilizar CSS Hacks para garantir uma boa renderização nos

mais diversos navegadores de internet, por favor, levante a

mão?”. Certamente, uma minoria vai conseguir se destacar

dentro do grupo.

“Todos nós, envolvidos com desenvolvimento, já passa-

mos pela frustrante - ou para muitos, já esperada - experiên-

cia de constatarmos que nosso layout visualizado com preci-

são e perfeição em um navegador X, mostra-se totalmente

‘quebrado’ e irreconhecível no navegador Y. Inconsistências

desta ordem devem-se ao fato de um mesmo código ser tra-

tado de modo diferente por diferentes navegadores. E isto

não é exclusividade das CSS. Qualquer código ou script a ser

interpretado no lado do cliente, obviamente dependerá do

dispositivo que o usuário estiver usando”, relata Mauricio

Samy Silva (www.maujor.com/blog).

Então, como poderíamos definir os CSS Hacks? “São

códigos CSS que se aproveitam de uma determinada falha

(ou falta de suporte a algum recurso) em um determinado

browser para fazer com que alguma propriedade CSS seja

aplicada exclusivamente para aquele browser ou em qualquer

um exceto aquele. Ou seja, funcionam mais ou menos como

‘fi ltros’ detectores de browsers. Um fi ltro não confi ável a lon-

go prazo, já que mudanças no código do browser podem fa-

zer com que um ou mais hacks deixem de funcionar”, explica

o desenvolvedor web Bruno Torres (http://brunotorres.net).

Erros mais comuns de renderização

Entendido o conceito da aplicação de CSS Hacks, pode-

mos apontar algumas das principais falhas na interpretação

dos navegadores que obrigam os desenvolvedores a utilizá-

los. “Sem dúvida, o erro mais comum é o de Box Model. Re-

sumidamente, é um bug de cálculo de largura de elementos.

As versões 5 e 6 (dependendo do DOCTYPE) do Internet

Explorer calculam a largura dos elementos diferente de bro-

wsers como Konqueror, Mozilla, Opera e Safari (KMOS). Esse

problema só era resolvido com o uso de CSS Hacks”, afi rma

Diego Eis, criador do Tableless (www.tableless.com.br).

Outro muito comum envolve o modo de compatibilida-

de defi nido (quirks ou strict mode). “Um dos mais comuns, e

que pode ser facilmente evitado, é colocar, inadvertidamen-

te, o IE6 para trabalhar em modo de compatibilidade (quirks

mode), o que faz com que tenha os mesmos problemas na

interpretação do Box Model que o IE5.x/Win tem. Isso acon-

tece quando se coloca uma linha em branco, um comentário,

ou uma declaração XML antes do DOCTYPE. E muita gente,

sem saber porque está tendo problemas, acaba se valendo

de hacks para que sua página seja exibida de forma correta

no IE6”, alerta Bruno Torres.

IE: trabalhe com comentários condicionais

Segundo os especialistas consultados pela reportagem,

quando falamos de interpretação de CSS para o Internet Ex-

plorer, uma boa pedida é se aprofundar no assunto “comen-

tários condicionais”.

“O Internet Explorer é a principal fonte de problemas

para os desenvolvedores, no que se refere à falhas de inter-

pretação de estilos CSS. Hoje sabemos da existência de uma

funcionalidade do Internet Explorer, desde a versão 5 (para

Windows), que permite enviar determinado código apenas

para este browser, inclusive com a possibilidade de enviar

apenas para versões específi cas. São os comentários con-

dicionais, comentários HTML que são interpretados apenas

pelo Internet Explorer. Tudo que estiver dentro de um comen-

tário desse tipo será ignorado por qualquer browser, já que

é, efetivamente, um comentário, mas será interpretado pelo

IE. É isso que devemos usar, já que é uma funcionalidade do-

cumentada pela Microsoft e funciona a contento, sem causar

maiores problemas”, orienta Bruno.

CSS Hacks: em busca da renderização igualitária nos navegadores

54 :: Tecnologia na web

nível avançado

Tecnologia na web :: 55

Versão 7 do IE trará boas notícias?

Em breve, a Microsoft vai lançar no mercado a versão 7

do Internet Explorer e promete melhorar a interpretação do

CSS em seu navegador (http://tinyurl.com/9wev8). “O IE 7,

para citar alguns avanços, virá com suporte mais robusto para

seletores CSS2, restabeleceu o elemento HTML como a raiz

do documento (acabou com a entidade superior ao HTML),

não mais reconhece o hack underscore e corrigiu o bug da

double margin”, cita Maurício Samy.

“Se o IE7 for tudo isso que estão falando, muitos de nos-

sos problemas estarão resolvidos. Poderemos desenvolver

com mais tranqüilidade e teremos mais recursos para utilizar

em nossos projetos. A vida do desenvolvedor se tornará mais

fácil. Tomara. Caso contrário, o IE7 será um novo fantasma,

um novo problema”, analisa Diego Eis.

No entanto, a grande esperança reside no trabalho cole-

tivo incessante de pesquisadores pelo mundo. “Hoje em dia,

após alguns anos de uso massivo do CSS, com diversos desen-

volvedores ao redor do mundo pesquisando comportamentos,

buscando formas de contornar falhas de maneira ‘lícita’, ou

seja, sem o uso de hacks, temos cada vez menos que recorrer

a estes para resolver nossos problemas”, fi naliza Bruno.

Referências on-line

- Box Model Hackhttp://www.maujor.com/tutorial/boxmodelhack.php

- Comentários Condicionaiswww.maujor.com/tutorial/condcom.php

- IE7 and IE7http://meyerweb.com/eric/thoughts/2005/10/17/ie7-and-ie7/

- O que é Quirks Mode?http://www.revolucao.etc.br/archives/o-que-e-quirks-mode/

- O que são, para que servem e exemplos de CSS

Hackshttp://www.tableless.com.br/csshacks

- Pandora’s Box (Model) of CSS Hacks And Other

Good Intentionshttp://tantek.com/log/2005/11.html#d26t1820

- Position Is Everythinghttp://www.positioniseverything.net/index.php

- Quirks Modehttp://www.quirksmode.org

- Vídeo-tutorial sobre CSS Hackshttp://www.tableless.com.br/videotutorial/videotutorial2/

Fontes: Bruno Torres, Diego Eis e Maurício Samy

Livros

- “CSS Hacks & Filters” Autor: Joseph W. Lowery (http://tinyurl.com/z7x5t)

- “Eric Meyer on CSS”Autor: Eric Meyer (http://tinyurl.com/l2rho)

Fontes: Bruno Torres e Maurício Samy

Caminhando pelo HTML - Parte 5Caminhando pelo HTML - Parte 5Elcio FerreiraDesenvolvedor e instrutor na Visie Padrões Webhttp://visie.com.br/

Em nosso singelo tutorial do mês passado, escreve-

mos a arquivo HTML muito simples, para demonstrar como

é simples a l inguagem HTML. Este mês, vamos tornar as

coisas divertidas, relacionando nosso arquivo HMTL com

outros arquivos. Isto é o que torna a web especial, a ca-

pacidade de relacionar documentos. Para começar, vamos

falar da forma básica e essencial de relacionar documentos

HTML: a tag A. Você vai se lembrar que, mês passado,

construímos um trecho de código assim:<ul>

<li>Home</li>

<li>Produtos</li>

<li>Serviços</li>

<li>Trabalhe conosco</li>

<li>Sobre</li>

</ul>

Essa lista será o menu de nosso site. Para isso, será pre-

ciso que, ao clicar, nosso feliz visitante seja enviado a uma

nova página. Você provavelmente sabe como se faz isso:<ul>

<li><a href=”home.html”>Home</a></li>

<li><a href=”produtos.html”>Produtos</a></li>

<li><a href=”servicos.html”>Serviços</a></li>

<li><a href=”trabalhe.html”>Trabalhe conosco</a></li>

<li><a href=”sobre.html”>Sobre</a></li>

</ul>

Simples, não? Talvez simples demais. Podemos aproveitar esse

trecho de código para acrescentar informações adicionais a respeito

da página para qual linkamos. Por exemplo:<li><a href=”sobre.html” title=”Saiba mais sobre a Florentina

Móveis e sua fundadora, Florentina Maria”>Sobre</a></li>

Agora temos uma indicação mais clara do que este link

nos trará. A este tipo de “informação sobre a informação” os

eruditos da web chamam de metainformação.

Há mais de uma utilidade para essa metainformação.

A mais conhecida é o fato de que o navegador exibe esse

texto numa tooltip quando o usuário passa o mouse sobre

o link. Entre outras utilidades está o fato de que robôs de

busca, como, por exemplo, o Google, entendem e indexam o

conteúdo da tag title.

Se você percebeu bem, para tornar nosso HTML rico, útil

e interessante, fizemos duas coisas. Primeiro o relacionamos

com outros documentos, através da tag link. Em seguida, ofe-

recemos informações adicionais a respeito dos outros docu-

mentos, através do atributo title. Vamos fazer a mesma coisa

agora, usando outra tag do HTML. Dentro da seção HEAD de

nossa página, vamos inserir:<link href=”florentina.xml” />

<link href=”florentina.css” />

<link href=”florentina2.css” />

<link href=”print.css” />

Com isso, relacionamos nosso documento a quatro outros,

um arquivo RSS e três arquivos CSS. Mas isso não basta. É preci-

so dizer ao navegador o que fazer com esses documentos e de

que tipo eles são. Fazemos isso com os atributos rel e type:<link rel=”alternate” type=”application/rss+xml”

href=”florentina.xml” />

<link rel=”stylesheet” type=”text/css” href=”florentina.

css” />

<link rel=”alternate stylesheet” type=”text/css”

href=”florentina2.css” />

<link rel=”stylesheet” type=”text/css” href=”print.css”

/>

Com isso, estamos dizendo ao navegador que o pri-

meiro arquivo é um formato alternativo de nosso conteúdo

(alternate), e que ele é do tipo application/rss+xml, ou seja,

que é um arquivo RSS. Na segunda linha, dizemos ao nave-

gador que estamos relacionando uma folha de estilo (sty-

lesheet) e que é do tipo text/css, ou seja, um arquivo CSS.

A terceira e quarta linhas também são do tipo CSS, mas a

terceira apresenta uma folha de estilo alternativa (alternate

stylesheet). Isso fará com que o navegador não carregue

essa folha de esti lo a não ser que o usuário peça. Ainda

podemos melhorar isso:<link title=”Feed RSS da Florentina Móveis” rel=”alternate”

type=”application/rss+xml” href=”florentina.xml” />

<link title=”Estilo CSS padrão”

rel=”stylesheet” type=”text/css” href=”florentina.css” />

<link title=”Estilo CSS alternativo”

rel=”alternate stylesheet” type=”text/css”

href=”florentina2.css” />

<link title=”CSS de impressão” media=”print”

rel=”stylesheet” type=”text/css” href=”print.css” />

O navegador agora sabe que o título de nosso Feed é

“Feed RSS da Florentina Móveis”. Sabe também os títulos das

nossas folhas de estilo. Assim, pode mostrar esse menu:

56 :: tutorial

Isso permite ao nosso usuário escolher com que estilo verá

a página. Você deve ter notado também que o link “CSS de im-

pressão” não aparece na lista. Isso se deve ao atributo media. O

navegador detecta corretamente o tipo de media de cada arquivo

css através desse atributo. Ele exibe então na lista aqueles cujo

media for screen (tela) ou all (tudo). O valor default de media é

all, então, se você não especifi car um valor para media, seu CSS

será exibido em todas as medias. Note no código que, para o

último link, estamos colocando media=”print”. Isso faz com que

este CSS seja usado quando o usuário imprimir a página. Assim,

posso ter uma “versão de impressão”, em que eu escondo menus,

publicidades, fundos coloridos, mudo a fonte etc. E que funciona

automaticamente, basta o usuário imprimir a página.

Por fi m, é importante dizer que ultimamente têm se trabalhado

muito em novas maneiras de se inserir metainformação em uma pági-

na. Uma das novidades de nossos dias é o fato de você poder inserir,

por exemplo, a seguinte tag META no HEAD de sua página:<meta name=”ICBM” content=”-23.626508,-46.639688” />

Dessa forma, o navegador, se suportar este recurso, sabe

as coordenadas geográficas de sua casa, empresa, ou seja, lá

de onde for o site. Quer ver funcionando? Uma das maneiras de

se usar isso é através de uma extensão para Firefox, chamada

GeoURL. Você pode baixá-la em http://tinyurl.com/fqpbq e, em

seguida, acessar qualquer site com essa tag META. Por exem-

plo, o nosso: http://visie.com.br. Ao fazê-lo, você deve ver um

pequeno globo colorido em sua barra de status. Assim, você

pode saber onde fica nosso escritório. Clique nele com o botão

direito do mouse e divirta-se:

Outro exemplo desse esforço de inserir metainformações

são os microformatos. Microformatos são pequenos trechos de

HTML comum, escritos seguindo regras específi cas, geralmente

contendo nomes de classe específi cos, que, devido a essas regras,

carrega mais metainformações que o simples HTML. Para explorar

isso melhor, sugiro que você baixe a extensão Tails Export para

Firefox (http://tinyurl.com/gfl h2).

Infelizmente, a Tails Export está disponível apenas para

Windows. Mas há uma série de outras ferramentas capazes de

lidar com microformatos que você pode usar. Por exemplo, para o

microformato hCard você encontra uma extensa lista em: http://

tinyurl.com/e5yvk.

De posse da Tails Export, entre no site do Tantek Çelik (http://

tantek.com) e dê uma olhada na barra de status do navegador. Lá

você pode, por exemplo, exportar as informações de contato dele

para um vcard. O formato de arquivo vcard é entendido por aplica-

ções como o Outlook. Assim, ao entrar no site do Tantek, você pode

adicioná-lo aos seus contatos do Outlook com dois cliques. Como

ele fez isso? Dê uma olhada nesse trecho de código:<div class=”item vcard” id=”livebait”>

<a href=”http://flickr.com/photos/tantek/

187850720/”><img

src=”http://static.flickr.com/74/187850720_fce42bc7e2_

t.jpg” alt=”photo of

restaurant entrance” class=”photo” /></a>

< a h r e f = ” h t t p : / / l o c a l . y a h o o . c o m /

details?id=11054799” class=”url fn org”>

Live Bait</a>

<div class=”tel”>+1 (212) 3539100</div>

<div class=”adr”>

<div class=”streetaddress”>14 East 23rd St.</div>

<span class=”locality”>New York</span>

<span class=”region”>NY</span>,

<span class=”postalcode”>10010</span>

</div>

</div>

Há um atributo class para cada um dos valores que será

exportado no vcard. E pronto, simples assim. O resto é com o

navegador. Para saber mais sobre as classes possíveis e outros

microformatos, acesse o site ofi cial do projeto: http://microfor-

mats.org. Com isso, nosso HTML já é rico e poderoso, altamente

relacionado com outros documentos na web. E não deixou de ser

uma linguagem muito simples. Praticamente todo o resto que fa-

ríamos para transformar nosso código em um site apresentável

será feito com outras duas linguagens: CSS e Javascript. Sim, isso

já é outra história.

tutorial :: 57

- Oi, cara, tudo bom? Recebi teu portfólio, achei bem legal.

- Pô, valeu.

- Como é mesmo o teu nome?

- Koruja.

- Coruja?

- É Koruja, com K.

- Não, cara, teu nome, teu nome de batismo...

- Pode me chamar de Koruja, todo mundo me conhece por Koruja.

- Como assim, Koruja?

- Koruja, pô!

Então tá, né. Resolvi não lutar contra a natureza, me condicionar ao nível de interlocução

imposto e quem sabe, com sorte, descobrir que tipo de Koruja era aquela.

- Ahmmm, ok, Koruja... Onde você já trabalhou?

- Em lugar nenhum.

- Como? Mas e o teu portfólio?

- Ah, eu fi z a maioria das coisas em casa, vagabundeando. Fiz uns freelas também.

Puxa, me comovi com tamanha honestidade! Naquele instante, entendi que o lado do meu

cérebro que funcionava não era o mesmo lado do cérebro do Koruja e que, embora ele falasse

um idioma que se aproximava muito do meu, o diálogo não iria rolar.

Não sei exatamente por que, além do desespero por qualquer profi ssional que conhecesse

um pouco de Photoshop e soubesse copiar algumas linhas de HTML, resolvi, naquele verão de

1998, rasgar todos os manuais de recursos humanos e dar uma chance para o Koruja!

- Muito bem, Koruja. Você pode começar amanhã um “estágio” de um mês...

- Bacana, onde é meu ninho?

Hoje, inverno de 2006, aquele Koruja não teria chance. O desenvolvimento de soluções para

o ambiente de internet amadureceu. As agências digitais cresceram e criaram novas competên-

cias e metodologias. Um “web tudinho” que fazia projeto de interface, criação, direção de arte,

webdesign e programava HTML foi substituído por cinco especialistas nas estruturas maiores e

por dois ou três nas menores. A especialização permitiu a produção de projetos web em escala

e uma profi ssionalização das estruturas de desenvolvimento.

Hoje, para fazer parte dos principais “times” de soluções de internet no país, vários crité-

rios passam a ser fundamentais no processo de seleção e manutenção de talentos por parte das

empresas que se tornaram players do setor. Na AG2, empresa que ajudei a criar e dirijo até hoje,

valorizamos, cada vez mais, nos nossos profi ssionais, as seguintes características:

58 :: mercado de trabalho

Guilhermo ReisEspecialista em Arquitetura de Informação e Usabilidade. É autor do Kit de Conhecimento sobre AI

(http://tinyurl.com/p4j6w). Atualmente, é responsável por coordenar projetos e manutenções nos

websites do Banco Real.

[email protected]

Cesar PazEngenheiro com pós-graduação em marketing e comércio exterior. Diretor Presidente da AG2 - Agência

de Inteligência Digital. Fundador e diretor da AGADi (Associação Gaúcha das Agências Digitais) e APADi

(Associação Paulista das Agências Digitais). Colunista do jornal Propaganda e Marketing e do site Webinsider.

[email protected]

Koruja!

1. Motivação pessoal: o profissional precisa ter ânimo, energia, inquietação, capacidade de indignação e

espírito empreendedor.

2. Trabalho em equipe: pobre do cara que não sabe compartilhar informações. São valorizados apenas

aqueles que sabem motivar, incentivar os colegas, planejar e organizar os processos e ter sinergia na construção

de objetivos com o grupo.

3. Gestão: a capacidade natural de relacionamento com as pessoas e habilidades no gerenciamento de proces-

sos e recursos são fundamentais para dar conta da dinâmica dos diferentes tipos de projetos web.

4. Visão positiva: não vejo chance para talentos que têm na “difi culdade” e nos “problemas” a sua matéria-prima.

Ter visão positiva de si próprio, da sociedade e da empresa em que trabalha é condição para a evolução profi ssional.

5. Fazer acontecer: apenas alguns profissionais têm uma enorme capacidade de realização, outros se per-

dem em processos, fórmulas, manuais e questões técnicas. A capacidade de “fazer acontecer” pressupõe que o

profissional tenha entendimento de prioridades, iniciativa, persistência, determinação, performance e compro-

misso com o negócio.

O Koruja se mostrou um bom profi ssional e era um cara supercriativo, e nos ajudou bastante. Não sei se tem a

ver com o “nome”, mas sempre foi um grande parceiro das madrugadas de trabalho. Preferia produzir à noite! Ficou

conosco quase dois anos e depois foi trabalhar com vídeo.

Eu continuei tendo que desesperadamente identifi car, contratar e reter talentos. O fato é que mesmo sabendo

que nem tudo no mundo é resultado de racionalidade, tratei de reconstruir pacientemente todos os manuais de re-

cursos humanos que eu mesmo havia rasgado no início da internet. Passei a ser muito mais científi co na busca e na

retenção dos melhores profi ssionais.

mercado de trabalho :: 59

“É preciso criar as casas, os prédios, as praças e principalmente as placas

de sinalização.”

"Um `web tudinho´ que fazia projeto de interface, criação, direção de arte, webdesign e programava HTML foi substituído por cinco especialistas nas estruturas maiores e por dois ou três nas menores."

OTIMIZE SUAS AÇÕES DE ENVIO DE E-MAIL.Monitore seus resultados: saiba quem leu, que horas leu e onde clicou.

www.easymailing.com.br tel. 55 51 3061.0636

GRUPO DB4“Assim que começamos a usar o Easy Mailing conseguimos despertar nos

clientes do grupo DB4 a importância do e-mail marketing e o resultado que

ele pode gerar se feito de maneira profissional, com documentação, relatórios

e ética. Encontramos nos softwares da Dinamize ferramentas de e-mail

marketing robustas, profissionais e com ótimo custo benefício.” Diogo Boni.

VEJA MAIS DEPOIMENTOS EM NOSSO SITE.

Vocês me conhecem, eu não sou de botar a boca no trombone à toa, no máximo um

manifesto aqui e uns podcasts ali, mas chega uma hora que temos que tomar posição.

E é imbuído do senso de dever que digo: arredemos pé das nossas posições. Estamos

entrincheirados demais.

Estou falando sério. Outro dia acompanhei de perto um site novo ser metralhado por

todos os lados: desenvolvedores fuzilando a compatibilidade com browsers, designers

estapeando a usabilidade, criativos bombardeando o coitado do logotipo. O episódio só

não foi trágico porque o dono do site tinha um bom-humor e à prova de balas.

Nem adianta pensar em desarmamento. Cada lado al i (engenheiros, designers,

marketeiros, etc) demorou anos pra conseguir seu arsenal: estudaram, praticaram, se

aprimoraram, se organizaram... e se engessaram.

Se ao menos o confronto fosse bonito, algo como uma bela roda de capoeira... mas

nunca é: cada um fica na sua trincheira jogando farpas e insultos de lá pra cá. Enquanto isso,

felizes da vida, passam ao largo os verdadeiros inovadores, os visionários, aqueles que ao

invés de defender territórios desbravam novos mundos.

OK, basta de alegorias e metáforas. Já deve ter dado para entender. Eu estou cutucando

os donos-da-verdade de plantão, aqueles profissionais que sobem no banquinho para... (que

outra palavra eu uso? Ai ai ai...) ditar (ufa!) regras a torto e a direito.

Abaixo os banquinhos. Abaixo quem se julga acima. Abaixo as opiniões incontestáveis.

Abaixo o absolutismo.

Absolutismo nunca fez sentido, e na internet faz menos ainda.

Suponhamos que você faça um site para a sua agência. A agência quer se posicionar

junto ao mercado como criativa e antenada com o state-of-the-art em novas mídias, e para

isso faz um site multimídia, inovador e irreverente. Pronto, o site está no ar.

Começa o tiroteio: xiitas vão chiar (xiitas chiam by default) que o site não é tableless,

não é W3C-compliant e que não roda no Opera pra Linux. Alguns puristas vão achar que

o site é banda-intensiva e exclui propositalmente quem tem banda estreita e máquinas

antigas. Outra ala vai apontar seus canhões contra o fato de que a mudança do logo foi

meramente cosmética, enquanto chovem flechas de quem diz que aquela é uma sub-utilização

dos recursos novos do flash XYZ.

Nessa hora eu bato o pé duas vezes: em primeiro lugar, desçamos do banquinho. Se a

agência escolheu uma linha X de comunicação com seu target e esse target por acaso não

te inclui, ela deve saber o que faz. Se a agência quer ser vista dessa maneira e não de outra,

idem. Não há uma solução de comunicação que seja universal, há sempre escolhas a se fazer.

Manifesto antibanquinho

60 :: marketing

René de Paula Jr.Diretor de produtos do Yahoo Brasil. É profissional de internet desde 1996, passou pelas maiores agências

e empresas do país: Wunderman, AlmapBBDO, Agência Click, Banco Real ABN AMRO. É criador da “usina.

com”, portal focado no mundo on-line, e do “radinho de pilha” (www.radinhodepilha.com), comunidade de

profissionais da á[email protected]

(Esse banquinho aí do teu lado... não, não, aquele ali. Me empresta? Coisa rápida, é só para fazer um manifesto.)

Caríssimos, do alto desse banquinho quarenta anos vos contemplam, e é alçado a esta altura imerecida que proclamo: abaixo os banquinhos.

(Pronto, aqui está teu banquinho. Não pretendo usá-lo de novo, obrigado)

"Abaixo os banquinhos. Abaixo quem se julga acima. Abaixo as opiniões incontestáveis. Abaixo o absolutismo."

Se ela errou o tiro, que aprenda com as conseqüências.

Em segundo lugar: se a agência foi capaz de produzir aquela comunicação e não outra, isso diz muito

dela, sobretudo sobre seus méritos e... limitações.

Para exemplificar melhor suponhamos outro cenário: uma agência mediana encomenda seu site a um

terceiro e o resultado é algo absolutamente arrasador e genial, muito acima da cultura digital da própria

agência, um site impecável, revolucionário, trendsetter. Isso não seria propaganda enganosa, mostrar uma

fachada que não corresponde ao que ela é capaz de pensar e realizar?

Ou alguma ética estranha diz que um site impecável ,mas irreal é preferível a um site “pecador”

mas verossímil?

Pecado por pecado, meus blogs pessoais são forrados de pecadilhos técnicos. Nem poderia ser

diferente, porque não sou técnico.

Meu podcast vai ao ar do jeito que eu gravo, sem edição ou cortes. Nem poderia ser diferente, porque

não sou locutor nem apresentador.

As milhares de fotos que eu publico não têm retoques, além de Levels e Crop.

Eu não quero criar uma ficção de mim mesmo, e não tenho o menor pudor quanto a imperfeições.

Nossas deficiências são tão nossas quanto as nossas qualidades, e mesmo que eu tenha minhas certezas,

elas são inseparáveis da minha história, da minha perspectiva, do lugar onde estou sentado. Minha opinião

é absolutamente parcial. Toda opinião é.

Quer pensar outside the box e inovar? Saia da trincheira. E não é nenhum banquinho que vai te

tirar do buraco :)

marketing :: 61

Marcela CatundaTrabalhou na TV Globo, TV Bandeirantes, TV Gazeta, Manchete e SBT. Foi redatora da DM9DDB e

Supervisora de Criação de Mídia Interativa da Publicis Salles Norton.

É sócia do site Banheiro Feminino, está no Orkut e trabalha como autônoma.

blog - http://pirei.catunda.org

[email protected]

E se eu chamasse Catundo?O que seria de Catunda, se Catundo fosse?

Já me peguei pensando na frase acima. Em muitos anos trabalhando não foram poucas às

vezes que imaginei como seria minha vida profissional se eu fosse um Catundo.

Meus pais só tiveram fi lhas, mas me lembro até hoje da preocupação do velho em nos ensinar

a trocar pneus, entender de cebolões e nos preparar para uma vida independente. Repeti a

quarta série do primário e como castigo (ou prêmio) tive que trabalhar um ano para aprender

a gostar da escola e dar valor pros estudos. Ledo engano, me apaixonei foi por trabalhar e não

parei mais. Foram anos trabalhando e estudando até que fi cou só o trabalho. A gente tá sempre

aprendendo e estudar também nunca é demais. Pensando bem, valeu a lição.

Escolhi a TV bem cedo e fiquei nela por longos quatorze anos. É muito tempo quando na

época, fazendo as contas, não somamos mais de trinta poucos. Nesse tempo, vi assistentes

virarem braços direitos de diretores, diretores propriamente ditos, editores chefes, gerentes

de programação... E eu quase na mesma. Mas, e seu chamasse Catundo, será que eu teria me

tornado um respeitado profissional de TV? Hum...

Confesso que quando migrei pra internet me senti bem mais confortável com esse assunto.

Mas será que se eu chamasse Catundo eu seria um bem sucedido cidadão ponto com? A

ausência total da TPM teria me ajudado a galgar um lugar no pico do universo www? Hum...

E eu escutaria:

- Bonita camisa, Seu Catundo.

- Boa jogada, Catundo. Tacada de mestre. Deixe-me segurar seu charuto! (sai fora).

- Seu Catundo, reunião na sala 14 com aquela gostosa do RH.

- Seu Catundo, sua esposa na linha 2. (que estranho)

- Seu Catundo, sua braguilha está aberta. (cruzes)

Mas o que me diverte não é só pensar no sucesso financeiro que eu teria se Catundo eu

fosse, mas também no dia-a-dia profissional.

Receberia Catundo, em seu e-mail, as fotos das últimas beldades da Playboy e Sexy

enviadas pelos amigos? Sim e seriam consumidas nisso boas horas de trabalho, muito bem

gastas por sinal.

Perderia Catundo mais outras boas horas de seu dia mergulhando no infinito de uma

boa olhada nos atributos físicos de suas colegas de trabalho? É lógico que sim e por que

diabos não?

É notória a capacidade feminina de se apegar aos detalhes, mínimos que sejam, podem

apostar: as mulheres tudo vêem, tudo memorizam, tudo relembram e depois “algumas vezes”

jogamos isso na cara dos seres masculinos. Mas e Catundo? Catundo, como portador de um

cromossomo y no lugar de um dos x perderia a capacidade de fazer mais de uma coisa ao

mesmo tempo? Catundo, ao tentar fazer a barba atendendo a um telefonema, perderia ¼ do

sangue de seu corpo? Não. Definitivamente não quero fazer a barba.

Na vida prática, preencher um gênero masculino no lugar do feminino nos formulários

62 :: bula da Catunda

bula da Catunda :: 63

"A ausência total da TPM teria me ajudado a galgar um lugar no pico do universo www? Hum... "

por aí me faria abrir mão de algo que muito me anima: minha suscetibilidade ao mundo invisível. A crença em

quiromantes, tarólogas e astrólogas poderia ser sensivelmente reduzida. Eu, enquanto Catunda, sucumbo sem

pestanejar a uma bola de cristal e um baralhinho enfeitado, se rolar um incenso e uma toalha colorida então,

acredito até que sou a reencarnação de uma jabuticabeira. Fazer o quê?

Mas, voltando ao mundo real, se é que ele existe - ser um Catundo poderia tornar-se determinante na hora

de receber um cheque de um pagamento atrasado, por exemplo, ou de colocar o “tal” na mesa e falar com

voz grossa (sem parecer ataque de mulherzinha) que não dá mais pra trabalhar desse jeito. Já dou risada só de

pensar. Seria tão divertido. Eu poderia apresentar o Aprendiz. Será?

A viagem de ser um Catundo é a mesma de ser um orangotango. Tudo seria diferente se num dia treze

de sessenta e poucos eu tivesse usado uma fita azul no lugar de um lacinho cor-de-rosa. Eu poderia ser um

halterofilista, um surfista, um guitarrista... Mas não sou. Eu sou a Marcela, sou mulher, adoro meu trabalho e

sonho com um mundo melhor (para todos os gêneros) mesmo não sendo miss.

Para que, afinal, seu cliente precisa de um website?

Já faz algum tempo que a época dos “geninhos” fazedores de sites acabou, uma época em

que o importante era “estar” na web, o que quer que isso signifi casse. Com ela, também acabou

a época dos “achismos” e dos chutadores, o que garantiu, para muitas empresas sérias, verbas

signifi cativamente maiores para o desenvolvimento de ações digitais.

À medida que o mercado de comunicação digital evolui, mais e mais pessoas começam

a usar com galhardia termos antes reservados aos mascadores de bits e outros sujeitos de

óculos esquisitos e cortes de cabelo improváveis. Já não se fala mais em portais, a onda

agora é fazer com que as campanhas de comunicação sejam “virais”, criem comunidades,

usem blogs e, para os mais versados nas artes mercadocibernéticas, usem características

colaborativas de Web2 etc etc etc.

No entanto, a busca por efi ciência não parece ser uma prioridade hoje em dia. Dos dois

lados do balcão de negociações, nada é menos sexy que se falar em taxas de conversão ou

sucesso de operações. É um raciocínio torto, para se dizer o mínimo. Pois se qualquer profi ssional

de comunicação se apressa em defender a importância da área digital para a fi delização de um

público, por que a maioria deles continua a se comportar como adolescentes mimados que

detestam uma planilha de Excel?

É triste reconhecer, mas muitos profi ssionais de design digital não sabem/querem/gostam

de ler um Briefi ng, um relatório de pesquisa ou um planejamento estratégico de seus clientes.

Em português, isso quer dizer que esses profi ssionais não são capazes de identifi car claramente

quais são os objetivos da comunicação. Aí, como diz aquela velha expressão, “se não sabes

aonde vais, por que teimas em correr?”.

Muitos se defendem argumentando que seus clientes são incapazes de elaborar um plano

mínimo, e que mudam de idéia de acordo com o que está na moda ou que foi mostrado pela

concorrência, sem ao menos considerar se a solução proposta é boa para eles. Pode até ser

verdade, mas de qualquer maneira, é o cliente quem contrata seus serviços e, para citar outras duas

velhas expressões, “o freguês tem sempre razão” e “a corda sempre rompe do lado mais fraco”.

Se a vida é dura e noção é um artigo em falta entre os profi ssionais de marketing, o que

se deve fazer? Para começar, levar a sério a idéia de ser parceiro de seu cliente. Isso signifi ca

ter um interesse real por suas conquistas e colaborar efetivamente para que ele as conquiste.

Caso contrário, o designer se comporta como um pintor ou pedreiro: faz exclusivamente o que

é mandado, dane-se se não der certo. Agindo assim, não é de se esperar que ganhe mal.

Falando o óbvio, clientes trabalham para empresas e, portanto, devem visar lucro em suas

operações. Para isso, é preciso identifi car um objetivo para a ação digital e uma estimativa de

recursos para viabilizá-la a contento. Um blog corporativo, por exemplo, deve ter de dois a cinco

Luli RadfahrerPhD em Comunicação Digital, já dirigiu a divisão de internet de algumas das maiores agências de

propaganda e de alguns dos maiores portais do Brasil. Hoje, é Professor-Doutor da ECA-USP, Diretor

Associado do Museu de Arte Contemporânea e consultor independente. Autor do livro ‘design/web/

design:2’, administra uma comunidade de difusão do conhecimento digital pelo País.

64 :: webdesign

[email protected]

"É triste reconhecer, mas muitos profi ssionais de design digital não sabem/querem/gostam de ler um Briefi ng, um relatório de pesquisa ou um planejamento estratégico de seus clientes. "

posts por dia. Isso signifi ca de 10 a 25 posts por semana, ou 500 a mil e poucos posts por ano. O cliente é capaz

de arcar com isso? Não? Então não arrisque, pois a coisa pode fi car feia.

O mesmo raciocínio se aplica a outras áreas. Para que se quer o website? Para aumentar reconhecimento de

marca? Para dar maiores informações sobre produtos e serviços? Para Vender on-line? Para dirigir a atenção para

outros canais de vendas (como concessionárias em websites de automóveis, por exemplo)? Para prestar serviços

ao consumidor? Para cortar custos? Para aumentar a fi delidade à marca? Para ações promocionais?

Para cada uma dessas perguntas há uma resposta clara, direta e efi ciente. Ela não passa por CSS ou AJAX,

mas consegue estabelecer uma meta – e, o que é melhor, mensurá-la. Isso serve para justifi car verbas para o

desenvolvimento de novas ações e a contratação de seus futuros serviços, mesmo que eles não sejam os mais

baratos ou mais rápidos do mercado.

Me parece uma boa recompensa para a árdua tarefa de ler algumas páginas de planejamento, mas eu

posso estar enganado.

webdesign :: 65

barraca da Pescaria

Capoeirista passarinho

Magê-Malien - Crianças que BrilhamFaça parte você também deste projeto.Informações:www.arteccom.com.br/ong

Todos temos o compromisso de cuidar para

que o nosso país seja um lugar melhor.

Um gesto de solidariedade não muda o

nosso mundo, mas muda o mundo daquele

que recebeu a sua ajuda.

Para doação de alimento entre em contato: [email protected] Loureiro, sócio diretor da agência STAGE3, já fez sua doação.

VOCÊ TAMBÉM PODE AJUDAR!Você também pode colaborar doando cestas

básicas para o projeto Magê-Malien.

DATA CENTER HOSTING

maxiservers

A alta qualidade do serviço de hospedagem da Acquaria Web Solutions lhe dá a tranqüilidade para dirigir sua empresa, com a certeza de que seu cliente terá acesso a qualquer momento a seu endereço na internet.

www.acquaria.com.brtel: (47) [email protected]

A Brasil Hosting assume a missão de “prestar os melhores serviços, oferecer preços justos e respeitar o consumidor”. Assine agora mesmo um dos nossos planos e sinta a diferença de um hosting com ética.www.brasilhosting.comtel: (48) 4052.9591 [email protected]

Hospedagem com infra-estrutura no Brasil, 6 anos no mercado. Planos Windows e Linux, antivírus, anti-spam, banco de dados, relatórios de acesso, disponibilidade de 99,5%.www.creativehost.com.brtel: (11) [email protected]

Você quer Hospedagem Profi ssional? Servidores estáveis e que não saem do ar? Então venha conhecer a DataHosting, suporte diferenciado e qualifi cado, planos especiais de revenda, plataforma windows e linux.

www.datahosting.com.br tel: (11) 6951.2954 - (11) 6939.7305

[email protected]

Oferece hospedagem profi ssional linux e windows com recursos grátis como loja virtual, blog, enquete, boleto. Possui planos de revenda ideais para webdesigners. Suporte qualifi cado 24 horas e registro de domínios.

www.portal123.com/tel: Minas Gerais (31) 3761.2253São Paulo (11) [email protected]

Hospedagem de Sites a partir de R$ 15,00 mensais com 30 dias grátis para testar nossa qualidade. Sistemas para Imobiliárias, Concessionárias e Lojas Virtuais Online.http://[email protected]

Hospedagem de sites com infra-estrutura de altíssimo nível, planos a partir de R$ 8,90/mês. HTML, PHP, CGI, Flash, FrontPage, DreamWeaver, MySql, e-mail com anti-vírus/spam, suporte 24x7 entre outros recursos.www.hphost.com.brtel: (11) [email protected]

Provedor fundado no ano de 2001, com infra-estrutura própria e datacenter no Brasil. Plataforma Windows com suporte integrado à Net 2.0, ASP e PHP5 no mesmo ambiente, contando ainda com MYSQL gratuito e SQLServer 2000.www.iphotel.com.brtel: (11) 6971.0438

Hospedagem de Qualidade em Windows e Linux. Planos a partir de R$ 4,90 mensais. Atendimento personalizado por telefonia fi xa, Voip, Skype e e-mail, eliminando a distância para que você tenha liberdade de escolha.www.jotachost.com.brtel: (11) 4063.2395 - (41) [email protected]

Com o maxiservers você acerta no alvo, o melhor e mais seguro em hospedagem de sites!A partir de 14,90 mensais você hospeda seu site de forma fácil, rápida e segura. Acesse Já! [email protected]

Hospedagem de sites a partir de R$ 6,60, planos Windows e Linux, servidores semi-dedicados e dedicados de alta-qualidade, suporte altamente qualifi cado e 24 horas.www.novahost.com.brtel: (21) [email protected]

R$ 5 mensais ou R$ 50 ao ano. 800MB de espaço em disco, 20GB de transferência,PHP, MySQL, Emails e subdomínios ilimitados.Também registramos seu domínio. Atendimento imediato pelo MSN.www.triangulohost.com.brtel: (34) [email protected]

Hospedagem de sites em plataforma Linux e Windows. Registro gratuito de domínios internacionais, acesse o nosso site e participe de nossa promoção.

www.rjhost.com.brtel: (21) [email protected]

Loja virtual GRÁTIS. Assine um plano de hospedagem 3 ou 4 e ganhe uma loja virtual completa e de fácil administração. Escreva o código WBM no formulário de inscrição e ganhe ativação + 1 mensalidade.www.studioserver.com.brtel: (13) [email protected]

studioserverstudioserverInternet Solution

Hospede seu site com quem conhece do assunto. Servidores de Alto Desempenho! Suporte Rápido e Efi ciente! Tranqüilidade e segurança para você!Top Hospedagem - Qualidade é a nossa marca.

www.tophospedagem.com.brtel: (31) 3077.3310

Top HospedagemSoluções completas para webdesigners e desenvolvedores.Sistema inteligente e seguro de email com disco virtual.Qualidade, estabilidade e segurança.www.speedhost.com.brtel: São Paulo (11) 5644.1047Rio de Janeiro (21) 3523-0387 Paraná (41) 3015.3077

Oferecemos registro de domínios e hospedagem em ASP, PHP e CGI. Planos a partir de R$ 9,[email protected]

ZARP HOSTHospedagem de Sites

Hospedagem de Sites, Revenda de Hospedagem e Registro de Domínios, tecnologia ASP, PHP e .net no mesmo plano, teste grátis por 30 dias e comprove a qualidade de nossa infra-estrutura e atendimento.www.redehost.com.brtel: Rio Grande do Sul (51) 3042.2030São Paulo (11) 4063.7574Rio de Janeiro (21) [email protected]

Para anunciar nesta seção, envie um e-mail para [email protected], com o título "busca host" ou ligue para (21) 2253.0596

ABCMIX Flash TutorialsVídeo-aulas interativas em fl ash para Joomla! CMS. Viewlets sob encomenda para treinamento web e provedores de hospedagem. www.joomlafl ashtutorials.com tel:(61) 8464.4383 [email protected]

ABCABC

Toda a experiência em treinamento presencial disponível agora na forma digital. Aprendizado rápido, na velocidade de seus negócios.www.actionsoft.com.brtel: (11) [email protected]

Promoção de cursos de informática-Pacote Offi ce-Montagem, Manutenção, Confi guração de Computadores-Programação (Lógica de programação)-Redes e Linux-Windows e Internettel: (21) 3393.6351 - (21) 3473.8683 [email protected]

SERVIÇOS E TREINAMENTO EM INFORMÁTICASERVIÇOS E TREINAMENTO EM INFORMÁTICA

Web Design, ASP, PHP, SQL, JAVA e outros.O participante dominará os padrões, conceitos e as boas práticas de desenvolvimento para os principais modelos adotados pelo mercado.www.digidatabrasil.com.brtel: (21) 2233.8967 - (21) [email protected]. Pres. Vargas, 482 - sobreloja 206 - Centro - Rio de Janeiro/RJ

Descrição: Especializada em treinamentos individualizados, a Digital ensina a trabalhar com softwares da área web, assim como os mais usados pelo desenvolvido mercado offshore da região. www.digitaltreinamentos.com.brtel: (22) [email protected]

Operador de Microcomputador, Assistente Administrativo, Analista de Suporte Técnico, Linux /Star Offi ce, Programação, Inglês, Telemarketing e Excelência no Atendimento, Editoração e Produção Gráfi ca, Web Design, Hotelaria e Turismowww.databyte.com.brtel: (21) 2482.4763 Unidade Madureira – Av. Ministro Edgard Romero 415

Disponibilizamos uma ampla gama de treinamentos, visando a capacitação para um mundo competitivo. Os cursos abrangem desde o básico de informática até os profi ssionalizantes.www.diginetinformatica.com.br tel: (71) 3382.7898 R: 124 - Elio Earli [email protected]

A Fuctura é uma empresa que constantemente está preocupada com qualidade e com novas tecnologias. Na área de treinamento oferecemos cursos tradicionais, cursos on-line como o curso de Tecnologias Anti-Hackers e de ponta como o curso de Bolsa de Valores.www.fuctura.com.brtel: (81) 3088.0992e-mail: [email protected]

Web Designer + Fotografi a Web DeveloperA melhor qualifi cação profi ssional em desenvolvimento de páginas e sites para a internet.Você conectado às novidades do mercado. Web Designer é na People !www.people.com.brtel: (19) 3739.6400 ou 0800 7 720 721

Ligue gratis: 0800 7 720 721

A Tecnoponta treina há quinze anos profi ssionais preparados diretamente para o mercado de Web. Crie dinamismo, organize e manipule dados na Web, processando informações em Background .Cursos de Flash Action Script, Ajax e Tableless, ASP.NET c/ C#.NETwww.tecnoponta.com.brtel: [email protected]

Cursos Presenciais ou e-Learning. Computação Gráfi ca, WEB Design, AutoCAD, 3D Studio.Horários Flexíveis, Início Imediato, Garantia de Aprendizado. Marque uma Aula GRÁTIS!www.treinasoft.com.brtel: 11 [email protected]. 11 de Junho, 63, (Metrô Santa Cruz)

Curso WEB Marketing e Comunicação Digital28 à 30/08 - Rio de Janeiro18 à 20/09 - Porto Alegre16 à 19/10 - São PauloConheça a programação completa no site www.wbibrasil.com.brtel: (51) [email protected]

Cássio Raphael Vitiello de SousaEspecialista Oracle - Sócio Diretorwww.worldsoft.com.brtel: (11) 3289.5963 [email protected]

Aprenda Oracle, Java, Linux, ITILMultiplique conhecimento!Nossos Treinamentos:OpenOffi ce, Banco de Dados, Gestão e Qualidade,Programação Java, Análise de Sistemas, PHP e MySQLPHP com Ajax, Gnu/ LINUX LPItel: (61) 3244.2510 [email protected] 910 Ed. Mix Park Sul sl 239 – Brasília/DF

Domine os softwares de Web Design: Illustrator, Indesign, Photoshop, Dreamweaver, Fireworks e Flash.www.aisinformatica.com.brtel: (21) [email protected]

A Bluestar Technology oferece toda a linha de treinamentos ofi ciais Borland, CA e Conectiva Mandriva. Temos ainda treinamentos profi ssionalizantes em Programação Web, com Java, Delphi e PHP. Invista em você, na sua carreira e no seu futuro.www.bluestar.inf.brtel: (61) [email protected]

AGORA NO BRASIL!O melhor treinamento Linux, pertinho de você.tel: (11) 3124.6000

Usabilidade, Arquitetura da Informação, Web 2.0, Webwritting, Tableless, Python, Zope e Plone com os maiores especialistas do mercado. Aprenda conceitos e ferramentas que serão seu principal diferencial competitivo.www.simplesconsultoria.com.brtel: (11)[email protected]

INVISTA EM SEU FUTURO

Para anunciar nesta seção, envie um e-mail para [email protected], com o título "busca cursos" ou ligue para (21) 2253.0596