janeiro 2007 :: ano 4 :: nº 37 :: www.revistawebdesign.com.

br

Saiba como aplicar a teoria na prática

Estudo de caso: o projeto interativo da Brastemp (AgênciaClick)

E D I T O R A
I SSN 1806 - 0099 E-mais: agências digitais conquistando o mercado internacional
Entrevista: padrões web, uma barreira ou um caminho?
9 771806 009009 00037
Tecnologia: trabalhando com criação em ActionScript
R$ 9,90
 4 :: quem somos

Editorial Equipe
Direção Geral
Cadê o recheio?????? Adriana Melo
adriana@arteccom.com.br
Ontem, eu ia enviar um e-mail para a Bauducco. Queria dar minha Direção de Redação
opinião sobre um produto deles que eu estava consumindo. Entrei no site. Luis Rocha
luis@arteccom.com.br
Achei o contato... Que bom! (é, algumas vezes não encontramos o contato). Criação e Diagramação
Camila Oliveira
Quando me deparo com um formulário enorme, com endereço, profissão,
camila@arteccom.com.br
estado civil etc., pensei: “o interessado deveria ser o fabricante, me facilitar Leandro Camacho
leandro@arteccom.com.br
o acesso, afinal, eu poderia contribuir para a qualidade de seu produto e para Ilustração
Beto Vieira
suas vendas. Eu estaria até disposta a perder 1 minuto, pela credibilidade da
beto@arteccom.com.br

:: A Arteccom não se responsabiliza por informações e opiniões contidas nos artigos assinados, bem como pelo teor dos anúncios publicitários. :: Não é permitida a reprodução de textos ou imagens sem autorização da editora.
marca, mas não 5!”. Fechei. Existem outras marcas por aí. Publicidade
Bruno Pettendorfer
Então, tanto se fala de Web 2.0, foco no usuário, troca de experiências,
Débora Carvalho
mas o básico ainda não é feito. Enfim, me pergunto: temos tanto tempo para publicidade@arteccom.com.br
Gerência de Tecnologia
interagir assim? Com acesso a e-mail, celular, MSN, Skype... Definitivamente
Fabio Pinheiro
não. O tempo vai continuar sendo o mesmo, nosso dia vai continuar tendo fabio@arteccom.com.br
Desenvolvimento Web
24 horas. E agora ainda temos que encontrar tempo para conversar com as Cadu Sant'Anna
cadu@arteccom.com.br
marcas dos produtos que consumimos! Conversaremos apenas com as marcas
Financeiro
que nos encantarem e olhe lá. Então, nosso desafio agora é criar ambientes Cristiane Dalmati
cristiane@arteccom.com.br
que realmente atraiam a atenção do usuário. Será um processo de seleção
Atendimento e Assinaturas
natural. O nosso cliente não deixará de conversar com um amigo para trocar Luanna Chacon
luanna@arteccom.com.br
experiências com nossa marca. A não ser que... Aí que estará a oportunidade
A Arteccom é uma empresa de design, especializada na
de demonstrar seu diferencial. criação de sites e responsável pelos seguintes projetos:
Revista Webdesign :: www.arteccom.com.br/webdesign
Bem, mas comecei falando de interatividade porque a WEBDESIGN Concurso Peixe Grande :: www.arteccom.com.br/
webdesign/peixegrande
pretende, ainda este ano, focar bastante neste assunto. Queremos trazer Encontro de Web Design :: www.arteccom.com.br/encontro
Fórum Internacional de Design e Tecnologia Digital ::
para vocês, em 2007, as melhores soluções, estratégias e experiências www.arteccom.com.br/find
Projeto Social Magê-Malien :: www.arteccom.com.br/ong
com interatividade na web, além de tratarmos de assuntos como aplicação
de vídeos em sites, internet no celular, cases internacionais, faremos uma Criação e edição
www.arteccom.com.br
coleção super especial “Café com Criação” e outras surpresas.
Produção gráfica
Um grande abraço e um feliz 2007! www.prolgrafica.com.br

Adriana Melo Distribuição

www.chinaglia.com.br

9
 menu :: 5

apresentação e-mais
pág. 4 quem somos pág. 38 debate: Ultrapasse os limites
pág. 5 menu pág. 46 e-mais: Desbravadores
pág. 51 estudo de caso: Brastemp
pág. 56 tecnologia na web: ActionScript
contato
pág. 60 tutorial: Produtividade 2.0 - Parte 3
pág. 6 emails
pág. 6 fale conosco
com a palavra
pág. 64 tecnologia: Abel Reis
fique por den tro
pág. 66 arquitetura da informação: Luiz Agner
pág. 8 métricas e mercado
pág. 68 marketing: René de Paula Jr.
pág. 10 direito na web
pág. 70 bula da Catunda: Marcela Catunda
pág. 11 post-it
pág. 72 webdesign: Luli Radfahrer

portfólio
pág. 12 agência: Plano B
pág. 18 freelancer: Andrezza Valentin
pág. 20 ilustração: Glauco Diogenes

matéria de capa
pág. 22 entrevista: Padrões web
pág. 30 reportagem: Gestalt
 6 :: emails
Assunto: Direito na web
PC ou Mac?
Gostaria de saber se a revista já
publicou alguma matéria sobre
qual a melhor plataforma para
um webdesigner trabalhar: PC
ou Mac? Falo em termos gerais,
desde a construção do layout até
a publicação do site.
Anderson de Almeida
almeida@animabits.com.br
Oi, Anderson, como vai? Ainda não
publicamos nada sobre o assunto.
Na verdade, existe uma previsão
de produzirmos um debate sobre
o assunto. Nosso intuito é avaliar
a opinião dos mais diversos
profissionais para podermos indicar
como o mercado vem trabalhando
esta questão. Além disso, para que
essa avaliação seja mais completa,
pedimos que os nossos leitores
também contribuam com este
debate, enviando suas opiniões
para redacao@arteccom.com.br.
Assunto: Direito na web
Resolução de tela
Tudo bem? Preciso dar uma
resposta urgente para o meu
diretor. Qual é a estatística de
usuários que utilizam 1024x768 e
800x600? É urgentíssimo...
Luciane Carvalho
wcfdesign@yahoo.com.br
Luciane, pela urgência, já enviamos
a informação por e-mail. Mas
achamos sua dúvida válida e vamos
compartilhá-la com os nossos
outros leitores! Na edição de julho
(nº30), publicamos as seguintes
informações: 63% dos 17,5 milhões
de PCs em funcionamento no
Brasil utilizam 800x600 pixels como
fale conosco pelo site www.revistawebdesign.com.br
:: Os emails são apresentados resumidamente. :: Sugestões dadas através dos emails enviados à revista passam a ser de propriedade da Arteccom.
resolução de tela. A estimativa é da
fabricante AOC (www.aoc.com.br),
que aponta ainda a utilização dos
tamanhos 1024x768 (35%) e acima
de 1024x768 (2%).
Uma dica é usar alguma
ferramenta de métricas web. O
Google Analytics (www.google.
com/analytics/pt-BR) é uma boa
opção: é gratuito, além de revelar
qual o tipo de resolução de tela
mais utilizado pelos usuários que
acessam o seu site.
Assunto: Direito
Metodologia de
na web
trabalho
Trabalho em uma fábrica de
software. Por lá, utilizamos o
método de desenvolvimento,
homologação e produção para o
desenvolvimento dos sistemas.
A equipe de web também teve
que se adaptar a esse método.
Entretanto, não sabemos se é o
mais adequado para esta área.
Gostaria que o tema “método
de trabalho” fosse abordado
em alguma edição da revista.
Como as grandes agências
digitais trabalham esta questão?
Como funciona a organização,
os backups e o desenvolvimento
dos arquivos? Como é a
dinâmica interna de trabalho,
quando vários desenvolvedores
e designers atualizam
constantemente o mesmo portal?
Juliana Diniz
jds.juliana@gmail.com
Juliana, esta sua sugestão é super
válida, pois reflete um dos principais
desafios para a constituição de uma
boa dinâmica de trabalho.
Um dos temas citados por você
vem sendo abordado na seção
Tutorial. A partir da edição de
novembro de 2006, iniciamos a
publicação do “Produtividade
2.0”, no qual o especialista Elcio
Ferreira vem explicando como
funciona a implementação de
sistemas de controle de versão. Vá
até a página 59 e confira um pouco
dessa história. Em breve, sua
sugestão de pauta vai virar tema
de reportagem, ok? Obrigado pela
ajuda e continue participando!
Assunto: Direito
Fonte denaconsulta
web
Sou estudante de Desenho
Industrial e acompanho a Revista
há muito tempo. Recentemente,
num trabalho da faculdade, tive de
escolher um tema para uma loja
e criar um plano de negócios. Fiz
sobre uma agência de design e a
Revista Webdesign (principalmente
a edição que teve a carteira de
trabalho como imagem de capa)
foi a principal fonte de pesquisa. A
professora adorou e elogiou muito
a pesquisa! E numa outra ocasião,
foi mencionada a fonte “Brasilêro”
(que, por sinal, é ótima) e eu já tinha
lido sobre ela na revista. Muito
obrigada por estar sempre nos
atualizando e nos enviando material
de alta qualidade. Forte abraço!
Evelyn Gomes
evelyn@rosa-shock.com
Muito obrigado por este feedback,
Evelyn! É um grande estímulo para
a nossa equipe saber que a revista
tem ajudado em seu crescimento
profissional. Aproveitando o
ensejo, se você gosta de tipografia
inspirada em tipos populares,
recomendamos que você leia a
entrevista de capa da edição de
setembro, que fala sobre o projeto
“Tipos Populares do Brasil” (www.
sibilina.com/tipos).
Assunto: Referências sobre livros
Tenho algumas revistas e as que
eu tenho realmente são muito
boas. Gostaria de saber se tem
alguma edição com uma biblioteca
de referência com bons livros
nacionais sobre webdesign. Se
não tiver, gostaria de sugerir para
uma próxima edição.
Dayvison Santos
mayvison@hotmail.com
Dayvison, obrigado pela sua
participação! Mensalmente,
publicamos na seção Post-it,
e dentro das reportagens e
entrevistas, algumas dicas sobre
bibliografia especializada na área.
Se puder, acompanhe a revista
todo mês, pois procuramos sempre
trazer boas dicas de livros, ok?
Desculpe a nossa falha!
Edição de novembro:
- Página 44, onde se lê “um dos
envolvido”, por favor considerar
como “um dos envolvidos”;
- Página 73, o olho da coluna do
Luli Radfahrer saiu repetido, com o
mesmo da edição de outubro;
Edição de dezembro:
- Página 51, na parte superior do
texto, aparece repetida a passagem
“...e as regras desse universo”.
 L I Z 2007
FE

DESEJAMOS A TODOS UM ANO REPLETO DE REALIZAÇÕES!

Magê-Malien - Crianças que Brilham

Faça parte você também deste projeto.
Para doação de alimento entre em
contato: arteccom@arteccom.com.br
Informações:
www.arteccom.com.br/ong
 8 :: métricas e mercado

Atividades desenvolvidas na internet - comunicação

Atividades Percentual (%) Fonte: TIC Domicílios 2006 (www.nic.
br/indicadores) / 2.286 entrevistados
Enviar e receber e-mail 82,84
Enviar mensagens instantâneas 49,19
Participar de sites de comunidades e relacionamentos 46,57
Participar de chats e/ou listas de discussão 35,00
Criar ou atualizar blogs e/ou websites 12,91
Usar o telefone via internet / videoconferência 10,76

Pesquisa Salarial - 2006 Fonte: Apinfo.com / 11.102 participantes

Brasil DF RJ SP
CLT Terceiro CLT Terceiro CLT Terceiro CLT Terceiro
Webdesigner 1.354,00 1.913,00 1.700,00 2.340,00 1.617,00 2.344,00 1.671,00 2.305,00
Webmaster 1.653,00 2.350,00 1.908,00 2.477,00 1.879,00 2.687,00 1.991,00 2.798,00

Estudo realizado com 42 empresas de

médio e grande porte aponta o e-mail 705 mil
marketing como a ferramenta de comu-
83% nicação digital mais utilizada no país.
Esta é a estimativa de sites referenciados por domínios brasi-
leiros. Isso porque, dos mais de um milhão de domínios regis-
Para o futuro, a previsão envolve o cres-
trados no Brasil, muitos não estão associados a um site. Há
cimento no segmento de conteúdo para
casos em que sites são apontados por mais de um domínio.
dispositivos móveis (76%), seguido pelo
Fonte: Hostmapper (www.hostmapper.com.br)
chat on-line (59%). Fonte: Associação Brasilei-
ra de e-Business (www.ebusinessbrasil.com.br)

369 ...das compras on-line realizadas no

Brasil são efetuadas em sites locais e não
Segundo pesquisa divulgada em novembro de 2006,
este era o total de empresas de hosting operando no 87% em estrangeiros. As categorias que se
destacam são: viagens (50%) e lojas de
mercado brasileiro. Juntas, elas respondem por 65,1%
departamento (25%).
dos domínios registrados no país.
Fonte: Camara-e.net (www.camara-e.net)
Fonte: Hostmapper (www.hostmapper.com.br)

Envie sugestões e críticas para redacao@arteccom.com.br

 métricas e mercado :: 9

ViuIsso? Por Michel Lent Schwartzman - michel@viuisso.com.br

Site: www.viuisso.com.br

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

Diretor da Microsoft no reino da pirataria intervalo da final do campeonato de futebol americano.

Sensacional a matéria produzida pelo Estadão, com A veiculação de 30” no SuperBowl custou US$
o diretor mundial de Propriedade Intelectual da ameri- 2 . 5 m i , e n q u a n t o o u p l o a d n o Yo u Tu b e c u s t o u z e ro .
cana Microsoft, Keith Beeman. Eles levaram o executivo O comercial no SuperBowl gerou 500 milhões de im-
até a Santa Ifigênia para conhecer de perto o comércio pressões (potenciais pessoas atingidas), enquanto a
pirata de produtos da sua companhia. veiculação no YouTube atingiu 1.7 milhões de impres-
Na barraca do camelô “Mouse” encontraram até as sões. Sensacional!
versões super recentes do Vista e do Office 2007, que (Via WOMMA: http://tinyurl.com/u2wae)
ainda não estão disponíveis para o consumidor final.
Keith sabe bem que pessoas como “Mouse” Marketing viral no Vitrine
são os que menos ganham e estão na ponta de uma
cadeia de um negócio mundial, que já fatura mais que
o narcotráfico, segundo a Interpol (U$ 516 bilhões por
ano - mais do que os U$ 322 bilhões do narcotráfico).
Leia a ótima matéria no Estadão: http://tinyurl.
com/y67q3d.

YouTube 3 x 1 SuperBowl

Bati um papo sobre marketing viral com a Sabrina

Veja a comparação de investimento e resultado ao se
veicular um comercial no YouTube e na TV, no intervalo do Su-
perBowl, o evento com a maior audiência da TV americana.
O comercial “Evolution”, de Dove, veiculado no You-
Tube e no SuperBowl, conseguiu três vezes mais através da
sua veiculação na internet do que quando foi veiculado no
Parlatore para o programa Vitrine da TV Cultura, que
foi ao ar no dia 01/12. A matéria mostra os criadores do
‘Tapa Na Pantera’ e a turma da Fisher America falando
s o b re o v i r a l q u e f i z e r a m p a r a C a i x a . P r a q u e m n ã o
teve a oportunidade de assistir, aqui está o endereço:
http://tinyurl.com/y4oz8y.
 10 :: direito na web
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:
redacao@arteccom.com.br
A extensão das ofensas na internet
Um antigo site de eventos de nossa região quer fazer uma parceria com o Portal que administramos.
Como a característica do site deles é fazer comentários dos “figurões” da cidade, temos medo que um
desses comentários possa dar algum problema jurídico. Como somos responsáveis pelo Portal, gostaria de
desvincular as responsabilidades. Um contrato resolveria o nosso problema?
Gabriel Martins (bie.gabriel@gmail.com)
Um dos assuntos mais controvertidos
nas atuais discussões jurídicas sobre a
internet é o das ofensas (injúria, calúnia,
difamação) a terceiros. Os provedores de
hospedagem ou de conteúdo tentam se
proteger, por via contratual, estabelecendo
cláusulas, respectivamente, com seus
usuários e colaboradores, no sentido de se
eximirem de responsabilidades por quaisquer
ofensas veiculadas por estes últimos num site
hospedado ou num texto postado.
Sucede, entretanto, que como
sabido, todo contrato é considerado “lei
entre as partes”, porém somente entre
elas, ou seja, não alcança terceiros, não
figurantes no contrato. Portanto, perante
terceiros, não há como garantir que o
provedor ficará livre de responder pelos
atos de seus usuários ou colaboradores.
O fundamento legal para esta situação é
triplo, pois resulta:
i) da responsabilidade civil, prevista
no novo Código Civil;
ii) do conceito de que a coletividade
(incluindo os terceiros) é equiparada a
consumidor, logo, protegida pelo Código
do Consumidor; e
iii) da Lei de Imprensa, pois o
Judiciário tem, crescentemente,
estendido o conceito de imprensa a sites
“informativos” ou “noticiosos”.
Quais alternativas restam, então,
para os provedores? Embora essa
resposta demande análise caso a caso
para que sejam considerados os detalhes
específicos de cada provedor (e os
detalhes são decisivos, em muitos casos),
se pode alinhar algumas opções básicas.
Dentre elas, se pode estabelecer
“filtros” visando (por meio de monitoramento
de palavras, ou de visitação de sites,
ou de revisão no eventual recebimento
de conteúdos para postagem) detectar
irregularidades, devendo ser aplicados tais
“filtros” a uma amostragem razoável.
Outra medida possível é fazer constar
em portais e páginas “Termos de Uso” ou
“ Te r m o s d e S e r v i ç o ” e n f a t i z a n d o , c o m
muita clareza, que a responsabilidade pelo
conteúdo será exclusivamente do respectivo
autor. Mais outra: prever como regra que o
autor do site ou conteúdo deverá possuir
elementos que dêem embasamento para o
teor do que pretende publicar, e autoriza
previamente a sua exibição a terceiros, no
caso de qualquer questionamento, garantindo
transparência e visibilidade da defesa.
Além de contratos adequados, há
u m s e m - n ú m e ro d e o u t r a s s u g e s t õ e s e
recomendações a serem feitas no tocante
a este tema, que está rapidamente se
convertendo num enorme filão de pedidos
de indenização por danos morais. Vale a
pena visitar o site do Tribunal de Justiça
das principais capitais do país e conferir a
quantidade de jurisprudência que já existe
sobre este assunto. E, essencialmente,
tomar medidas para não ser surpreendido,
como incauto, e responsabilizado,
como negligente, em meio a “tiroteios”
quase incontroláveis entre usuários,
colaboradores e terceiros.

Brasilêro na Dinamarca!
Se você leu a edição de fevereiro de 2006, vai lembrar que
conversamos com o designer Crystian Cruz, criador da fonte
Brasilêro (http://tinyurl.com/jdgtw). Para se ter uma idéia do
sucesso dos tipos populares brasileiros pelo mundo, a fonte foi
escolhida para compor o site da famosa dupla dinamarquesa
Wulff e Morgenthaler (www.wulffmorgenthaler.com),
especializada em webcomics.
Com ou sem tabelas?
Quer conferir se seu site está 100% tableless? Pois então, a dica é
acessar a ferramenta on-line w3tableless (http://w3tableless.com) e
colocar o código de seu projeto para validação.
Produção tipográfica no Brasil
Falando ainda sobre tipografia, o número de profissionais
criando novas fontes é motivo de orgulho para a produção
nacional do design. Dois bons exemplos: Discord (http://tinyurl.
com/y3z9pw), de Rafael Neder, e Maryam (http://tinyurl.com/
y8dpkl), de Ricardo Esteves.
Fique de olho: vídeos interativos
A equipe criativa da agência AlmapBBDO (www.almapbbdo.
com.br) trouxe uma boa novidade no Natal, com o hotsite da
campanha produzido para a Bauducco (www.natalbauducco.com.
br). Através de um vídeo interativo on-line, o usuário conseguia
interagir com o Papai Noel (respondendo a perguntas como
idade, cor preferida e nome).
Produção acadêmica no design para web
Para começar o ano, a dica acadêmica começa em ritmo de samba,
mais precisamente sobre a importância de Cartola para a música
popular brasileira. Estamos falando do projeto “Um sonho que a
gente teve” (www.umsonhoqueagenteteve.com.br), apresentado
por Claudio Gusmão, Fabio Moita, Letícia Gomes, Marcos Cardinal,
Paola Barone, Rafael Ribeiro e Renato Garcia, no curso de Design
Digital da Universidade Anhembi Morumbi. Se você possui ou
conhece algum trabalho acadêmico interessante, envie sua
sugestão para redacao@arteccom.com.br.
Participe do Post-it! Envie sugestões para redacao@arteccom.com.br.
post-it :: 11
p o r d entro ,
Fique cas, eventos ias
das di e referênc undo
livros vimentam o m
que mo ign na web
do des
Referências sobre construtivismo russo
Para quem busca referências visuais sobre a produção referente
ao período conhecido como Construtivismo Russo (segundo
a Wikipédia, caracterizado pela “...utilização constante de
geometria, cores primárias, fotomontagem e a tipografia sem
serifa”), a dica é acessar o álbum de fotos “USSR posters”
(http://tinyurl.com/y5p7wz). E para entender a conceituação
histórica do movimento, os livros “Design Gráfico, uma história
concisa”, de Richard Hollis, e “Neoconcretismo”, de Ronaldo
Brito, são boas pedidas de leitura.
Dicas
Livro do mês
Coleção “ICONS, Web Design”
(E-commerce, Flash Sites, Music Sites, Portfolios e Studios)
Autor: Julius Wiedemann
Editora: TASCHEN (www.taschen.com)
“Se você procura por referências de como anda o design
para web no mundo, um bom caminho é conhecer a coleção
‘ICONS, Web Design’, lançada recentemente pela editora alemã
TASCHEN. Sob o comando do brasileiro Julius Wiedemann, os
livros desta série representam um acervo mundial atualizado
em termos de criação e desenvolvimento web. Por lá, é
possível descobrir, por exemplo, como criam os profissionais
da Croácia, Estônia, Hong Kong, Índia, Suíça, entre outros. Para
se ter uma idéia do trabalho realizado, na série ‘Portfolios’,
são 200 portfólios de mais de 30 países. O Brasil também
marca presença: o trabalho de brazucas como Pablo Marques
(www.pablomarques.com) e Vitor Vilela (www.vitorvilela.
com.br) revelam como o nosso conhecimento vem recebendo
reconhecimento internacional.”
12 :: portfólio agência - Plano B

O DESIGN COM MÚLTIPLAS FACES

No mercado web, poucas são as agências com capacidade e disposição de atender
clientes de segmentos tão distintos. Talvez seja por isso que a carioca Plano B (www.plano-
b.com.br) conseguiu construir, ao longo dos seus oito anos de mercado, um bom diferencial
para colocar em seu portfólio empresas e organizações das mais diversas áreas.
“Atendemos clientes nos mais diversos setores: energia, responsabilidade social, cultura,
corporativo (B2B e B2C), comércio, tecnologia, saúde, educação, transporte... Sempre propondo
soluções para diferentes desafios”, explica Pedro Herzog, diretor de projeto da Plano B.
A história da agência se inicia em 1999, quando Pedro e seu amigo Sergio Boiteux,
recém-formados pela ESDI (Escola Superior de Desenho Industrial - www.esdi.uerj.br),
decidem trabalhar juntos.
“A experiência adquirida por cada um dos sócios como estagiários em diversos
escritórios de design foi pré-requisito para iniciar as atividades em uma base sólida.
No início, atuávamos desenvolvendo projetos para pequenas empresas e oferecendo

“O importante é que o cliente se reconheca como parte integrante do produto final”
serviços terceirizados para outros escritórios de design. Em
2002, Marcos Rogozinski, formado em engenharia de som
pela Berklee College of Music, associou-se ao escritório,
trazendo sua experiência no desenvolvimento de novas
tecnologias e programação”.
Nesta caminhada, um dos principais desafios seria
conseguir verba para montar a agência dentro de uma
boa infra-estrutura física. “Além das noites mal dormidas,
o escritório iniciou suas atividades em uma pequena sala
sublocada de uma produtora de cinema. Receber clientes
naquela sala era sempre complicado. Mais tarde, com
a contratação de uma estagiária, a situação ficou ainda
mais crítica. Depois de dois anos, o escritório mudou-
se para um local mais amplo, permitindo o crescimento
da equipe que hoje conta com oito funcionários fixos
(seis designers e dois programadores) e colaboradores
(redatores, fotógrafos e ilustradores)”.
Muito dessa evolução deve-se a variada oferta de
serviços (nas áreas de design gráfico, vídeo/animação,
identidade corporativa, exposições e webdesign), que
permitiu, em pouco tempo, que a Plano B conseguisse
desenvolver um portfólio consistente e diversifi cado. “As
principais conquistas são os próprios clientes. Atualmente, a
Plano B atende regularmente empresas, projetos e instituições
como SHV Gas Brasil, Petrobras, Eletrobras, Anima Mundi,
Fundação Casa de Rui Barbosa, entre outros”.
Apostando na pluralidade
Se fosse definir em uma palavra a característica marcante
dos projetos desenvolvidos pela agência, Pedro Herzog
aponta a pluralidade como a definição a ser apresentada.
“Por isso, na hora de selecionar um profissional, além de
uma avaliação do portfólio, pesa muito a versatilidade, a
capacidade e a vontade de aprender”.
Outra característica que confirma a forma como a
Plano B atua no mercado está presente nas etapas de
desenvolvimento de seus projetos. “O processo criativo de
cada trabalho se inicia no primeiro contato com o cliente
e, como cada cliente tem características e necessidades
diferentes, os projetos também são encaminhados de
portfólio agência - Plano B :: 13
maneira distinta. O importante é que o cliente se reconheça
como parte integrante do produto final”.
Lembrando que a diversidade dos projetos
serve ainda como um estímulo ao trabalho de seus
profissionais. “No início do processo criativo,
procuramos estimular uma discussão com toda a
equipe. Nessa etapa, todos podem, livremente, sugerir
alternativas para o desenvolvimento do projeto. Além
disso, a diversidade dos projetos cria um processo de
contínuo aprendizado, que ajuda a manter o interesse
pelo desenvolvimento de novas soluções”, diz.
E dentro das transformações que vão ocorrer no
m e rc a d o d e i n t e r n e t n o s p r ó x i m o s a n o s , a P l a n o B
aposta cada vez mais no alinhamento entre a prática
do design e as possibilidades tecnológicas. “Os novos
recursos vão sendo incorporados aos projetos na
medida em que viabilizam uma interação mais fluida
e uma comunicação mais direta. A internet está cada
vez menos restrita à estação de trabalho. Em um futuro
próximo, as questões de interface e usabilidade serão
formuladas para outros ambientes, ampliando ainda
mais o mercado”, argumenta Pedro.
Plano B: etapas envolvidas nos projetos digitais
1. Levantamento dos objetivos do cliente e das infor-
mações relevantes ao projeto
2. Pesquisa
3. Arquitetura de informação, estrutura de navega-
ção e definição das principais ferramentas
4. Layout das principais páginas, de acordo com a
identidade do projeto
5. Programação
6. Desenvolvimento da interface
7. Testes de usabilidade
8. Ajustes
9. Treinamento
10. Fechamento do projeto
 14 :: portfólio agência - Plano B
SHV Gas Brasil (SHV.Net)
www.shvgas.com.br
Tecnologias utilizadas: ASP, Flash e SQL Server
O relacionamento com a SHV Gas representa dois gran-
des projetos: além dos sites da SHV Gas Brasil, Minasgás e
Supergasbras, a agência ficou responsável pelo desenvol-
vimento da intranet da empresa, que centraliza ferramen-
tas de integração, comunicação interna e de otimização de
recursos.
Diante de tal experiência, quais seriam as principais
diferenças na criação de interfaces para internet e intra-
net? “Os sites têm uma estrutura relativamente simples,
com navegação direta, ricos em informações sobre seus
produtos e serviços. São orientados para o consumidor
final e sofrem pequenas atualizações de conteúdo dentro
da estrutura de navegação proposta. Já a intranet é um
projeto mais complexo, em constante desenvolvimento.
A SHV.Net converge informações de todas as diretorias e
departamentos, sendo constantemente revisada em seu
conteúdo e estrutura, além do desenvolvimento de novas
ferramentas”.
Um aspecto interessante na interface da intranet é a
utilização de ícones para orientar a navegação dos colabora-
dores da empresa. “Eles foram construídos a partir de uma
matriz de 25x25 pixels, destacando os tópicos mais utilizados
e contribuindo para uma interface mais leve e amigável”.
Anima Mundi
www.animamundi.com.br
Tecnologias utilizadas: ASP, Flash e SQL Server
A oportunidade para a criação e o desenvolvimento do site do
Anima Mundi, considerado o maior festival de animação da América
Latina, surgiu através da recomendação de um cliente. “Conquista-
mos a conta através da participação em uma concorrência. A partir
de então, a Plano B passou a atender todas as demandas relaciona-
das ao projeto nos últimos três anos”, diz Pedro.
A proposta era transformar o site em uma ferramenta dinâmica
que permitisse que os próprios funcionários do festival tivessem
autonomia para administrar as informações disponibilizadas na
rede. “Desenvolvemos um sistema para gerenciamento de todo o
conteúdo do site. Entre as funções deste sistema, destacamos: perfis
de acesso; cadastro de notícias; sistema de votação on-line; grade
de programação; mural de fotos; calendário de eventos; cadastro de
produtos e links; mala direta para os usuários cadastrados etc.”.
Em relação à arquitetura da informação da versão 2006
do site do festival, a agência procurou valorizar também as
outras categorias que foram surgindo ao longo das edições.
“Embora o Festival Anima Mundi seja a principal referência
para a maioria dos visitantes, a estrutura deveria apresentar
os módulos (Festival Anima Mundi, Anima Mundi Web, Anima
Mundi Celular e Anima Escola) com o mesmo valor hierárquico.
Outro fator levado em consideração foi a necessidade de mo-
dificar completamente os padrões de cores, tipografia e estilos
de texto, para cada edição do website. Além disso, a arquite-
tura de cada seção foi replicada para facilitar a navegação do
visitante e também a manutenção do website”.
 portfólio agência - Plano B :: 15

Filmes do Serro
www.filmesdoserro.com.br
Tecnologias utilizadas: ASP, Flash e SQL Server

A tradicional produtora de cinema Filmes do Serro propôs um bom desafio

para a Plano B: criar um novo site que apresentasse, com a mesma ênfase, a
empresa e uma área dedicada a biografia e a filmografia de Joaquim Pedro de
Andrade (um dos expoentes do Cinema Novo e fundador da produtora).
“Dessa forma, tivemos que trabalhar na organização e na formatação
de um grande volume de textos e imagens. A composição das barras de
fotos, presentes em todas as páginas, também renderam horas de traba-
lho”, revela Pedro.
Outro detalhe interessante neste projeto refere-se ao equilíbrio das cores
utilizadas para construção da interface do site. “Optamos pelo uso de diferen-
tes paletas para identificar as duas grandes áreas do website. Utilizamos cores
pouco saturadas para as páginas de apresentação e cores mais vibrantes para
destacar e identificar as páginas dos filmes”.
 18 :: portfólio freelancer - Andrezza Valentin
Andrezza Valentin
Contato: info@andrezza.com
Site: www.andrezza.com
Estímulos de criação baseados
na arte e no design
Se alguém ainda tem dúvidas sobre a validade de se
investir numa boa formação acadêmica, a trajetória profis-
sional de Andrezza Valentin, formada em artes pela FAAP
e em design gráfico pelo SENAI, serve para dirimir os prin-
cipais questionamentos.
“Se você quisesse realmente estagiar na área de de-
sign, você tinha que correr atrás para conseguir porque
as vagas eram disputadíssimas e entrar num estúdio de
design ou agência era quase impossível. Naquela época,
o mercado ainda não estava acostumado a contratar pro-
fissionais tão jovens. Apesar dessas dificuldades, tínhamos
ao nosso favor o fato de o SENAI dar aos alunos uma exce-
lente base de conhecimento em tipografia, diagramação e
teoria das cores. Isso ajudou bastante no meu desenvolvi-
mento profissional, principalmente no início, pois apesar
de ser muito jovem, eu acabava me destacando pela minha
boa formação”, destaca.
Após experimentar como seria o processo de tra-
balho de um designer gráfico, e descobrir que não seria
este o único segmento que gostaria de atuar, a internet
surgiu como o campo ideal para ela demonstrar todo o
seu potencial. “Quando comecei a trabalhar com web tive
a sensação de ter me encontrado. Por muito tempo pre-
feri a linguagem de internet a qualquer outra, mas agora
me sinto à vontade para fazer trabalhos de impresso,
logos, animações. Demora um tempo para você se sentir
confiante do seu próprio trabalho a ponto de não preci-
sar se prender a nenhum tipo de linguagem específica.
Isso também requer muito estudo e dedicação porque é
necessário conhecer bem todas as linguagens para poder
mudar facilmente de uma para outra”.
Para participar desta seção, cadastre seu portfólio no site da revista: www.revistawebdesign.com.br.
Responsável pela direção de arte do hotsite “High Definition é Gradiente”
(www.gradiente.com/highdefinition)
Analisando o portfólio de Andrezza, é possível per-
ceber uma forte ligação com a arte. Seria essa uma das
principais influências em seu processo de criação? “Acho
que tanto arte como design fazem parte de todos os meus
trabalhos. O que acontece é que, às vezes, eu utilizo alguns
conhecimentos adquiridos em arte para a minha produção
de design e vice-versa. Quando estou criando um trabalho
para web, sempre penso nele de forma espacial e com al-
gum tipo de narrativa. Talvez isso aconteça pelo fato dos
meus trabalhos de arte serem tridimensionais e em grande
parte efêmeros ou com algum tipo de interação com os
espaços e/ou público”.
Falando ainda sobre seu trabalho, ela procura esti-
mular seu processo de criação buscando diversas fontes
de informação. “Sempre começo vendo referências, re-
correndo a projetos, artistas e elementos que me impres-
sionaram de alguma forma. Depois, faço diversas leitu-
ras do briefing, planejamento e repasso todo o material
gráfico do cliente. Aí, é deixar as coisas cozinharem um
pouco na cabeça e procurar os estímulos certos para
desenvolver o trabalho”, afirma.
Uma lição valiosa que Andrezza aprendeu ao longo de
sua carreira de designer está na cuidadosa preparação do
portfólio. “Quando analiso um portfólio, procuro entender
o processo de construção dos trabalhos e a evolução de
um para outro, pois assim você consegue perceber o ritmo
e a velocidade do processo de aprendizagem da pessoa.
Também presto muita atenção na escolha das cores, fontes
e diagramação. Esses são os elementos fundamentais de
qualquer trabalho e é através deles que você percebe o que
o profissional realmente sabe fazer”.
 20 :: portfólio ilustração - Glauco Diogenes

Glauco Diogenes
www.glaucodiogenes.com.br
Wd :: Como define seu estilo e onde você busca as referências para o seu trabalho?
Glauco :: Acredito que a diferença do meu estilo de ilustração está exatamente em utilizar o computador ou o software como
instrumento de trabalho e não como linguagem ou razão do trabalho em si. Com isso, consegui desenvolver um trabalho que,
embora tenha uma estrutura relativamente simples, possui uma essência forte, possibilitando a atuação nos mais diversos tipos
de veículos e mercados, seja nas artes, design, editorial, televisão entre outros. A minha preocupação sempre foi a de desenvolver
um trabalho consistente e não um estilo de verão com prazo de validade determinado.

Filosofia de Boteco - Zapping / Zoomp (2006)

L a r D o c e L a r - P ro g r a m a C a l d e i r ã o d o H u c k ( 2 0 0 6 )

Materiais utilizados: “um

bom briefing, algumas fotos
(Google Images e/ou sites
d e ro y a l t y f re e ) , u m a b o a
dose de paciência, detalhes
q u e ‘ a p a re n t e m e n t e ’ n ã o s ã o
necessários e uma xícara de
café.”
 22 :: entrevista - padrões web

Padrões web,
uma barreira ou um caminho?
Ao longo dos últimos quatro anos, certamente você leu os mais diversos conteúdos falando

sobre as vantagens e os porquês para a adoção dos padrões web dentro dos processos de criação

e desenvolvimento de sites.

Passado este tempo, a Revista Webdesign pretende analisar como o mercado reagiu a tamanho

tsunami de informações. Os padrões se tornaram uma barreira ou um caminho no design para web?

Ninguém melhor para responder tal provocação do que o professor Everaldo Bechara, pós-graduado

pela COPPE/UFRJ e coordenador acadêmico do Centro de Treinamento iLearn (www.ilearn.com.br).


Wd :: Na edição de abril de 2005, abordamos as van-
tagens no uso dos padrões web. Neste ínterim, é possível
apontar um aumento na utilização desta metodologia?
Bechara :: Com certeza, mas bem menos expressivo
do que deveria ser, dado que é inevitável que passemos a
utilizar os padrões pelas inúmeras vantagens que sua uti-
lização oferece. É um trabalho diário de esclarecimento,
pois, apesar de termos vários profissionais utilizando e di-
vulgando os padrões, a grande maioria ainda permanece
com total ignorância sobre o assunto, resistindo a sua uti-
lização por total desconhecimento, utilizando argumentos
fracos e sem fundamento.
Para o mercado governamental, o aumento natural
foi impulsionado pelo decreto 5.296, de acessibilidade, o
que obriga, por força de lei, que sítios municipais, esta-
duais e federais se tornem acessíveis. Em análise feita em
sítios governamentais, encontramos incongruências com
relação aos padrões do W3C (www.w3c.org). Na verdade,
o equívoco é pensar que um projeto web acessível pode
começar pela própria acessibilidade, quando o correto é
começar um projeto acessível pela sua estrutura (X)HTML,
depois pelo CSS, seguido do Javascript Cross-Browser e
finalmente com questões específicas de acessibilidade,
atendendo assim as 65 recomendações do W3C e mais
questões de usabilidade referentes à acessibilidade.
Hoje, o grande problema com relação aos sítios do
governo é a falta de um órgão fiscalizador independente
e com experiência para avaliar se eles estão realmente
acessíveis, o que implica necessariamente em adoção
dos padrões web. Recente estudo divulgado pela ONU
revela que apenas 3% dos sites são acessíveis. Segundo
a pesquisa, a maioria dos sites não cumpre as normas
internacionais. O estudo detalha informações sobre 20
países, inclusive o Brasil.
Wd :: Nesta mesma edição, sobre o uso de sof-
tware para o desenvolvimento de sites dentro dos
entrevista - padrões web :: 23
padrões, você recomendava que os profissionais não
se prendessem a programas e aprendessem a gerar
os códigos através de digitação e “não somente aper-
tando botões ou arrastando elementos”. De lá para cá,
essa realidade mudou?
Bechara :: Não e acho difícil que mude em um curto
espaço de tempo. Os produtos WYSIWYG (“What You See
Is What You Get”), que geravam códigos automaticamente
através de uma interface interativa, sem o conhecimento
específico do (X)HTML e CSS, ainda não têm espaço neste
mercado, embora os esforços de produtos como Adobe
Dreamweaver ou Adobe GoLive e Microsoft Expression
Web Designer tenham avançado neste sentido, mas longe
do ideal. Fazer códigos “na mão” ainda é a forma mais in-
teligente de criarmos código com os padrões web.
Um bom profissional é aquele que conhece o con-
ceito, a teoria, os fundamentos. A ferramenta, como o
próprio nome diz, deve ser utilizada como ferramenta.
Uma ferramenta pode mudar, evoluir ou mesmo ser ul-
trapassada por outras ferramentas. Podemos até decidir
usar outra ferramenta. Os fundamentos não, servem
para qualquer ferramenta de hoje ou amanhã. Para um
produto A ou produto B. É como fazer uma faculdade ba-
seada em produtos e outra em fundamentos. É óbvio que
os fundamentos são mais importantes. Você não precisa
fazer uma faculdade para aprender ferramentas. É jogar
tempo e dinheiro fora.
Wd :: Em entrevista recente falando sobre os de-
safios na disseminação dos padrões, o especialista
Maurício Samy (www.maujor.com) alertava que “...en-
quanto um excelente designer estiver sendo solicitado
a codificar sua criação, um especialista em XHTML +
CSS tiver que criar o visual, um gênio do PHP tiver
a obrigação de escrever XHTML Strict, o processo
de aceitação e implementação dos ‘padrões web’ no
Brasil estará a passos de tartaruga”. Como você ana-
 24 :: entrevista - padrões web
lisa a utilização dos padrões entre os profissionais e
agências digitais no país?
Bechara :: Concordo com o Maurício quando ele diz
que o potencial de cada um deve ser aproveitado da melhor
forma - isto é o ideal. Entretanto, são poucas as empresas
hoje em dia que podem ter um excelente designer que faça
só a criação do site, pois, de acordo com o porte da em-
presa, muitas vezes não existe uma demanda de projetos
que justifique. Dessa forma, o web designer deve traçar seu
plano de carreira observando seus objetivos e seu potencial,
mas sem ignorar esta demanda do mercado.
Entendo que um web designer que hoje crie e de-
senvolva seus projetos adotando os padrões de forma
correta e que seja preocupado com usabilidade é um
profissional bem requisitado pelo mercado. O de-
senvolvedor PHP, ASP.net etc. é outro profissional, o
especialista em Flash é outro, 3D e assim por diante.
Apesar de ainda ser comum no mercado, entendo que
exigir que um mesmo profissional crie e programe em
uma linguagem de desenvolvimento não é recomendável,
pois é muito difícil ter um bom conhecimento de tudo.
Cabe lembrar, entretanto, que um profissional de desen-
volvimento web tem que conhecer os padrões.
Recentemente, fui júri de um evento corporativo na
web, onde agências digitais eram a maioria das empresas
inscritas no concurso. Fiquei impressionado como os pa-
drões web estão muito tímidos neste segmento. Analisei
sites que poderiam ter sido desenvolvidos com padrões
web sendo feitos em Flash. Acho que será muito difícil
um web designer que desenvolva dentro dos padrões con-
vencer um diretor de criação a não usar o Flash em um
hotsite, por exemplo, mas temos que ter, no mínimo, uma
alternativa acessível. É possível criar belas campanhas na
web também com o apoio dos padrões e dando um dife-
rencial positivo ao projeto.
Wd :: Na edição de agosto de 2005, promo-
vemos um debate sobre a existência ou não de limites
para a criação de sites seguindo os padrões. Você
acredita que um dos grandes obstáculos para a sua
disseminação seja o mito dos limites criativos que ele
supostamente traria para os designers?
Bechara :: Essa é uma pergunta que há anos me
fazem, mas como os padrões web ainda não estão po-
pularizados, esta pergunta ainda é muito pertinente.
Infelizmente, somente pensa desta forma quem nunca
teve o menor contato com os padrões web. Quem já
visitou o famoso e popular “css ZenGarden” (www.csszen-
garden.com), ou mesmo já tenha navegado por galerias
de sites em CSS como, por exemplo, o “CSS Mania” (www.
cssmania.com) ou o “CSS Beauty” (www.cssbeauty.com),
já teve a oportunidade e a certeza de que a adoção dos
 entrevista - padrões web :: 25

“Recente estudo divulgado a principal ferramenta para o seu desenvolvimento. Em

pela ONU revela que apenas
3% dos sites são acessíveis”
padrões web é inevitável. É a forma correta para o de-
senvolvimento de um projeto web e permite uma maior
liberdade de criação aos designers.
Podemos observar diversos sites cujos projetos
somente foram possíveis de serem elaborados com as
técnicas de layouts com CSS. Visitem a categoria de sites
com efeitos especiais (special effects) no “css ZenGarden”.
Procurem pelo projeto de nome “Killer Style”, do designer
Scott Kiekbusch. É um layout muito bem sacado, daqueles
“por que não pensei em fazer isso antes?” e que é
impossível de ser produzido se usássemos tabelas para
a criação do mesmo efeito visual. Esse é apenas um dos
exemplos para provarmos para quem ainda tem dúvidas em
adotar os padrões web em seu próximo projeto.
Cabe lembrar que os profissionais que estão iniciando
agora nesta profissão precisam, desde o seu início, aprender
a forma correta de desenvolver sites, caso contrário, estarão
aprendendo uma forma obsoleta de desenvolvimento.
Wd :: Atualmente, observamos a construção de
ambientes digitais que permitem um período de entre-
tenimento para os usuários, sendo que o Flash se tornou
relação ao uso dos padrões web, quando e como de-
vemos procurar desenvolver um site em Flash?
Bechara :: O Flash é uma tecnologia fantástica e até
então imbatível em sua categoria. O problema é que, em
muitas vezes, faz-se uso do Flash onde não é recomendado.
Quando devemos usá-lo? Acho praticamente impos-
sível convencermos uma equipe de marketing a trocar, em
um hotsite, o Flash pelo XHTML e CSS, considerando as
possibilidades de interação do Flash. Alguém já imaginou
aquele hotsite de uma cerveja (www.skolcopa.com.br),
onde uma morena chutava a bola para o gol, durante a
Copa do Mundo de 2006, sendo desenvolvido em XHTML
e CSS no lugar do Flash? Seria um problema sério para o
marketing. Temos que ser realistas.
O Flash existe e devemos usá-lo com cautela, sendo utili-
zado para questões bem específicas. Construir, por exemplo,
sites corporativos em Flash é, em minha opinião, altamente de-
saconselhável. Uma questão que é muito importante no Flash
e que devemos discutir é a acessibilidade. Acessibilidade em
Flash é complexa. Muitas vezes, pela interação na interface,
torna-se impossível sua implementação. Portanto, quando for
fundamental a utilização do Flash em seu projeto, procure for-
necer uma alternativa acessível.
Wd :: Dentre as principais recomendações do W3C,
quais delas estão sendo efetivamente adotadas pelos

OTIMIZE SUAS AÇÕES DE ENVIO DE E-MAIL.

Monitore seus resultados: saiba quem leu, que horas leu e onde clicou.

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.

www.easymailing.com.br tel. 55 51 3061.0636

 26 :: entrevista - padrões web
“A adoção dos padrões em dispositivos móveis também é uma
questão de cultura e convencimento”
profissionais e agências brasileiras?
Bechara :: Quando aplicadas, com certeza as re-
comendações são o (X)HTML e o CSS. A acessibilidade,
infelizmente, também é pouquíssimo adotada, cabendo
muitas vezes a um esforço pessoal do web designer ou do
implementador (client side). Lamentavelmente, algumas
campanhas podem estar investindo mais em consumo de
banda que o necessário, aumentando assim o custo do
projeto e deixando de lado uma parte do potencial pú-
blico-alvo da campanha, não contribuindo para a inclusão
digital e restringindo seu alcance.
As agências que atendem ao governo têm que se
capacitar para atender a área governamental, pois para
atender a um órgão do governo, as licitações já de-
veriam estar exigindo esta implementação, visto que
no dia 03/12/06 esgotou-se o prazo limite dado pelo
decreto 5.296 para que os órgãos do governo tenham
incluído em seus projetos web a acessibilidade, que é
uma das recomendações do W3C e que o governo bra-
sileiro adotou na íntegra.
Essa exigência, em licitações públicas, abrange qual-
quer tecnologia que leva a informação a web, ou seja,
qualquer empresa, de qualquer ramo de atividade que
desenvolve projetos para web, tem, por força da lei, que
entregar seus projetos acessíveis. Por sua vez, os órgãos
do governo têm que saber aferir o que está sendo ou o que
já foi entregue com essa exigência. A não aferição trará
conseqüentemente problemas aos órgãos contratantes,
pois a sociedade cobrará essas funcionalidades.
Wd :: No blog FatorW (http://tinyurl.com/ydquku), o
especialista Walmar Andrade levantou uma questão inte-
ressante, envolvendo o valor de projetos desenvolvidos
através dos padrões. Alguns opinaram que a cobrança de-
veria ser mais cara, pois tal conhecimento garantiria um
diferencial na prestação dos serviços; outros rechaçaram a
idéia, apontando, por exemplo, que o tempo de produção,
seguindo tal metodologia, seria reduzido significativa-
mente. Diante de sua experiência, qual desses caminhos
deve ser adotado pelos profissionais e agências?
Bechara :: Desenvolver dentro dos padrões web
é a forma natural e obviamente a forma correta de de-
senvolvermos projetos. Quem desenvolve dentro dos
padrões não pode cobrar um valor maior ou menor
por isso, pois essa é a forma. O valor tem que ser co-
brado de forma justa. O reconhecimento por trabalhar
correto vem por outros caminhos. A satisfação, a reco-
mendação, novos projetos etc. Quem desenvolve fora
dos padrões é quem está errado e por isso, se o con-
tratante tivesse o conhecimento das vantagens dos
padrões do W3C, nem iria contratá-lo. Na verdade, en-
tretanto, o contratante nem deveria se preocupar com
esses detalhes. Compete ao contratante direcionar
seus esforços ao foco de seu negócio e ao designer/
desenvolvedor servi-lo da forma correta.
Atualmente, as agências que desenvolvem pro-
jetos segundo os padrões, devido ao número reduzido
de profissionais devidamente capacitados, podem estar
cobrando um valor maior pelos seus projetos em virtude
da escassez deste profissional diferenciado. Com re-
lação especificamente a um projeto com acessibilidade,
pelo fato de termos o envolvimento de profissionais com
deficiência durante o desenvolvimento/avaliação, natu-
ralmente a quantidade de horas para esse projeto
serão maiores e por conseqüência acarretarão
um acréscimo ao valor do projeto.
Wd :: Nos últimos dois anos, o movimento
Web 2.0 recebeu grande atenção por parte da
mídia especializada e gerou acalorados de-
bates sobre os rumos da web. Diante deste
cenário, de que forma as reco-
 entrevista - padrões web :: 27

mendações do W3C se encaixam dentro dos “ideais”

propagados pela Web 2.0? Dicas de leitura
Bechara :: Essas questões estão sendo levantadas
pelo W3C no PFWG (Protocols and Formats Working - Beginning CSS: Cascading Style Sheets for Web
Group), ou seja, a adoção de plataformas ricas dentro Design
dos padrões. O termo Web 2.0 não significa nada a Autor: Richard York
mais do que já fizemos até hoje. O fato de estarmos Editora: Wrox
mais preocupados com os usuários, chamando-os
- Building Accessible Websites
para nossas aplicações ou usando tecnologias mais
Autor: Joe Clark
modernas não deveria ter número de versão. Diga-se de
Editora: New Riders Press
passagem, não vejo absolutamente nada de mirabolante
na chamada Web 2.0. Se analisarmos a usabilidade e a - CSS Mastery: Advanced Web Standards Solu-
adoção da melhor tecnologia para o projeto contratado, tions
encontraremos, na verdade, uma Web 0.2. Nem chegamos Autores: Andy Budd, Cameron Moll e Simon
ainda a Web 1.0. Ainda temos muito para evoluir, mas isso Collison
é assunto longo. A Web 2.0 só está servindo hoje como Editora: APress
marketing e muitos se aproveitam disso.
Wd :: Em breve, a Microsoft vai lançar no mercado - Designing with Web Standards (2ª edição)

a versão 7 do Internet Explorer (IE). Dentre as novi- Autor: Jeffrey Zeldman

dades, a empresa promete melhorar a interpretação Editora: New Riders Press

do CSS em seu navegador (http://tinyurl.com/9wev8).

- Web Standards Solutions: The Markup and
Você acredita que a nova versão vai ajudar na dissemi-
Style Handbook
nação dos padrões web?
Autor: Dan Caderholm
Bechara :: Com o lançamento do IE 7, a Microsoft
Editora: friends of ED
tenta dar uma virada na direção da utilização dos pa-
Fonte: Professor Bechara
drões, visto que estava perdendo terreno para o seu
maior rival, o Firefox. Acreditamos que a Microsoft tenha
percebido o poder do usuário e está procurando atendê-
lo da melhor forma possível.
 28 :: entrevista - padrões web
O IE 7 é uma prova deste comprometimento, com
uma evolução em relação à versão 6. Gostaríamos de ver
o IE concorrendo lado-a-lado com o Firefox, pois desta
forma todos nós estaríamos ganhando, mas isso ainda vai
demorar. Esperamos também que a Microsoft não leve
tanto tempo para lançar o IE 8, como levou para lançar o IE
7. Parece-me que o tempo de testes/avaliação foi pouco e
algumas questões de incompatibilidade estão começando
a aparecer. Não acredito que, pelo fato de o IE 7 ter sido
lançado, teremos um incremento na disseminação dos pa-
drões web, mas conseqüentemente os desenvolvedores
estarão mais bem servidos. Agora é ver a fatia de mercado
que o IE 7 irá assumir, para termos uma previsão de utili-
zação de técnicas já possíveis para os dois navegadores.
Wd :: Cada vez mais os sites são desenvolvidos de
maneira dinâmica, exigindo uma atualização constante
por parte de quem administra tal ambiente. Diante
deste dinamismo, existe algum tipo de recomendação
quanto ao período para que o site seja revisado em
relação à conformidade com os padrões web?
Bechara :: A conformidade com os padrões web
em projetos, dinâmicos ou não, se faz em todos os
momentos. Um site dinâmico é mais complexo, pois
depende de mais cuidados em todas as etapas de inclusão
de conteúdo. É de fundamental importância
“Um bom profissional é aquele
que conhece o conceito, a
teoria, os fundamentos”
que toda a equipe envolvida (técnicos e conteudistas) na
construção e na manutenção de um site dinâmico dentro
dos padrões seja treinada.
Wd :: A rápida expansão das tecnologias móveis
promete abrir um novo mercado para quem trabalha
com a criação e o desenvolvimento para mídias in-
terativas. Além disso, o W3C criou o “Mobile Web
Best Practices 1.0” (http://tinyurl.com/r2rcl), no qual
aponta as melhores práticas para desenvolvimento
web voltado para dispositivos móveis. Podemos
afirmar que o uso de padrões nestes ambientes será
mais facilmente adotado?
Bechara :: Assim como a adoção dos padrões em sites
web, a adoção destes padrões em dispositivos móveis
também é uma questão de cultura e convencimento.
Como esta área é tradicionalmente mais nova que o
desenvolvimento de sites e com profissionais, a princípio
mais antenados em tecnologia, acredito que seja mais
fácil sua implementação. Mas, depende de um trabalho de
convencimento e conscientização do profissional.
30 :: gestalt
 gestalt :: 31

“Gestalt é a gramática subliminar da Influências na percepção visual

Antes de abordarmos os aspectos que envolvem as
alfabetização visual” (Luli Radfahrer)
leis da Gestalt, é preciso entender quais fatores influen-
ciam na percepção visual da forma em um projeto gráfico.
Você acorda, abre a janela de seu quarto e se depa-
“As influências são diversas e dependem do tipo e da
raccom o dia amanhecendo. De imediato, avista um
natureza do projeto gráfico e da natureza, tipo e intenção
grande plano pintado de cores azuis, contrastando com
da mensagem. No entanto, aqui vão alguns parâmetros
vários blocos de nuvens brancas, que mais parecem gran-
básicos: adequado posicionamento dos elementos visuais
des e apetitosos algodões-doces. Cachorro, borboleta,
no gride da diagramação (texto, imagens, vinhetas, cai-
rinoceronte e girafa. Isso porque, depois da percepção
xas, blocos etc.) no espaço compositivo; adequado con-
do todo, você mira sua visão nas nuvens e começa a defi-
traste de cores (ou das nuanças e tons do preto e branco)
nir em sua mente quais representações aqueles objetos
entre os objetos da diagramação; adequação das famí-
podem formar no céu.
lias tipográficas: tipo, tamanho, cor; aspectos relativos
A passagem acima serve como um bom exemplo da
à legibilidade, acuidade visual (ergonomia), e assim por
maneira como funciona a nossa percepção visual, além de
diante”, diz o professor João Gomes Filho.
demonstrar a importância de se trabalhar os detalhes de um
Como exemplo prático deste cenário, Luli exercita
projeto gráfico para que a transmissão da informação não
nossa imaginação, citando o exato momento no qual
seja prejudicada. Mas onde encontrar embasamento concei-
entramos em um restaurante. “Sabe aquela impressão
tual para alcançarmos tal objetivo? Segundo o livro “Gestalt
de ‘sujo’, ‘opressivo’, ‘suspeito’ ou ‘descolado’ que você
do Objeto”, do professor João Gomes Filho, os estudos e as
tem, mas é incapaz de definir o porquê? Pois é exata-
experiências realizadas pela Escola Gestalt, no campo da Psi-
mente essa ‘impressão’ que um usuário tem de uma
cologia Perceptual da Forma, são um bom caminho para se
página. Ele não dá a mínima para cores ou acabamento,
construir e justificar as bases de qualquer projeto.
mas fica com uma primeira impressão que é muito difí-
“Gestalt é tudo. Ela é a gramática subliminar da alfa-
cil de mudar. Por isso que arquitetos e designers são
betização visual. Ao se compreender e praticar seus princí-
tão obcecados por detalhes: eles são treinados para ver
pios, o designer passa a entender de forma abrangente e
e analisar aquelas partes que, quando somadas, dão um
completa como funciona a percepção no cérebro humano,
resultado muito maior que cada componente individual”.
e, conseqüentemente, no de seu usuário. Não faz o menor
Além disso, não podemos esquecer que o desig-
sentido ser expert em Flash, ActionScript, CSS e usabili-
ner do século XXI trabalha com ambientes simulados, o
dade enquanto se é analfabeto em visualização. Quando
que certamente traz uma série de questionamentos se
isso acontece (e isso acontece quase sempre, o contrário
formos comparar com a maneira como interpretamos
é que é raro) o que se tem é um website cheio de tru-
um objeto dentro de um espaço físico. “Basicamente,
ques que piscam e pulam, mas que deixa uma impressão
muda tudo: o suporte, o brilho, a posição da página, o
geral de algo mal-acabado, técnico, feio etc.”, afirma Luli
ambiente... Como se não bastasse, o objeto gráfico é
Radfahrer, professor-doutor da ECA-USP.
estático, enquanto o interativo é uma máquina funcional,
“Um projeto gráfico pode provocar todos os cinco
que demanda certos comandos para dar as respostas cer-
sentidos. A teoria da Gestalt apresenta hipóteses sobre
tas. Livros têm uma usabilidade pré-determinada e imu-
as manifestações da forma em diversos meios de mani-
tável. Quando criança, você aprende a virar as páginas
festação sensorial. No que diz respeito às artes visuais,
e segurá-lo pelas bordas. Até o fim da vida, essa relação
podemos apontar princípios básicos imprescindíveis: pro-
não muda. Compare isso com um game ou celular, por
ximidade, semelhança, pregnância, continuidade, fecha-
exemplo”, argumenta Luli.
mento, agrupamento, experiência...”, completa Lucas
Para Lucas Hirata, a grande diferença está na provo-
Hirata, designer da Globo.com. A seguir, confira como
cação que cada um dos ambientes (físico e virtual) causa
esse campo do conhecimento pode ajudar no trabalho de
em nossos sentidos. “Projetos digitais podem provocar
criação e desenvolvimento de sites.
 32 :: gestalt
“O designer deve se preocupar com a
relevância das partes e como a composição
irá afetar o cérebro do receptor”
(Lucas Hirata)
nossos olhos e ouvidos de maneira realmente impactante.
Projetos impressos podem também ser comidos, cheira-
dos e manipulados. O chocolate ‘SURPRESA’, da Nestlé, é
um exemplo clássico. Como a percepção visual está dire-
tamente ligada à vivência de cada um de nós, todas as
nossas experiências sensoriais (táteis, olfativas, visuais,
auditivas e gustativas) modificam a maneira como vemos
e interpretamos as imagens. Para os nossos olhos, as dife-
renças dos sistemas de cores provocam percepções dife-
rentes nos dois universos. No mundo digital, as cores são
luzes emanadas de dispositivos eletrônicos. Em impres-
sos, as cores são resultados das diversas luzes refletidas
no ambiente onde o produto se encontra”, analisa.
O que se vê não é o que se percebe?
No livro “Gestalt do Objeto”, o professor João
Gomes Filho aponta que um dos princípios básicos da
Gestalt diz que o fenômeno da percepção que acontece
no cérebro não é idêntico ao que ocorre na retina. Dessa
forma, nossa primeira sensação seria global e unificada,
ou seja, não vemos partes isoladas, mas sensações. “A
definição é precisa e corretíssima: o que se vê não é o
que se percebe. Da mesma forma que no exemplo do
restaurante ‘vagabundo’ não é um elemento isolado que
traz o conceito, mas seu conjunto. É por isso que certas
combinações de cores ou roupas que caem muito bem em
certas pessoas são um horror em outras. A velha história
do ‘estilo’ contra a pura e simples falta de noção. No pri-
meiro caso, se acerta sempre. No último, cedo ou tarde
a festa acaba. A figura e o fundo se alternam na mente
de um usuário. Experimente olhar para a sua mão e para
a parede atrás dela e o mundo real se torna muito menos
estático do que parece”, diz Luli Radfahrer.
Sobre esta questão, José Ricardo Cereja, coorde-
nador pedagógico da graduação em Design Gráfico do
Instituto Infnet e professor de Computação Gráfica da
PUC-Rio, ressalta que, em ambientes interativos, a dinâ-
mica visual estabelece uma relação “tempo versus per-
cepção” que influencia na apreensão das imagens. “Isto
é, o tempo de observação que o usuário dedica a uma
interface pode ser controlado tanto pelo designer que a
projetou, através da composição de elementos e arqui-
tetura de navegação, quanto pela velocidade com que a
ação do usuário é realizada. Temos ainda as ações moto-
ras controlando o tempo de ação e fazendo mudar todo
o aparato visual em segundos. Isto vai influenciar dire-
tamente a disposição das imagens, fundos, animações,
inclusive, no ambiente interativo”.
Diante disso, um dos principais desafios é trabalhar
o princípio “figura-fundo” na internet, que se caracteriza
pelo dinamismo e pela interatividade. “O designer deve
se preocupar com a relevância das partes e como a com-
posição irá afetar o cérebro do receptor que ele almeja
atingir. O importante é ter o bom senso para distinguir
o que será figura e o que será fundo para cada receptor.
Cores e formas, por exemplo, podem ter significados dife-
rentes para as pessoas. Cabe ao designer construir uma
linguagem visual capaz de comunicar objetiva e precisa-
mente seu conteúdo”, explica Lucas Hirata.

Como trabalhar a organização visual?
Quando analisamos a organização visual de um pro-
jeto, certamente aplicaremos outra lei da Gestalt: a preg-
nância da forma, cujo significado passa pela maneira como
trabalhamos a organização visual da forma de um objeto.
“Em primeiro lugar, quero dizer que pregnância está
longe de significar excesso ou repetição! Uma boa preg-
nância em um site significa associar os diversos elemen-
tos que compõem uma página a padrões que os identifi-
quem mutuamente (cor que lhes dê identidade, padrões
de formas e acabamento das mesmas, tipos e resolução
semelhante das imagens, uso restrito de famílias de fon-
tes etc.)”, orienta Cereja.
Nesta discussão, o professor cita a relação entre a
navegação entre páginas e a fixação da imagem na memó-
ria. “Ou seja, ao passar de uma página para a outra em
um site, fica um registro do que se viu antes, na memó-
ria, mas por um curto período de tempo, já que as novas
informações visuais substituirão as primeiras. Portanto, o
que vai garantir que o usuário sinta e perceba o mesmo
ambiente serão estes padrões determinados pela uni-
dade visual entre os elementos. Podemos citar o Portal da
Petrobras (www.petrobras.com.br) como um bom exemplo
no uso deste conceito”.
Dessa forma, na busca pela pregnância, o segredo
é combinar a coerência no uso dos elementos com uma
pitada de criatividade. “Cores e formas simples são mais
facilmente identificadas e armazenadas pelo cérebro
humano. Mas, em contrapartida, não provocam impacto
gestalt :: 33
e não apresentam diferenciais. O caminho é desenvolver
interfaces com capacidade de pregnância rápida, mas que
consigam ao mesmo tempo um grau particular de criativi-
dade”, reforça Lucas.
“O cérebro é uma máquina fascinante. Ele se entedia
quando uma organização é tediosa ou previsível, se inte-
ressa por estruturas estimulantes que dão acesso a regras
desconhecidas e se irrita profundamente com o caos. As
características básicas da boa pregnância são pratica-
mente as mesmas de uma pessoa interessante: o inusi-
tado, diferente da pasmaceira do normal, mas, acima de
tudo, coerente. Considere as pessoas que você conhece:
é preferível conversar com um artista que com um buro-
crata. No entanto, essa preferência só se manterá se o
artista for coerente e consistente em seus argumentos,
não um psicopata metido à prima-dona”, acrescenta Luli.
Além da pregnância, dois conceitos são considera-
dos elementares para se atingir a plenitude em termos de
organização visual: proximidade e semelhança. “Uma vez
que a proximidade significa perceber objetos próximos
como grupos independentes (nosso sistema óptico tende
a agrupar visualmente elementos próximos) e que a seme-
lhança trata destes agrupamentos a partir de objetos de
formas similares, então se pode dizer que, ao desenvol-
ver um site, é possível definir os elementos que guardam
entre si formas semelhantes e que podem ser agrupados,
próximos uns aos outros, a fim de formarem um conjunto
bem distribuído de informações”, relata Cereja.
Na prática, diz Luli, lembre-se sempre como trabalha-
 34 :: gestalt
mos estes conhecimentos no mundo físico. “Em um super-
mercado, os sacos de arroz ficam juntos. Em uma festa,
namorados ficam juntos. Coisas de categorias próximas
devem se agrupar ou darão ao usuário um desconforto, que
tende a crescer quanto maior for à distância”, exemplifica.
Na busca pela fluidez visual
Atingir uma fluidez visual é considerado um dos prin-
cipais desafios na criação de uma interface digital. Para
isso, vamos recorrer a mais uma das leis da Gestalt, que
fala sobre continuidade. No livro “Gestalt do Objeto”,
ficamos sabendo que uma boa continuidade “é a impres-
são visual de como as partes se sucedem através da orga-
nização perceptiva da forma de modo coerente, sem quebras
ou interrupções na sua trajetória ou na sua fluidez visual”.
Então, a pergunta que fica é: como trabalhar este
conceito na web? “A fluidez se consegue com a transmis-
são simples e direta da informação. O que implica tam-
bém na simplicidade e objetividade na composição dos
elementos visuais, sejam imagens, desenhos, fotos ou ani-
mações. A continuidade em um site se dá a partir da pri-
meira apresentação ao usuário de padrões que atendam
confortavelmente a sua percepção visual”, orienta Cereja.
Ou seja, o professor recomenda que sejam evitados
vários elementos em uma mesma interface. “Excesso de
texto, barras de rolagem intermináveis, mistura de cores,
áreas claras em contraste direto com áreas escuras, cores
pastéis em excesso, animações piscantes e frenéticas cau-
sam uma verdadeira esquizofrenia visual, expulsando o
usuário daquele lugar virtual”.
Além disso, traçar previamente o perfil do público-
alvo pode ser um bom atalho para garantir a continui-
dade da leitura visual dentro de um site. “A continuidade
depende muito da experiência de vida do usuário. Pode-
mos dizer que a interpretação de imagens está tão ligada
ao histórico de vida do mesmo, quanto às suas habilida-
des visuais. O conhecimento prévio do perfil do usuário
predominante é um caminho para o desenvolvimento coe-
rente de um site. Lógico que é humanamente impossível
uma definição 100% precisa. Mas testes de usabilidade e
grupos focais são caminhos seguros para nortear grandes
projetos”, ressalta Lucas.
Evitando os erros mais comuns
Nada melhor do que aprender com os erros para
aperfeiçoar a prática. Levando em consideração as leis da
Gestalt, a primeira falha observada na criação e no desen-
volvimento de um site envolve o descaso pelas experiên-
cias passadas. “Elas auxiliam a navegação em sites. Nor-
malmente, os usuários reproduzem padrões de comporta-

mento em sites diferentes”, aponta Lucas.
Outro aspecto a ser considerado está na construção
da unidade de um projeto. “Todos se resumem a um só,
quando se conhece bem a Gestalt: o agrupamento de
partes sem levar em consideração o todo. Isso leva a uma
confusão visual sem unidade, que permite ao olho trei-
nado a identificação imediata de um trabalho profissional
de um amador, por melhor que seja o último. Clientes não
têm esse olho treinado, por isso tendem a valorizar idioti-
ces como o preço e depois quebrar a cara. De que adianta
comprar um vinho mais barato só para descobrir que sua
qualidade é um lixo?”, questiona Luli.
“A fluidez visual se consegue com
a transmissão simples e direta da
informação” (José Cereja)
Segundo o professor Cereja, vamos encontrar expli-
cação para a perpetuação deste tipo de erro, através de
uma única palavra: excesso. “Excesso de imagens, excesso
de fontes, excesso de animações, excesso de cores e, ulti-
mamente, excesso de áudio. Há um desequilíbrio na apli-
cação das leis da Gestalt. Principalmente porque é muito
difícil, mas não impossível, contemplar todas. A questão
é o quanto o designer consegue negociar com seu pró-
prio conhecimento, ou seja, o quanto está disposto a
aplicar um pouco de cada lei da Gestalt a fim de simpli-
ficar o resultado. Em geral, os designers tendem a ver no
ambiente virtual a oportunidade de exercitar livremente
toda a sua habilidade estética e tecnológica e aí jogam
toda a sorte de elementos visuais dentro da página”.
Assim, para evitar que tal prática continue aconte-
cendo, o especialista afirma que o investimento em pla-
nejamento vai ajudar a garantir o sucesso de um site. “Em
geral, os erros estão aí, no início do processo. Planeja-se
mal ou quase nunca se planeja e o resultado vai sendo um
acúmulo de erros. É importante planejar. Nesta fase, se
pode então considerar todas as leis da Gestalt e observar
a melhor forma de compor elementos, organizar a infor-
mação, que tecnologia utilizar, quais as necessidades de
comunicação etc.”.
gestalt :: 35
Análise acadêmica da Gestalt
Bate-papo: João de Souza Leite, professor da
ESDI e da PUC-Rio
Como aplicar conceitos formulados sob o
prisma do século XX em mundo marcado atualmente
pelas transformações tecnológicas? Nesta entre-
vista, o professor João Leite analisa os principais
aspectos conceituais envolvendo a utilização das leis
da Gestalt no design para web. Boa leitura!
Wd :: O que devemos considerar na hora de
trabalhar a percepção visual da forma em um pro-
jeto gráfico?
Leite :: No mundo contemporâneo, as caracte-
rísticas do sujeito se afastaram de uma concepção onde
a estabilidade do ponto de visão ou de ação desempe-
nhava papel central. Por outro lado, suas características
passaram a se confundir, circunstancialmente, com as
características do objeto.
Ao utilizar essa oposição clássica da filosofia
entre sujeito e objeto, o que quero dizer é que o
observador deixou de ser concebido como um ser
estável, sempre em razoável contraste com o objeto
da sua observação. Assim, pode-se afirmar não ser
mais possível determinar regras gerais capazes de
resolver este tipo de questão em um modo absoluto.
Os fatores são vários, diferentes em suas categorias
e existem sempre em relação ao contexto em que
se dá a exposição do projeto, em que se dá a comu-
nicação. Laços da cultura interferem no processo
assim como laços de afeto, estes então, promovidos
pelas lógicas as mais diversas.
Para enumerá-los, deveríamos iniciar pelos cri-
térios mais básicos, ou seja, aqueles que permitem
que a forma adquira certo destaque do contexto.
Em seguida, devemos nos perguntar a respeito das
possibilidades de leitura por parte daqueles a quem
nos dirigimos. Em que medida sou capaz de ler uma
imagem de modo diferente de um outro ser? O
que condiciona o meu aparato de leitura (entenda-
se, também, leitura de imagens) e observação, que
é diferente de um indivíduo pertencente a outro
grupo social e cultural?
 36 :: gestalt
Wd :: A teoria da Gestalt trabalha muito em cima
dos conceitos de objeto e de forma. Quando trazemos
esta realidade para a internet, como definir os termos
“forma” e “objeto” dentro do design para web?
Leite :: Na medida em que tendemos, nós os humanos,
a relacionar os objetos segundo algum tipo de padrão, esta
atitude pode ser definida como uma busca pela forma, ou
como vontade de forma. Penso, sem o propósito de esta-
belecer definições absolutas, já que me baseio sobretudo
em minha própria experiência de observador e fazedor de
coisas, que deveríamos buscar nosso entendimento a res-
peito da palavra estrutura, qualquer tipo de estrutura em
um determinado campo. E quando digo qualquer, quero me
referir exatamente a esta qualidade por vezes indecifrável
de certas estruturas - certos modos de organização que não
se oferecem claramente à nossa percepção, mas que nem
por isso deixam de ser estruturas.
Pois bem, nesse sentido, lidamos constantemente com
objetos agrupados segundo determinados padrões, pode-
mos pensar em unidades e modos de relação entre essas
unidades. Ou seja, lidamos com elementos visuais, sejam
imagens ou letras, e suas relações de semelhança e apro-
ximação, oposição e ruptura, estabelecidas no design. Na
medida em que o reconhecimento dessas unidades e das
suas relações se torna mais consciente, mais objetivamente
lidamos com a forma.
Wd :: Falando em organização visual, dois conceitos
podem ajudar a trabalhar esta questão: proximidade e
semelhança. De que forma estes conceitos devem ser tra-
balhados em um site?
Leite :: Na verdade, tenho minhas dúvidas se o con-
ceito de proximidade deva ser tomado em termos de distri-
buição no espaço. Se for possível considerar que o espaço
da vida anseia pela ordem, isto implica na percepção da
diferença e da semelhança como conceitos básicos. Se, para
o homem comum interessa a ordem, e esta pode lhe facili-
tar a vida, então é possível entender a idéia de organização
visual através desses dois conceitos. Entenderemos ordem
visual no sentido em que as características formais dos mais
variados elementos sejam organizadas segundo categorias
relativamente reconhecíveis.
O conhecimento, esta velha questão filosófica, se dá
na medida em que conseguimos agrupar diferentes coisas,
segundo determinados aspectos ordenadores que, por fim,
dão forma a categorias. Estas categorias visuais, portanto,
se estabelecem segundo os instrumentos
de que dispomos, e quais são eles? Valores
tipográficos, valores cromáticos, disposição e
ordenamento.
No cenário da internet, nos defrontamos com uma
infinidade de problemas de comunicação, justamente em
função da proliferação dos públicos e das intenções. Para
todos os efeitos, não existem regras absolutas, torno a
dizer. Digamos, um site de compras difere radicalmente de
um site educativo, ou ainda, de um site com fins de uma
determinada agregação social. E cada tipo demanda solu-
ções adequadas e específicas. Mas seria possível afirmar,
com toda certeza, que a habilidade da boa e adequada
construção de um site passa pela capacidade de conferir
valores de forma a diferentes categorias de informação.
Wd :: Quais características marcam a percepção
visual quando analisamos a oposição entre o objeto físico
impresso e o espaço virtual gerado pelo ambiente digital?
Leite :: Um objeto impresso é manipulável fisicamente,
e possui uma concretude em princípio imutável, enquanto
o projeto digital estabelece outro tipo de relação com o
observador, que se define como transformador do próprio
projeto. No primeiro, revelam-se dimensões como o tempo
e o tato, na medida em que a manipulação do objeto per-
mite idas e vindas sob total controle do observador. Já no
segundo, digo, no espaço virtual, é possível explodir nossa
concepção euclideana de espaço. Dimensões que não se
expressam pela simulação da realidade através da perspec-
tiva, mas sim em uma simultaneidade de planos, oferecem
novos problemas à percepção.
Mas a diferença que mais salta aos olhos é a capaci-
dade de nós, como observadores, estarmos constante-
mente alterando o objeto digital. No espaço virtual da rede,
estabelecemos caminhos e ligações quase em uma medida
pessoal, já que os trajetos percorridos não são necessaria-
mente iguais para todos. Portanto, no projeto digital nos
defrontamos com um receptor da informação que é clara-
mente um agente ativo neste processo de comunicação.
 gestalt :: 37

Biblioteca da Gestalt

- Arte e Percepção Visual

Autor: Rudolf Arnhein
Editora: Pioneira

- Como a mente funciona

Autor: Steve Pinker
Editora: Cia. das Letras

- Forma e percepção estética

Autor: Mário Pedrosa
Editora: EdUSP

- Gestalt do Objeto
Autor: João Gomes Filho
Editora: Escrituras

- Making and Breaking the Grid

Autor: Timothy Samara
Editora: Rockport Publishers

- Modos de ver
Autor: John Berger
Editora: Rocco

- O instinto da Linguagem
Autor: Steve Pinker
Editora: Martins Fontes

- O poder do centro
Autor: Rudolf Arnheim
Editora: Edições 70

- Sintaxe da Linguagem Visual

Autor: Donis Dondis
Editora: Martins Fontes

- Visual and attention

Autores: Lawrence Harris e Michale Jenkin
Editora: Universidade de Toronto

Fontes: João Leite,

José Cereja e Lucas Hirata
38 :: debate - ultrapasse os limites

ULTRAPASSE OS LIMITES,
DANDO ASAS À IMAGINAÇÃO
Baixa capacidade de acesso à internet no país, clientes sem conhecimento prévio sobre o

meio, prazos apertados. Se você for fazer uma enquete entre os profissionais sobre os limites que

envolvem os processos criativos na web, estas serão algumas das alegações mais comuns.

O tema sempre foi polêmico. Em 2001, na última edição do Design de Bolso (http://

tinyurl.com/yltjmc), finado e histórico fanzine criado pela dupla Elesbão e Haroldinho, existiam

as seguintes provocações: “As limitações são da rede ou do designer? O problema está na

velocidade de conexão ou na capacidade de criação?”.

Tempos depois, a Revista Webdesign decidiu retomar este debate para descobrir quais

seriam atualmente as principais limitações no design para web e as formas para

vencer esses desafios. Confira a seguir.

 debate - ultrapasse os limites :: 39

:: Marcelo Mariano
Diretor de Arte da AgênciaClick
www.marcelomariano.com

“A principal limitação está na dispa-

ridade entre os recursos existentes e as
verdadeiras condições do usuário brasileiro.
O conflito entre o potencial tecnológico e ar-
tístico versus a diversidade de resoluções de tela,
velocidade de conexões, versões de plug-in e capacidade
de processamento das máquinas acabam influenciando di-
retamente no processo criativo.
O designer tem seu trabalho reduzido a determinadas
regras, que geralmente se baseiam na menor resolução, na “A principal limitação está na
pior conexão e assim por diante, privando o restante dos disparidade entre os recursos
usuários de uma experiência mais rica e atraente.
existentes e as verdadeiras
Talvez por isso, no mercado brasileiro, com algumas
exceções, é comum dispensar do processo criativo uma condições do usuário brasileiro”
produção fotográfica de qualidade ou investimentos
específicos em produção de áudio e vídeo. O designer,
muitas vezes, precisa trabalhar com o pouco material que
dispõe, que, na maioria dos casos, são provenientes de
outro tipo de mídia ou de pouca qualidade, obtido através
da própria internet.
Acredito, entretanto, que esses fatores, apesar de
imporem limites, fazem do design para web uma busca
constante pela superação criativa, tornando este processo
cada dia mais interessante.”
 40 :: debate - ultrapasse os limites

“Assim como em suas demais modalidades, na web o

design tem dois limitadores principais: fatores técnicos e com-
:: Dado Queiroz
Designer gráfico e sócio-fundador do estudioCrop
portamentais. Tecnicamente, quesitos como largura de banda
www.estudiocrop.com.br e resolução de tela são fortes inimigos da liberdade formal
e de conteúdo. O LCD, a princípio, piora a situação, pois a
maioria dos modelos atuais tem dot pitches (a grosso modo,
o tamanho do pixel) superiores aos dos monitores CRT. Assim,
“Cada profissional deve tentar menos pixels cabem na tela, e mais “serrilhadas” ficam as ima-
alinhar seu comportamento ao de gens e os textos. Já a largura de banda foi um limitador mais
crítico no passado, mas ainda faz com que ferramentas como
seu cliente, visando mais liberdade
vídeos e animações sejam escolhas arriscadas.
para realizar seu potencial” Felizmente, estas questões são constantes e signifi-
cativamente melhoradas - ao contrário dos fatores com-
portamentais, dos quais não se pode dizer o mesmo. O
desconhecimento e a insegurança do cliente, somados à
impaciência e fragilidade financeira do profissional, cos-
tumam gerar catástrofes criativas.
Se a autoridade do cliente passa da conta, sua inseguran-
ça transparece no projeto, através do medo da transgressão e
da busca pelo refúgio daquilo que é conhecido e aceito. Isso
leva ao desgosto do profissional que, por outro lado, muitas
vezes não tem paciência, coragem ou mesmo força de vontade
para defender racionalmente sua visão.
Ao contrário das limitações técnicas, as comporta-
mentais são muito improváveis de se modificar sistemati-
camente. Cabe então a cada profissional tentar alinhar seu
comportamento ao de seu cliente, visando mais liberdade
para realizar seu potencial.”
 debate - ultrapasse os limites :: 41

sky is the limit” (O céu é o limite). Daí, você chega no céu

e cai sem o pára-quedas, porque alguém não no alto posto
:: Adhemas Batista da empresa não aprova, ou porque o céu estava meio
Designer Director na Hello Design
www.adhemas.com
escuro, chuvoso e não dá para implementar a idéia no
prazo necessário. Mas é bom enfatizar, são casos e casos,
“Para quem vivenciou o início da internet, tivemos não dá para colocar como uma limitação generalizada.
muitas limitações para se criar um website: as ferramentas Tirando os casos à parte, estou cada vez mais feliz de
eram pobres, a leitura dos browsers era muito simples e trabalhar com design para websites. Vejo clientes com a
confusa, cada um fazia a sua maneira, os programas de mente mais aberta, engajada e querendo ter uma imagem
edição de HTML não se entendiam e as linguagens de melhor na rede, explorando mais as possibilidades e
programação não eram muito felizes nas soluções para tentando buscar ou manter-se na liderança. É um ciclo bom
integrar interface visual com as funcionalidades. que traz o céu mais para perto da gente e deixa os limites
Não podemos esquecer também as limitações que menores, arriscando em novas possibilidades. Muitos
fazem parte do ofício, mas que variam, por exemplo, deles querem ter um alcance internacional, coisa que não
de cliente para cliente: um tem material, outro não tem; se via há pouco tempo, querem que a divulgação seja em
um possui orçamento apertado ou não tem verba. Já nível internacional e assim estão de verdade explorando
aconteceram muitas vezes de clientes pedirem para fazer o real potencial da internet, que é reduzir as distâncias e
um tipo de trabalho explorando as melhores possibilidades facilitar a vida das pessoas e empresas.”
da web. Foram horas pensando, muitas outras trabalhadas,
muitas xícaras de café e, no final, o que era uma para ser
uma casa com suítes, sala de jantar, sala de estar, garagem
e playground, virou a casinha do cachorro e sem o cachorro
dentro, só faltou colocar a plaquinha, cuidado com o
cachorro raivoso!
Acho que todos nessa indústria já passaram por
isso. Acredito até que não é só
para a web, todas as mídias têm
esse problema no dia-a-dia. Nos
Estados Unidos, o pessoal tem
uma expressão fantástica: “The

“Não acredito em obstáculos para

se ter um site de qualidade e com
alcance internacional”
 42 :: debate - ultrapasse os limites
:: Ludmilla Rossi
Diretora geral da Mkt Virtual
www.mktvirtual.com.br
“Limitações são desafios e a
vontade de superá-los pode
resultar em design inovador”
“Um fator que limita e veta algumas boas idéias é o pra-
zo. Muitas vezes, o projeto chega na produtora com um prazo
relativamente curto para ser desenvolvido e as idéias têm que
ser adequadas para esse tempo. Assim, acontece de deixar-
mos de executar algumas coisas por causa de um cronograma
a seguir. A melhor saída, neste caso, é negociar com o cliente
para ver se existe alguma flexibilidade. Quando não existe,
guardamos as idéias mais mirabolantes na gaveta. Além dis-
so, quando a criação envolve idéias que necessitem de verba
extra, e o cliente não dispõe dessa verba, a idéia também é
descartada ou adaptada.
Outro caso é quando temos a idéia, mas quando ela está
prestes a ser executada, detectamos que ela não é viável por
causa do peso, ou mesmo pelo fator-risco de desenvolvê-la.
Porém, acredito que com a evolução da tecnologia de desen-
volvimento, algumas limitações acabem diminuindo, e como
conseqüência os usuários estarão cada vez mais abertos para
vivenciar uma experiência diferenciada nos sites que nosso
mercado desenvolve.
O público-alvo também pode brecar algumas idéias que a
princípio parecem boas. Em casos mais raros, o próprio clien-
te pode ser uma limitação também. Clientes que não estão
abertos a novas idéias, que contratam desenvolvedores de
qualidade, mas não sabem ouvi-los, podem barrar ou frustrar
criações que poderiam ser bem sucedidas, mas que acabam
nem saindo do papel de rascunho.
O grande lance é pegar um trabalho com todos esses
fatores críticos, desenvolver conceitos bacanas e ainda
deixar o cliente contente com os resultados. Limita-
ções são desafios e a vontade de superá-los pode
resultar em design inovador.”
 debate - ultrapasse os limites :: 43

:: Thadeu Morgado
Designer do 8P.com.br no Núcleo de Aplicativos da Globo.com
www.thadeumorgado.com

“ A s b a r re i r a s n o p ro c e s s o c r i a t i v o d i m i n u e m à m e d i d a q u e o
“Estamos deixando para trás aquela fase em que, para nos
envolvimento no projeto aumenta. O trabalho deve começar antes e
intitularmos designers de internet (e suas muitas variáveis), bastava
ir muito além do momento em que o Photoshop é iniciado. O designer
fazer um curso de Dreamweaver, saber um pouco de Flash e sair
deve se envolver em todas as etapas do projeto: é essencial ter um
fazendo páginas por aí.
conhecimento profundo do briefing e dos requerimentos de produto, e,
Hoje, o mercado está acordando para a importância da mídia
a partir daí, estar totalmente envolvido na concepção do site.
internet e o próprio público está exigindo cada vez mais, seja na
As inovações muitas vezes começam ainda na arquitetura, refletindo
facilidade de navegação, objetividade, tecnologia, conteúdo dife-
claramente na hora de criar as interfaces e as soluções gráficas. Deve-
renciado e, sobretudo, emoção, arte e design.
se pensar não na página estática, mas sim no fluxo de navegação do
Com o aperfeiçoamento dos softwares e a disponibilização
usuário pelo site. Entender como o usuário vai utilizar o que está sendo
de bandas cada vez mais largas, estão se tornando mais comuns
proposto é o mais importante ponto no processo de criação.
sites com grandes imagens e filmes interativos que tomam todo o
Outro fator imprescindível é ter um diálogo muito próximo com os
fundo de uma tela. Isso traz um impacto e uma identidade com a
desenvolvedores. Esse canal aberto com a tecnologia abre espaço para
marca muito grandes, lembrando que a pessoa só está lá porque
soluções que, muitas vezes, não são visualizadas. Deve-se não ter medo
ela desejou assim.
de experimentar ao máximo, desenvolver protótipos e testá-los desde o
A interatividade com o público é outro fator que traz a simpli-
início do projeto. Apenas dessa forma é possível interagir com a solução
cidade como ponto chave na navegação. Em tempos onde é comum
criada e ter a idéia da viabilidade (ou não) do design.
se ter uma câmera no bolso, todos querem ter seus 15 minutos de
Limitações sempre irão existir. Por essa razão, manter-se atualizado
fama, disponibilizando fotos e vídeos on-line. Assim, o papel da
com as inovações que surgem a todo o momento e entender o que
internet é tornar isso realidade e da forma mais fácil possível. Sim-
tangencia o nosso trabalho dentro do processo de criação faz com
plicidade é a palavra. Sem deixar a emoção de lado.”
que essas barreiras diminuam consideravelmente. Dessa forma,
soluções simples ou meramente visuais devem ser evitadas,
pois é necessário ter sempre em mente que o usuário
interage com o site, e não apenas olha para ele.”

“Soluções simples ou visuais devem ser evitadas,

pois é necessário ter em mente que o usuário
interage com o site, e não apenas olha para ele”
 44 :: debate - ultrapasse os limites

par
gan tici
he pe
prê e
mio
s!

Participação dos assinantes

Quais são os desafios para a criação na internet?

Miriam Paula -
comercial@tecsite.com.br

Os principais desafios para a criação são: manter qualidade e oferecer soluções de nível alto a baixo custo, prazos de entrega
apertadíssimos, desenvolver nos padrões para os diferentes browsers, sem falar na dificuldade de ter seu trabalho reconhecido
e valorizado pelos clientes.
VENC EDORA

vencedor! Adriano de Oliveira

anapolino@gmail.com

Acredito que seja elaborar websites visualmente agradáveis aliado às diversas novas tecnologias de forma que resulte em um
produto bonito, funcional e eficiente.

Cláudia Mucenecki
depcom@adsantamaria.org.br

Creio que os maiores desafios sejam o de identificar o que os usuários de internet buscam em uma navegação. Atingir o
ponto ideal de um layout agradável e usabilidade são questões desafiadoras para um design de interfaces.

Gláucia Roberta
glauciaroberta@gmail.com

O maior desafio é permanecer com um trabalho simples, objetivo, leve, respeitando os princípios de design e mesmo
assim com uma boa dose de criatividade...

Sergio Montes
sergio_montes@ig.com.br

Como em qualquer processo criativo, 1% é inspiração e 99% é transpiração. A conceituação, o briefing, os prazos e as obrigato-
riedades e limitações colocadas por muitos clientes, na maioria das vezes, atrapalham o processo. Assim como o dedo criativo
deles. Muitas das vezes nos obrigam a misturar idéias e conceitos diferentes com cores e tipos que não se relacionam bem e no
final temos que domar aquele “monstro incontrolável” que vira o projeto.

Se você é assinante, participe desta seção pelo site www.arteccom.com.br/webdesign/clube O autor da melhor resposta ganha prêmios.
 46 :: e-mais - desbravadores
Desbravadores dos
territórios www ponto com
A máquina do tempo da História do Brasil retorna ao
século XVI, mais precisamente na época de expedições
organizadas pelo governo e por particulares, conhecidas
como Entradas e Bandeiras, respectivamente. Resumida-
mente, a função dos bandeirantes era capturar escravos fu-
gitivos, buscar povos indígenas para realização de trabalho
escravo e procurar riquezas minerais. Apesar de cumprirem
uma tarefa cruel, esses homens também colocaram seus
nomes na história do país como desbravadores de um ter-
ritório até então desconhecido pelos nossos colonizadores,
o que possibilitou a abertura de novos negócios.
Voltando a Era Digital, o mercado de internet no Brasil
presencia uma nova realidade, no qual as agências digitais
começam a desbravar um segmento ainda pouco explorado
comercialmente. Estamos falando do crescimento de pro-
jetos interativos internacionais realizados com a marca do
conhecimento de profissionais brasileiros.
“Esse boom de outsourcing que existe há anos no
setor de TI para a Índia, por exemplo, vai começar a acon-
tecer em vários outros setores, inclusive na propaganda
on-line. O que é bom! São novas visões, novas cabeças
pensando”, afirma André Matarazzo, sócio da Gringo.nu.
“As agências interativas são um tipo de negócio que já
nasceu sob o processo de globalização da economia. Nes-
se novo cenário, é natural que tenhamos programadores
indianos atuando no mundo todo, designers mexicanos,
diretores de arte brasileiros, gerentes de projetos ingleses,
e por aí vai... Hoje, o conhecimento está aberto a todos, o
que torna a concorrência global”, complementa Santana
Dardot, diretor de produção da Sapien.
O que eles buscam nas agências brasileiras?
Certamente, alguns fatores têm contribuído para a
abertura do mercado internacional para as agências digitais
do país. Segundo os especialistas, o preço de nossos servi-
ços é extremamente competitivo. “Nós podemos entregar
ao cliente um serviço de nível internacional com um preço
abaixo das grandes agências localizadas na Europa e Améri-
ca do Norte”, diz Tiago Ritter, sócio-diretor da W3Haus.

Além disso, vivemos uma fase de valorização de nos-
sa capacidade criativa. “Somos criativos, nem sempre da
forma mais óbvia: programadores brasileiros têm passe
valorizado no exterior por buscarem saídas pouco usuais
para os problemas, não desanimando ante as dificulda-
des. É o lado bom do jeitinho brasileiro: o jogo de cintura
e o gosto pela resolução de problemas”, afirma Gladi-
mir Dutra, gestor executivo da Aldeia - Agência Internet.
“Brasileiro é criativo, faz perguntas, se mete, mobiliza as
pessoas, dá risada, usa bem o humor, faz as coisas com
muita paixão. Isso causa uma boa entropia para processos
criativos”, acrescenta André Matarazzo.
Ou seja, adaptação e flexibilidade são diferenciais pro-
curados pelo mercado externo. “A nossa maneira em lidar
com diferentes cenários, a forma como nos envolvemos com
o que fazemos, a nossa capacidade criativa, a facilidade que
temos no contato interpessoal e a mistura cultural (que é
uma marca forte da nossa sociedade) nos credencia para
interagir com esse ambiente global com uma certa vantagem
em relação a outros povos”, analisa Santana Dardot.
Etapas para a expansão de mercado
Deseja expandir seu mercado de atuação para o ex-
terior? Então, nada melhor do que ouvir as dicas de quem
já passou por este processo. “A primeira etapa é a seleção
dos mercados de atuação, com base no retorno potencial
e nas características econômicas e culturais do mesmo. O
“Brasileiro é criativo, faz perguntas, mobiliza
as pessoas, usa bem o humor, faz as coisas com
muita paixão” (André Matarazzo)
e-mais - desbravadores :: 47
Oriente Médio pode ser um mercado mais ou menos pro-
missor que a Europa Setentrional, por exemplo, depen-
dendo do serviço a ser oferecido. É importante, nessa fase
de prospecção de mercados, que abandonemos as noções
pré-concebidas de que somente determinados mercados
é que são bons. Às vezes, ótimas oportunidades vêm de
onde menos se espera”, lembra Gladimir.
Para quem duvida da eficácia desta ação, a experi-
ência vivida pela W3Haus serve como prova viva. “É bom
conhecer o terreno em que vai se pisar. Antes de viajar, o
Rodrigo (um dos sócios da agência) fez muita pesquisa e
vários contatos para se inteirar do mercado que iria encon-
trar. Nesse aspecto, entendo que não se difere muito de
uma iniciativa que se faça no Brasil. A diferença é estar pre-
parado para enfrentar as diferenças culturais desse novo
mercado”, ressalta Tiago.
Assim, a sugestão é desenvolver um planejamento
com metas a serem atingidas. “Num universo macro, a
agência deve buscar o autoconhecimento. Qual é o seu
modelo de negócios? Quais os objetivos e a visão? O plano
de negócios, o estabelecimento de métricas para o acom-
panhamento dos fatores essenciais do negócio e processos
alinhados aos objetivos da empresa são ferramentas que
podem ser úteis nesse cenário. Depois disso, cabe à agên-
cia buscar as possíveis oportunidades que melhor aderem
ao seu modelo de negócios”, afirma Santana.
 48 :: e-mais - desbravadores
Definidos estes pontos, lembre-se que a capacitação
das equipes vai garantir uma boa realização do processo.
“Vale a recomendação de se ter o domínio do inglês e das
terminologias específicas da nossa área. Mais que conhe-
cimento, uma habilidade muito necessária é a percepção
e empatia para percebermos padrões culturais diferentes
dos nossos e nos adaptarmos a eles. Ingleses reagem de
forma diferente dos portugueses, que reagem diferente
dos suecos, e por aí vai. Isso vai muito além da linguagem
empregada: está nas entrelinhas dos e-mails, nas pausas e
entonações em uma teleconferência”, alerta Gladimir.
Vencendo os obstáculos
Como já dizia o poeta mineiro Carlos Drummond de
Andrade, “no meio do caminho tinha uma pedra, tinha uma
pedra no meio do caminho”. Assim, na trajetória em busca da
ampliação de mercado, alguns desafios precisam ser supera-
dos. O primeiro deles envolve as diferenças entre o cliente e
o fornecedor do serviço.
“A língua, a cultura e a comunicação são pontos que, se
não são bem trabalhados, podem se apresentar como gran-
des obstáculos. Uma equipe com formação multicultural
pode surgir como um facilitador nesses quesitos”,
diz Santana.
Outra dificuldade está no estabeleci-
mento de canais de prospecção e aten-
dimento. “A falta de flexibilidade
e empatia com um cliente di-
ferente do usual podem
gerar ruídos de comu-
n i c a ç ã o n o p ro c e s s o
de trabalho. Antes de
tudo, a decisão entre
levar a prospecção
ou a produção para
o exterior deve ser
analisada em termos fi-
“O fato de nos estabelecermos
em um outro país é uma prova de
nossa competência e qualidade nos serviços
prestados” (Tiago Ritter)
nanceiros. Embora saibamos que o componente emocional
sempre fala alto, a decisão deve ser baseada em critérios
racionais”, argumenta Gladimir.
“Vale a recomendação de se ter o domínio
do inglês e das terminologias específicas da
nossa área” (Gladimir Dutra)
Além disso, Tiago, da W3Haus, lembra que é preciso
convencer o cliente da seriedade do serviço a ser disponi-
bilizado. “É necessário vencer a desconfiança dele, que vai
ter o seu trabalho realizado por pessoas do outro lado do
Atlântico. Em nosso caso, pelo fato de termos uma presença
física com dois profissionais dando suporte e atendimento,
o cliente se sente mais amparado. Quando apresentamos
o resultado final e ele atende às expectativas do cliente, o
obstáculo está definitivamente ultrapassado”.
Cliente: diferenças e vantagens
Certamente, a longa caminhada já percorrida
pelas agências digitais brasileiras com atuação interna-
cional foi suficiente para traçar as características que
diferenciam os clientes daqui com os de fora. “Acho
que a diferença é, sobretudo, de expectativa
e organização. Por exemplo, marcas estran-
geiras têm uma estratégia de marketing
definida com muita antecedência por seu
p e s s o a l o u a g ê n c i a d e p ro p a g a n d a .
Raramente alguém vai te contactar
dizendo que precisa de um projeto
substancial para ontem. Processo
de feedback, de coleta de mate-
rial - na nossa experiência tudo
corre muito mais seriamente
e estruturadamente”,diz
André Matarazzo.
Como conseqüên-
cia desta organiza-

ção, surge uma maior cobrança. “O cliente que contrata
um fornecedor offshore (e não estamos falando de países
específi cos, isso se aplica até mesmo ao Brasil) tende a ser
mais escolado nas práticas de TI e é, portanto, mais exigente
em termos de gestão de processos. Não gostamos de fa-
zer generalizações em relação a países específi cos: há, por
exemplo, ingleses extremamente abertos à inovação, outros
são mais conservadores. O relacionamento com os clientes
no exterior, na experiência da Aldeia, tem sido formal, com
tendência a suavização do meio para o fi nal do processo”,
relata Gladimir.
Não podemos esquecer também a exigência pelo
cumprimento rigoroso dos prazos. “Os cronogramas são
mais respeitados tanto pelo cliente como pela agência
digital. Além disso, existe uma autonomia maior para a
agência. No Brasil, não é raro termos que lidar com algu-
mas empresas em que o cliente sente a necessidade de ter
o ‘seu dedo’ no trabalho”, cita Tiago.
Vale a pena?
Mais do que receber um simples “sim” ou “não” como
resposta a tal pergunta, é preciso saber que tipo de retorno
uma agência digital poderá obter ao decidir expandir seu
mercado de atuação para o exterior. “A Sapien tem obtido
elevadas taxas de crescimento a cada ano (13,60% em 2003,
34,98% em 2004 e 68,02% em 2005). Hoje, atendemos clien-
tes na Europa, Ásia e América. Esse foi um dos fatores que
contribuiu para o nosso crescimento”, revela Santana.
Como tudo começou?
- Aldeia - Agência Internet
“Sempre tivemos o desejo de aproveitar nosso poten-
cial criativo e inovador para diversos perfis de clientes,
mercados e culturas como forma de expandir e qualificar
nosso portfólio de soluções” (Gladimir Dutra)
- Gringo.nu
“Não diria que a Gringo é focada em clientes no exterior,
mas gostamos de poder trabalhar com gente de fora.
Acreditamos em um modelo global de atendimento”
(André Matarazzo)
e-mais - desbravadores :: 49
No caso das gaúchas Aldeia e W3Haus, houve uma
transformação na forma como elas se posicionam no merca-
do. “Além do aumento do número de projetos, um retorno
bastante sensível foi o número de contatos comerciais. Pas-
samos a ser percebidos como fornecedores potenciais, o
que é sempre importante em um processo de posicionamen-
to de marca para um determinado mercado”, cita Gladimir.
“Brincamos que a W3Haus, ao contrário das empresas aéreas,
vai de Porto Alegre à Europa sem escala em São Paulo. Fa-
lando sério, existe uma admiração dos concorrentes e um
respeito maior por parte dos clientes. O fato de nos estabele-
cermos em um outro país é uma prova de nossa competência
e qualidade nos serviços prestados”, conta Tiago.
Além desses aspectos, podemos citar o crescimento
da receita financeira e a possibilidade de participação em
projetos inovadores. “Sem contar com o lógico aumento do
orçamento, sentimos também que a organização é melhor, a
comunicação é mais eficiente, entre outros. Temos também
a chance de criar conceitos para públicos diferenciados,
mais abertos para experimentação, que navegam em banda
mais larga etc. É importante frisar que clientes ‘interna-
cionais’ variam imensamente. Temos clientes institucionais
americanos que se comunicam com um público geriátrico
- até clientes de pura atitude que se comunicam com os jo-
vens de Helsinque, por exemplo. Nem tudo são flores, nem
sempre existe uma oportunidade grande de fazer um traba-
lho extremamente diferenciado”, finaliza Matarazzo.
- Sapien
“Esse foi um dos objetivos perseguido por nós desde
o início de nossa atuação. Começou como um objetivo
meio difuso e, com o esforço e a maturidade da em-
presa, assumiu a forma de uma meta clara”
(Santana Dardot)
- W3Haus
“A partir da iniciativa de um dos sócios (Rodrigo Caudu-
ro). Por motivos pessoais, ele tinha interesse de morar
na Inglaterra e aliou essa vontade ao lado profissional
levando a W3Haus ‘na bagagem” (Tiago Ritter)
50 :: estudo de caso - Brastemp
Brastemp
na era do comércio
eletrônico
personalizado
Você vai comprar um novo refrigera-
dor e gostaria de encontrar um lugar onde
pudesse escolher as cores das portas e do
gabinete, definir o tipo de voltagem e o
lado de abertura, além de incluir algumas
novas funcionalidades, como porta-latas,
compartimento para laticínios e gavetas e
prateleiras extras.
Pois bem, de olho nas transformações
ocorridas nos desejos dos consumidores
nos últimos tempos, a Brastemp (www.
brastemp.com.br) vem desenvolvendo
pela internet uma nova maneira de co-
mercializar seus produtos: é o chamado
comércio eletrônico personalizado, no
qual o usuário vai determinando as ca-
racterísticas de sua compra.
Os detalhes sobre a criação e o de-
senvolvimento deste novo tipo de am-
biente, você confere nesta entrevista rea-
lizada com dois especialistas da Agência-
Click (www.agenciaclick.com.br): Ricardo
Figueira, diretor de criação, e Abel Reis,
VP de Tecnologia e Projetos.
 estudo de caso - Brastemp :: 51

Wd :: A Brastemp é uma tradicional marca de eletro- “Entendemos que o importante é adequar-

domésticos no mercado brasileiro e atinge um público se a espontaneidade cognitiva dos
seleto de consumidores. Diante disso, quais são as prin- consumidores” (Ricardo Figueira)
cipais motivações que levam um usuário a visitar o site
da empresa? Quais seriam as diferenças entre o consu- res na compra de um monitor novo ou mais potente.

midor “físico” e o consumidor “virtual” da marca? Mas o importante é que a decisão do projeto partiu do

Ricardo :: Hoje em dia, os consumidores visitam o site pressuposto de atender a todas as necessidades dos usu-

da Brastemp por uma infinidade de motivos. Inclusive, pelos ários. O site projetado não poderia ter uma configuração

mesmos que naturalmente os levariam ao ponto-de-venda. que fosse excludente, ao contrário, que atendesse com boa

As visitas são motivadas por iniciativas ativas da pró- ergonomia a todas as pessoas.

pria marca, como campanhas promocionais de varejo on- Wd :: Em termos de arquitetura da informação, o site

line, comunicação de novos lançamentos, ações de rela- foi dividido em quatro seções principais: Catálogo de Pro-

cionamento, ou pelas próprias necessidades específicas dutos, Loja Virtual, Atendimento ao Consumidor e Dicas da

do consumidor, que variam desde registro de um produto Brastemp. De que forma vocês decidiram quais seriam os

até a configuração de novos eletrodomésticos com gostos, blocos de informação a serem trabalhados na interface?

cores e design personalizados. Ricardo :: Apesar de o site hoje contar com muito

Enfim, a internet acabou integrando todas as relações conteúdo e outras ações e assuntos, essas eram as temá-

já existentes com o consumidor e criou ainda um cenário ticas que refletiam as principais necessidades do usuário

gigantesco de vantagens que influencia diretamente na em grande escala.

sua relação com a marca - que é uma só - independente do Procuramos, praticamente em todos projetos, desen-

ambiente ser real ou virtual. volver a arquitetura de informação do site de forma a refle-

Na cabeça dele, não existe distinção, não existe a tir os hábitos e o entendimento do consumidor, mesmo que

marca virtualmente e a marca fisicamente. Existem, sim, a estrutura interna da empresa seja diferente. Entendemos

experiências proporcionadas por uma marca para atender que o importante é adequar-se a espontaneidade cognitiva

as suas necessidades e são essas experiências que passam dos consumidores.

a influenciar diretamente os seus hábitos de escolha e fre- Wd :: A combinação cromática do site prioriza tona-

qüência aos diversos meios e canais. lidades leves e neutras, como o branco e o cinza, além do

É claro que, por outro lado, os consumidores passam uso do laranja para destacar determinadas informações.

a ter expectativas cada vez mais sofisticadas e que só a fle- Quais fatores influenciaram nesta escolha?

xibilidade, a agilidade e as características de um ambiente Ricardo :: A Brastemp é uma marca tradicional no mer-

interativo podem oferecer. cado, porém altamente moderna e de forte personalidade.

Wd :: A diversidade de resoluções de tela usada Esse foi um dos principais pontos que determinaram na

pelos usuários ainda é uma questão que merece atenção concepção do design do site.

por parte de quem trabalha com a criação e o desenvol- Essas atitudes ou características da marca acabaram

vimento de sites. No caso do site da Brastemp, vocês influenciando a estratégia criativa, passando por três pon-

adotaram o tamanho de 800x600 pixels como padrão. O tos principais.

que determinou esta decisão? O primeiro deles é priorizar o funcional, a escolha do

Ricardo :: Atualmente, no Brasil, a diversidade de reso- usuário, a organização da informação. Em seguida, era pre-

luções utilizadas em computadores é muito variada e o fato é ciso permitir que as imagens dos próprios produtos falas-

influenciado por inúmeros motivos, que vão desde questões sem com o consumidor, transmitindo o espírito da marca

de “acessibilidade” até o “poder aquisitivo” dos consumido- e suas propostas.

 52 :: estudo de caso - Brastemp
“O design de um site precisa jogar a favor da
dinâmica do negócio do cliente”
(Ricardo Figueira)
Por último, procuramos criar uma plataforma visual
que favorecesse a comunicação de oportunidade ou de mo-
mento em função da própria dinâmica de relacionamento
com o consumidor.
Wd :: Em relação ao grid, é possível reparar o uso
de boxes retangulares para determinar a divisão dos ele-
mentos do site. Por que vocês decidiram trabalhar com
este tipo de forma para apresentar as informações?
Ricardo :: O site da Brastemp é um ambiente intera-
tivo com muito conteúdo, informação, lançamento de pro-
dutos, serviços e ainda tem uma dinâmica de atualização e
operação muito intensa.
Assim, a utilização de grids ajuda ao usuário desenvol-
ver um entendimento ou cognição pelas áreas-fins do site,
sem prejudicar o ritmo de publicação de tudo que é produ-
zido para atender as necessidades diárias da marca.
O design de um site precisa jogar a favor da dinâmica
do negócio do cliente. Nesse caso, não adianta muito ex-
perimentalismo, o negócio é desenhar um grid inteligente
e graficamente bem concebido.
Wd :: Um dos destaques do site é a seção “Bras-
temp You” (http://tinyurl.com/yn7noa), no qual o usu-
ário pode personalizar a compra de um refrigerador ou
freezer. Segundo a divulgação oficial da AgênciaClick,
o trabalho levou dez meses de duração e envolveu as
áreas de arquitetura da informação, design e interface.
Como esses conhecimentos foram aplicados no desenvol-
vimento desta funcionalidade? Vocês realizaram testes
de usabilidade para garantir a eficácia da ação?
Ricardo :: Brastemp You foi o primeiro case no Brasil
de configuração de um eletrodoméstico customizado pelo
próprio consumidor. E tudo que de uma forma ou de outra
é o “primeiro” necessita de teste. Esse projeto, especifica-
mente, além de ter passado por testes, ainda contou com
atualizações dinâmicas, conforme a sua performance em
ambiente real.
Em um trabalho como esse, o processo de concepção
não parte do princípio do trabalho isolado. Ao contrário,
o arquiteto de informação, por exemplo, influencia inclusi-
ve na implementação do ambiente tecnológico, de acordo
com os fluxos e até a performance das aplicações.
É sempre um trabalho de equipe para garantir a consis-
tência e, acima de tudo, todo mundo focado na necessidade
do consumidor, dos testadores aos desenvolvedores.
Wd :: É possível afirmar que o “Brastemp You” se-
gue a filosofia emanada pelo movimento Web 2.0, que
é disponibilizar ferramentas que aumentem a interativi-
dade do usuário com um ambiente digital?
Ricardo :: O conceito do projeto Brastemp You está
alinhado com necessidades mais sofisticadas do consumidor.
Ele está alinhado com uma tendência de comportamento de
consumo, que está influenciando e vai influenciar também as
próximas décadas, quando os produtos, por mais industriais
e característicos que sejam, receberão a intervenção dos
gostos e características pessoais de seus compradores.
Eu diria que a Web 2.0 é um pedacinho dessa manifes-
tação do conceito de interatividade do mundo com tudo que
existe e existirá, inclusive nos meios de produção em larga
escala e mais complexos como as indústrias e nas fábricas.
Wd :: Falando em negócios, a Brastemp possui uma
área de comércio eletrônico. Além de facilitar a compra
dos produtos, a seção apresenta uma série de informa-
ções úteis que podem ajudar a esclarecer as principais
dúvidas dos consumidores (simulação de consumo de ener-
gia, fotos dos produtos, características principais etc.).
Que tipo de diferenciais vocês utilizaram para destacar os
produtos no site?
Ricardo :: Nesse caso, o nosso trabalho foi tornar es-
ses fatores evidentes e principalmente deixá-los absoluta-
mente organizados por atributos e uma caracterização que
pudesse facilitar a comparação com outros produtos, seja
da mesma linha ou até mesmo da concorrência.
A Brastemp, na verdade, já trabalha com diferenciais
na sua essência. O nosso papel foi deixá-los evidentes.
Wd :: Especialistas apontam que um dos principais
desafios para a disseminação do comércio eletrônico
envolve a sensação de segurança para se realizar uma
transação pela internet. Quais elementos podem ajudar
 estudo de caso - Brastemp :: 53

a aumentar a confiança de um usuário sobre a segurança “Nas próximas décadas, os

de um site? Como vocês trabalharam esta questão no produtos, por mais industriais
site da Brastemp? e característicos que sejam,
Abel :: O site adota as melhoras práticas e recursos receberão a intervenção dos
técnicos visando preservar o sigilo de informações e a se- gostos e características pessoais
gurança das transações realizadas pelos clientes. Essas
de seus compradores” (Ricardo
ações são acompanhadas de muita orientação e um efi-
Figueira)
ciente canal de contato por chat ou até mesmo telefone. É
assim que se constrói confiança.
Wd :: Um detalhe interessante deste projeto é a dis-
ponibilização de banners como uma espécie de “autopu-
blicidade”, no qual a empresa destaca as suas principais
ofertas e promoções. Quais aspectos determinaram o
conceito da aplicação de espaços publicitários no site?
Ricardo :: O site da Brastemp é detentor de uma gran-
de audiência, tanto em função da afinidade que a sua marca tem
com os brasileiros quanto pelos serviços e oportunidades dispo-
níveis on-line com interesses mais diversificados possíveis.
A partir disso, utilizamos estrategicamente as diversas
áreas de interesse do site para comunicar as oportunidades
específicas e adequadas àquele momento da navegação.
Com isso, podemos aumentar a possibilidade da Bras-
temp desenvolver novos negócios ou se aprofundar na re-
lação com o consumidor.
Wd :: Ainda sobre a publicidade, a página principal
conta com um pop-up bem criativo, que destaca a nova
linha de purificadores de água da empresa. Na edição
de dezembro de 2006, na seção “Métricas e Mercado”,
apresentamos uma pesquisa sobre a rejeição dos usuá-
rios (86%) por este tipo de formato publicitário on-line.
Vocês acreditam que o pop-up é um formato em extin-
ção? Por que vocês decidiram utilizá-lo como canal de
divulgação no site da Brastemp?
Ricardo :: Particularmente, não acredito que o pop-up
é uma ferramenta em extinção. É bem verdade que a comu-
nicação interruptiva vai ficar cada vez mais em desuso, em
função dos mecanismos interativos on-demand, de acordo
com os interesses do usuário. www.brastemp.com.br
Entretanto, existe um fato que caracteriza o pop-up
como uma ferramenta ainda interessante. Apesar do índice
de rejeição ao tipo de comportamento, a afinidade e inte-
 54 :: estudo de caso - Brastemp
“Pop-up: apesar do
índice de rejeição ao tipo
de comportamento, a
afinidade e interesse das
pessoas que realmente
clicam nele é altíssima”
(Ricardo Figueira)
resse das pessoas que realmente clicam nele é altíssima, caracterizando uma
efetivação da comunicação proposta.
Então, uma vez que o site da Brastemp possui uma audiência já qualificada,
dentro de um interesse específico, há grandes chances dessa linha de comu-
nicação trazer pertinência e interesse ao visitante. Podemos interpretar como
uma sugestão de oportunidade e não uma comunicação invasiva.
Wd :: A acessibilidade é um tema que vem transformando a maneira
como as empresas desenvolvem seus produtos e serviços. Pensando nis-
so, a Brastemp lançou recentemente uma linha de produtos acessíveis aos
consumidores com necessidades diferenciadas (www.brastemp.com.br/in-
dependente). Assim, dentro do site, existe também um espaço dedicado a
exposição desses produtos. Como as normas de acessibilidade on-line foram
aplicadas nesta seção?
Ricardo :: Lembro que, quando criávamos esse site, passamos algumas
vezes pela discussão de aproveitar a oportunidade para entrar nesse assunto
no próprio site.
Entretanto, concluímos que o nosso objetivo deveria ser simplesmente
fazer o site mais acessível, não fazendo disso um assunto para discussão, mas
sendo realmente um site adequado ao público focal.
Para isso, criamos um site tecnologicamente simples, adequado e compa-
tível com todos os mecanismos viabilizadores e de suporte às diversas necessi-
dades especiais, previstas nas normas regentes do HTML para acessibilidade.
Acessibilidade na web X
É criar ou tornar as ferramentas e páginas web acessíveis a um maior número de
usuários, inclusive pessoas com deficiências. A acessibilidade na web beneficia
também pessoas idosas, usuários de navegadores alternativos, usuários de tecnologia
assistiva e de acesso móvel.
Fonte: Serpro (http://tinyurl.com/wsple)
Wd :: Um detalhe interessante nesta seção são os ícones utilizados para
representar cada um dos consumidores com necessidades diferenciadas. Como
vocês definiram os símbolos que representariam cada consumidor (cadeirantes,
deficientes auditivos e deficientes visuais)?
Ricardo :: Buscamos utilizar ícones inspirados nas padronizações de si-
nalização internacional, comum às características específicas para facilitar o
entendimento e, principalmente, a identificação da informação.
Wd :: Disponibilizar formas de contato é fundamental para garantir que
os consumidores possam contribuir com sugestões e críticas que ajudem no
aperfeiçoamento dos produtos e serviços de uma empresa. O canal on-line
de atendimento ao consumidor da Brastemp oferece uma gama variada de
opções (ajuda on-line, formulário, perguntas freqüentes etc.). Quais fatores
 estudo de caso - Brastemp :: 55

“Todas as formas de contato e de orientação

devem estar à disposição dos visitantes, sendo
por vezes até mesmo redundante. É isso que dá
segurança ao e-consumidor, pelo menos no Brasil”
(Abel Reis)

determinaram os canais a serem disponibilizados?

Abel :: Todas as formas de contato e de orientação devem
estar à disposição dos visitantes, sendo por vezes até mesmo
redundante. É isso que dá segurança ao e-consumidor, pelo me-
nos no Brasil. Foi isso que constatamos há cerca de três anos,
ao realizar uma pesquisa de expectativas e atitudes do público
internauta.
Wd :: O site recebeu recentemente o prêmio iBest 2006,
pela Academia iBest brasileira, na categoria “Eletro-Eletrô-
nicos” (http://tinyurl.com/y48ovk). Que tipo de retorno este
projeto trouxe para a AgênciaClick?
Ricardo :: A Brastemp é uma marca parceira no desenvol-
vimento de projetos e campanhas que para nós são sempre es-
peciais, seja de varejo ou institucionais. Isso, por conseqüência,
acaba nos dando a oportunidade de ter uma parceria reconhecida
pelo mercado, através de prêmios nacionais e internacionais.
No ano passado, tivemos várias iniciativas premiadas, como
o iBest para o site e um Leão de Ouro, em Cannes (www.can-
neslions.com), para uma peça de varejo. Esse tipo de incentivo
é importante em função do desenvolvimento de um trabalho em
parceria, buscando sempre o melhor para o negócio, para a co-
municação e para a nossa expectativa qualitativa pessoal.

Festival de Publicidade de Cannes X

Criado em 1953 pela SAWA (Screen Advertising Worlds Agencies). Tornou-se
o mais importante prêmio da publicidade mundial. Em 2006, a AgênciaClick
foi premiada com as peças “Purificador de água - Brastemp” (http://tinyurl.
com/y2aulo) e “Sacode - Revista Sexy” (http://tinyurl.com/y6cvt9).
Fonte: Wikipédia (http://tinyurl.com/yxzztm)

Por outro lado, existe, além do reconhecimento da indústria

da comunicação, a incessante busca por resultado, tanto de ven-
das quanto por força de marca, tudo medido dia-a-dia através de
recursos tecnológicos e humanos. Ou seja, tudo é parametrizado e
o resultado é a energia para novos investimentos e iniciativas.
 56 :: tecnologia na web
Tecnologia na web
ActionScript: expandindo os limites do desenvolvimento web
Extraordinários efeitos visuais e transições dinâmi-
cas entre os elementos que compõem a interface do site.
Se você entrar em algum fórum ou lista de discussão
voltada para a criação e o desenvolvimento web, certa-
mente vai se deparar com o endereço www.2advanced.
com. O site desta agência americana é um bom exemplo
no uso de Flash, através da utilização da linguagem de
programação ActionScript.
“No início, o Flash era só uma plataforma para dese-
nho vetorial e animação. Com o ActionScript, se transfor-
mou numa plataforma que permite a execução de código.
Em termos visuais, permitiu o controle dinâmico de obje-
tos. Assim, programadores e designers não precisam mais
compor animações e outros efeitos na timeline, como feito
originalmente. Além disso, tornou possível todo o tipo de
processamento existente em uma linguagem real de pro-
gramação, como interpretação e manipulação de dados,
geração de conteúdo em tempo real, interação com scripts
no lado servidor etc”, explica o designer de interfaces Zé
Fernando (www.zeh.com.br).
Sobre as suas vantagens, o especialista afirma que
hoje é mais fácil perguntar se é possível criar algo sem o
uso de ActionScript. “A resposta é não: sem uma lingua-
gem para script, qualquer tecnologia de interfaces não é
nada além de uma casca sem propósito. Em sites em Flash,
ActionScript acaba sendo usado principalmente para transi-
ções entre estados dos elementos da interface (eventos de
rollover, fades de conteúdo e outras animações, por exem-
plo), criação de conteúdo dinâmico (quando carregado de
algum sistema externo, como uma consulta num banco de
dados), diálogo com scripts do lado servidor para executar
tarefas mais avançadas num website (como mandar e-mails
ou adicionar registros num banco de dados) etc.”
O começo
Para entendermos um pouco mais sobre esta tec-
nologia, uma boa pedida é descobrir como alguns pro-
fissionais começaram a manipulá-la. No caso de Dauton
Janota, desenvolvedor especialista em Flash e sócio-di-
retor da DES16N (www.des16n.com.br), o início coincide
com o lançamento da versão 3 do Flash. “Nesta época, já
brincava com Flash e Javascript. Em 2000, passei a usar
a versão 4, que já trabalhava com variáveis e streaming
de MP3. No Flash 5, veio a interação com XML e assim
evoluindo aos dias de hoje”.
Já a história de Zé Fernando está intimamente ligada
com a evolução do Flash. “Comecei a trabalhar com Flash,
na versão 2, em 1997 ou 1998. No começo, o Flash não
tinha o ActionScript como é conhecido hoje - ele só supor-
tava meia dúzia de comandos simples, chamados de ‘ac-
tions’. Ele foi mudando bastante conforme os anos foram
passando e ainda tem mudado constantemente, com as
novas versões de ActionScript (2, 3 etc.) e recursos novos
que são criados. Assim, posso dizer que comecei a traba-
lhar com ActionScript quando ele nasceu”.
Erros mais comuns
Nada melhor do que perguntar para quem já vem de-
senvolvendo há um bom tempo quais seriam os erros mais
comuns no uso do ActionScript. Com a palavra, os especia-
listas. “Os principais são os erros de tipagem. Os scripts in-
ternos do Flash exigem sua escrita corretamente. Por exem-
plo: escrever var meu_som:sound = new sound() em vez de
var meu_som:Sound = new Sound()”, aponta Dauton.
Outra questão complicada envolve, dentro do Flash, o
trabalho com um mesmo código dividido em muitos objetos
diferentes. “Um dos grandes problemas do ActionScript e
do Flash, em geral, é que você pode fazer uma mesma coi-
sa de diversas formas diferentes - da mais confusa a mais
simples, da mais poderosa a mais limitada. Por exemplo,
alguns programadores podem conseguir terminar uma ta-
refa, mas de uma forma que o código esteja tão confuso
que qualquer mudança ou manutenção seja impossível. Em-
bora isso não seja um ‘erro’ pela definição mais técnica da
palavra, acaba sendo um erro prático porque impede que
outras pessoas trabalhem no código”, afirma Fernando.

O especialista lembra ainda da confusão entre os es-
copos da linguagem. “Ou seja, ao se usar objetos, variáveis
e funções em muitos lugares diferentes. Quando o progra-
mador não possui um conhecimento maior da linguagem
e de programação orientada a objetos em geral, é comum
criar um código cheio de buracos, que pode até funcionar,
mas vai estar funcionando na corda bamba, podendo entrar
em parafuso a qualquer momento.”
Bons exemplos no uso do ActionScript
Então, onde encontrar bons exemplos da aplicação do
ActionScript, que sirvam de referências para futuros proje-
tos? “Geralmente, sites que indexam websites (www.the-
fwa.com, por exemplo) são bons índices para isso, já que
90% dos sites listados lá são feitos em Flash e, obviamente,
tecnologia na web :: 57
nível médio
usando ActionScript de cabo a rabo”, diz Fernando.
Além disso, ele indica exemplos envolvendo as ques-
tões técnicas. “Bons exemplos de uso de ActionScript são
scripts que redimensionam a interface com muito mais
controle dependendo do tamanho da janela do browser.
Temos ainda os scripts que te permitem fazer algo muito
mais visualmente (por exemplo: procurar um livro da Ama-
zon e estabelecer relações entre outras publicações sob a
forma de gráficos interligados), interfaces de usuário mais
amigáveis (as chamadas interfaces ricas), carregamento de
dados dinamicamente (que podem ser interpretados no
lado cliente), jogos singleplayer e multiplayer etc.”
Dificuldades no aprendizado
Segundo os especialistas, um dos principais desafios
 58 :: tecnologia na web
“Com o ActionScript, o Flash se transfor mou numa platafor ma que per mite a execução
de código” (Zé Fer nando)
para quem deseja se aprofundar na área está no desen-
volvimento de conhecimento lógico, de programação.
“Para designers, essa acaba sendo a principal dificuldade
ao lidar com a linguagem: não a sintaxe (que sempre está
disponível em referências ou na ajuda), mas sim a lógica de
programação, objetiva, fria e racional. Depurar um algo-
ritmo é algo que demora um tempo para se aprender, mas
depois que a lógica de uma linguagem é compreendida,
as outras vêm mais fácil. No caso do ActionScript, tem um
complicador a mais: entender como o Flash se relaciona
com a linguagem. Existem coisas que parecem óbvias pela
sintaxe, mas que não funcionam na prática, principalmente
devido à forma como o Flash executa o código (frame por
frame, seqüencialmente etc). Então, surge muita solução
esquisita por causa, exclusivamente, das peculiaridades do
Flash”, alerta Fernando.
Assim, não há outra alternativa: torne a prática como
a principal ferramenta de aprendizado. “Toda e qualquer
linguagem de programação é como uma linguagem pro-
priamente dita. Se você estuda inglês e não pratica, cer-
tamente não se desenvolverá e provavelmente nem terá
condições de efetuar uma conversação neste idioma. Na
programação, examino o fato similarmente. Tudo depende
do interesse em aprender a programar. E, esteja certo, er-
rar é o mais comum na programação. Este fato é o que leva
à experiência. O grande lance é tentar e errar, até chegar
no que se quer. No caminho, você encontrará inúmeras
outras soluções”, orienta Dauton.
A história do ActionScript
“Linguagem de programação baseada em ECMAScript. É
utilizada para controlar filmes e aplicações no Flash. Visto que o
JavaScript e o ActionScript são baseados na mesma sintaxe do
ECMAScript, ambos são traduzidos de um para outro facilmente.
Contudo, o modelo de cliente é diferente: enquanto o JavaScript
trabalha com janelas, documentos e formulários, o ActionScript
trabalha com movie-clips, campos de texto e som.”
Fonte: Wikipédia (http://pt.wikipedia.org/wiki/ActionScript)
Evolução do Flash
- 1996
“Chamado de SPLASH (FutureSplash Animator). Era um
programa para animações vetoriais”
- 1997
“A versão 2 ainda possuía poucos recursos de programação”
- 1998
“No Flash 3, através da integração do Flash e JavaScript, era
possível desenvolver algumas aplicações”
- 1999
“O Flash 4 trouxe uma quantidade de scripts internos (actions)”
- 2000 aos dias atuais
“O Flash 5 traz o ActionScript 1.0, que permitia criar uma
interatividade com outras linguagens de servidor, bem como
otimizar as animações que até então eram feitas via timeline.
Utilizávamos prototypes, que foram substituídos, apesar de
ainda serem permitidos no uso pelas classes do ActionScript
2.0, que tem como principal característica à programação
orientada a objetos (OOP). Já a versão atual, ActionScript 3.0,
está voltada completamente à OOP, onde toda programação
escrita deve pertencer a uma classe”
Fonte: Dauton Janota
Dicas de leitura
- “ActionScript for Flash MX: The Definitive Guide”
Autor: Colin Moock
Editora: O’Reilly Media
- “Essential ActionScript 2.0”
Autor: Colin Moock
Editora: O’Reilly Media
- “Flash Actionscript MX - Documentado e Não Documentado”
Autor: Dauton Janota
Editora: Axcel Books
- “Flash Animado: Técnicas Avançadas em design e animações”
Autores: Dauton Janota, Rodrigo Piologo e Ricardo Piologo
Editora: Axcel Books
Fontes: Dauton Janota e Zé Fernando
 tutorial :: 59

Produtividade 2.0 - Parte 3

Elcio Ferreira
Desenvolvedor e instrutor na Visie Padrões Web
http://visie.com.br/

Trac
Mês passado, conhecemos o Subversion, um sistema <Location “/tracvalidar/”>
livre de controle de versão. Esse mês, vamos falar do Trac,
SetHandler mod_python
um sistema minimalista de gerenciamento de projetos inte-
PythonHandler trac.web.modpython_fron-
grado ao Subversion. Não se preocupe, você vai entender
tend
o que ele faz assim que vir as telas. Como fizemos com o
PythonOption TracUriRoot “/tracvali-
Subversion, vamos mostrar a você como instalar o Trac no
dar”
Ubuntu, para que você tenha uma idéia do processo todo.
PythonOption TracEnv /home/dev/trac/
Vamos começar com o comando:
validar

sudo apt-get install trac </Location>

Agora, vamos ao diretório onde você vai manter seus E, claro, reiniciar o Apache:
arquivos do Trac. Eu escolhi /home/dev/trac:
$ sudo invoke-rc.d apache2 restart
cd /home/dev/trac
Fazendo isso, você poderá acessar o Trac em seudo-
Em seguida crie o pacote de arquivos para o seu pro- minio.com/tracvalidar e verá uma tela assim:
jeto do Subversion:

trac-admin initenv validar

O Trac vai perguntar a você o nome do projeto, a

string de conexão ao banco de dados, onde, se você não
pretende usar uma base de dados específica, basta aper-
tar ENTER, o caminho para o repositório, no meu caso /
home/dev/subversion/validar, e o diretório dos templates
do Trac, onde você também pode apertar ENTER tranqüila-
mente. Ao final, garanta que o Apache conseguirá acessar
o diretório que o Trac criou:

$ sudo chown -R www-data /home/dev/trac/*

Por fim, vamos criar um diretório virtual no Apache

Clicando em “Browse Source”, você poderá navegar
apontando para o Trac. Para isso basta inserir, em seu apa-
pelo código-fonte dos arquivos do projeto:
che2.conf ou no arquivo de configuração do seu site:
 60 :: tutorial
Clicando em “Timeline”, confira todo o histórico de
alterações no projeto, além de saber exatamente que ar-
quivos foram criados ou alterados, quando e por quem:
Mais do que isso, você pode em cada arquivo, para
cada alteração, exatamente o que foi alterado:
O Trac é uma valiosíssima fonte de informação para
programadores que resolveram pensar em seu próprio tra-
balho e investir em sua produtividade. É também excelente
para o acompanhamento do projeto, e inestimável quando
algo quebra em seu sistema e você precisa descobrir o que
mudou e como as coisas eram antes.
Automatização
Bons programadores não se conformam em repetir a
mesma tarefa manualmente várias vezes. Se algo pode ser
automatizado, será.
O processo de desenvolvimento e publicação de
suas aplicações é algo que pode ser automatizado ao
extremo. Isso é importante porque o commit e deploy
de sua aplicação provavelmente será feito muitas vezes.
Algumas dicas para otimizar e automatizar o processo de
desenvolvimento e deploy:
1. O controle de versão deve ser seu único repo-
sitório de código.
Ninguém copia código do servidor de desenvolvi-
mento para a sua máquina e vice-versa. Ninguém copia
código do servidor de desenvolvimento para o de pro-
dução. O caminho do código é entre os diversos lugares
em que ele tem que estar e o repositório do controle de
versão. Você vai desenvolver?
Baixe o código do repositório, altere e suba no-
vamente para o repositório. Vai colocar o código que
você acabou de escrever no servidor de testes/homo-
logação? No servidor de testes você faz check out do
código que está no repositório.
O processo de deploy automatizado vai copiar para
o servidor de produção o código do repositório. Nunca
mais você vai ter que se preocupar com versões dife-
rentes do código.
2. Coloque tudo o que se refere ao projeto no
controle de versão.
Seus scripts de criação de banco de dados, a docu-
mentação do seu sistema, seus artefatos de modelagem
e tudo o mais que mereça ser guardado.
Da mesma forma que você pode precisar de uma
versão antiga de um trecho de código, pode precisar
de uma versão antiga de um diagrama de classes ou de
um documento do sistema.
3. Guarde seu repositório de código com a sua vida.
Ele é seu bem mais valioso. É tudo. Na verdade, isso é
muito bom. Você vai precisar fazer backup de um lugar só.
Este modelo de trabalho vai lhe trazer alguns bene-
fícios, entre eles seus desenvolvedores vão gastar menos
tempo com testes e gerenciamento de código, a qualidade
do seu código estará assegurada a cada passo e você evi-
tará erros nos processos de testes e instalação.
Em fevereiro, vamos começar a falar de desenvol-
vimento guiado por testes, que faz parte do pacote de
produtividade. Até lá!
 tutorial :: 61

Dicas

O Trac é mais do que um visualizador do seu repositório do Subversion. Ele contém um Wiki, que você pode
usar para documentação de seu projeto, ou como uma maneira fácil de ter um site do projeto durante o desen-
volvimento, e um sistema de controle de tickets muito bom. Tudo integrado ao controle de versão.
A homepage do Trac está em http://trac.edgewall.org e é feita com o próprio Trac. Há outros excelentes
exemplos do que o Trac é capaz de fazer, como a página de desenvolvimento do Projeto Django: http://code.
djangoproject.org.
Se você também quiser personalizar sua versão do Trac, os arquivos de template estão em /usr/share/trac/
templates e você tem duas alternativas. Pode alterar os templates ali, se quiser que todos os seus sites Trac
nesse servidor sejam alterados. Ou, se quiser personalizar apenas um site, pode criar uma cópia desse diretório
e apontar seu projeto para essa cópia quando usar o comando trac-admin initenv.

Links

- Track Hacks
http://www.trac-hacks.org

- Guia de instalação do Trac

http://colab.interlegis.gov.br/wiki/TracInstall

- Controle de mudança com o Trac

http://www.pronus.eng.br/artigos_tutoriais/gerencia_configuracao/trac.php

- Trac
http://en.wikipedia.org/wiki/Trac
64 :: tecnologia

Abel Reis
Guilhermo Reis
VP de Tecnologia e Projetos da AgênciaClick. Doutorando em Comunicação e Semiótica pela PUC-SP.
Especialista em Arquitetura de Informação e Usabilidade. É autor do Kit de Conhecimento sobre AI
M.Sc. em Engenharia de Sistemas pela UFRJ. Bacharel em Informática e Filosofia. Há 15 anos trabalha
(http://tinyurl.com/p4j6w). Atualmente, é responsável por coordenar projetos e manutenções nos
com projetos de mídia interativa. É um dos top creatives do mundo, segundo o livro “How to catch the
websites do Banco Real.
big idea”, do consultor Ralf Langwost.
reis@guilhermo.com
abel.reis@agenciaclick.com.br

Vem aí a Web 3.0

Sabemos que a indústria de tecnologia da informação é movida a novidades. É a lógica
da obsolescência contínua e planejada. Por esta razão, vez por outra surgem expressões e
“palavras mágicas” que procuram apresentar ou “vender” ao mercado inovações ou ten-
dências. Às vezes são apenas “espumas e bolhas”, isto é, não dizem nada de novo, ou sim-
plesmente não dizem nada, mas o fazem de modo sofisticado. Porém, este não é o caso da
chamada Web 2.0. Trata-se aqui, a meu ver, de um fenômeno que agora se materializa numa
terceira onda de inovação na internet: a onda das redes sociais.
A primeira onda vai de 1995 (criação da Amazon) a 1999 (quando surge o Napster), onde
os modelos de negócios vitoriosos na web (B2C, em especial) seguiram, principalmente, três
vetores: a redução de custos de procura (exemplo: eBay), a consolidação de grandes portais
de conteúdo e serviços (exemplo: UOL), ou a redução de custos operacionais, onde internet
banking é, neste caso, o melhor exemplo. O destaque desta primeira onda foi a formação
dos grandes centros de atração de audiência, que hoje se encontram bem consolidados.
Tudo segue sem grandes abalos até o surgimento da segunda onda de inovação: a dos
aplicativos P2P (peer-to-peer) - Napster, Gnutella etc. Estamos em 2000. Um ano de muitas
loucuras… Tais aplicações permitem aos usuários se comunicarem diretamente, sem necessa-
riamente envolver servidores centrais. Fazem de qualquer computador na rede um servidor
de onde parte e de onde chega conteúdo digital de todo tipo, de simples mensagens de
texto a CDs de música. Qualquer computador da rede tornava-se assim um centro de audi-
ência natural, por fora dos grandes portais. Mais que isso: por fora dos modelos tradicionais
de venda e distribuição de conteúdo. Napster foi o caso exemplar. O que se destaca, nesta
segunda onda, é a descentralização na distribuição de conteúdo digital. Vale dizer que os
abalos provocados por esta onda foram enormes e ainda estão longe do fim - que o diga a
indústria fonográfica.
Chegamos então a 2002, ano em que os blogs se consolidam. Surgem também os fo-
tologs. E mais que tudo: surgem as ferramentas de redes sociais. São muitos os exemplos:
Friendster, Linkedin, last.fm, del.icio.us, Orkut, digg e muitos outros.
Vejamos um caso: o delicious.com. Trata-se de um repositório onde qualquer internauta
pode guardar endereços de seus sites favoritos, de forma bem organizada, usá-los a partir
de qualquer computador, e ainda colocá-los à disposição de todos os participantes da co-
munidade. O conteúdo do del.icio.us é assim o próprio rastro das atividades de milhares de
internautas na rede.
Vejamos outro exemplo: o last.fm. Uma rádio em rede onde os participantes ouvem e
classificam livremente suas músicas preferidas, compartilhando na comunidade dicas e pre-
 tecnologia :: 65

"“ÉOpreciso
que secriar
destaca, nesta
as casas, terceiraas
os prédios, onda, é ae difusão,
praças a pulverização
principalmente as placas
de
de microcentros
sinalização.” de audiência, ou seja, conteúdos em profusão que
interessam a poucos por vez, mas interessam muito"

ferências (playlists). Desse modo, nichos específicos de gosto musical acabam formando, naturalmente, pequenas
audiências segmentadas.
Qual a novidade nesses dois exemplos? A novidade é a força criadora intrínseca (os chamados “efeitos de
rede”) que emerge da web, a partir da atividade rotineira e natural de seus milhões de usuários. E o caso da Wiki-
pédia? Enciclopédia na web criada e atualizada pelos próprios internautas, num modelo colaborativo de produção
de conteúdo, no qual, por “seleção natural”, os verbetes vão sendo melhorados e atualizados.
Creio, assim, que a esperança na web como um espaço criativo, livre e global, onde a rede produz seu pró-
prio conteúdo relevante - de enciclopédias a blogs até simples playlists -, ganha novo alento.
O que se destaca nesta terceira onda é a difusão, a pulverização de microcentros de audiência, ou seja,
conteúdos em profusão que interessam a poucos por vez, mas interessam muito. E mais: repentinamente, tais
conteúdos podem alcançar enorme sucesso de audiência, sem nenhuma ação de marketing espetacular. Falo
do seu blog, dos blogs e fotologs dos seus amigos, das tags no delicious, das wish lists e plogs na Amazon, dos
comentários no digg, das recomendações profissionais no linkedin, e de tantos outros conteúdos cuja autoria
emerge e se organiza de modo inteligente, naturalmente, a partir da vida digital de milhões de pessoas. Isso é
web 2.0.
Resta uma pergunta: a web 2.0 já tem sucessor? Sim. Hoje já se fala numa web 3.0, onde a idéia principal é a
de software oferecido como serviço, pela própria rede, por grandes, médios, pequenos ou micro fornecedores,
sob demanda e pago por uso transacional. Parece que uma nova onda está em formação...
66 :: arquitetura da informação

Luiz Agner
Guilhermo Reis
Ilustrador e designer. Doutorando em Design pela PUC-Rio, é professor da Escola de Comunicação e
Especialista em Arquitetura de Informação e Usabilidade. É autor do Kit de Conhecimento sobre AI
Artes da UniverCidade e da pós em usabilidade de interfaces da PUC-Rio. Além de dar aulas, trabalha
(http://tinyurl.com/p4j6w). Atualmente, é responsável por coordenar projetos e manutenções nos
atualmente no IBGE. É autor do livro “Ergodesign e arquitetura de informação: trabalhando com o
websites do Banco Real.
usuário” (Quartet, 2006).
reis@guilhermo.com
luizagner@gmail.com

Design e Arquitetura de Informação

Um milhão de novos usuários inserem-se no mundo digital a cada quatro meses, em nosso
país. Como disse Peter Morville, o Brasil é uma sociedade de massa e precisa de mais arquitetos de
informação atuando no mercado. A educação é a chave para isso.
A importância da arquitetura de informação reflete o crescimento da população de pessoas
comuns conectadas aos espaços informacionais. Reflete as necessidades das organizações na
economia global, e a maior compreensão do comportamento humano e de seus aspectos cognitivos,
durante a interação com os sistemas.
Com um volume cada vez maior de informações disponíveis, a crise da sociedade atual é como
transformar informação em conhecimento. Mais informação deveria representar maior compreensão
para guiar a nossa atuação no mundo. Mas não é o que ocorre na prática! O famoso semiótico
Umberto Eco admitiu certa vez que não havia diferença nenhuma entre o New York Times de
domingo e o Pravda, jornal oficial da antiga União Soviética - quando se tratava de impedir o acesso
da população a informações de seu interesse.
Para ajudar a combater a verdadeira cortina de fumaça informacional, é que entram em cena
os conceitos do ergodesign e da arquitetura de informação. Quando eles são aplicados às interfaces
de sistemas, estão geralmente em defesa dos seus usuários. Ou seja, de nós - os trabalhadores,
consumidores e cidadãos.
A confusão entre transmitir dados e criar mensagens com significado teve a sua origem na
atenção demasiada dada aos computadores e na pouca atenção dada aos seres humanos. São os
problemas da usabilidade da interação humano-computador.
As tecnologias de informação e comunicação têm alterado substancialmente o modo como
a informação é organizada e acessada, assim como a quantidade de informação disponível. Por
isso, não é surpreendente a emergência de uma nova profissão para lidar com essas questões: a
arquitetura de informação.
A localizabilidade das informações (ou findability) é o grande conceito da área. Além disso, a
arquitetura preocupa-se também em desenvolver produtos compatíveis com as necessidades de quem
vai utilizá-los. Ou seja, com a usabilidade. Além de ser uma abordagem de pesquisa, a usabilidade pode
ser considerada uma ideologia. Ela implica na crença em certos direitos inalienáveis do homem, como:
- o direito de ser superior à tecnologia;
- o direito de poder controlar o computador;
- o direito à simplicidade;
- e o direito a ter seu tempo respeitado.
O foco da arquitetura de informação é o projeto de ambientes informacionais que forneçam aos
usuários recursos para transformar suas necessidades em ações e atingir seus objetivos com sucesso.
 arquitetura da informação :: 67

"A confusão
“É preciso entre
criar transmitir
as casas, dadosase praças
os prédios, criar mensagens com signifi
e principalmente cado
as placas
teve a sua origem na atenção demasiada dada aos computadores e na
de sinalização.”
pouca atenção dada aos seres humanos"

Por isso, a arquitetura de informação é uma atividade inserida no campo da ergonomia.

Como tradição, nas empresas, os designers e programadores são contratados e pagos para enfatizar a dimensão
racional em detrimento do ser humano e do seu contexto (as dimensões ambíguas). A ênfase e o foco estão sempre
na máquina, e não no usuário. No olho desse furacão, os designers, às vezes, perdem a noção de que não estão lá
para desenhar os produtos em si, mas para desenhar o relacionamento dos produtos com os seres humanos. Seria
importante que os conceitos interdisciplinares que definem a AI pudessem ser melhor compreendidos. Para que
possam ser bem aplicados nos cursos de graduação que pretendem formar designers de interfaces, provedores de
conteúdo ou gestores de espaços informacionais.
Se a educação é a chave para o sucesso, a área acadêmica precisa mostrar logo a que veio. Ainda falta no
meio acadêmico uma compreensão ampla dos conceitos relacionados à arquitetura de informação como processo
interdisciplinar. Acho que tanto entre estudantes quanto entre docentes. Ainda bem que essa realidade está
mudando rapidamente, apesar de ainda haver carência de bibliografia em português. O livro que eu escrevi há pouco
(“Ergodesign e arquitetura de informação - Trabalhando com o usuário”) é uma forma de procurar contribuir.
Crédito da foto de Luiz Agner: Julia Caldas
68 :: 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ênciaClick, 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 área.
rene@usina.com

A primeira mega-máquina
Títulos enganam. Esse, por exemplo, é um desses. Se você o viu no índice ou na capa e veio
correndo ler a íntegra, é porque imaginou que eu ia falar sobre:
· playstation 4 de pulso.
· o novo X-XBox implantável no cérebro.
· alguma câmera nova da Sony em que todos saem lindos. Todos.
· um novo supercomputador da IBM que entende, enfim, o ugá-gá dos bebês.
· um celular que conversa sozinho com quem não tem amigos.
· uma Ferrari movida a uísque e Viagra para milionários idem.
· um novo satélite militar americano capaz de depilar 100 mil terroristas ao mesmo tempo.
De cabo a rabo. Com dor, claro.
Deixe-me dar, então, uma boa e uma má notícia. Primeiro a má: não é nada disso. Agora
a boa: estou falando de você.
Na verdade, estou falando de todos nós. Na verdade, estou falando de um xerox velho que
devo ter perdido no porta-malas de algum carro meu (destino fatal de todo xerox grampeado),
e cujo autor só uma boa busca vai ser capaz de resgatar. (Acho que vou perguntar no Yahoo!
Respostas para prestigiar meus nobres colegas :) )
Faz quanto tempo isso? Uns 20 anos? O que me consola é, se um dia encontrar o tal xerox
amarelado, o assunto não vai ter envelhecido nem um pouco, e por duas razões:
1. o tema do “A Primeira Mega-Máquina” eram os faraós construtores de pirâmides, e 20
anos a mais ou a menos não fazem um grão de areia egípcia de diferença.
2. nós, sem nenhum faraó para nos azucrinar, estamos criando coisas faraônicas a cada dia.
A tal da mega-máquina egípcia não era de aço, era de carne. Ou melhor: as engrenagens
eram de carne e osso, o combustível era entusiasmo e fé (e alguma cerveja egípcia, imagino).
Nada disso, porém, teria levantado uma palha sem algo inédito: organização.
Gente aos montes nunca faltou no mundo, mas a grande sacada do faraó é que, com um
pouco de coordenação e um propósito comum, essa gente toda vira uma mega-máquina e faz
coisas antes inimagináveis. Não acredita? Pergunta pra Esfinge :)
Foi tudo uma questão de tecnologia... humana: uma boa equipe de escribas, uns bons
geômetras, outros tantos capatazes e proto-engenheiros e arqueo-arquitetos e voilá, gente
iletrada vira... uma potência construtiva e pedras brutas viram... o Vale dos Reis.
Seis mil anos depois estamos de novo construindo algo monumental, desta vez sem
chibata, sem faraó nem areia entrando no chinelo. Eu, você e mais 1 bilhão (isso mesmo,
somos 1 bilhão de internautas) construímos com nossas próprias mãos comunidades,
produzimos conteúdo, publicamos o que bem entendemos e levantamos bit a bit esse
work-in-progress que é a Web 2.0.
Web 2.0, para mim, é gente. Ponto. Ajax? Antrax? Botox? XML? Sandra e Miele? Na boa,
isso para mim é o de menos. O que conta, para mim, é gente. E gente pode fazer milagres... ou
 marketing :: 69

"Criar um ambiente colaborativo é mais do que pendurar

numa página uma série de ferramentas e truques"

não. Uma ferramenta mágica na mão de pessoas pode operar maravilhas... ou não.
Se uma novidade não conquistar corações e mentes vira badulaque, traquitana, quinquilharia no museu
dos grandes micos.
Gente é o corpo e alma da Web 2.0. E gente não funciona sempre igual. Aliás, gente não funciona sempre.
Ao menos, não da maneira que você espera.
Qual o segredo, enfim, para trazer à tona o melhor das pessoas? Como transformar interesses pessoais em
interesse pelo bem coletivo? (Chicotada não vale, ok? Nem poções mágicas.)
Eu arrisco: existe uma “arquitetura da generosidade”, uma “mecânica da participação”, uma “química do
relacionamento”, “elementos catalíticos de colaboração”. Well, eu acho que existe :)
Criar um ambiente colaborativo é mais do que pendurar numa página uma série de ferramentas e truques.
Criar um ambiente colaborativo significa cativar a confiança de pessoas, deixá-las à vontade e sem medo,
reconhecer cada gesto “colaborativo” e deixar claro sempre o benefício ímpar de se ter um espaço onde o
melhor de cada um pode vir à tona.
Sob condições favoráveis, pessoas fazem maravilhas. Mas... como criar e garantir as tais condições
favoráveis? Well, é uma arte. E ciência também ajuda.
Quem vai mover e se mover nesse espaço social? Adolescentes? Então, pesquise sobre as motivações e
dilemas e barreiras e receios e deleites dos adolescentes. Como eles se organizam? Como eles defi nem seu
território? Com gírias e modinhas? Com uma mecânica complexa de reputação e identidade e diferença? Com
SMS e instant messengers? Scrapbooks?
Seja como for, vai ser bem diferente de um espaço para neurocirurgiões. Ou para calouros de faculdade.
Ou para veteranos de faculdade. Ou recém-formados. Ou formandos. Erre a fórmula e o energético de uns
vira o purgante de outros.
Cada grupo e cada fase da vida têm seus códigos próprios, seus espaços e dinâmicas. Respeite isso,
alavanque isso, identifique o que é imperdoável e o que é venerado e desenhe o ambiente como quem
desenha cidades: com praças, ruas, espaços privados e públicos, anonimato e reconhecimento, áreas de
lazer e locais de trabalho.
Nós estamos descobrindo a cada dia do que somos capazes, e isso é bárbaro. E você, meu caro, assim
como eu e todos os que estão com a mão na massa, temos um papel nessa história. Quem cruzar os braços
é uma múmia.
70 :: bula da Catunda

Marcela Catunda
Trabalhou 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
marcelacatunda@terra.com.br

É coisa nossa!
E o estacionamento? É por conta nossa.
E a gasolina? É por conta nossa.
E o almoço perto do cliente? É por conta nossa.
É assim que me sinto muitas vezes indo e voltando das reuniões de freela, num show
de calouros com o som dos anos oitenta pra depois não ganhar nem 10 mangos (que nos
anos oitenta era uma grana). Isso se não tiver pegadinha do “Mallandro”: “Háááááá! Você
pode pegar seu pagamento mês que vem? Glu-gluuu, iê-iééééééééé!!!” Em 2007, gostaria
que as coisas fossem diferentes.
Passei o ano de 2006 como Diretora de Criação, mas resolvi voltar para a vida de ser
freela no ano que tá aí. Tô ficando especialista em pedir demissão. Acho que eu entro na
sala dos caras e eles pensam:
- Lá vem a Catunda se demitir... (risos) E eu me demito mesmo. Seria cômico se não
fosse trágico.
A verdade é que estou ficando mais velha e cada dia com menos paciência para o lado
negro da força dos ambientes coorporativos. Até o mais forte dos Jedis teria problemas
em lidar com uma dedada no olho. Nem Obi Wan Kenobi está preparado para uma briga
de puxão de cabelo e beliscão. Já pensou o Darth Vader brigando igual a uma menininha?
Picuinhas, sacanagens e afins: Tô fora!
D u r a n t e m u i t o t e m p o a c re d i t e i s e r p o s s í v e l m u d a r o m u n d o , a g o r a j á t ô m e
conformando em mudar apenas a minha vida. De repente se cada um de nós fizer uma
mudança pro bem, o mundo muda pra melhor. Eu mudei bem, pra bem longe do endereço
da minha ex-mesa. Agora estou em casa de novo, reaprendendo a ser freela, me adaptando
a escrever sem fumar (larguei o cigarro), longe dos amigos que ficaram lá e pensando
bem antes de sair por aí oferecendo trabalho. Que trabalho? Aquele que te comeu atrás
do “armalho” (que piadinha péssima), mas é sério. A gente precisa tomar cuidado pra na
hora do desespero não pegar a primeira oportunidade e jogar fora nossa liberdade. É
impressionantemente mais fácil encontrar um emprego fixo do que achar empresas que
queiram um relacionamento “freela” com a gente. É sempre aquela coisa: te quero, mas te
quero só pra mim. Te quero muito. Te quero agora, pela manhã, a tarde, a noite. Fala sério!
Que relacionamento mais obsessivo é esse? Me deixa. EU SOU FREE.
O tempo de 2006 passou e agora que eu voltei a ser free já me deparei com a dura
realidade da minha escolha: gastei uns 100 mangos só de estacionamento e queimei uns
bons quilômetros de gasolina. Fora aquele almoço com o cliente, aquele que o cara te leva
num lugar legal achando que você tem grana e na hora da conta divide pelo número de
pessoas presentes na mesa, sem sacar que você comeu tão somente uma salada de alface
 bula da Catunda :: 71

"Com menos paciência para o lado negro da força dos

ambientes coorporativos. Até o mais forte dos Jedis teria
problemas em lidar com uma dedada no olho"

com rúcula e rabanetes de 18 mangos (o que já é um assalto). Tenha dó de mim, o senhor comeu um filé
ao molho madeira.
Não é simples ser freela, a gente precisa de fluxo de caixa e aquele pensamento positivo quando
lembra que “não tem nada pra entrar nesse mês”. Auummmm! Mas a vida continua e esse ano vai ser lindo.
Pensamentos positivos nunca são demais, criemos então uma realidade linda e quente onde, caminhando
pela minha marina particular entre iates luxuosos que brilham escandalosamente com o reflexo dourado
do sol de Miami... (me deixa ser cafona que esse peptídeo é meu) passo a mão num daqueles celulares
platinados, cravejados de diamantes e digo “Manda comprar tudo, agora!”. Não sei que “tudo” é esse,
mas os mega milionários do cinema sempre pegam o celular para mandar comprar “tudo”, então eu quero
“tudo” também ora, bolas. O Octopus, do Paul Allen, ia parecer um caiaque perto dos meus iates. O tal
do Airbus 380 ia ser o meu AeroCatunda, ou Catunda Force One.
E essa coisa de criar realidade funciona. Tenho uma amiga que olha o saldo dela negativo de 3 paus
no banco e enxerga um sinal de positivo no lugar do menos e um 8 no lugar do 3. Pô! Em menos de
um minuto, ela sai da miséria e pula pra classe dos bem sucedidos. Tem investimento melhor do que
pensar no positivo?
E pensar pra lá de positivo é uma das minhas promessas para 2007, bem como comprar um bloquinho
de Zona Azul, criar coisas legais, escrever muitos livros* e chegar sempre com o estômago relativamente
forrado em reuniões perto da hora do almoço. Nham! Nham.

* Você já leu “Eu Sento, Rebolo e Ainda Bato um Bolo”? Então, leia! É meu último livro e está à venda nas melhores lojas do ramo. E fique de olho que
virão mais em 2007.
72 :: webdesign

Luli Radfahrer
PhD 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.
luli@luli.com.br

Sobre marretas, consumo, atitude e web 2.0

Como ser estrela em uma sociedade que o espetáculo é a única forma
viável de expressão
Tudo parece ter começado como uma brincadeira de um grupo de estudantes
canadenses que não tinham mais o que fazer. Cansados de todo o barulho de mídia para
o lançamento do iPod nano, eles tiveram uma idéia tão inesperada quanto divertidamente
genial: coletar dinheiro de um grupo de amigos, ir até uma loja da Apple, lá comprar um
desses aparelhinhos e destruí-lo no balcão da loja. Registrando, é claro, tudo em vídeo.
A idéia, de tão completamente absurda, acabou atraindo a curiosidade geral. Aos poucos,
mais e mais colegas desses malucos resolveram colaborar com cinco ou dez pratas, por diversos
motivos. Imagino que o principal deva ter sido a diversão com a coragem e cara-de-pau desses
doidões. Algo do tipo que você certamente já fez ou viu fazer na vida, como “te pago uma
cerveja se você tiver a coragem de pular naquela piscina”. Por isso, não adiantava apenas
destruir o brinquedo: era fundamental registrar o ato.
Gosto de imaginar que outro motivo bastante razoável para contribuir com dinheiro
para tal plano diabólico possa ter sido uma resistência inconsciente à cultura do design e ao
culto aos objetos como fetiche pós-moderno. Olhe à sua volta e você perceberá que para
a maioria das pessoas é mais importante o aparelho que seu conteúdo. Nessa relação de
valores tortos, ter um iPod é mais importante que ter nele músicas de boa qualidade, ter um
notebook de última geração é muito mais importante que qualquer trabalho realizado nele,
um carrão importado é gigantescamente mais importante que o imbecil que o dirige e assim
por diante... irritados com a ditadura do consumo, muitos podem ter pago o equivalente a
uma refeição leve no McDonald’s local para se ver vingados por um anti-herói que marreta
um ícone adorado por muitos de forma quase religiosa.
Seja qual for o motivo, racional ou irracional, ativista ou simplesmente mega-nerd, o fato é
que a brincadeira acabou se transformando em um website (smashmyipod.com). Nele, nada de
explicações. Apenas um fórum bagunçado, um design vagabundo e um monte de informações
contraditórias, nenhuma delas de conotação neocomunista ou histérico-ong. Ainda bem. Como
um bom filme ou piada, qualquer esforço para explicá-lo só tende a diminuir seu impacto.
Graças a ferramentas de transferência de microcrédito, como o PayPal, os malucões acabaram
por conseguir os dólares de que tanto precisavam. E cumpriram a promessa, para desespero dos
presentes e do staff da loja que, chocados diante de tal sacrilégio, chamaram a segurança e, no
melhor estilo Jihad, proibiram os moleques de entrar naquele shopping center pelo ano seguinte.
Para muitos de nós, viciados (ou simplesmente acomodados) com o consumo,
uma punição deste porte já seria o suficiente. Mas não subestimemos nossos heróis e
 webdesign :: 73

"Aquilo que se chama por aí no mundo de web 2.0 nada mais

é que a real possibilidade de dar ao indivíduo comum uma
voz para que ele possa se expressar"

a gigantesca falta de noção que só os vinte e pouquíssimos anos são capazes de providenciar. Meses
depois, foi a vez do Xbox.
Dessa vez, a estratégia precisava ser refinada. Não bastava chegar na loja e quebrar o brinquedo. Para que
a pancada fosse realmente grande, o website foi usado durante meses para gerar uma espécie de expectativa ao
contrário. Antes do tão esperado lançamento do console, o dinheiro já estava lá. Na véspera do lançamento, eles
acamparam na porta da loja, como muitos outros fãs da tecnologia. Depois de muita espera, chegou a sua vez:
compraram algo que quase ninguém no mundo tinha, só para marretá-lo com vontade. A Microsoft arregalou os
olhos. Seus inimigos espalhados pelo mundo exultaram.
No final de novembro, eles repetiram a dose com o PS3 e com o Nintendo Wii. Cientes que o espetáculo
é muito mais importante que o aparelho, sua vestimenta fica mais e mais arrojada a cada atividade. Os
depoimentos e gestos de fé, paciência e fascínio fazem a alegria dos repórteres e câmeras de TV, todos
crentes que ali está um fiel exemplar dessa “nova geração”. Flashes pipocam. Pouco depois, a marreta desce,
para o desespero de consumidores, funcionários, segurança e público geral completamente perplexo. Em
desprezo, alguns se referem ao ato como coisa de nerd, quando é justamente o contrário.
Para minha enorme alegria, a única coisa que não muda em suas atividades cada vez mais populares e
arrojadas é seu discurso. Nada de político, nada de humanitário, nenhum protesto zangado contra esta ou
aquela corporação, apenas o enorme desprezo e desapego de alguém que comprou um objeto - e, exercendo
seu pátrio poder de direito legítimo, o destrói. Que alívio, meus heróis não se renderam ao “sistema”.
Uma atitude dessas pode não parecer resistência, mas é. E como. Porque faz pensar, leva a rever,
questiona o que aceitamos como “certo” e “errado”. Há menos de um século, Marcel Duchamp expôs como
arte uma coleção de objetos como uma roda de bicicleta e um ferro de passar roupa. Pintou um quadro de
um cachimbo e escreveu embaixo que aquilo não era um cachimbo. Também não foi levado a sério.
Os vídeos foram parar no site deles. Os aparelhos destruídos são negociados no eBay. Cada aparelho
quebrado (iPod, PS3, XBox, Wii) ganhou um novo site. Neles, nenhuma explicação. As críticas e ofensas estão
lá, abertas e explícitas. Algumas têm fúria taleban.
Antes que você pergunte obviedades do gênero “mas o que isso tem a ver com design” ou “não seria
melhor dar esse dinheiro para os pobres”, pense duas vezes: aquilo que se chama por aí no mundo de web 2.0
nada mais é que a real possibilidade de dar ao indivíduo comum uma voz para que ele possa se expressar. Se
o que ele tem a dizer é relevante, não faltarão ouvidos no mundo. Se ele puder ajudar as pessoas a tomarem
consciência do vazio existencial de uma sociedade de consumo, sua contribuição será inestimável. E isso
certamente poderá ajudar muito mais as populações necessitadas que um punhado de notas verdinhas.
A propósito, por uma divertida coincidência, o link de sua última destruição chegou para mim uma semana depois do
ato, exatamente no dia em que ONGs barbudas, cabeludas e furiosas pregavam o “buy nothing day” - dia internacional
de resistência ao consumo de massa, instigando as pessoas ao redor do mundo a não comprarem nada. Irônico, não?

Promoção assine um plano de hospedagem efetue o
pagamento anual e
ganhe um pendrive ou uma webcam. Confira o
regulamento em nosso site.
www.siweb.com.br
tel: (11) 4063.8047
info@siweb.com.br
Você quer hospedagem de site Profissional? Servidores que
não saem do ar? Então venha conhecer a Datahosting, temos
plano individual e de revenda, plataforma linux e windows.
*Dizendo que nos conheceu através da revista webdesign,
ganha 1 mês de hospedagem grátis.
www.datahosting.com.br
tel: (11) 6951.2954 - (11) 6939.7305
atendimento@datahosting.com.br
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.br
tel: (11) 6684.9597
info@hphost.com.br
A Informática Online.Net está preparada para hospedar
seu site, nosso DataCenter possui servidores de última
geração, nossos backbones sempre irão propiciar ao seu
visitante uma alta velocidade e estabilidade de conexão.
www.informaticasp.com.br
tel: (11) 6944.2566
sac@informaticasp.com.br
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.br
tel: Rio Grande do Sul (51) 3042.2030
São Paulo (11) 4063.7574
Rio de Janeiro (21) 3527.0848
comercial@redehost.com.br
E-mail de 1GB, webmail com leitor de notícias e disco virtual.
Soluções completas para webdesigners e desenvolvedores.
Qualidade, estabilidade e segurança.
www.speedhost.com.br
tel: São Paulo (11) 5644-1047
Rio de Janeiro (21) 3523-0387
Paraná (41) 3015-3077
Para anunciar nesta seção, envie um e-mail para publicidade@arteccom.com.br, com o título "busca host" ou ligue para (21) 2253.0596
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.com
tel: (48) 4052.9591
atendimento@brasilhosting.com
Oferece hospedagem profissional linux e windows com
recursos grátis como loja virtual, blog, enquete, boleto.
Possui planos de revenda ideais para webdesigners.
Suporte qualificado 24 horas e registro de domínios.
www.portal123.com/
tel: Minas Gerais (31) 3761.2253
São Paulo (11) 4052.9253
suporte@portal123.com.br
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.br
tel: (11) 6971.0438
Hospedagem Profissional PHP a partir de R$ 4,90 -
Servidores 64 bits Dual Core - Revenda de Hospedagem.
Sua melhor opção, Confira!
www.infotecnico.com.br
tel: (48) 3235.2761
contato@infotecnico.com.br
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.br
tel: (21) 2577.5545
vendas@rjhost.com.br
ZARP HOST
Hospedagem de Sites
Oferecemos registro de domínios e hospedagem em
ASP, PHP e CGI. Planos a partir de R$ 9,90.
www.zarphost.com.br
contato@zarphost.com.br
Parceria Tehospedo e você, Designer: registro
de domínio totalmente grátis e até 3 meses
de hospedagem para oferecer a seus
clientes. Consulte condições no site.
www.TeHospedo.com.br
tel: RS (51) 3227.7727 / capitais de SP/RJ/MG/DF/
PR/SC 4062.1432, GO (62) 4052.1432
comercial@tehospedo.com.br
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://www.braghost.com.br
braghost@braghost.com.br
Hospedagem de Sites com infra-estrutura no Brasil, 6
anos no mercado, multi-serviços para você e seus clientes.
Planos Windows e Linux, antivírus, anti-spam, banco de
dados, relatórios de acesso, disponibilidade de 99,5%.
www.creativehost.com.br
tel: (11) 3849.1166
atendimento@creativehost.com.br
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.br
tel: (34) 3316-2433
hostmaster@triangulohost.com.br
Hospedagem de Sites com segurança e estabilidade
total para os clientes mais exigentes nas plataformas
Linux e Windows. Infra-estrutura de altíssima qualidade.
Planos de Revenda e VPS.
www.ativahost.com
tel: (21) 2238-3407
vendas@ativahost.com