ed30

Page 1

junho 2006 :: ano 3 :: nº 30 :: www.arteccom.com.br/webdesign

Webdesign

junho 2006 :: ano 3 :: n 30 :: www.arteccom.com.br/webdesign

R$ 8,90

Do Canadá ao Japão, o design nacional que encanta o mundo: André Matarazzo (Gringo.nu) Organização das agências digitais Layout líquido: projetando sites em diferentes resoluções




4 :: quem somos

Editorial Aos 45 do segundo tempo... Como passei essa última semana participando do Encontro de Web Design, acabo de chegar ao Rio e estou aqui às 11h45, tendo que terminar este editorial às 12h. Mas que bom que cheguei a tempo de

Equipe Direção Geral Adriana Melo adriana@arteccom.com.br

Direção de Redação Luis Rocha luis@arteccom.com.br

Criação e Diagramação

Antes de tudo, o evento foi excelente, tanto no Rio, quanto em BH, Salvador e Recife. Tive o prazer de conhecer pessoalmente vários de nossos leitores e reencontrar alguns de nossos anunciantes, que também patrocinam o Encontro. Enfim, queria agradecer pela presença e carinho dos cariocas, mineiros, baianos e pernambucanos! Espero, em novembro, encontrar nossos leitores do Sul... :) E, aqui vai meu recado: queria que vocês absorvessem ao MÁXIMO o conteúdo da matéria com ANDRÉ MATARAZZO. Estamos no terceiro ano de nossa publicação e talvez ele tenha sintetizado tudo que temos a intenção de transmitir um pouquinho para vocês a cada edição: trabalhar com muita paixão, buscar superar seus próprios limites independente do nível de cobrança da agência e, principalmente, estar ciente de como

Camila Oliveira camila@arteccom.com.br

Leandro Camacho leandro@arteccom.com.br

Ilustração Beto Vieira beto@arteccom.com.br

Publicidade Jane Costa jane@arteccom.com.br

Gerência de Tecnologia Fabio Pinheiro fabio@arteccom.com.br

Financeiro Cristiane Dalmati cristiane@arteccom.com.br

Atendimento e Assinaturas

VOCÊ pode ajudar sua agência a crescer ou a alcançar outro “patamar

Renata Fontan

criativo”. Esses são apenas alguns dos preciosos ensinamentos de

renata@arteccom.com.br

Matarazzo. Enfim, leiam com muita atenção essa matéria, que começa

A Arteccom é uma empresa de design, especializada na criação de sites e responsável pelos seguintes projetos: Revista Webdesign :: www.arteccom.com.br/webdesign Curso Web para Designers :: www.arteccom.com.br/curso Encontro de Web Design :: www.arteccom.com.br/encontro Portal Banana Design :: www.bananadesign.com.br Projeto Social Magê-Malien :: www.arteccom.com.br/ong

na página 20. E depois me digam o que acharam. Matarazzo, obrigada pela entrevista, seja bem-vindo ao Brasil e esperamos contar com sua presença, seja em edições futuras da Webdesign ou em nossos próximos eventos. Sua experiência será extremamente valiosa para todos nossos designers.

Criação e edição www.arteccom.com.br

Produção gráfica

Um beijo,

www.prolgrafica.com.br

Adriana Melo

Distribuição www.chinaglia.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.

trocar essa palavrinha com vocês!


menu :: 5

apresentação

matéria de capa

pág. 4 quem somos

pág. 20 coleção Brasil Design: André Matarazzo

pág. 5 menu

pág. 22 entrevista pág. 28 portfólio

contato pág. 6 emails pág. 6 fale conosco

pág. 32 trajetória pág. 34 dia-a-dia e-mais pág. 38 debate: No limite do ego

fique por den tro pág. 8 bloguices pág. 10 métricas e mercado pág. 12 direito na web

pág. 42 e-mais: Organização das agências pág. 46 estudo de caso: GloboEsporte.com pág. 52 tecnologia na web: Layout líquido pág. 54 tutorial: Caminhando pelo HTML- parte1

portfólio

com a palavra

pág. 14 agência: Colletivo

pág. 58 webwriting: Bruno Rodrigues

pág. 18 freelancer: Wellington Rocha

pág. 60 marketing: René de Paula Jr. pág. 62 bula da Catunda: Marcela Catunda pág. 64 webdesign: Luli Radfahrer


6 :: emails

2 - Comentários de leitores: na verdade, já fazemos isso ;-) Na página do Clube do Assinante, disponibilizamos sempre uma

´

pergunta para a participação de vocês. As melhores respostas acabam sendo publicadas na revista (nesta edição, confira a página 36). Ah, e tem mais: a melhor de todas acaba levando

na web Assunto: Direito Sugestões, sugestões...

alguns prêmios interessantes!

na web Assunto: Direito Cursos no exterior Sou formada em Publicidade e Propaganda e trabalho com internet há um ano. Gostaria muito de me informar sobre Pós-Graduações / Especializações em Comunicação Digital tanto no Brasil quanto fora. Estou planejando uma viagem para o exterior para estudar, mas

na web Assunto: Direito Divulgação de sites

Gostei muito das novas seções

3 - Gerenciadores de conteúdo:

gostaria que vocês passassem

Desde o início de 2005, recebo

“Bloguices”, “Métricas e

estamos devendo uma matéria

umas dicas de cursos, faculdades,

muitos pedidos de clientes para

Mercado” e “Tecnologia na Web”.

sobre esse assunto :-( Já separamos

países etc. Obrigada!

desenvolvimento de newsletters

São seções muito boas e gostaria

algum material interessante e, em

para divulgação de produtos

que elas fizessem sempre parte da

breve, prometemos satisfazer sua

Cíntia Dumiense cintia@rage.com.br

revista. Queria ver uma matéria

curiosidade, ok? :-)

Olá, Cíntia.

quando uma newsletter deixa

sobre o que está acontecendo

4 - Edições anteriores: algumas

Em termos de cursos no Brasil,

de ser um “informativo” para se

com o Orkut atualmente, ou seja,

bancas disponibilizam as edições

podemos indicar a edição de

tornar um spam? Literalmente

a famosa quebra de sigilo dos

anteriores da revista. Porém, pode

junho de 2005 (nº18). Sobre

saberia a diferença, mas

usuários. Também queria sugerir

acontecer de você não encontrar a

especializações no exterior, vamos

algumas dicas seriam de grande

outra coisa: a cada edição, vocês

edição que quer nas bancas. Assim,

colocar esse tema na pauta de

valor. Além disso, quais são as

jogariam um tema para os leitores

pela internet, você tem a facilidade

reportagem. Por enquanto, procure

dicas para melhor divulgar a

comentarem. O prêmio? Nem

de adquirir qualquer uma delas.

acompanhar a “Coleção Brasil”,

empresa, aumentar o número de

iniciada em maio, onde designers

visualizações etc. Alguns clientes

brasileiros de destaque no mercado

compram aquelas listas de um

internacional abordam este assunto.

milhão de e-mails e querem enviar

E aguarde nossa matéria!

para todo aquele povo. Isso é

precisa ter, o texto vencedor seria publicado na revista. Ah, uma cobrança básica: vocês disseram que o Joomla! seria assunto para edição de março. Fiquei triste... E a sugestão que não poderia faltar: relançar as edições anteriores da revista, em banca. Comprar pela net é um pouco chato, já que tem o preço do frete. Fernando Farto fernandoperesfarto@gmail.com

Oi, Fernando. Mensagens como a sua são um estimulante para que possamos continuar o nosso trabalho. Sobre seus questionamentos, vamos por partes:

Assunto: Direito Flash e na 3Dweb Gostaria de ler uma matéria falando sobre design no Flash (Action Script 2.0 etc.). Outra coisa interessante seria uma

e serviços. Minha dúvida é:

válido? Devo aconselhá-los a não web Assunto: Direito Links dana revista

enviar?

matéria como está o uso de 3D na

Não seria interessante

André Barcellos contato@andrebarcellos.pro.br

internet.

disponibilizar, em um espaço no

Como vai, André?

site da revista, todos os links

Na edição de maio (nº29),

citados nas matérias?

promovemos um debate sobre

Agenilson Santana agesantana@hotmail.com

e-mail mkt vs. spam. Por lá, já é

pois recentemente criamos a seção

Olá, Agenilson.

“Tecnologia na Web” e sempre

dicas. Sobre as listas: além de ser

Ótima observação! Vamos colocá-la

procuramos temas interessantes

uma prática considerada antiética

na lista de desenvolvimento quando

para abordar. Continue

no mercado (www.antispam.br),

formos fazer um upgrade no site da

participando!

por não haver autorização de

revista. Aguarde! :-)

recebimento, muitos desses e-

Frederico Félix fredericofelix@gmail.com

Oi, Frederico. Suas sugestões são oportunas,

possível garimpar algumas boas

1 - Privacidade no Orkut: esse

mails são inválidos. Outro ponto

poderia ser um bom tema para

é que possivelmente seu cliente

a coluna “Direito na Web”, não

não estará atingindo o público-alvo

acha? Vamos encaminhá-la para o

do produto ou serviço anunciado,

Dr.Gilberto Martins.

por não ser uma lista que tenha recebido o devido tratamento.

fale conosco pelo site www.arteccom.com.br/webdesign :: Os emails são apresentados resumidamente. :: Sugestões dadas através dos emails enviados à revista passam a ser de propriedade da Arteccom.



8 :: blog

Bloguices

By Margarida Flores apareceu_a_margarida@hotmail.com

MARGARIDA QUENTÃO DE SÃO JOÃO Junho é mês de festa junina, de comer paçoca, pipoca, pé de moleque, de tomar quentão, jogar argolas pra ganhar brindes inúteis, baratos e que não servem pra nada, absolutamente pra nada. Me amarro numa comemoração junina, embora quando criança não gostasse de dançar quadrilha, mas mesmo assim a data me agradava e eu achava aquele clima bandeirolas deveras divertido. Uma coisa Volpi caipira, aqueles papéis de seda voando, aquele cheiro de churrasco, os professores pouco preocupados com as salas de aula e muito com suas barraquinhas. Era bom demais (http:// tinyurl.com/esqmg)! Pensando em junho, lembrei do meio do ano. Já estamos no meio do ano, ano em que a internet tá bombando cheia de novidades pra contar. Pois então, comecemos... GOOOOL! É DO BRASIL! Você sabe o que é TYBA? Saiba! É um banco de imagens com aproximadamente 800 mil fotos que mostram em sua grande maioria aspectos brasileiros como: arte e cultura, economia e indústria, turismo e natureza. Nosso ecossistema bem na foto. Ficou curioso? Então saiba também que boa parte desse acervo já pode ser visto on-line no site www.tyba.com.br. Enjoy em inglês e com versão em português, claro.

VÃO 35 MILHÕES AÍ? Mega-Sena é coisa do passado. A Finep (Financiadora de Estudos e Projetos) está bancando uma linha de crédito de nada mesmo que R$ 35 milhões para financiar projetos de inovação tecnológica. Além disso, a Finep está oferecendo R$ 4,5 milhões em bolsas de estudos para profissionais interessados em desenvolver pesquisa na área de inovação tecnológica. Se interessou? Topa? É até dia 14 de agosto. Leia o edital em http://tinyurl.com/eq2dj.

CHIQUES & FAMOSOS A Semana de Design de Milão está comendo solta. Basicamente, se alguém tem alguma importância no mundo do design, está lá, testemunhando pequenas loucuras da arte enquanto dá umas voltas na loucura maior ainda do complexo de exibições em Rheo Pero do arquiteto Massimiliano Fuksas. Tudo com foto. In italiano, capisci? http://tinyurl.com/ggjwn, http://tinyurl.com/egvgt, http://tinyurl.com/k8k7j (fotos feitas por visitantes, capisci?)


blog :: 9

LINKS BRINDES Se você está com raiva do mundo, de mau humor, tudo deu errado: Que tal acabar com a felicidade de quem está alegre enquanto você está triste? Pare numa fila de cinema e conte o final dos filmes. Nem precisa ter assistido antes. Tem até um trailer de Titanic

É MEU! ESSE É MEU! ESSE TAMBÉM É MEU!

2, aproveite para descobrir se é falso.

Em ano de Copa, Bill Gates tá na marca do pênalti. A justiça européia está em vias

http://tinyurl.com/tw32

de decidir se o nerd mais famoso do mundo cometeu abuso impedindo que outros

Cobrando um pixel por dólar, o dono desse site quer chegar a um milhão de verdinhas.

fabricantes de software tivessem informações para desenvolver seus aplicativos para

Mau negócio para quem anuncia, mas ótimo

o sistema Windows. Se condenado, pode ter que pagar dois milhões de euros por

para ele..

dia e ainda ter que divulgar as informações que todo mundo quer. Quem quer? http://tinyurl.com/zz2lf

http://tinyurl.com/c4l4t O site ficou uma droga. Dá até vontade de picar, moer e tocar fogo, mas não tem como. Mas espera lá. Agora tem. Nesse link você

É MEU! ESSE É MESMO MEU! É MEU! MEU! E MEU! - PARTE 2 E, na calada da noite, Bill deu um susto em quem usa o Windows “genérico”. Uma

pode descarregar sua raiva, torturando o maldito com instrumentos que vão desde ponta de cigarro até moto serra. Digite o

atualização ou hotfix oficial da Microsoft, que foi ao ar há uma semana, pode ser

endereço do site que acabou com seu humor,

considerada um “spyware” que identifica cópias piratas do sistema operacional.

e escolha sua arma.

Quem tem o recurso “Atualizações Automáticas” ativado, teve o tal hotfix instalado,

http://tinyurl.com/6utz4

e passou a receber alertas em seu desktop, algo como “Esta cópia do Windows não

Toogle. Não é o Google do Hortelino

é genuína”. http://tinyurl.com/ejln5 a “ameaça” (em inglês).

Troca Letras. E sim um site de busca que transforma sua pesquisa de fotos em um ASCII. Você pode achar que não precisa disso, mas um dia vai precisar. Não sei pra

1º ENCONTRO NACIONAL DE LIGHTWAVERS

quê, mas vai precisar. Acho.

A R3F vai reunir profissionais e usuários do software LightWave 3D. O evento

http://c6.org/toogle/

acontece em São Paulo, no sábado, dia 17 de junho, das 9h às 18h. Palestras

No país do futebol, em ano de Copa, nada melhor do que um monte de comerciais com

com nomes consagrados no produto apresentarão suas técnicas de modelagem,

o tema do momento.

texturização, animação, efeitos especiais e a integração do software com outras

http://tinyurl.com/k7spk

ferramentas de design digital. Corra pra garantir sua vaga. Elas são limitadas. Inscrições através do site http://www.r3f.com.

BLOG-SE BY LU Você sabia que existe um índice de blogs, fotologs etc.?

VOCÊ SABIA QUE?

Pois existe e a dica veio do Manoel Lemos,

No caderno Link do Estadão, tem um mini orkut para quem não tem medo de se

que mandou avisar que a coisa ainda tá

assumir publicamente? Dê uma olhadinha em membros em destaque: http://link.

começando : )

estadao.com.br/.

http://tinyurl.com/kvsha Esse menino me diverte. O blog tá

TÁ COM FOME? Pra quem não sai da frente do computador nem pra comer, agora pode fazer a sua comida do computador. Coisa de maluco?

começando, mas promete. Valeu, Sergio! http://tinyurl.com/zw7yg Você conhece um mutante? Alguém com

Um drive-forno pode preparar o seu alimento, desde que ele seja pequeno.

fator X? Dizem que eles estão entre nós.

Extremamente bizarro.

Será?

http://tinyurl.com/3hk4l

http://tinyurl.com/e6ffo


10 :: métricas e mercado

63%

dos 17,5 milhões de PCs em funcionamento no Brasil utilizam

800x600

pixels como

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%).

90%

dos sites em Flash não possuem estatísticas de acesso.

A HostConnection explica que a maior parte dos sites de estatísticas só contabilizam o acesso às páginas em HTML. Fonte: www.flashcounter.com.br

Média Salarial Brasil - Abril/2006 Cargos

Valores (R$)

Analista Júnior Desenvolvimento de Internet / Sistemas Web

2.830,00 (Fonte: 165 respondentes)

Analista Pleno Desenvolvimento de Internet / Sistemas Web

4.271,00 (Fonte: 203 respondentes)

Analista Sênior Desenvolvimento de Internet / Sistemas Web

5.586,00 (Fonte: 172 respondentes)

Analista Programador(a) Web

2.305,00 (Fonte: 236 respondentes)

Coordenador(a) de Projetos Web

6.379,00 (Fonte: 74 respondentes)

Editor/Produtor de Conteúdo Web

2.345,00 (Fonte: 37 respondentes)

Webdesigner Estagiário (a)

529,00 (Fonte: 142 respondentes)

Webdesigner Trainee

1.347,00 (Fonte: 96 respondentes)

Webdesigner

2.316,00 (Fonte: 187 respondentes)

Web Development

3.512,00 (Fonte: 58 respondentes)

Webmaster

2.450,00 (Fonte: 198 respondentes)

19

horas e

24

Fonte: Catho

minutos de navegação em março.

Segundo o IBOPE//NetRatings, a contagem representa um recorde de tempo on-line na web brasileira. A categoria “comunidades”, que engloba sites de relacionamento, blogs, fotoblogs e videoblogs, foi uma das principais responsáveis (3h46min de uso individual), sendo visitada por 74% dos internautas domiciliares brasileiros.

112 brasileiros.

mil domínios “.com” pertencem a usuários Fonte: Nomer.com

Orkut

Qual resolução de tela você costuma projetar seus sites? Total de votos: 194 800x600 - 47%

(www.orkut.com) é o site mais acessado

1024x768 - 41%

por usuários brasileiros.

Acima de 1024x768 - 11%

É o que aponta uma pesquisa de tráfego de sites, realizada pelo

640x480 - 2%

site Alexa.com, em maio. acesse e participe! www.arteccom.com.br/webdesign

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


métricas e mercado :: 11

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 Quando a internet se torna realmente popular

Karaokê Albany

Você passa a ler sobre ela, não mais

A agência de publicidade DM9DDB, ganhadora do

nos cadernos especializados dos jornais,

Grand Prix Cyber em Cannes no ano passado, aprontou mais

mas nas seções comuns, como aconteceu

uma, agora para Albany. Criaram um karaokê virtual em que

no dia 26/4, na capa do caderno Metrópo-

os usuários podem efetivamente cantar e gravar suas versões

le do Estadão. O Orkut, que ultimamente

das músicas. Muito bem desenhado, construído, executado.

tem freqüentado também as páginas po-

Se for bem traduzido, é candidato forte a algum prêmio mun-

liciais com as confusões sobre violação de

do afora. Sem falar que é uma ótima forma de botar todo

privacidade e crimes, apareceu retratado de forma comum

mundo cantando as músicas da campanha. Difícil é agüentar

num caderno sobre o cotidiano, em uma matéria que fala

as desafinadas dos usuários! :-) Visite e grave a sua versão:

sobre uma mudança no sistema e como isso está afetando a

http://tinyurl.com/pbhx5.

vida das pessoas.

Bannerblog, parada obrigatória Bannerblog é um blog de

O ClickZ publicou um artigo com

uma turma da Austrália que se

números muito impressionantes sobre

encarregou de um tema que realmente estava fazendo falta:

a ‘blogosfera’, o ‘universo’ mundial dos

um repositório de banners legais. AgênciaClick, Almap, DM9 e

blogs, seus posts e seus autores. Pelo es-

Euro estão lá, além de agências de todo o mundo. Pelo o que

tudo, o número de blogs existentes no mundo dobra a cada

deu para perceber, o arquivo ainda não é muito grande (pouco

seis meses. O gráfico de crescimento dos blogs fala por si só.

mais de 500 peças), mas a iniciativa é fantástica. Visite o Ban-

É para ficar de boca aberta (http://tinyurl.com/o4dyg).

nerBlog e não deixe de enviar contribuições para o arquivo ir

Quase 12 milhões de brasileiros no Orkut

crescendo: http://www.bannerblog.com.au/.

Fiz uma conta rápida para chegar nesse número. O Orkut diz que estou conectado a 16.750.335 pessoas através de 770

A Globo.com lançou, no

amigos. Assumo que estes 16 milhões sejam a totalidade dos

começo de abril, uma nova

usuários da comunidade. Pelos dados divulgados pelo pró-

versão da sua home, com uma

prio Orkut, os brasileiros (declarados) seriam 71,48%, o que

distribuição mais equilibrada

dá um total de 11.958.843 de perfis declarados brasileiros na

entre entretenimento, notícias e esportes e a volta do menu

comunidade. É preciso levar em consideração que muita gen-

de navegação na esquerda, aberto. Desde 2000, quando o

te tem mais de um perfil e que muitos não declaram o Brasil

portal foi lançado, uma série de opções de home foram co-

como seu país, além da possibilidade de que 16 milhões não

locadas em prática, cada uma adequada a um determinado

sejam o número total de usuários da comunidade. De todas

momento da web e da própria Globo.com. A evolução deste

as formas, a estimativa de quase 12 milhões de brasileiros no

trabalho, desde a versão 1 de 2000, está guardada na página

Orkut fica bem aproximada. Uau!

do Felipe Memória, no Flickr (http://tinyurl.com/ljgp9).


12 :: direito na web

Direitos de autor na web “Posso colocar músicas para tocar em meu site, seja ele pessoal ou comercial, desde que eu cite o nome do Grupo/Conjunto/Cantor e o nome da música?” Luciano Machado (camaleao@camaleao.com) Caro, Luciano.

toda). Porém, a lei diz que isso vale apenas

Se o seu site for comercial, a simples

para fins de uso pessoal e não para o de dis-

menção do compositor e do intérprete

Gilberto Martins de Almeida Advogado formado na PUC/RJ, com Mestrado na USP e cursos em Harvard e no M.I.T. ExGerente Jurídico da IBM, onde trabalhou por 11 anos, no Brasil e nos EUA. Sócio de Martins de

ponibilizar a terceiros.

da música não será suficiente, pois nesse

Portanto, você se encaixaria no “espíri-

caso não há dúvida de que os titulares dos

to” geral da lei (uso não comercial), mas não

direitos de autor têm direito de conceder

necessariamente na “letra” dessa exceção.

ou não a autorização respectiva, podendo

O que significa que, em última instância, suas

exigir pagamentos.

chances dependeriam de o juiz que exami-

Note que o caráter comercial, às ve-

nasse a questão ser adepto da interpretação

zes, se revela de forma indireta e mesmo

finalística, ou da interpretação literal. É bas-

assim o Judiciário o tem considerado como

tante incerteza, não?

requerendo prévia autorização do autor.

Por isso é que tem havido uma “grita”

Foi o que aconteceu, por exemplo, com

bastante ruidosa nos EUA e na Europa (por

especializado.

supermercados que colocaram fundo musi-

parte de movimentos como o do “copyleft”,

Envie sua dúvida para:

cal para tornar mais agradável a freqüência

o do “software livre” etc.), postulando fle-

pelos fregueses, teoricamente favorecen-

xibilização do regime do direito de autor

do mais compras. Eles foram condenados a

quanto à sua inserção na era digital, tendo

pagar pela utilização das músicas.

em vista o atual desequilíbrio entre os privi-

Almeida - Advogados, escritório

redacao@arteccom.com.br

Mas, supondo que em seu site os visitantes não venham a comprar qualquer

légios dos titulares dos direitos e, de outro lado, o interesse da coletividade.

coisa - nem direta, nem indiretamente -, a

Como sempre poderá haver alguém

interpretação jurídica nesse caso, parado-

pressionando para cobrar direitos autorais.

xalmente, se torna mais complicada. É que

Dessa forma, o mais prudente é explicar a

no Brasil (ao contrário do que acontece nos

natureza do site, convidar a uma visita para

EUA) não existe tradição jurisprudencial

a comprovação e pedir a aprovação de quem

de reconhecimento da teoria do chamado

de direito, para evitar riscos que, por en-

“uso justo” (fair use).

quanto, ainda persistem.

Nossa lei dos direitos de autor concede exceções ainda muito limitadas para o livre uso de obras autorais. Uma delas é a de executar pequenos trechos (não a obra



14 :: portfólio agência - colletivo

O instinto Colletivo

do design

Se formos apontar no atual modelo de sociedade qual seria uma das melhores formas de representação da democracia, certamente os ônibus receberiam boa parte das indicações. Mas, e na produção do design, onde encontramos exemplos de manifestação democrática? A resposta parece estar presente no DNA do Estúdio Colletivo (www.colletivo.com.br). “Vamos completar três anos no final de 2006. Trabalhamos juntos desde a época da faculdade (Anhembi Morumbi), isso há uns cinco anos. A idéia do nome foi baseada em cima do conceito do ônibus (sinônimo de coletivo), que agrega todas as raças, todos os segmentos, é um transporte democrático, nômade e sempre tem histórias diferentes. Do ponto de vista do design, é o que gostaríamos de representar, essa sempre foi nossa escolha, porque refletia nossas idéias na época, e ainda reflete”, revelam Vanessa Queiroz, responsável pelo atendimento e criação, Marcelo Roncatti, responsável pelo planejamento e diretor de arte, e Fabio Couto, responsável pela programação e animação.


portfólio agência - colletivo :: 15

“A idéia do nome foi baseada em cima do conceito do ônibus (sinônimo de coletivo), que agrega todas as raças, todos os segmentos, é um transporte democrático, nômade e sempre tem histórias diferentes” Disciplina e experimentalismo para vencer os obstáculos

Além disso, eles afirmam que a prática ajudou a mostrar como funciona e quais são as particularidades

Os dois anos de existência do estúdio serviram

existentes no mercado profissional do design para web.

para que eles tirassem algumas boas lições: sonhar não

“Soluções engessadas de sites geram sempre problemas,

custa nada, mas lembre-se de manter sempre os pés no

ao contrário da otimização que prometem. Por isso, cada

chão. “Definitivamente, para nós, o começo foi muito

projeto on-line que desenvolvemos é individual e focado

complicado, principalmente na parte financeira. Levamos

no conceito do serviço ou produto, lembrando sempre

n o s s o s c o m p u t a d o re s p e s s o a i s p a r a u m l o c a l o n d e

qual é a linguagem ideal para seu respectivo público-

podíamos trabalhar em equipe. A partir daí, tentamos

alvo. E não menos importante: discutir com o cliente cada

pegar qualquer trabalho que se apresentasse para que

recurso disponível no projeto de um site antes de seu

t i v é s s e m o s u m m í n i m o n e c e s s á r i o p a r a s o b re v i v e r.

desenvolvimento, considerando que é fundamental um

Sabíamos que se o estúdio permanecesse com suas contas

grande interesse e envolvimento do cliente em todas as

em dia, durante pelo menos dois anos, teríamos mais

etapas de discussão do projeto”, orientam.

chances de crescimento”.

A internet move montanhas

A tática deu certo e o objetivo inicial foi superado.

Para quem ainda desconfia que a internet ainda

“Sobrevivemos porque fomos extremamente rígidos e

não seja capaz de superar barreiras para os profissionais

disciplinados com nós mesmos. A cobrança interna era

interessados em divulgar e expandir a cartela de clientes

muito mais forte do que é atualmente. Tínhamos que

em diferentes cantos do mundo, o Estúdio Colletivo é a

conseguir, falhar não estava nos planos. Mas foi complicado,

prova viva desse novo cenário.

em muitos meses tirávamos o equivalente a um salário

“Já fizemos exposições na França, trabalhos

mínimo. Com o tempo nos estruturamos, organizamos

nossos foram divulgados na Austrália e no Canadá e

nossos processos e estamos conseguindo uma estrutura

recentemente participamos de um projeto na Malásia.

bem bacana para quem começou caoticamente”.

Enfim, é extremamente positivo e nunca tivemos in

Eles não esquecem também da importância dos

loco nestes trabalhos. A web sempre foi a nossa

p ro j e t o s e x p e r i m e n t a i s . “ O s p r i m e i ro s p ô s t e re s d e

ponte companheira para estabelecer contato com

caráter experimental (e promocional) que desenvolvemos,

outros designers no mundo e também clientes.

juntamente com site, ajudaram na visibilidade do estúdio

Quem não for ‘amigo’ da internet e entender como

em alguns segmentos do design. E isso nos trouxe diversos

ela pode ser positiva no universo do design terá

trabalhos comerciais que, de forma positiva, nos ajudaram

muitas dificuldades”, afirmam, em coro uníssono,

a crescer. Portanto, o que mais nos ajudou e ainda ajuda,

Vanessa, Marcelo e Fabio.

s ã o o s p ro j e t o s e x p e r i m e n t a i s q u e e s t a m o s s e m p re desenvolvendo”.


16 :: portfólio agência - colletivo

Criatividade em primeiro lugar

Eles não são e nem pretendem ser candidatos, mas

Para que o instinto coletivo do estúdio possa atingir

as promessas para o segundo semestre de 2006 incluem

sua plenitude na criação e desenvolvimento de projetos,

uma nova versão do site do estúdio, incursão pela área de

eles consideram uma boa estruturação do ambiente físico

Motion Design, além de podcast e o lançamento de uma

como um estímulo para se alcançar tais objetivos.

loja virtual.

“Muitas pessoas se surpreendem quando nos visitam

“Estamos produzindo nossos primeiros trabalhos em

pela primeira vez, pois encontram um ambiente totalmente

Motion Design e estamos muito ansiosos para ver como

familiar e livre de dogmas corporativos. Estruturas rígidas

ficará todo o projeto finalizado. Um website totalmente

normalmente solidificam uma ditadura criativa, criam-

n o v o s o b re o e s t ú d i o j á e s t á s e n d o p ro d u z i d o , e l e

se barreiras no processo e prejudicam nossos objetivos.

provavelmente terá podcast, entre outras coisas. Também

E muita liberdade pode não ser positiva se não for bem

estamos fazendo uma pequena loja virtual, que não terá

pensada. Somos um estúdio que trabalha com diversos

o nome do Colletivo, pois será um projeto paralelo ao

segmentos do design e nossa proposta é a criatividade em

estúdio. A loja só estará disponível na internet, seu objetivo

primeiro lugar. Tentamos dar total liberdade para todos

será funcionar como um laboratório de produtos com livre

que trabalham aqui, mas sem esquecer de suas tarefas e

criação. Posters, buttons, camisetas, protetor para ipods

disciplinas”.

e quem sabe até alguns brinquedos, tudo está no caminho.

Segundo semestre promete!

cases Spezzato Teen Verão 2006 www.spezzato.com.br “Nossa cliente há três anos, a Spezzato Teen vem com uma evolução constante na maneira de expor sua coleção na internet. O tema da coleção do site em questão, " adventure" , nos fez criar um mundo por onde o internauta tinha possibilidade de viajar pelo cenário criado, chegando em cada link com a experiência de 72 transições de telas diferentes. Utilizamos os desenhos e as interferências que criamos para todo o material da campanha, que por serem desenhos vetorizados, fez com que a navegação ficasse bem mais leve.”

Esperamos que gostem quando sair”, finalizam.


Cavalera Verão 2006 www.cavalera.com.br

“O nosso desafio era desenvolver um site tão eficiente e visualmente atrativo, quanto os anteriores. O diferencial, no caso, era um reposicionamento na marca, fazendo com que o produto Cavalera aparecesse de maneira mais efetiva, além de dar um destaque maior ao jeans. Mesmo com o material enviado, a criação foi totalmente desenvolvida pelo estúdio dentro da temática e o resultado foi um site funcional, com uma animação em Flash leve e agradável.”

Splashblue www.splashblue.com.br

“Site de um dos melhores buffet infantis de São Paulo. Nesse case, tivemos a experiência de lidar com um mercado que aproveita de maneira precária a internet. Muitos dos concorrentes ainda possuem sites em HTML. O resultado visual desse trabalho foi tão bom, que acabamos por desenvolver todo o material gráfico deles, baseado nessa nova estética.”


18 :: portfólio freelancer - Wellington Rocha

No caminho do bem Wellington Rocha Contato: well@artpixel.com.br Site: http://well.artpixel.com.br

De uma fantasia de criança até o descobrimento do mundo maravilhoso do design para web. A caminhada profissional de Wellington Rocha não faz parte de um fazde-conta, mas serve como um incentivo para quem ainda acredita que sonhos podem se tornar realidade. “Quando criança imaginava ser designer de automóveis, tinha pastas cheias de desenhos de carros de minha autoria. Em 1998, trabalhava em uma empresa no controle de estoque, porém não agüentava mais, queria trabalhar criando algo que não sabia exatamente o que seria”, conta. “Hotsite comemorativo da Páscoa. Feito em Flash, com cores vivas e alegres.”

fazer um miniportfólio em Flash, contendo algumas peças e animações, gravei em um disquete e mandava junto ao currículo. Semanas depois, veio o primeiro contato telefônico. Na semana seguinte, a primeira entrevista. Mais ou menos três semanas depois, o meu primeiro emprego, onde trabalhei por sete anos”. A experiência serviu para que ele aprendesse http://well.artpixel.com.br

algumas peculiaridades que envolvem a profissão, como

O pontapé para que tal resposta fosse encontrada

a importância de se organizar as tarefas e como estipular

surgiu quando ele decidiu comprar um computador para

os preços dos projetos. “Faça um cronograma detalhado

aperfeiçoar o seu trabalho. “Assim, tive meu primeiro

de cada um. Assim, você consegue organizá-los e mantê-

contato com o Photoshop. Comecei criando papéis de

los sob controle. Isso ajuda não só na hora de priorizar as

parede para uso próprio e montagem de fotos para amigos.

tarefas, mas também no momento de encaixar um novo

Rapidamente, estava colorindo e restaurando fotografias

projeto, saber o status real de cada um deles. Em termos

antigas. Um dia, um amigo resolveu criar um site. Ofereci-

de preço, procuro saber exatamente o que o cliente quer,

me para ajudá-lo e acabei fazendo o site sozinho. Ali,

transformo tudo em hora de desenvolvimento e multiplico

percebi o que realmente queria fazer e não parei mais”.

pelo meu valor hora, chegando a soma total”, revela.

M a s c o m o n a d a v e m f á c i l n a v i d a , We l l i n g t o n

Para o futuro, Wellington faz planos de trabalhar com

percebeu que seria preciso batalhar para conquistar seu

a área de jogos. “A realidade é muito dura. Você se depara

espaço no mercado. “No momento que achei que estava

com situações e percebe que precisa estudar muito. Assim,

preparado para trabalhar profissionalmente, surgiu a dura

é preciso ficar sempre antenado, buscando o novo e o

realidade: meu currículo era muito pobre. Então, resolvi

melhor para cada projeto”.



20 :: Coleção Brasil Design - vol.2

1. Gui Borchert

2. André Matarazzo

3. Nando Costa

Coleção Brasil Design Como os designers brasileiros vêm conquistando o mercado internacional


Introdução :: 21

D entre as principais propostas de paz formuladas pela Associação Brasil Soka Gakkai Internacional (BSGI), encontramos uma definição envolvendo os atributos necessários para que uma pessoa seja considerada como um cidadão do mundo. Segundo o documento, ela precisa apresentar “uma mudança em sua visão de bem-estar da Humanidade. Esse grande movimento dedica-se a encorajar as pessoas a conscientizarem-se de seu próprio e ilimitado poder e assumirem a responsabilidade pelo futuro da Humanidade”. Se alguma entidade internacional decidisse premiar um profissional por contribuir para o desenvolvimento da área de design, certamente teríamos um candidato brasileiro nesta disputa. Estamos falando de André Matarazzo, que já mostrou o valor de seu trabalho em países como Canadá, Holanda, Suécia e Japão. A escolha da carreira desse paulista para figurar no segundo volume da “Coleção Brasil Design” não foi por

volume 2

acaso. Ela apresenta uma das vertentes de nosso design, é um ótimo exemplo de como enfrentamos quaisquer desafios e como contribuímos para o desenvolvimento dos mais diferentes mercados pelo mundo. A seguir, você poderá conferir quais são os elementos que compõem o estilo de Matarazzo, que retorna ao país com um portfólio recheado de projetos interessantes e com a pretensão de desenvolver uma nova proposta de agência interativa no país. No último volume desta coleção, vamos apresentar a história e os trabalhos realizados por Nando Costa, hoje figura de destaque no mercado americano.


22 :: Coleção Brasil Design - vol.2

Cidadão do mundo (do design) Entrevista: André Matarazzo, criador da agência Gringo.nu De volta ao Brasil, André Matarazzo anunciou recentemente a criação da Gringo.nu. Nesta entrevista, ele revela um pouco de sua experiência internacional, qual é o valor do design nacional lá fora e os desafios que espera encontrar com sua nova agência. Wd :: Do Canadá ao Japão, passando pela Holanda e Suécia. Diante de sua experiência profissional, podemos apontá-lo como um “cidadão do mundo (do design)”. Qual é a visão que os estrangeiros fazem do design brasileiro? Nossos clichês culturais (samba e futebol) ainda são muito fortes lá fora? André :: Sim, todos os clichês brasileiros de futebol e mulher pelada são fortes lá fora. Mais nos EUA e no Canadá do que na Europa. Pelo fato de termos muitos descendentes europeus aqui, os de lá também sabem um pouco mais sobre o nosso país. Já nos EUA, quando eu dizia que era brasileiro, notava que para eles soava qualquer coisa como boliviano ou hondurenho. Eles não têm uma exata noção do nosso país. E isso se aplicava ao design também. Já na Europa, o Brasil é visto como uma terra encantada e exótica. Vários sabem das mazelas sociais, mas também conhecem um pouco da cultura. Encontrei diversos europeus que conhecem muito mais do Brasil do que eu. Vários sabem da história da construção de Brasília, do nosso presidente etc. Muitos acham o português a língua mais linda do mundo e estão aprendendo. Ainda por cima existe esse renascimento da cultura brasileira atual no mundo. Até em Tóquio vi lojas de roupas bem descoladas e caríssimas vendendo Havaianas e tocando bossa-nova. O Brasil é hoje uma “marca” internacional bem cool.

Wd :: Quais são as dificuldades que um designer brasileiro encontra para se adaptar no mercado de trabalho no exterior? E o que é preciso fazer para vencer estes obstáculos? André :: Acho que a maior dificuldade é o profissionalismo do mercado internacional. Não basta você ser um designer que desenha bem, porém estoura prazos, não trabalha em equipe, tem atitude de estrela... Isso mata qualquer ponto a seu favor. Tem que saber lidar com o cliente pessoalmente e muito diplomaticamente, não pode “meter o pau” no trabalho alheio, não pode atrasar para nada em hipótese alguma. Na verdade, esses detalhes tão


entrevista - André Matarazzo :: 23

intrínsecos da nossa herança cultural, isso tem que ser revisto para fazer uma boa transição para o mercado internacional. Outra coisa mal vista é profissional que pula de agência em agência. No mercado frenético e desorganizado de São Paulo, parece-me que isso é que dá um bom nome e grana a um profissional. Esse eterno descontenta-

“Até em Tóquio vi lojas de roupas bem descoladas e caríssimas vendendo Havaianas e tocando bossa-nova. O Brasil é hoje uma ‘marca’ internacional bem cool”

mento impulsiona o profissional para frente. Na Europa,

inverno não é rigoroso, imagino que haja menos saudades

não existe confiança num profissional que pula de galho

e problemas de adaptação. Agora, ficar na Noruega, onde

em galho. Como eles investem no profissional (desde ar-

tudo é diferente e, além disso, o povo é frio, a temperatura

ranjar o visto, alojamento, cursos, viagem etc.), mostrar

é abaixo de zero e escurece às três da tarde durante quatro

que você a qualquer momento pode pegar a sua mala e ir

meses, aí fica mais complicado. Frio é uma delícia, porém

embora para outro lugar que te contratar por 500 euros

depois de ficar soterrado em neve e escuridão durante al-

a mais... Pega muito mal. Uma das coisas que mais conta

guns meses, qualquer brasileiro reclama.

pontos no currículo de um profissional estrangeiro é o que

Wd :: Você começou sua experiência profissional lá

ele faz pela agência. Como ele ajudou a agência a chegar

fora, em 2000, no Canadá, e foi justamente na época da

num outro patamar criativo etc. No profissional brasileiro,

famigerada “bolha da internet”. O que mudou no coti-

o que conta é o que ele tem no portfólio e quantos prêmios

diano do profissional que trabalha com internet?

ele ganhou. É a velha história do foco coletivo (Europa) e o foco individual (Brasil).

André :: Naquele tempo, a internet era um bicho meio inexplorado. Ninguém sabia muito em que direção tudo

O idioma é sempre um problema. Achei difícil no

estava caminhando, mas todos sabiam que estava cami-

Japão, onde poucos na agência falavam inglês. Mas, na

nhando rápido e para alguma boa direção. Depois veio

Suécia, na Holanda, os negócios eram feitos basicamente

o “crash”, onde todos imaginaram “acho que tudo esta

em inglês. Então, dependendo da sua área (design, por

indo muito rápido”. Nesse período, os salários baixaram,

exemplo), basta inglês. Agora, para virar um diretor de

as agência-clubes (com piscina, creche, bar, festas, DJs e

criação, juntar uma equipe, convencer um cliente de algo,

tal) fecharam ou diminuíram o luxo bruscamente e o mer-

é necessário que se fale a língua local. No Japão, eu tinha

cado ficou muito menos elástico. Hoje, estamos vivendo

uma tradutora para reuniões.

um segundo boom, mais estruturado, com uma curva bem

O ritmo de trabalho é muito mais leve do que numa

ascendente. Atualmente, o profissional tem mais chances.

agência de São Paulo, por exemplo. Como tudo é muito

Tanto de mobilidade, quanto de propor algo novo que

mais organizado, é esperado que o funcionário cumpra seu

agite o mercado. Acho que vivemos uma época bem sau-

horário de trabalho (das nove às 17 horas, mais ou menos).

dável para novas descobertas on-line.

Qualquer coisa extra conta pontos favoráveis para você.

Wd :: Provavelmente, a diversidade de culturas que

Mas nada parecido com São Paulo, onde o pessoal chega

você vivenciou ao longo de sua carreira trouxe algum tipo

às 10, 11 e fica até às 22. Novamente, em Nova Iorque ou

de influência em seu trabalho. De que forma a cultura bra-

Londres, os horários são mais barra. Já na Escandinávia, se

sileira e de outros países marcaram seus projetos?

você fica depois das seis, você vai fechar a agência sozinho todos os dias.

André :: O meu design inicial era muito inconseqüente. Mas também assim era o mercado e as soluções

Saudades de família? Isso depende muito da perso-

que propúnhamos aos clientes em 1998, 1999. Ninguém

nalidade do profissional e para onde ele vai. Ficando na

sabia bem o que era legal, o que dava certo. Métricas de

Espanha, um país mais próximo a nossa cultura, onde o

sucesso não eram nem cogitadas.


24 :: Coleção Brasil Design - vol.2

Depois de trabalhar na Blast, descobri que tudo o que

Exatamente por isso projetos pessoais podem ser tão mais

entra no design tem que ser pensado e estar à prova de

interessantes do que projetos comissionados, onde você

furos. Porque no Brasil muita coisa era defendida como

parte do problema e busca a solução. Eles são a verdadeira

“assim é legal” e essa defesa esotérica não é uma boa

chave para experimentação e inovação.

base para um design funcional. Então, aprendi a pensar

Na hora de criar, eu parto do princípio que o site

com muito mais cuidado em absolutamente tudo. Desde o

precisa agradar a mim e a minha equipe. Se nós, que tra-

conceito visual geral e embasamentos gráficos até na exata

balhamos nesse meio e não caímos em cilada on-line por

serifa da minha fonte e por que deveria ser assim.

termos boas referências e mal clicamos em banners, aca-

Por final, depois de passar um tempo respirando design de primeira no Japão, Holanda e Suécia, eu passei

barmos curtindo e usando muito o projeto que criamos, tenho certeza de que será uma peça de sucesso.

por uma fase de me livrar de tudo que era supérfluo e des-

Também existe um desafio pessoal: sempre procuro

necessário. Fiquei mais minimalista, mas tento manter a

encontrar uma solução que ainda não foi tentada, algo dife-

energia inicial da proposta. Hoje, acho que um bom design

rente, uma nova tecnologia, uma nova execução, um novo

é algo funcional, focado, inteligente e claro. Não gosto de

conceito, uma nova interatividade... Sem isso, não tenho

coisas obscuras e desnecessárias, a não ser que seja exata-

prazer nenhum em trabalhar. Quando você senta para fazer

mente essa a proposta da peça - que normalmente não é.

um brainstorming para um projeto e parte do princípio que

Um bom designer absorve tudo a sua volta. Por isso,

o céu é o limite, tudo vem mais fácil. Fora que, na Gringo,

tantos designers bons hoje querem sair do país. Pegar um

nossa proposta é ser uma agência que descobre e vai atrás

menu de um boteco em Estocolmo é um colírio para os

somente de idéias criativas e nunca antes vistas, portanto

olhos, porque tudo está perfeito, lindo, coeso, bem feito.

difíceis. Por isso, para nós, o céu é sempre o limite e o

Você anda na rua e absolutamente tudo tem um design

prazer é altíssimo - e o trabalho flui mais fácil.

lindo. Tudo. Faz parte da cultura. Depois que você passa

Wd :: Ainda nesta entrevista, você cita que um dos prin-

por um período de adaptação, você se cobra e a agência é

cipais aprendizados com o mercado na América Norte foi o

cobrada a fazer algo muito melhor do que está a sua volta.

foco na produção baseada na arquitetura da informação e na

Por isso, é tão interessante e desafiador trabalhar com uma

usabilidade. Como estes dois conceitos devem ser aplicados

cultura que entende design.

na construção de interfaces em projetos web?

Já no Brasil, ou nos EUA, onde, fora um nicho minús-

André :: Alguns projetos requerem uma equipe mul-

culo do marketing de alto luxo que é razoavelmente bem

tidisciplinar que cuide de várias facetas do site que não

resolvido, o resto é basicamente medíocre. Assim é mais fácil se acomodar, achando que o seu trabalho, por estar

“Se você acha que tem um portfólio

acima da média, já é bom. Fora que a nossa média brasi-

ruim, faça-o ficar melhor com peças

leira é muito baixa. Wd :: Um dos cases de destaque em seu portfólio é o “Daddy (2000)”. Em entrevista para o site Media Inspiration, você diz que se orgulha deste projeto porque ele se iniciou através de um simples conceito e por ter se tornado um dos mais inovadores em seu portfólio. Você segue algum tipo de método na hora de criar? Quais aspectos garantem a originalidade e a inovação de um projeto? André :: Esse projeto foi interessante porque primeiro achei uma solução. Depois fui buscar o problema.

pessoais, se envolva, batalhe!”


entrevista - André Matarazzo :: 25

“Uma das coisas que mais conta pontos no currículo de um profissional estrangeiro é o que ele faz pela agência. Como ele ajudou a agência a chegar num outro patamar criativo etc.” são apenas focadas em conceitos e elementos visuais.

Aqueles que sabem fugir dos modismos farão sites

Para fazer um site grande e funcional, acho que devem

que terão mais longevidade. Bato o olho em sites que

existir vários profissionais especializados em coisas do tipo

usaram elementos “da moda” de certas épocas e me dão

conteúdo (Content Strategist), informação (Information Ar-

calafrios. Sei até dizer que mês e que ano provavelmente

chitect), usabilidade (Usability Expert) e por aí vai. Canso

ele foi concebido. Não tem nada pior.

de ver sites de agências grandes não tão bem resolvidos

Wd :: A Semana de Arte Moderna marcou um pe-

- muito mais por falta desses profissionais especializados

ríodo definitivo na construção de um pensamento

do que por falta de gente com paixão de fazer. Canso de

artístico nacional. Hoje, é possível apontar algum mo-

ver redator testando site e atendimento fazendo o grid de

vimento que influencie o design para a web? Pela sua

informação do site. Não vai ficar um trabalho espetacular.

vivência de mercado, é possível afirmar que já possuímos

Wd :: Existem vantagens e limitações quando fa-

uma escola de design com um estilo próprio?

lamos do uso de cores e de tipografia em projetos de

André :: Não sei se estou preparado para responder

internet. Como você procura trabalhar estes dois ele-

isso. Sei que não entendo profundamente de arte e também

mentos em seus trabalhos?

não sou de acompanhar muito os movimentos atuais. Muito

André :: A cada dia essas limitações vão caindo mais por

mais me interessa o “porque” e o “pra onde” da vida on-line

terra. Hoje, por exemplo, não vejo nenhuma limitação tipo-

do que o “como”. Então, estou mais atrelado com conceitos

gráfica ou de cores em projetos on-line, por exemplo. Lógico

e soluções hoje em dia do que movimentos visuais.

que limitações existem, você não vai usar uma fonte de dis-

Temos muita gente marcante no design brasileiro. Al-

play para um texto minúsculo de cinco parágrafos apertados.

guns ficaram no Brasil, outros foram para fora. Esse é um

Mas você também não faria isso na mídia impressa.

dos nossos grandes problemas. O cara que é bom e tem

Então, graças a deus, acabou a fase de fontes “espe-

condições de sair do país, acaba saindo para ver o que

ciais” pixelizadas, cores X e gradientes Y. Claro que isso

consegue alcançar fora. Por isso, temos um grande con-

leva em conta o target final, existe uma grande diferença

tingente de gente ótima que não está mais aqui. No geral,

na produção de uma solução para um público que são se-

acho o design brasileiro interessante em matéria de cores e

nhoras senis do meio-oeste americano e adolescentes ricos

formas. Muitos ilustradores interessantíssimos, muitas cola-

brasileiros. Porém, sempre existe alguma moda do mo-

gens incríveis. Isso é um pouco do reflexo de nossa cultura,

mento, mas isso é o grande perigo, porque o projeto fica

uma colcha de retalhos de pobre com rico, de europeu com

sempre datado e envelhece mal.

índio, de catolicismo com psiquiatria... É interessante! Wd :: Apesar de você não possuir formação em curso superior, você é considerado atualmente um dos principais designers do mundo. Isso de alguma maneira atrapalhou sua caminhada profissional? André :: Não acho que estou nem perto de ser um dos grandes designers do mundo. Fiz algumas escolhas certas sempre por aprendizado e oportunidades em vez de grana. Isso ajuda a ter a chance de fazer coisas legais. E também me empenhei e tive sorte. Agora, o fato de eu não ter curso


26 :: Coleção Brasil Design - vol.2

“No profissional brasileiro, o que conta é o que ele tem no portfólio e quantos prêmios ele ganhou. É a velha história do foco coletivo (Europa) e o foco individual (Brasil)” superior em design nunca me atrapalhou. O mundo do design é extremamente democrático. Sempre consegui trabalho mandando um e-mail para a agência X e falando: “é isso que faço”. Nunca tive nenhum contato, além disso. E sempre funcionou. Se amanhã chegar um cara de 16 anos com um portfólio de cair o meu queixo, mesmo que sejam só trabalhos de escola ou pirações da cabeça dele, eu contrato na hora! É mais ou menos isso o que acontece no mundo inteiro. Portfólio nesse nosso setor fala muito mais alto do que qualquer curso. Aliás, se eu recebesse a visita desse gênio de 16 anos ou um cara formado pela Hyperisland ou pela Cranbrook que tivesse um trabalho ok, rapidamente contrataria o cara de 16 anos. Dom e paixão pelo design são muito mais importantes do que qualquer curso. Cursos são muito interessantes e importantes na formação de um designer, mas diplomas, menos. Wd :: Você iniciou sua trajetória em uma empresa de hospedagem web em Campinas e decidiu se lançar no mercado de design, apostando na curiosidade, em sua coragem e através da construção de um portfólio envolvendo produção para pequenos clientes e experimentos pessoais no Photoshop. Quais dicas você daria para quem quer entrar neste mercado? André :: Dica número um, a mais importante: especialize-se! Hoje, um cara que faz médio HTML, sabe um pouco de Flash e que “não faz feio” em design está fadado a sempre fazer trabalhos medíocres. Agora, um cara que tem uma grande paixão por Flash, sei lá, e se dedica e sabe muito da área, sempre terá emprego. Sempre. Viajará o mundo se quiser, só fazendo isso. Vivemos num mundo globalizado e muito competitivo. E a criação de peças on-line deixou de ser um trabalho de um carinha

que fazia tudo para um trabalho de uma equipe multidisciplinar, onde cada um faz uma coisa. A tarefa ficou muito mais difícil e o profissional generalista de épocas passadas morreu. Lógico que todos que entram para um curso qualquer acabam aprendendo tudo de uma vez. A minha sugestão é que quem está iniciando use todo esse estudo mais para entender o que é o bicho chamado internet do que para achar que já está pronto para abraçar o mundo e ganhar milhões. Tente achar, dentro de tudo o que viu, o que deixa você mais interessado, o que dá mais prazer e corra atrás disso. Dica número dois: para aqueles que estão na área porque adoram, façam a opção de serem um peixe pequeno num grande aquário. Ou seja, sejam humildes e aceitem um salário baixo numa agência que tem um grande potencial para te ensinar muito. É muito mais interessante do que ficar dando as cartas numa agência medíocre e estagnar. Dica número três: não desista! Para cada trabalho legal que arranjei, eu batalhei pesado. Como exemplo, tenha isso em mente: mande 100 e-mails, espere ser respondido 20 vezes, espere fazer entrevista três vezes e finalmente feche com um. Veja que é uma proporção de 100 para um. As coisas acontecem, mas tem que batalhar. Dica número quatro: foque no seu portfólio e tenha orgulho dele. Já entrevistei gente que mostrou trabalho atrás de trabalho e sempre vinha um comentário do tipo: “ah, esse não ficou muito bom porque X”; “nesse, o tempo foi curto e não deu para fazer Y”; ou “esse, o cliente carrasco rejeitou”. Se você acha que os seus trabalhos só têm problemas, quem sou eu para sentir que devo te contratar? Se você acha que tem um portfólio ruim, faça-o ficar melhor com peças pessoais, se envolva, batalhe! Não quero saber das oportunidades que você perdeu, quero saber das oportunidades que você recebeu um limão e fez uma limonada, porque o negócio no nosso dia-a-dia é mais ou menos assim. Wd :: Na edição de abril de 2004, “Descubra os segredos dos maiores webdesigners do mundo”, você analisava que “as tecnologias tendem a fundir-se e transformar-se em um elemento único e mais contínuo”.


entrevista - André Matarazzo :: 27

Diante do ritmo alucinante que a evolução tecno-

André :: Estamos ainda no começo da Gringo e, por

lógica traz para o cotidiano de nossa sociedade, qual é

acaso, alguns trabalhos chegaram até mim através de con-

ou deve ser o papel do designer neste cenário?

tatos antigos internacionais. Para mim, é muito mais fácil tra-

André :: Design virou uma commodity muito valori-

balhar para fora do que para o Brasil, porque a expectativa

zada nos dias atuais. Hoje, uma escova de dentes, com

estrangeira, as oportunidades, os prazos e a grana são dife-

um cabo de design feio, encalha e não vende. Então, o

rentes. É bom estar trabalhando num ritmo mais gostoso e

mundo está olhando para o tal do “design” como uma

criando soluções mais avançadas do que se vê no Brasil. Ao

ferramenta de vendas muito mais interessante do que

mesmo tempo, tenho certeza que, em mais um ou dois anos,

anteriormente.

o espaço abissal que divide as soluções brasileiras das solu-

Atualmente, você tem um designer especializado

ções internacionais vai diminuir. Daí, não será tão trabalhoso

em cada setor de qualquer coisa que seja produzida e

convencer o cliente brasileiro de que certos caminhos são

venda bem. Até cartelas de medicamentos e seus folhe-

bem mais interessantes que outros.

tos de marketing são necessariamente bem desenhados

Mas também é bom notar que, pelo fato de criarmos

para que vendam bem. O mundo hoje compra o livro pela

soluções diferenciadas na Gringo, temos uma gama de

capa. Não é só o conteúdo que vale. Não sei se acho

clientes sedentos por inovações e atitude e que não têm

isso muito bom, mas é uma realidade ao meu ver. Nesse

muito medo de arriscar. Aqui no Brasil, vejo que muitos

sentido, o papel do designer é o de um profissional de

têm medo do risco. Quem não arrisca é rapidamente con-

marketing. Nós apenas ajudamos a criar desejo em torno

sumido pela onda do capitalismo que mata os que sentam

de produtos, locais ou pessoas. Tentamos fazer tudo ficar

e esperam.

mais belo e mais funcional. Mesmo que a máquina que

Estamos nesse ano criando um portfólio muito forte e

movimente o design hoje em dia seja 100% monetária,

temos a intenção de ser a melhor “hot shop” do mercado

nesse processo competitivo tudo acaba sendo repensado.

- e possivelmente uma das melhores do mundo. É esse tipo

Como desenhar uma escova de dentes que todos

de pretensão que faz todo mundo aqui trabalhar com uma

vão querer usar? Muitas inovações serão simplesmente

grande vontade de vencer. Sabemos que estamos indo

estéticas, mas várias outras serão funcionais, que trarão

para o lado certo e procuramos clientes que tenham visão.

benefícios diretos para o usuário, como melhor limpeza e

Quem não tem visão, não nos interessa.

menos tempo escovando, exemplificando.

Para que as agências nacionais se posicionem melhor

E assim que eu vejo a situação atual. Todos estão,

no mercado internacional, primeiro elas devem parar de

pelo motivo primário monetário, repensando tudo todo

fazer peças fantasma, que dão um nome péssimo ao Bra-

o tempo. Carros, computadores, celulares, televisões,

sil lá fora. Todos imaginam que os gringos estão batendo

móveis, cartazes... Nós, designers, podemos estar no

palmas pelos 400 Leões de Cannes que ganhamos, só que

centro disso tudo. Somos nós que ajudamos a moldar o

quase todos sabem que 350 desses são fantasmas feitos

mundo de amanhã de uma forma muito direta. E acho isso

às pressas, três semanas antes da competição. É uma ver-

extremamente interessante.

gonha. Por isso, o Brasil ganha tantos prêmios com ban-

Wd :: Você voltou recentemente ao Brasil e decidiu

ners e coisas fáceis de produzir. Somos prolixos em idéias

abrir um estúdio, Gringo.nu, que atende principalmente

e ruins de execução - componentes que fazem banners

a clientes internacionais. Ou seja, hoje você exerce sua

bons, mas jamais fariam um bom site. Quando conseguir-

carreira internacional de outra maneira. Quais são as

mos juntar essa nossa veia criativa, que não tem para nin-

suas perspectivas diante deste novo desafio? Como as

guém, e esse nosso gingado engraçado com um pouco

agências nacionais devem se apresentar para o mercado

mais de organização e mais atenção a produção e a exe-

internacional?

cução, estaremos dentro do jogo internacional.


28 :: Coleção Brasil Design - vol.2

Portfólio

Confira alguns dos trabalhos que definem a personalidade profissional de André Matarazzo


portfólio :: 29

Laramara (2000) “Foi uma peça importante no meu portfólio, porque nasceu de uma idéia bem inspirada e se transformou em uma peça on-line com um resultado dramático. Ela tem como intuito colocar o usuário no ponto de vista de um deficiente visual, o que é muito diferente de tentar ‘comover’ as pessoas colocando o deficiente visual na posição de coitadinho. Não queríamos usar essa idéia antiga, mas apenas que o usuário sentisse, por 30 segundos que fosse, o que seria não enxergar, dentro de um mundo tão visual como o nosso e, em especial, na mídia interativa. O site foi muito bem recebido e ganhou diversos ´Grand Prix` e prêmios internacionais. Esse site foi o primeiro que eu fiz que ganhou uma projeção mundial e me mostrou o quão rápido as coisas andam on-line. Mostrou-me também o quão democrático o mundo da propaganda on-line era, onde uma peça de um estúdio com cinco pessoas em São Paulo virou referência mundial naquele período. Para não esquecer, a Laramara também arrecadou algumas boas doações e, principalmente, trouxe notoriedade para ela no Brasil e no exterior.”


30 :: Coleção Brasil Design - vol.2

Gringo (2006) “De todos os sites que fiz de 2000 para cá, resolvi mencionar o site da Gringo porque é o site do meu novo estúdio e acho que ele tem exatamente a nossa cara. A agência tem essa faceta bem ‘nonsense’, muito divertida e interativa, elementos indispensáveis para que uma peça realmente seja relevante ao usuário que quer ser entretido on-line. Queria mostrar nesse site um pouco das frustrações do dia-a-dia dos profissionais de criação que trabalham em agências maiores e impessoais e logicamente tem muito de minhas próprias frustrações nisso. Sempre acredito que a web é um veículo de total entretenimento e informação. Adoro fazer sites que dão algo ao usuário em troca de sua atenção. Para a Gringo, queríamos um site que tivesse um elemento fortíssimo viral e não apenas se basear no que somos, onde estamos, o que fazemos... Acho que no Brasil temos muito papo e pouco resultado. Ninguém mais quer ficar lendo um catálogo chato das glórias da agência on-line! Então, em troca de clicar no site www.gringo.nu, queria poder dar ao usuário algo que ele talvez já queira receber a muito tempo: um site que faz um verdadeiro vídeo-bomba a seu chefe carrasco. Vale a pena!”


negociação :: 31

Daddy (2000)

“Foi uma peça divertida de fazer, porque foi um projeto pessoal e feito com o processo criativo inverso: em vez de notar o problema e criar uma solução, notei a solução e criei o problema. Eu estava, na verdade, pesquisando uma forma de incorporar vídeo e ilustração de uma mesma cena em um mesmo plano. Depois de várias tentativas, surgiu a idéia de sobrepor os dois vídeos e deixar o controle do que é visto ao comando do usuário. Gosto bastante dessa peça porque criei uma solução nunca antes vista. Não é nada de novo contar pontos de vista diferentes em uma narrativa, porém, sobrepostos, ao controle do usuário, simultâneos, e ainda com esse efeito visual interessante (na época, era inovador), isso sim nunca tinha sido mostrado antes. Por isso, acho que foi um trabalho bem feliz. Tão feliz que, cinco anos depois, uma grande agência brasileira copiou essa peça quase ipsisliteris e ganhou um prêmio em Cannes com ela. Mas isso já é uma outra história.”


32 :: Coleção Brasil Design - vol.2

Trajetória 1998 a 1999

2000

2003

“Meu primeiro trabalho no ramo

“Depois de um ano e pouco, queria

“Depois de três anos no Canadá, já

on-line foi num provedor de acesso

tentar minha sorte fora do Brasil de

queria alcançar novos horizontes.

em Campinas que também fazia sites

novo. Já havia morado fora durante

A Blastradius tinha ficado grande

para alguns clientes. Tive a sorte de

alguns anos e estava querendo uma

demais, perdido o foco inovador

aprender o ofício com duas designers

experiência semelhante novamente.

(tinha ficado chata, basicamente).

maravilhosas que trabalhavam lá e me

Fui fazer entrevistas em algumas

Mudei-me para Amsterdã, ainda

ensinaram tudo o que sabiam, com

agências bacanas de São Francisco,

pela Blastradius, como diretor de

uma paciência de jó. Pela primeira vez

mas acabei me apaixonando por

criação, para tentar o que seria

na minha vida, notei que tinha uma

uma agência média de Vancouver,

abrir um escritório da Blast em

boa vocação para o negócio e aprendi

no Canadá, chamada Blastradius.

terras européias. Imaginei que res-

tudo muito rápido. Em seis meses,

Quando cheguei lá, achei tudo

gataríamos aquele espírito pioneiro

juntei um portfólio merreca (mas até

fantástico, os projetos, as pessoas,

inicial da Blast, mas não foi bem

legal para os tempos pioneiros da

a organização, a cidade... Tudo me

isso. Aproveitei muito a minha vida

web no Brasil) e fui bater na porta

interessava. Fiz muitos projetos baca-

na Holanda, só que não conseguia

de agências grandes em São Paulo.

nas, cresci profissionalmente. Tenho

mais curtir o trabalho na Blast.”

A que gostou do meu portfólio foi a

memórias muito boas desse tempo.”

Thunderhouse, comandada pelo Bob Gebara, que era a figura mais interessante e bacana do mercado. Colocou-me lá como assistente e dentro de seis meses já era diretor de arte e estava fazendo peças importantes para clientes bacanas.”


trajetória :: 33

2004

2005

2005 aos dias atuais

“Como sempre quis morar na Escan-

“Sai da Suécia por motivos de saúde,

“Decidi voltar para São Paulo e come-

dinávia, fui fazer várias entrevistas,

fiquei um tempo afastado rodando

çar um estúdio meu, que fosse focado

desde Islândia até Finlândia. Decidi

pela Europa. De repente, surgiu

apenas em soluções interativas

ficar numa agência pequena, que

uma oportunidade de trabalhar para

muito específicas e que trabalhasse

estava fazendo trabalhos alucinantes,

a agência mais bacana do Japão:

muito com o mercado internacional.

com um povo muito bacana.

TYO-ID, como diretor de criação.

Tudo está funcionando! Hoje mon-

Foi aí que me mudei para Estocolmo

Morar em Tóquio, absorver a cultura,

tei a Gringo.nu e estou, junto com

para trabalhar na Farfar. Ela me deu

viver em meio ao povo mais cordial

uma equipe fenomenal, encabeçada

um novo impulso e uma nova visão

e interessante do planeta - tudo isso

por Ricardo Landim e Fernanda de

sobre a mídia on-line. Tratá-la como

foi uma experiência muito válida.

Jesus, fazendo trabalhos para Japão,

algo divertidíssimo, fazer sites que

Mas não achei que era um plano que

Europa, EUA, alguma coisa muito

nós mesmos adoraríamos usar, fazer

queria seguir por longa data. Estava

bacana para o Brasil, e tentando

produções gigantes, com atores,

me sentindo mais velho, com mais

mostrar que a web pode ir muito

cantores, bonecos animados, vídeos,

vontade de ficar com amigos, família,

mais longe. Meu sonho é que nos

chroma-key, voice-overs, muita

e pensava: será que quero criar raízes

tornemos uma referência no mercado

tecnologia, muita gente experimen-

no Japão?”

internacional - uma das dez melhores.

tal. Enfim, reaprendi a amar a web

Fora isso, quero poder dar uma puta

e ver nela um novo potencial. Mais

experiência e uma vida boa para as

importante do que isso: fiz parte

pessoas que trabalham comigo, que

de um grupo de pessoas (15) que

eles possam fazer intercâmbio com

tinham um grande tesão no que

outras agências estrangeiras e que

faziam. Não existiam estrelas, gente

trabalhem em projetos muito interes-

saindo e entrando, gente desiludida,

santes, nos quais acreditem mesmo.

se sentindo frustrada. Não! Éramos

Até agora tudo está correndo de

todos uma grande família nos diver-

acordo com o plano!”

tindo e criando muita coisa legal no processo.”


34 :: Coleção Brasil Design - vol.2

Dia-a-dia De tudo, um pouco “Meu dia-a-dia não é nada de muito esotérico. Trabalhar num estúdio pequeno significa que você faz de tudo um pouco. Quando trabalhava na Blast, na Farfar ou na TYO-ID, meu dia era inteiro definido, cheio de reuniões, deadlines e tal. Hoje, envolvo-me mais em criação de conceitos, um pouco de direção de arte e muita coordenação de projetos.”

Definindo os projetos “Quando o projeto chega até nós, verificamos primeiro se é algo que nos interessa, se está de acordo com a proposta da Gringo, quem é o cliente, se ele está em sintonia (ou tem vontade de aprender qual é a sintonia) com o que é mais bacana como solução on-line hoje, se está a fim de inovar etc. Se acharmos, em conjunto, que é um trabalho que agrada a todos, damos início no projeto. Sempre fazemos questão de ter um prazo bem bacana, mas nada flexível. Não gostamos de atrasar em absolutamente nada.”

demanda: flash designers, ilustradores, fotógrafo, vídeomakers, 3D, roteiristas, programadores, áudio... Depois de definido qual será o time, fazemos uma reunião grande, organizamos a vida e o material de cada um e deixamos todo mundo trabalhar livre, com prazos bem bacanas, mas sem a possibilidade de extensão. Ainda bem que até agora não tivemos muitos sustos.”

Cuidado com os prazos “Fazemos checagens quase que diárias nos projetos, mantemos o cliente menos ansioso possível, mostrando como tudo está correndo, para que ele também opine sobre o andamento do projeto etc. Ao final do site, na maioria das vezes, não há qualquer correria e tudo funciona bem. Costumo dizer que quem sempre corre no final é o cara altamente desorganizado, ou que trabalha com prazos impossíveis, e nada disso é o nosso caso. Ao final do projeto, fazemos um almoço com toda a equipe, brindamos e partimos para próxima. Quando a Gringo crescer um pouco mais, quero tentar me afastar um

Na hora da criação “Inicialmente, criamos, em papel e lápis, um conceito. Rabiscamos coisas horríveis visualmente falando (não sei desenhar direito), mas que mostram um conceito bacana, inovador, que acreditamos ser a melhor solução para o cliente. Em seguida, apresentamos esse conceito e vamos e voltamos fazendo pequenas ou grandes revisões. Partimos para a montagem da equipe, de acordo com o que o projeto

pouco das tarefas organizacionais e ficar mais dentro de estratégia e criação.”


dia-a-dia :: 35


36 :: Coleção Brasil Design - vol.2

Participação dos assinantes Os dicionários definem o ego como o centro da consciência. Trazendo esta realidade para o design na web, se por um lado ele ajuda na realização de trabalhos criativos e na defesa de idéias, por outro pode atrapalhar o crescimento profissional e o relacionamento em equipe. Até onde vai o limite do ego para quem trabalha com criação? Renata Pimentel rspimentel@globo.com

Existem, no mundo da criação, objetivos a serem alcançados na concepção de um projeto, que ultrapassam o limite do ego do criador. O processo criativo é a ponte entre a meta e o resultado e isso exige uma grande dose de responsabi-

v

ra! encedo

lidade de quem está sentado na cadeira de criação. Essa responsabilidade é o limite a ser respeitado para se obter o crescimento e comprometimento da equipe com os resultados.

Carlos Barreto carlos@vipwebarte.com.br

O ego é uma fonte de criatividade e com isso assumimos que nosso trabalho é sempre o mais adequado e perfeito para as diversas situações. Ele nos ajuda muito quando enfrentamos desafios sozinhos. Porém, quando estamos trabalhando em equipe, devemos analisar cuidadosamente nossas colocações, pois neste momento o ego pode vir a ser um inimigo e atrapalhar o nosso relacionamento com toda a equipe.

Frederico Félix eloisapessoa@hotmail.com

Não tem limites. A criação é algo que não se explica, ela nasce de uma inspiração. A questão do crescimento profissional e o relacionamento em equipe podem ser afetados, devido ao isolamento do profissional com o mundo exterior, pois sua grande preocupação é estar sempre concentrado e livre de interferências externas para não atrapalhar a busca da melhor idéia. Isto não deveria acontecer, mas - se acontecer - é melhor saber lidar com isso.

Carlos Junior vamoss@vamoss.com.br

O ego é a chave para a porta de entrada para seu local de trabalho. Na entrevista de emprego, seu ego diz quem você é e não engana caso seja um perfil institucional ou um perfil descontraído. Portanto, seu ego irá colocá-lo junto a uma equipe que espelhe o seu perfil, com os mesmos gostos, ou irá colocá-lo em um ambiente de trabalho que valorize suas atitudes.

André Moraes avmcosta@hotmail.com

Creio eu que se formos basear nossa criação em nosso universo egocêntrico, ficaremos limitados as nossas experiências, o que pode ser bom ou ruim. Contando com a possibilidade de ser ruim, prefiro ser excêntrico no que diz respeito à criação e obedecer as minhas convicções e estudos.

Se você é assinante, participe desta seção pelo site www.arteccom.com.br/webdesign/clube

O autor da melhor resposta ganha prêmios.



38 :: debate - os limites do ego

Os limites do

O profissional criativo deve procurar conhecer pro-

“o centro da consciência, a soma total dos pensamentos,

fundamente os conceitos que envolvem duas palavras:

idéias, sentimentos, lembranças e percepções sensoriais”.

narcisismo e ego. Em artigo, Mario Quilici diz que o mito

Trazendo estes significados para a realidade do

de Narciso foi muito bem utilizado pela psicanálise, “...já

design na web, se por um lado o ego ajuda na realização

que determinadas pessoas vivem como se olhassem num

de trabalhos criativos e na defesa de idéias, por outro

espelho: não conseguem ver o mundo e o interpretam em

pode atrapalhar o crescimento profissional e o relacio-

função de seus próprios valores, desconhecendo assim as

namento em equipe. Assim, até onde vai o limite do ego

diferenças”. Já o dicionário Wikipédia define ego como

para quem trabalha com criação?

Flor de Narciso “... Numa ocasião, enquanto caçava com os amigos, Narciso afasta-se deles. Cansado, ele procura uma fonte para saciar sua sede. Encontra a fonte de Tépsias e, diante dela, se curva para mitigar a sede. Ao debruçar-se sobre o espelho imaculado das águas, ele viu-se. Dessa forma, não pode mais sair dali. Apaixonara-se pela própria imagem. Ali ficou e ali morreu e, mais tarde, quando procuraram o seu corpo, encontraram apenas uma flor amarela, cujo centro era circundado de pétalas brancas. Era o Narciso.” Fonte: “O mito grego de Narciso”, por Mario Quilici


debate - os limites do ego :: 39

:: Cláudio Reston (Haroldinho) Designer e tipógrafo, co-autor do zine Design de

O

Bolso e sócio da Visorama Diversões Eletrônicas (www.visorama.tv)

limite do seu ego termina onde começa o do

outro. Façamos bom uso de nossos ouvidos ouvidos”

“Para os ditos trabalhos autorais, ou que tenham um

que faltava para aquele conceito até então mal azeitado.

prazo sufocado, mais que bem-vindo, o ego é indispensá-

Ou, na pior das hipóteses, que pelo menos lhe sirva para

vel, pois não existem tempo e espaço para ruídos externos.

compreender em quais vias não pretende trafegar.

Mas, no dia-a-dia, para um bom rendimento em equipe, a

Trazendo isso para o universo pessoal, todos os

fórmula é outra: ouvir e manter o ‘spam filter’ mental sem-

trabalhos que participei, onde diversas opiniões foram

pre ativado.

consideradas, o resultado foi sempre muito superior. E

Ouça tudo. Releve a opinião das partes envolvidas,

é muito bom contemplá-lo e lembrar de todas as idéias

seja cliente, fornecedor, sócio ou assistente. Experimente

ali presentes, entender o mérito de cada uma das partes

a certeza alheia e depois pondere. É muito difícil imaginar

envolvidas, e até mesmo vislumbrar o quão equivocado

um coletivo eficiente num ambiente de guerra de egos,

ele estaria se somente suas opiniões fossem levadas à ris-

onde apenas o seu ponto de vista vale. Mesmo que seu co-

ca. O limite do seu ego termina onde começa o do outro.

nhecimento seja superior sobre determinado assunto, um

Façamos bom uso de nossos ouvidos.”

comentário inocente e despretensioso pode ser o molho


40 :: debate - os limites do ego

E

m qualquer natureza de relaciona-

mento, seja namorado, chefe, médico, político :: Ricardo Figueira

ou vendedor, quem gosta de se relacionar com

Diretor de criação da AgênciaClick

um mala metido que se acha o tal?”

www.agenciaclick.com.br

“A definição clássica de ego não é a mesma definição

mala metido que se acha o tal?

que usamos para classificar a visão, geralmente distorcida, que

Coincidência ou não, geralmente as pessoas que possuem

profissionais de criação ou de qualquer outra natureza possam

esse tipo de distúrbio estão mais preocupadas em ser do que

vir a ter sobre a sua auto-imagem e o seu trabalho.

fazer. E o pior é que elas próprias acabam restringindo o seu

Entretanto, vendo por esse lado, ego não tem limite,

leque de oportunidades a partir do momento em que isso se

mas o profissionalismo e o relacionamento têm. Em qualquer

torna deflagrado. O mercado é extremamente frenético e a cada

natureza de relacionamento, seja namorado, chefe, médico,

dia que passa existe menos espaço ou tempo para esse tipo de

político ou vendedor, quem gosta de se relacionar com um

coisa. Os mais espertos e maduros já perceberam isso.”

E

:: Chico Baldini

preciso saber trabalhar em equipe,

trocar idéias com outros profissionais, ouvir

Diretor de criação e sócio-diretor da W3Haus www.w3haus.com.br

e traduzir as necessidades do cliente”

“O ego de um profissional de criação somado à sua

Em uma situação ideal, o ego do designer e a sua tarefa

bagagem cultural, à sua percepção e sensibilidade estética

de design estão em perfeita sintonia (por isso é mais fácil criar

e à sua intuição são os definidores da qualidade visual de

sobre temas que gostamos), mas nem sempre a necessidade

seu trabalho e, sem dúvida, é o que define o núcleo de uma

do cliente e o ego do designer estão em sintonia completa. É

criação estética.

aí que o profissional precisa saber buscar recursos para criar

Porém, design não é só isso. Um trabalho de design

essa sintonia. Saber afastar o seu ego nesses momentos pode

não é simplesmente um trabalho autoral, é um projeto de

ser a diferença entre um trabalho equivocado e um trabalho

comunicação que precisa atender às necessidades/demandas

certeiro. É preciso saber trabalhar em equipe, trocar idéias

de um cliente e de seu público-alvo. Um trabalho de design é

com outros profissionais, ouvir e traduzir as necessidades do

bem sucedido quando consegue comunicar os objetivos do

cliente e, por fi m, saber o que o público quer receber, pois

cliente para o seu público, utilizando recursos estéticos em

afinal comunicação é uma realização coletiva.”

sintonia com a sua imagem.


debate - os limites do ego :: 41

:: Fernand Alphen Diretor de Branding, Planejamento e Pesquisa da

E

F/Nazca S&S www.fnazca.com.br

go é auto-estima e segurança. O que contamina

o ego, no entanto, é a vaidade excessiva”

“Uma vez, perguntaram para o Osho: ‘dizem que

vergonha, no gargarejo da autoria.

p re c i s a m o s n o s l i b e r a r d o e g o p a r a p o d e r c re s c e r

No dia em que as atitudes dos outros forem todas

espiritualmente. Mas você mesmo cultua o seu próprio!’.

medíocres, em que o mundo ao redor parecer frígido,

Osho respondeu: ‘para se liberar do seu ego precisamos

em que perdermos a educação, o recato e toda timidez,

primeiro ter um!’.

em que esquecermos que a nossa idéia é parte chupada,

Nada de errado, portanto, em ter um ego. Aliás,

parte inspirada, parte de outro, parte de todos em que nos

tudo de bom. Ego é auto-estima e segurança. Minhocas

levarmos a sério demais, acenda a luz amarela que você

não têm ego. O que contamina o ego, no entanto, é a

está se ‘Michael-jacksonnizando’.

vaidade excessiva. A vaidade, por ser autocentrada, é

É fácil curar-se desse mal: vá procurar outra turma.

uma falha geral nas interfaces de relacionamento. Falha no

Saia da torre e vá para rua, para o estádio, para o morro.

relacionamento com as pessoas com as quais trabalhamos,

Deixe de freqüentar os locais da sua moda, qualquer

relacionamento com os (mortais) clientes. A vaidade

que ela seja - os berços que cultuam sua genialidade. Vá

entorpece e cega, transforma diálogos em monólogos e

de calça Diesel e camiseta Comme des garçons ao baile

talentos em mediocridades.

funk. Vá de jeans sem marca e camiseta Hering para um

Qual é o limite da vaidade para quem trabalha criação?

restaurante chique. Vá de calça de mano e boné para o chá

É relativamente simples: quando perdemos a capacidade

das cinco do clube inglês. Fique um tempo cheio da grana

de expressar e rir com o ridículo de nossa condição. Ser

em Nairobi ou sem nenhum em Megève. Você vai se sentir

criativo é ser ridículo. Exercitamos o ridículo o tempo todo:

uma minhoca e está curado.”

nas atitudes originais, na paixão descabida, na falta de

Osho Originalmente, é um título de reverência concedido a certos mestres na tradição Zen do Budismo. Fonte: Wikipédia (http://pt.wikipedia.org/wiki/Osho)


42 :: e-mais - organização das agências

Organização do setor de agências digitais no Brasil Unidos para consolidação do mercado de internet corporativa Bahia, Pernambuco e Rio Grande do Sul. Para quem ainda duvida que o mercado de internet já se espalhou pelo Brasil, as associações de agências digitais, criadas nestes três estados, nos últimos dois anos, servem como prova do empenho e do esforço para tornar definitivamente tal segmento em fator produtivo na economia do país. Os principais fomentadores deste cenário são a ADBA (Associação de Agências Digitais da Bahia - www.adba.com. br), a AETI (Associação das Empresas de Tecnologia Internet - www.aeti.com.br) e a AGADi (Associação Gaúcha das Agências Digitais - www.agadi.com.br). “As entidades que reúnem as agências digitais têm como objetivo principal o aculturamento e o desenvolvimento do mercado corporativo no que se refere a soluções digitais, notadamente o desenvolvimento de internet corporativa”, afirma Cesar Paz, presidente da AGADi e diretor presidente da AG2 (Agência de Inteligência Digital). Além destes fatores, Bruno Queiroz, presidente da AETI e diretor executivo da Cartello, reforça que a força institucional destas associações permite a criação de regras, dando as condições necessárias para a concorrência sadia e para a evolução da qualidade do trabalho na área.


e-mais - organização das agências :: 43

Mercado fora dos grandes centros

estávamos iniciando nossas atividades”, revela Allessan-

Antes de falarmos sobre as vantagens e as conquis-

dro, da ADBA.

tas alcançadas por essas associações, é importante relatar

Por que se associar?

como elas mapeiam a expansão do segmento de internet

Você tem uma agência digital, possui uma série de

pelo país. Para se ter uma idéia, o Sudeste - considerado

idéias para melhorar o segmento e procura parceiros para

o principal eixo deste mercado - ainda não possui uma

compartilhar experiências e boas práticas no mercado?

entidade na área. Diante desse cenário, podemos afirmar

Então, saiba a seguir que tipo de vantagens você terá ao

que o mercado web já é uma realidade em outros grandes

participar de uma associação do setor.

centros do Brasil?

“O grupo pode utilizar sua força conjunta para abrir

“Sem a menor sombra de dúvida. Existem muitos tra-

novos mercados, barganhar valores e posições junto aos

balhos produzidos para os mercados nacional e internacio-

fornecedores, recorrer a um banco de talentos da pró-

nal que não deixam nada a desejar, em termos de qualida-

pria associação no momento de novas contratações etc.”,

de, se comparados com outros feitos em qualquer grande

enumera Allessandro Canella, da ADBA (veja box abaixo).

centro, seja São Paulo, Milão, Nova Iorque ou Tóquio”,

“Ao associar-se, você assume um papel de agente e não

afirma Allessandro Canella, vice-presidente da ADBA e

de refém num mercado em plena transformação. Na enti-

sócio-diretor da BeeWeb.

dade, o associado participa de forma direta de um debate

Como bons exemplos, ele cita alguns trabalhos desenvolvidos por agências baianas: nos portais de e-com-

intenso sobre a organização do nosso setor”, completa Cesar Paz, da AGADi.

merce da Insinuante (www.insinuante.com.br) e da GPW (www.gpw.com.br), ou ainda nos portais de turismo regional da Bahia (www.bahia.com.br) e da Praia do Forte (www. praiadoforte.org.br). E os resultados positivos que vêm sendo colhidos em

Benefícios oferecidos pelas associações: caso prático ADBA - Acesso gratuito a todas as pesquisas e dados do setor produzidos pela ADBA; - Participação de todo o processo de discussão e dos movimentos que a entidade realizar;

outras regiões do país parece ter servido de incentivo às

- Direito a voto nas assembléias e reuniões de diretoria;

agências localizadas no Sudeste. “São Paulo deve anunciar,

- Visibilidade de marca em todo o material de divulgação da ADBA;

nos próximos dias, a formação da APADi, que deve nascer

- Direito à participação nas comissões de trabalho.

com bastante força, proporcionalmente ao tamanho do mercado no centro do país. Esse é um movimento que

Hoje, ADBA, AETI e AGADi reúnem mais de 30 agên-

deve se ampliar nos próximos anos e, quando estiver ma-

cias digitais. Como convencer tantas empresas, com di-

duro, naturalmente poderemos unir todas essas entidades

ferentes visões, a participar de entidades envolvendo um

numa grande entidade nacional representativa de todo o

mercado em desenvolvimento no país?

setor”, analisa Cesar Paz.

“Contactamos diretamente cada uma delas e apre-

Enquanto uma associação nacional permanece como

sentamos as vantagens e os benefícios de se tornar um

uma idéia embrionária, as entidades existentes articulam

associado. A tática deu certo. Num segundo momento,

a troca de informações. “Temos uma relação forte com a

nós passamos a ser procurados pelos interessados”, re-

ADBA, na Bahia, e apoiamos bastante a sua criação. Ela

vela Bruno, da AETI. “Na AGADi, reunimos as principais

segue o mesmo modelo da AGADi”, conta Cesar. “Almocei

agências digitais do Rio Grande do Sul sem maiores esfor-

recentemente com o Murilo Gun (da Cartello, associada da

ços de prospecção e através de uma mensagem simples e

AETI), aqui em Salvador, para trocarmos algumas idéias

direta sobre a necessidade de aculturamento do mercado,

sobre a nossa premiação local. Vale ressaltar que houve

em especial do gestor corporativo, sobre as soluções e o

uma grande contribuição do pessoal da AGADi, quando

ambiente de internet”, diz Cesar.


44 :: e-mais - organização das agências

Contribuindo para o avanço do mercado

e, sobretudo, a credibilidade do setor. Ou seja, contratantes

Apesar do pouco tempo de existência, as entidades

e contratados saíam perdendo. Criamos um código de éti-

contabilizam algumas conquistas. Na Bahia, eles celebram

ca, que estabeleceu princípios e normas de relacionamento

a união das empresas em prol da melhoria do segmento.

entre os concorrentes, bem como entre o contratante e o

“Conseguimos reunir as maiores agências locais para ini-

contratado. O código, por exemplo, definiu procedimentos

ciar o processo de melhoria de nosso mercado e, a partir

para o direito autoral e de propriedade, para a prospecção

daí, iniciarmos um trabalho em conjunto, consolidando os

ativa a clientes de concorrente, para o assédio a membros

nossos propósitos”, diz Allessandro Canella, da ADBA.

da equipe técnica dos associados, para o trabalho em con-

Para Cesar Paz, da AGADi, o reconhecimento da en-

junto de um ou mais associados em um mesmo projeto, entre

tidade como uma das principais fontes de referência no

outros casos. Podemos citar também a realização de duas

mercado web já justifica sua criação. “Além disso, com foco

edições do Prêmio AETI, que traz visibilidade aos projetos

no aculturamento do mercado, montamos dois eventos prin-

desenvolvidos por aqui e atrai novos interessados em inves-

cipais que estão tendo ótima aceitação: o Fórum de Internet

tir na internet”, conta Bruno Queiroz.

Corporativa e o F5 - Ciclos de Qualificação. Hoje, no RS,

Outro avanço proporcionado pela entidade foi a cria-

temos reconhecimento do mercado, 24 empresas associa-

ção de um modelo referencial de orçamento (baseado em

das, seis colaboradoras, gestão participativa, influência no

homem/hora). “Padronizando a ‘moeda’, os associados pas-

mercado e uma entidade auto-sustentável. Para o primeiro

saram a ter o mesmo parâmetro de cobrança, variando ape-

ano foi uma boa maratona”, afirma.

nas o preço da hora de acordo com estrutura de custos de

Em Recife, a regulamentação do mercado e o lança-

cada um. Isso facilitou a tomada de decisão do contratante,

mento de uma premiação no setor foram duas das princi-

que ficou nivelada para cima, pois a comparação entre os

pais metas alcançadas pela AETI. “Antes, havia uma disputa

concorrentes se vale dos mesmos critérios. Além disso, os

centrada no preço e na desqualificação do concorrente. Em

associados começaram a perceber, com mais clareza, seus

busca do cliente, chegava-se a praticar preços abaixo do

próprios custos, corrigindo as grandes distorções que che-

custo, comprometendo não só a rentabilidade das empresas

gavam a 75%, em situações críticas”.

como também a qualidade do trabalho, o prazo de entrega


Em relação ao futuro, a AETI promete manter firme os ideais (regulação e fomentação) que levaram a sua criação. Na ADBA, o compromisso está na criação de uma premiação regional. “Queremos definir critérios técnicos mais específicos, avaliando não somente o aspecto estético do trabalho (design, recursos gráficos etc.), mas principalmente a real capacidade de venda do site para aquele produto, seja ele qual for, com aferição de resultados, índices de recall e outros meios de constatação”, diz Allessandro. No Sul, as novidades envolvem um mapeamento completo da área. “Queremos avançar no Raio-X da internet corporativa, um projeto que ainda não saiu do papel, mas que é fundamental para termos os primeiros dados do mercado corporativo em relação a utilização da internet pelos diferentes setores da economia gaúcha”, finaliza Cesar.

Como surgiram - ADBA “A partir da última premiação (2005) do Top Web (prêmio local aos melhores trabalhos do ano). Eu, Mauro Rocha (2Pontos) e Rogério Ramos (Agency5) começamos a interagir sobre a necessidade de termos uma entidade local, sem vícios, com foco na aculturação e profissionalização do mercado corporativo de soluções digitais na Bahia. Listamos algumas empresas que acreditávamos ter uma representatividade local, ligamos e agendamos uma primeira reunião para amadurecermos nossas idéias. Assim nasceu a ADBA.” (Allessandro Canella) - AETI “A AETI surgiu no final de 2002 e início de 2003. Não foi inspirada em nenhum modelo específico. O principal motivador foi a percepção das quatro mais representativas empresas do setor da necessidade de discutir os problemas do mercado no sentido de buscar soluções em comum. Cartello, W3, Icorp e Inovação fundaram a associação e, em seguida, convocaram mais dez empresas, totalizando 14 associados em sua composição inicial. Atualmente, a AETI possui oito associados, redução ocasionada pela fusão entre Cartello e W3, entre Icorp e Inovação, bem como pelo ‘desaparecimento natural das microempresas’. Embora menor, a formação atual representa cerca de 90% do mercado, tanto em número de clientes, quanto em movimentação financeira.” (Bruno Queiroz) - AGADi “Em funcionamento desde o final de 2004. A AGADi surgiu a partir de discussões num grupo de empresas (agências digitais) que não encontravam representatividade nas entidades de tecnologia da informação nem da publicidade. Quando participávamos dessas entidades, tínhamos a sensação de ser um apêndice dessas estruturas e de ter pouca relevância. Depois de várias discussões, entendemos que o caminho era montar uma entidade própria.” (Cesar Paz)


46 :: estudo de caso - GloboEsporte.com

GloboEsporte.com A evolução da cobertura do esporte na web Proporcionar aos amantes do esporte uma experiência completa. Com este mote na cabeça, os profissionais da Globo.com criaram um dos maiores sites esportivos do país, o GloboEsporte.com. “O site vai além da notícia, trazendo a emoção do esporte para o computador. Introduzimos um novo conceito na forma de estruturar a informação, deixando para trás o velho modelo de notícia/matéria (jornal)”, afirma André Braz, gerente de design da Globo.com. A seguir, ele revela os principais detalhes envolvendo este projeto.

Wd :: A Globo.com é uma empresa de internet pio-

foi relevante para o redesenho do produto. No geral, os

neira no Brasil, pois possui um laboratório próprio para

problemas detectados eram muito pontuais e acabaram

testes de usabilidade. Na edição de janeiro da revista,

sendo corrigidos com o tempo. A pesquisa foi também

Felipe Memória, designer de interfaces da empresa, re-

fundamental para definir direções para a nova home do

velou que o GloboEsporte.com passava por avaliações

GloboEsporte.com, que será lançada para a Copa do Mun-

em termos de usabilidade. Como estes testes ajudaram

do. A novidade é a transmissão de todos os 64 jogos da

no desenvolvimento do site e quais foram os custos en-

Copa, ao vivo pela internet.

volvidos durante esta etapa?

Basicamente, o teste mostrou que o site tinha dois

André :: O teste de usabilidade do GloboEsporte.com

problemas principais: falta de exposição adequada de al-

foi, de uma forma geral, um sucesso. Além do site como um

guns conteúdos e comunicação deficiente do que era ou

todo, foram avaliados o Cartola FC (fantasy game oficial

não aberto para não assinantes da Globo.com. Em outras

do Campeonato Brasileiro), o Tempo Real (transmissão dos

palavras, o site deveria se “vender” melhor, pois muito

jogos lance a lance, que inclui vídeos dos gols e principais

conteúdo interessante e exclusivo, como as páginas de

jogadas, acompanhamento dos jogos da rodada, escalação

jogadores, confrontos, central de jogos e vídeos acabavam

dos times etc.) e a nova home do portal.

passando em branco, sem serem percebidas pelos usuá-

Não foram encontrados grandes problemas com relação à navegação e ao uso de nenhum dos produtos tes-

rios, que também ficavam receosos quanto ao que seria ou não aberto para não assinantes da Globo.com.

tados. Por outro lado, como não poderia deixar de ser,

Os custos foram basicamente com o recrutamento dos

detectamos possibilidades de melhoria em alguns pontos.

usuários e horas de trabalho dos profissionais envolvidos

No Cartola FC, por exemplo, produto novo no mercado

na pesquisa, custos ínfimos perto do resultado que obti-

brasileiro, existiu dificuldade na compreensão do conceito

vemos com essa iniciativa.

de “fantasy game”, pois jogos no modelo “manager” são

Wd :: De dois anos para cá, a tecnologia RSS se

mais populares. Por isso, as pessoas tendiam a acreditar

tornou febre entre os desenvolvedores de sites. Por

que o funcionamento era semelhante e não prestavam

ser dividido em assuntos esportivos (futebol, basquete,

atenção nas diferenças de regra. Esse tipo de informação

vôlei etc.), o site de vocês possui uma oferta variada de


estudo de caso - GloboEsporte.com :: 47

“Qualquer empresa de mídia tem por obrigação manter presença em todas as formas, seja pelo navegador, via WAP, RSS, newsletters etc.” feeds. Como o RSS pode ajudar a alavancar os acessos

mais de quatro anos. Isso explica a baixa utilização que

de um site? Os usuários brasileiros já utilizam regular-

temos em terras tupiniquins. Há outra grande diferença

mente esta tecnologia?

entre as ofertas no país e o que ocorre lá fora. Não te-

André :: Os usuários no mundo tornam-se cada vez

mos por aqui a figura do agregador on-line, presente em

mais exigentes sobre aquilo que consomem na web, in-

boa parte da oferta de conteúdo dos sites americanos.

cluindo a forma como consomem. Para se adequar a essa

A popularização da tecnologia nos EUA se deve, priori-

nova perspectiva, qualquer empresa de mídia tem, por

tariamente, as iniciativas do Bloglines e do Yahoo, que

obrigação, manter presença em todas as formas, seja pelo

incentivaram a adoção dos botões de “Subscribe with

navegador, via WAP, RSS, newsletters etc.

Bloglines” ou “Add to MyYahoo” nos grandes sites de

Nesse cenário, o RSS é só mais um dos meios de entre-

notícias.

ga que o GloboEsporte.com oferece a seus clientes. Como

Wd :: Falando da oferta de conteúdo, muitas

produzimos um volume muito grande de notícias todos os

vezes sites com grande quantidade de informações

dias, o RSS ainda nos ajuda a manter o usuário automatica-

acabam não produzindo interfaces adequadas, que

mente atualizado, uma vez que ele não precisa visitar o site

facilitem o acesso do usuário a dados específicos. De

a toda hora para saber o que tem de novo. A segmentação

que forma a Arquitetura da Informação foi aplicada no

por modalidades de esporte, campeonatos de futebol ou

GloboEsporte.com?

times do coração também nos garante que falaremos com

André :: Como esporte mexe basicamente com a

o cliente certo, além de ser um ótimo serviço para o “fa-

emoção das pessoas, no GloboEsporte.com buscamos

nático” que quer acompanhar tudo o que acontece sobre

uma arquitetura que beneficiasse a paixão do torcedor

aquele determinado assunto. Todos ganham.

brasileiro. O melhor exemplo para isso está na seção

O RSS no Brasil tem uma vida muito recente, diferente

Futebol (paixão nacional e principal esporte consumido

dos EUA, onde já é usado, pelo menos pelos blogueiros, há

pelo internautas brasileiros), onde os times são o grande


48 :: estudo de caso - GloboEsporte.com

eixo de navegação. Criamos interfaces direcionadas para

“As cores entregam a informação de

os torcedores de cada time. Além disso, valorizamos a na-

maneira mais objetiva. O reconhecimento é

vegação por confronto (ou evento) e modalidades, o que direciona o amante do esporte direto para as suas preferências e continuam incentivando suas paixões. Wd :: Uma notícia do site Tableless (http://tinyurl. com/fqrjj) revela que a ESPN.com vai economizar mais de 700 terabytes por ano ao implementar os padrões web em seu site. Como o GloboEsporte.com vem aplicando tais conceitos em seu site? André :: A nova home da Globo.com já é um grande passo nessa direção. É o caminho que vamos seguir no GloboEsporte.com, não só pela economia de bytes, mas por acreditar que um site construído dentro dos padrões contribui positivamente para uma melhor experiência do usuário, além de otimizar o tempo de desenvolvimento. Wd :: Recentemente, a Globo.com lançou uma nova versão de seu portal. Na divisão do conteúdo (esportes, entretenimento, notícias etc.), percebe-se o uso de cores para identificação de cada canal. Por que vocês decidiram utilizar tal recurso e como foi escolhida a cor de cada canal? André :: Como estamos tratando de um universo de conteúdo tão amplo como o das Organizações Globo, faz muita diferença uma navegação organizada e de fácil entendimento. Esta divisão das áreas, com um código de cores, tem por objetivo melhorar a experiência de uso do portal. As cores entregam a informação de maneira mais objetiva. O reconhecimento é instantâneo, a curva de aprendizado é alta e, portanto, a sinalização é mais eficaz. É importante ressaltar também que as cores conferem maior personalidade às áreas. Queremos que estas sejam vistas não apenas como uma simples categorização, mas como páginas que são fonte segura de conteúdo amplo, variado e de qualidade para cada universo: Jornalismo, Esportes, Entretenimento e Vídeos. A escolha das cores foi feita com base na associação emocional natural de cada tipo de conteúdo e/ou posicionamento que buscamos para cada área. Em Jornalismo, usamos o azul por estar associado à seriedade e credibilidade e por ser uma cor muito presente nos produtos jorna-

instantâneo, a curva de aprendizado é alta e, portanto, a sinalização é mais eficaz” lísticos da Globo, que estarão abrigados nesta área. Em Esporte, o verde nos pareceu natural. Dado que o futebol é a paixão nacional e responde por um percentual expressivo de nossa audiência, não tivemos muitas dúvidas em trazer o verde dos gramados, presente em quase todas as cenas do esporte, para representar esta área. Na parte de Entretenimento, optamos pelo laranja principalmente pelos atributos emocionais da cor. É uma cor quente que traz a alegria, a energia e a luz do amarelo misturados com a força e a emoção do vermelho. Fora isso, a área deve abraçar um número de produtos muito amplo e diversificado, de naturezas diferentes, alguns focados no público masculino e outros no feminino. O laranja permite trabalhar com toda esta variedade. A área de Vídeos não segmenta por assunto, mas pelo tipo de experiência. Justamente por abrigar conteúdo de todas as áreas, deixamos o Tab acromático. Ao clicar no Tab “Vídeos”, o usuário chega no Globo Media Center, nossa central de vídeos. Lá dentro, o conteúdo é organizado no menu seguindo o mesmo código de cores da barra do portal. Wd :: Hoje, já podemos afirmar que a internet possui uma iconografia própria (por exemplo: utilizamos a imagem de uma casa para indicar a página principal de um site). No GloboEsporte.com, vocês utilizam os escudos de times de futebol para indicar as seções específicas de cada um deles. Como o uso de elementos gráficos pode ajudar a navegação de um usuário e como eles devem ser aplicados? André :: O elemento de navegação “Tudo sobre o seu time”, com o escudo dos clubes, é uma das marcas registradas do site. Mostrou-se um enorme sucesso tanto nos testes de usabilidade quanto na pesquisa qualitativa realizada em São Paulo, semanas depois. Mas esse tipo de solução não funcionaria em qualquer situação. Sua eficiência depende do nível de familiaridade


estudo de caso - GloboEsporte.com :: 49

das pessoas com a iconografia. O elemento só foi proje-

Lemas para atingir o público-alvo

tado dessa forma porque os escudos dos principais times do Brasil são bem conhecidos pelo público-alvo do site.

- Informação

Mesmo assim, foram usados textos auxiliares que funcio-

Uma das maiores coberturas jornalísticas da internet e de

nam como legendas para o caso de dúvidas. O uso de elementos visuais agiliza a navegação, além

notícias contendo áudio, vídeo, fotos e infográficos. - Vídeos O maior acervo de vídeos da internet brasileira, através de

de torná-la mais lúdica. As pessoas identificam mais ra-

conteúdos exclusivos (Estaduais, Brasileirão, Lutas, Surf, NBA

pidamente o escudo de seus times do que os nomes por

e Copa do Mundo - 2002 e 2006).

extenso. Outra vantagem dessa solução é a economia de

- Torcidas Dar voz e cara aos usuários, proporcionando um ambiente

espaço na interface, importantíssima para a área do “pri-

para o encontro das torcidas.

meiro scroll”.

- Diversão

Wd :: Na edição de março da revista falamos das comunidades virtuais, tema que tem exercido grande influ-

Casseta com Bola e tudo; blog do Tabajara FC e do Caneladas; Cartola FC; games on-line. - Interatividade

ência no desenvolvimento de projetos de internet. Vocês

Usuários podem participar da mesa redonda do Sportv;

lançaram recentemente uma nova versão do Cartola FC.

videolog no “Tá na área”; vídeo-recado do internauta;

Qual é a sua função dentro do GloboEsporte.com?

enquetes; quiz; concursos culturais.

André :: O Cartola FC, lançado em 2005, foi o primeiro fantasy game brasileiro e, mesmo com o baixo conhe-

mos os destaques de cada site em diferentes momentos do

cimento deste tipo de jogo no Brasil, tivemos mais de 200

dia, buscando saber número de matérias por cada tema es-

mil cadastrados na primeira edição. Este ano, a estimati-

pecífico, tipo de abordagem às matérias, o que é destaque,

va é que tenhamos 400 mil cadastrados. Ele é a primeira

vídeos. Com todas as informações consolidadas (números

grande comunidade virtual dentro do GloboEsporte.com,

de audiência e análise de conteúdo), podemos montar um

tem uma função estratégica e entrega uma nova forma

perfil estratégico completo do nosso produto em compa-

de consumir conteúdo relacionado ao futebol brasileiro.

ração à concorrência e posicionar o nosso site para atender

Reúne, sobre o mesmo tema, informação, entretenimento

melhor o nosso público, saber o que mais agrada e como

e interatividade.

os mesmos se comportam com cada tema. Buscamos assim

Wd :: Para se garantir investimentos em projetos

nos diferenciar para melhorarmos cada vez mais.

web, é preciso saber mensurar resultados e possuir mé-

Wd :: No blog “Poucas e boas” (http://tinyurl.com/

todos de análise de performance de um site. Que tipo

hektq), o presidente da Associação de Mídia Interativa,

de métricas o GloboEsporte.com utiliza para mensurar

Marcelo Sant’Iago, analisa que a Globo.com continua utili-

seu desempenho?

zando um formato antigo de banner (full banner - 468x60

André :: Realmente todo investimento em projetos

pixels), quando a padronização sugerida pela instituição

de modo geral está ligado diretamente ao resultado do

aponta para novas medidas (super banner - 728x90). Por

mesmo. Pensando exatamente em entregar sempre o

que vocês continuam utilizando tal formato?

melhor produto é que, além das métricas convencionais,

André :: A Globo.com tem o espaço para super ban-

estamos sempre atentos ao Ibope e as web métricas bási-

ner em 99,9% dos seus sites. Fomos os primeiros a con-

cas, tais como: visitantes únicos, visitas, tempo médio do

templar isso em praticamente todas as nossas páginas e

nosso site, principais caminhos percorridos, profundidade

continuamos incentivando fortemente a adoção desse for-

de conteúdo, vídeos mais vistos etc.

mato pelo mercado, inclusive nessa nossa nova fase, onde

Fazemos também uma análise detalhada do GloboEsporte.com em relação à concorrência diariamente. Analisa-

temos tantos novos sites. O que acontece - e este é o foco - é que ainda poucos


50 :: estudo de caso - GloboEsporte.com

anunciantes produzem o super banner e como em nossas

“Um site construído dentro dos padrões

páginas é possível tanto a veiculação do full banner como

contribui positivamente para uma melhor

o super banner, acaba que infelizmente vemos com mais freqüência o formato menor. Por que as agências insistem no full banner? O nosso preço para veiculação é o mesmo

experiência do usuário, além de otimizar o tempo de desenvolvimento”

para full banner e super banner justamente para incenti-

ta por integrantes da Globo.com e da TV Globo. Todo o

varmos a veiculação do formato maior. Mas onde estão os

conteúdo produzido poderá ser utilizado por ambos os

anunciantes com super banner? Alguns poucos focam no

veículos. Teremos uma programação completa com uma

tamanho maior. Com isso, alcançam melhores resultados e

cobertura do principal evento esportivo do mundo em ví-

ainda contribuem para que as nossas páginas fiquem mais

deos, matérias do dia-a-dia, entrevistas exclusivas, mesas

bonitas e estruturadas, como é o caso da Fiat (AgênciaCli-

redondas, blogs e muito mais. A Globo.com se vestirá de

ck) que sempre contribui com algumas das melhores peças

Copa e terá 24 horas de programação atualizada no ar.

que veiculamos.

Wd :: Alguns desenvolvedores de sites ainda encon-

Mantendo a linha de inovação, a Globo.com faz es-

tram dificuldades para avaliar e ajustar os últimos deta-

tudos constantes com o objetivo de melhorar sua entre-

lhes antes de um projeto “ir ao ar”. A Globo.com utiliza

ga comercial. Temos novos formatos sendo analisados e

alguma metodologia ou ferramentas específicas para

desenvolvidos. Nossa nova home, por exemplo, já conta

trabalhar esta questão? Quais são as principais questões

com um banner que denominamos “big banner”, um espa-

a serem observadas antes de um site ir ao ar?

ço totalmente diferenciado e com uma nova proposta de

André :: Todo novo projeto da Globo.com, antes de ir

veiculação. Em breve, vocês verão anunciantes estreando

para o ar, é testado por duas equipes: uma de testes fun-

esta novidade.

cionais e outra de carga. As duas etapas são acompanhadas

Wd :: Neste mês, se inicia o principal e mais esperado evento do mundo do futebol: a Copa do Mundo.

de perto pelos arquitetos (da informação e de sistemas) do projeto e pela equipe de produto.

Diante disso, os grandes portais de internet se preparam

Nos testes funcionais são simuladas todas as situações

para lançar espaços exclusivos em seus sites para atrair

possíveis durante a edição do site, garantindo o risco mí-

um público sedento por informação. Quais novidades o

nimo de erro e problemas tanto no sistema de publicação

GloboEsporte.com pretende oferecer para os seus usu-

quanto nas páginas finais. Essa etapa também tem um su-

ários durante a Copa?

porte da equipe que desenvolveu o site para a resolução

André :: A Globo.com vem se tornando sinônimo de

de bugs e eventuais erros graves.

inovação tecnológica no mercado web. Na Copa, não será

Após a homologação em testes, o site “vai ao ar”. An-

diferente. Como ela acontecerá durante o horário de tra-

tes de ser publicado e divulgado, fazemos uma edição-zero

balho (e todos os jogos ocorrerão dentro do horário co-

completa e uma validação final envolvendo as equipes de

mercial), a mesma será, sem dúvida nenhuma, a Copa da

criação, marketing e arquitetura. Alguns últimos bugs são

internet. E é por isso que, durante o maior evento esporti-

revistos durante esse processo, que podem surgir devido

vo do mundo, o GloboEsporte.com fará a cobertura mais

à mudança de ambiente.

completa já vista na internet.

As questões observadas levam em conta à necessida-

Seremos o primeiro e único site do Brasil a transmitir

de de atingir usuários utilizando os mais diversos sistemas

todos os jogos da Copa do Mundo ao vivo. Falando ainda

operacionais e browsers. Questões como peso das páginas,

em inovações, as Organizações Globo lançarão um projeto

tempo de carga e segurança na informação são também

inovador de cobertura da Copa: ela será multiplataforma.

bastante críticas e valorizadas durante todas as etapas de

Ou seja, a equipe que irá para a Alemanha será compos-

desenvolvimento e testes de um novo produto.



52 :: Tecnologia na web

Tecnologia na web Layout líquido: projetando sites em diferentes resoluções

site Tableless (www.tableless.com.br). Um dos principais fatores que parece contribuir para

Um dos principais desafios na hora do desenvolvimen-

as mudanças no perfil médio dos usuários de internet está

to de um site envolve a variedade de resoluções de tela de

na popularização dos monitores de 17 e 19 polegadas.

computador utilizadas pelos usuários. Assim, devemos pro-

“Como aconteceu com o 640x480, futuramente não tere-

jetar uma interface através de parâmetros fixos (800x600

mos mais usuários de 800x600. Possivelmente chegaremos

pixels, 1024x768 etc.) ou pensar em uma solução que aten-

a uma etapa onde dimensões fixas serão maioria, já que a

da as diferentes especificações de tela?

largura de linha terá encontrado seu ambiente ideal. Isto

“A polêmica entre layout líquido e fixo é antiga. Os

duraria apenas o tempo necessário para a chegada de uma

designers, vindos de uma escola historicamente habituada

nova transição que traria de volta a necessidade de se re-

a ter mais controle sobre as dimensões dos elementos de

pensar o que é mais adequado”, destaca Federico.

uma composição, dão preferência a estruturas com valores

Se levarmos em consideração o público-alvo de um

fixos como um desdobramento natural da sua atividade. No

site, o tamanho da projeção poderá aumentar. “Para um

entanto, em se tratando de internet, essa idéia de controle

público muito específico, como, por exemplo, fotógrafos

é ilusória. Deve-se considerar resolução, tamanhos e tipos

ou designers, é possível fazer layouts com larguras bem

de fonte, browsers e suas versões, sistemas operacionais

maiores que o convencional, já que esse pessoal costuma

etc. Todas estas são variáveis que têm impacto sobre o

usar resoluções como 1280x1024”, diz Diego. “Já vemos

resultado final”, explica Federico Arana, que trabalha com

sites que usam layout totalmente fixo em 1024, apenas di-

design de interfaces na Globo.com.

vidindo a área de maneira a permitir que o visitante usando

Para quem ainda não conhece a definição de layout

800x600 consiga ver sempre conteúdos completos, sem

líquido, o especialista explica que esse é o nome que da-

corte ou sobra de colunas. O scroll horizontal então mostra

mos as páginas que utilizam porcentagens para definir as

o que está escondido à direita e recolhe o que estava visível

dimensões dos seus elementos em detrimento do uso de

à esquerda, deixando novamente uma divisão de conteúdo

valores fixos. “Isto quer dizer que o conteúdo destas pá-

ajustada para esta resolução. Esta tendência é uma clara

ginas se adeqüa à largura da janela do browser. Embora

conseqüência dos avanços trazidos pelos novos monitores,

‘líquido’ seja o nome mais popular deste tipo de estrutura,

maiores em polegadas, melhores em qualidade de imagem

também encontraremos este assunto sendo tratado por

e menores em tamanho”, complementa Federico.

fluido, elástico ou, o menos popular, dinâmico”. Nova geração de monitores traz novos paradigmas

Recomendável para qual tipo de projeto? Até aqui entendemos o que significa um layout líquido

Uma coisa parece ser unânime: a evolução no mer-

e como a evolução dos monitores trouxe novos desafios

cado de monitores parece ter decretado o fim de sites

para quem desenvolve sites. Porém, tal técnica pode ser

projetados com base no tamanho de 640x480 pixels. “Atu-

utilizada para qualquer tipo de projeto ou existe um seg-

almente, é praticamente padrão usuários domésticos usa-

mento específico?

rem resoluções a partir de 800x600, o que facilita a vida

“Sites que tenham um volume grande de massas de

dos desenvolvedores que podem fazer tranqüilamente um

texto, convivendo com destaques usando imagens e com

layout com uma largura de, aproximadamente, 770 pixels”,

grande profusão de anúncios, são fortes candidatos ao uso

afirma Diego Eis, sócio da Visie Treinamentos e criador do

de estrutura líquida. Isto porque, como o conteúdo é vasto


Tecnologia na web :: 53

nível avançado

e variado, o melhor é que se use todo o espaço que se tenha

uma linha do CSS, você consegue transformar um layout

disponível”, orienta Federico. Segundo ele, um bom exem-

fixo em layout fluido e vice-versa. Com CSS é a maneira

plo de layout totalmente líquido é o site da Vivabit (www.

mais fácil, porque você ganha todas aquelas vantagens que

vivabit.com). “É interessante como até as colunas com ima-

todos estão carecas de saber. E tem a vantagem de poder

gens de destaque conseguem redistribuir seu conteúdo”.

mudar totalmente o seu layout, mexendo apenas algumas

No Brasil, os sites de comércio eletrônico são os que

propriedades”, relata Diego.

mais utilizam a técnica. “Eles precisam fazer com que a

Para Federico, isso vale mesmo que o designer não

home pareça o máximo possível com uma vitrine. Preci-

seja o responsável pela montagem das páginas e que seu

sam mostrar produtos e ofertas para que possam chamar

trabalho acabe na produção de PSDs. “As novas experiên-

a atenção do usuário. Provavelmente, se o site fosse fei-

cias para diagramação de páginas de internet envolvem

to com largura fixa, ele perderia um espaço importante

uso de mais de uma folha de estilos para o mesmo arquivo,

para exibir seus produtos. Sites como Submarino (www.

divisão dinâmica de textos em colunas autopagináveis e

submarino.com.br) e Americanas (www.americanas.com)

até troca em tempo real de diagramação, dependendo do

são ótimos exemplos de como um layout líquido pode ser

tamanho da janela. Com a web cada vez mais ‘personali-

usado. O usuário tem a impressão de estar na frente de

zável’, o desenvolvimento de páginas que se adaptem às

uma verdadeira loja”, cita Diego Eis.

necessidades do usuário serão cada vez mais exigentes.

Porém, ambos ressaltam que não há certo e errado. “Amazon (www.amazon.com) e New York Times (www.nyti-

Quanto antes os designers perceberem que quem está no controle é o usuário, melhor”.

mes.com) são dois sites com estas características (grande massa de texto e profusão de anúncios), mas apenas o

Vantagens no uso de layout líquido

primeiro utiliza o layout líquido”, aponta Federico. “O site

- Permite que o usuário tenha um contato com um número maior

de e-commerce Magazine Luiza poderia ser fluido como os

de informação.

outros sites do mesmo gênero. Mesmo assim, o pessoal do

- Adaptação do conteúdo à largura da janela do browser. Isto

Magazine conseguiu resolver eventuais problemas de um site de fazendo um layout fixo”, lembra Diego.

evita a estranheza causada pelo espaço vazio existente nas páginas com layout fixo e permite que o visitante tenha mais controle sobre sua experiência no site.

Além disso, não devemos esquecer que a maioria dos exemplos que consideramos ser de layouts líquidos usam,

Desvantagens no uso de layout líquido

na verdade, estruturas híbridas que combinam conteúdo

- Falta de controle sobre a disposição dos elementos e sobre

líquido e com largura fixa. “Um simples exemplo: colunas

a largura das linhas de texto. Não há como estabelecer uma codificação eficiente de pesos e valores que norteie os olhos

laterais de portais que normalmente abrigam menus de na-

do visitante se estes elementos se encontram espalhados e

vegação, caixas de enquete, banners, tickers etc. costumam

distantes.

ter suas larguras fixas enquanto que o centro ocupa a área

- A leitura de massas de texto pode se tornar uma tarefa

útil determinada por um valor percentual”, diz Federico.

desagradável já que a linha muito longa dificulta o

Cinto de utilidades Quer transformar o layout de seu site em líquido? En-

acompanhamento do conteúdo. - Maior dificuldade no desenvolvimento, pois será preciso observar diferentes resoluções, não utilizar posicionamento

tão, procure preencher seu kit básico de conhecimento

absoluto para os objetos, dentre outros fatores.

com HTML e CSS. “Existem técnicas que, mudando apenas

Fontes: Diego Eis, Fator W (www.fatorw.com) e Federico Arana


54 :: tutorial

Caminhando pelo HTML - parte 1 Elcio Ferreira Desenvolvedor e instrutor na Visie Padrões Web http://visie.com.br/

Este mês, vamos iniciar uma série de estudos sobre

para ser usada na construção de uma internet aberta e

HTML. Alguns podem estranhar o fato de ocuparmos espa-

acessível. Conhecê-la pode tornar seu site mais acessível

ço nesta revista para falarmos sobre um assunto tão comum

e muito flexível. Foi feita para que seu site funcione em

e uma linguagem tão simples. Por isso, vou começar expli-

qualquer navegador, em qualquer plataforma. Para que ele

cando o que me motivou a escrever esta série.

seja acessível em seu celular e apareça bem no Google. Os

Simples e importante

primeiros artigos desta série vão falar sobre isso.

HTML é uma linguagem bastante simples, mas muito

Além disso, é uma linguagem extensível. Os últimos

importante. Praticamente tudo na web é feito com HTML

artigos vão falar de microformatos, GeoURL e outras ma-

ou depende dela de alguma maneira. Até um site todo em

neiras de se estender o HTML e mostrar algumas aplicações

Flash é publicado num arquivo HTML.

que estão surgindo baseadas nisso. Este é um excelente

Este primeiro artigo pode parecer muito básico. Não

motivo para escrever sobre HTML. Você vai gostar de co-

se engane, há muita coisa importante a aprender nos fun-

nhecer os novos usos que estão sendo dados à linguagem e

damentos do HTML. Às vezes o que nos faz falta é mesmo

as extensões do HTML que você pode usar em seu site.

o conhecimento inicial, e tenho visto muita gente tropeçar

HTML é a própria base da construção de sites com

nas coisas simples. Vejo muitas “soluções” inventadas com

padrões web. Antes da formatação CSS, de um elegante

CSS e Javascript para resolver problemas que o HTML tra-

javascript baseado em DOM ou um poderoso AJAX, todo

ta sozinho. Tenho visto também muita gente que faz um

site baseado em padrões começa com HTML e é impossível

trabalho limitado simplesmente porque não conhece os

trabalhar com padrões web sem saber HTML.

recursos disponíveis na linguagem.

A idéia básica: texto simples

Outro motivo para escrever é o fato de que tenho

A idéia básica por trás do HTML é muito simples: ele é

visto muita gente capaz, habilitada a trabalhar com layouts

um arquivo de texto. Isso mesmo, texto puro, como o que

CSS ou programação Javascript/AJAX, perdendo seu tem-

você pode escrever no bloco de notas. Essa é a natureza

po com problemas simples de HTML.

fundamental do HTML e que o torna acessível em qualquer

Eliminar o medo

plataforma e em qualquer dispositivo. Embora existam pla-

Nossa primeira tarefa é perder o medo do HTML. Se

taformas de software que não suportem imagens, sons ou

você trabalhou com HTML sem CSS, ou com pouco CSS, com código baseado em tabelas ou gerado automatica-

Flash, não há sistema que não suporte texto. XML

mente pelo editor visual, tem boas razões para ter medo

Um daqueles fundamentos que muita gente ignora é

de HTML. Se, como eu, teve que fazer seu HTML funcionar

o fato de a linguagem HTML ter versões. Neste tutorial,

nos velhos Netscape 4 e Internet Explorer 4, deve mesmo

trabalharemos com a versão XHTML 1.0. XHTML é uma

ficar apavorado.

versão da linguagem HTML que é compatível com XML.

Deixe-me avisá-lo, não é daquele velho HTML com-

Na prática, para quem escreve o HTML, isso significa ter

plicado que estamos falando. Pretendo mostrar-lhe que,

uma meia dúzia de regras simples ao escrever, poder usar

trabalhando com padrões web, HTML é uma linguagem

validadores automáticos muito poderosos em seu código

realmente simples e muito poderosa.

e produzir código preparado para as aplicações que estão

Recursos únicos

surgindo e ainda vão surgir baseadas em XML. Quando

HTML é uma linguagem com recursos únicos, feita

abordarmos os microformatos, no final dessa série, isso


tutorial :: 55

vai ficar mais claro. Por hora, basta saber que seguindo o

e atributos. Simples, não?

padrão XHTML, você vai estar pronto para o que vamos

Semântica e significado

fazer depois.

Você deve ter notado uma característica interessante

Tags

do HMTL: cada tag significa alguma coisa. Assim, usa-se a

O texto HTML é muito simples, é quase como texto

tag strong (forte) para destacar trechos de texto, p para

comum. A principal diferença é que há pequenas marcas

fazer parágrafos, h1 para títulos e a para links, para citar

que podemos colocar no texto para indicar suas partes. Por

as que já usamos. É importante usar a tag certa para cada

exemplo, digamos que determinada palavra no texto preci-

tarefa e este é um dos principais segredos do trabalho com

se de um destaque especial, você pode fazer isso assim:

HTML. A boa notícia é que a quantidade de tags é pequena

Um <strong>diamante</strong> é um pedaço de carvão que se saiu bem sob pressão.

e você logo saberá de cor todas as possibilidades. Muita gente tem escrito HTML, seja em editores de

O código <strong> indica o início do texto destacado

código ou em editores WYSIWYG, quebrando essa regra

e o código </strong> o seu final. A esses pequenos marca-

básica. Ao observar o resultado em seu navegador, parece

dores, damos o nome de tags (etiquetas), porque servem

tudo bem. Mas, quando você avalia o mesmo site num na-

justamente para marcar trechos do texto. Veja um trecho

vegador simplificado, como os de dispositivos móveis, per-

típico de código HTML:

cebe a falta que fazem as tags em seus lugares exatos.

<h1>PASSAREDO</h1>

A essa característica do código, de usar a tag certa

<p>Cuidado, homem que (se) mata! Quem é

para cada tarefa, damos o nome de semântica. Ou seja,

que você mata se mata a mata, que não a si

significado. Cada tag tem um significado e você não pode

mesmo?!</p>

usar uma tag de título para fazer um parágrafo de texto

<p>O poema de Luiz Angelo Vilela Tannus d á o triste aviso: Cuidado, existência! O homem pode acabar com você...</p>

comum ou uma tag de endereço para fazer um menu. É sobre esse significado que estão sendo construídas uma série de aplicações interessantes. Há leitores de tela

Temos aqui um título (h1) e dois parágrafos (p) de tex-

para cegos que, baseados na semântica do documento, au-

to. Código simples, tanto de se escrever quanto de se ler.

xiliam o usuário em sua navegação. Ele pode, por exemplo,

Atributos Nem todos os parágrafos são iguais. O mesmo com os títulos, imagens, links, listas, menus e formulários. Muitas vezes uma tag não é o suficiente para representar o que você quer dizer em determinado trecho de código. Por exemplo, ao inserir um link, é preciso dizer para onde esse

ouvir apenas os títulos da página para encontrar com facilidade o conteúdo que o interessa. Robôs de busca como o Google parecem entender a semântica do documento ao pontuar as páginas. E os microformatos são construídos em cima da semântica. Nosso caminho

link aponta e muitas vezes você quer indicar também qual

Espero ter lhe vendido meu peixe. Nos próximos três

será o texto da tooltip que aparecerá quando o cursor es-

artigos, vamos falar sobre a estrutura básica do HTML, a

tiver sobre o link. Logo, você tem um link assim:

construção do código, as tags disponíveis, as informações

Isto é um link: <a href=”http://www. tableless.com.br”>Tableless</a>.

relacionadas, como a página de código usada (se você tem problemas com acentos, precisa ler este artigo) e as folhas

E com o texto da tooltip:

de estilo relacionadas. E no final dessa série daremos o

Isto é um link: <a href=”http://www.

passo além falando sobre os microformatos e como você

tableless.com.br” title=”Tableless: web

pode aumentar as funcionalidades disponíveis em seu

standards”>Tableless</a>.

HTML. Até!

Os atributos são sempre usados para definir características das tags, como o endereço de uma imagem ou o tipo de um campo de formulário. Um documento HTML é basicamente composto desses três elementos: texto, tags




58 :: webwriting

Bruno Rodrigues Autor do primeiro livro brasileiro e terceiro no mundo sobre conteúdo online, intitulado “Webwriting - Pensando o texto para a mídia digital”. É coordenador de informação do website Petrobras e titular da primeira coluna sobre Webwriting no mundo, elaborada desde 1998 e hoje veiculada na revista online “WebInsider”. Ministra treinamento de Webwriting e Arquitetura da Informação no Brasil e no exterior. bruno-rodrigues@uol.com.br

O castor, o dique e o seu conteúdo Um das fábulas mais interessantes (e menos conhecidas) de Esopo conta a história de dois castores que pouco se falavam, mas moravam em rios que corriam paralelos. Um dia, em meio à construção de um enorme dique para conter o rio que teimava em se encher com a água da chuva, o castor do Rio da Direita notou, exausto, que os galhos estavam terminando. Sem graça, gritou, então, ao castor do Rio da Esquerda, se ele poderia doar um ou dois galhos. Voaram dois galhos por sua cabeça, que o castor agoniado tratou de enfiar pelo amontoado de galhos que já começava a notar sinal de fraqueza. Desesperado, o castor tratou de ajeitar os galhos aqui e ali, até que, em pânico, perguntou mais uma vez ao castor do Rio da Esquerda se ele poderia jogar dois ou três galhos. Nem bem os galhos voaram para o seu lado, o castor nervoso encaixou-as em meio à pilha de galhos que agora tremiam como uma geléia, e estancou, paralisado, à espera do pior. Alucinado, gritando por socorro, pela primeira vez em sua vida o castor do Rio da Direita subiu, atabalhoado, a encosta do seu rio, e já ia descer correndo para dentro do Rio da Esquerda, quando parou, chocado com o que via. No Rio da Esquerda havia um outro dique, enorme e resistente, a conter a força da água. Deitado sobre ele, roendo calmamente uma folha de árvore, estava o outro castor, que observava as centenas de galhos que haviam sobrado, flutuando à sua frente... Antes que o castor do Rio da Direita pudesse se arrepender de algo, o seu pobre dique arrebentou. Em questão de minutos o rio transbordou, afogando o apavorado castor e cobrindo com enormes ondas o Rio da Esquerda - que engoliu o outro castor, sua folhinha de árvore e as centenas de galhos que haviam sobrado. Claro, você não é um castor - a não ser que eu tenha uma nova estirpe de leitores (se for o caso, não deixe de me avisar). A lição que se pode tirar desta história (para nós, webwriters, inclusive), é que não adianta querer cuidar do seu rio/conteúdo sozinho, já que todo assunto ou tema é gerado por alguém que não é você - a fonte da informação. Em resumo: todos os lados precisam se comunicar e, mais importante que tudo, todos têm sua responsabilidade sobre o que é disponibilizado. Em termos práticos, o webwriter tem suas funções, assim como o gerador de conteúdo tem as suas. O gerador pode mexer direto no conteúdo? É claro que sim (não se assuste, você não vai ficar desempregado). Quais seriam as vantagens em ter dois cozinheiros preparando o mesmo prato? A ver: Comprometimento: você é o redator e pensa a melhor distribuição de conteúdo, mas o “pai” dos assuntos abordados em uma página web deve ser o gerador de conteúdo. Você é o padrinho, no máximo. Não importa em que perfil de site você trabalha, construa uma tabela de ‘Responsabilidade de Conteúdo’ e defina qual gerador cuida de quê. O grande benefício? A qualidade do que é disponibilizado melhora sensivelmente, já que toda palavra e parágrafo têm dono, e ninguém gosta de ser o culpado por erros. Em tempo: você é o castor do rio do lado, portanto não fique achando que você passou a bola para frente e ponto final. Cheque se este trabalho está realmente sendo feito, e não reclame se for obrigado a cobrar se houver furo - você faz parte de uma equipe.


webwriting :: 59

“Pensar conteúdo é nossa tarefa, e qualquer atividade que passe mais pelo “cerebral” que pelo “mecânico” é irmão gêmeo da inteligência.”

Atualização: se quem gera o conteúdo fica exposto, a atualização passa a ser, também, uma das prioridades, você verá. Na tabela de ‘Responsabilidade’, abra um campo para ‘Periodicidade’, então. Não fique achando que uma só andorinha - ou um castor - faz o verão, já que atualização é um trabalho hercúleo. Prontifique-se a ajudar o gerador de conteúdo. Envolvimento: se a lição da história é que dois castores que trabalham em conjunto não morrem afogados, imagine você e o gerador de conteúdo pensando juntos - quantas boas idéias podem surgir! Para alcançar este patamar, contudo, é o preciso que haja vontade e envolvimento, e essa interação só floresce com comprometimento. Sim, a missão do webwriter está mudando - para melhor. Pensar conteúdo é nossa tarefa, e qualquer atividade que passe mais pelo “cerebral” que pelo “mecânico” é irmão gêmeo da inteligência. Prepare-se! Em tempo: a fábula acima não é de Esopo - eu criei para esta coluna... Pois é, viu o que dá só ficar lendo sobre tecnologia & internet? Cultura geral é bom, gente - até fábulas (verdadeiras) de Esopo. Olhe que o dique do lado pode arrebentar...


60 :: marketing

René de Paula Jr. Diretor de produtos do Yahoo Brasil. É profissional de internet desde 1996, passou pelas maiores agências e empresas do país: Wunderman, AlmapBBDO, Agência Click, Banco Real ABN AMRO. É criador da “usina.com”, portal focado no mundo on-line, e do “radinho de pilha” (www.radinhodepilha.com), comunidade de profissionais da área. rene@usina.com

Cartas na mesa O que você quer? Sim, estou falando contigo. Responda. Assustou? Então falemos de outra coisa enquanto você pensa. Para a conversa ficar mais interessante, aventuremo-nos no arriscado território do infalável. Eu quero falar sobre Querer. “Eu quero falar” é bem diferente de “eu gostaria de”. Se eu quero, eu quero, não tem por que colocar num subjuntivo açucarado. Eu quero. Nem é questão de desejo, é vontade mesmo. Desejar é passivo: você depende de algo externo que lhe desperte o desejo, seja uma barra de chocolate ou um sex symbol qualquer. Querer não, querer é coisa minha. Só eu sei o que quero. Se você quiser algo diferente, por favor coloque suas cartas na mesa. OK, não é fácil. Expressar o que eu quero vai contra uma vida inteira aprendendo polidez, etiqueta, protocolos sociais, respeito etc. Em algumas culturas orientais pega muito mal expressar diretamente o que se quer. Parece falta de respeito, egoísmo, rudeza. Em algumas culturas ocidentais, por outro lado (planetariamente falando, inclusive), ou o cara se coloca abertamente ou ele é um hipócrita dissimulado. Quer ver? Coloque os dois extremos numa negociação e os dois vão sair horrorizados com a barbárie alheia. Questões culturais, contextos, situações políticas... Tudo isso condiciona a maneira como expressamos nossos quereres. Existe uma situação, porém, onde temos que ser claros: design. Eu me recordo até hoje de algo que li no prefácio de um livro-curso de Desenho Técnico: desenho vem de desígnio, e desígnio (obrigado, Houaiss) é “idéia de realizar algo; intenção, propósito, vontade”. Se a etimologia está correta eu não sei, mas ao menos coloca na mesa um ponto fundamental: design é querer. Querer é um verbo que tem objeto sempre... E um sujeito. Pensemos num sujeito que acessa uma loja on-line. Se ele entrou no site, há vários quereres imagináveis: - ele quer comprar um produto X da marca Y - ele quer comprar um produto da categoria Z, seja de que marca for - ele quer encontrar ofertas - ele quer saber o que há de novo - ele quer acompanhar o pedido que fez ... e por aí vai. A loja, por sua vez, tem seus quereres: - quer vender - quer que o usuário compre - quer que o usuário deseje comprar outros produtos - quer que o usuário compre sempre dela - quer que o usuário ajude a divulgá-la - quer conhecer melhor o usuário - quer que o usuário se sinta seguro


marketing :: 61

"...ou aprendemos a expressar o que queremos e a lutar por isso, ou vamos ter dores de cabeça sempre."

- quer que o usuário se sinta satisfeito - quer que o usuário se sinta bem-atendido ... e a lista continua. E eu pergunto: - Esses quereres todos foram colocados como itens sine qua non do projeto? - O design contemplou tudo isso? - O resultado final viabiliza esses quereres todos? Cada pergunta dessas diz respeito a uma etapa diferente do design: planejamento, desenvolvimento, implementação. Depois que o projeto está no ar, não dá mais para querer uma coisa que não foi colocada expressamente na fase de planejamento. Se o layout que você encomendou veio diferente do esperado, será que você expressou corretamente o que queria? A busca do site funciona como o usuário espera ou o cliente queria que funcionasse? Eu escrevi esse artigo porque queria deixar claro um ponto: ou aprendemos a expressar o que queremos e a lutar por isso, ou vamos ter dores de cabeça sempre. E isso ninguém quer, quer?


62 :: 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

Então tá então. Fazer o quê? - Então, Marcela. A gente gostou mesmo, mas infelizmente não vamos fazer esse vídeo agora. – justifica o cliente. - Entendo. – me consolo. - Mas foi muito legal a gente ter feito esse primeiro contato. Não faltarão oportunidades pra gente tocar alguma coisa mais pra frente. - Claro. – me consolo novamente. - Obrigado. Até mais. – desliga. - Até mais Sinal de Ocupado. – respondo pro nada. Por que será que esses caras são assim? Eles me ligaram, se reuniram comigo, me passaram o job, mandei o orçamento, eles aprovaram, eu cumpri o prazo, entreguei direitinho e agora eles dizem que não precisam mais do meu roteiro? E quem me garante que eles não vão usá-lo? Boa pergunta, mas melhor ainda é a resposta: ninguém. E aí nasce a coluna de hoje. Como abordar os clientes que nos disseram não? Devemos jogá-los no limbo do “eles não me merecem”, numa lista negra do “tô de mal” ou tocar pra frente e procurá-los numa outra oportunidade? Dou uma de cobaia e faço a experiência. - Oi, por favor, o Otávio? – essa sou eu. - Otávio? – diz a moça. - Sim, ou seria Olavo? – essa louca sou eu. - Ahhh! Você quer falar com o seu Olávio. Quem deseja falar com ele? – pergunta prestativa. - A Marcela Catunda, e antes que você me pergunte de onde, sou a redatora que fez um trabalho pra ele do projeto Verão 2005, diz pra ele que foi aquele que não rolou. – explico, ou tento. - Espera... – enquanto ela tampa o bucal do telefone como o nariz dela escuto: “Olávio, uma moça que fez um negócio que não foi aprovado quer falar com você”. - Puuuuf! – bufo alto. - Olha, ele não tá. Quer deixar recado? – pergunta. - Pra quê? – agradeço e desligo. Esse não rolou, mas pudera. Que lugar é esse? Risco então esses caras e tento mais um approach. - Puxa! Quanta novidade boa. – exclamo. - Pena que você só ligou agora. Chamamos um redator ontem. - Nossa! Que bola fora eu dei, hein? Perdi essa bolada por um dia? – Fala sério! É tripudiar demais. Pra que dizer ontem? Diz semana passada, pô. Tem dó. Desligo irritada e desisto da guerrilha telemarketing. Parto para algo mais corpo a corpo. - Então, menino. Tava passando aqui na porta (mentira) e parei pra entrar. – essa sou eu. - Entra! Vamos papear. – isso é um seja bem-vinda. Rimos bastante e não é que eu saí de lá com uma promessa de job? Nada muito certo,


bula da Catunda :: 63

"...aprendi que bom mesmo é focar em novas frentes. Foi bobagem achar que o que não rolou poderia rolar."

mas pelo menos bati um bom papo, soube das últimas, vi um monte de amigos e me diverti. Pensando bem foi bom. Volto pra casa, abro meus e-mails e uns docs. antigos. A quantidade de trabalhos na pasta “bombados” é tão grande que quase desisto de seguir adiante. Tenho por hábito colocar uma observação no final dos docs. quando eles são bombados, uma explicação qualquer. A maior parte delas é ridícula porque as faço com ódio no coração e você sabe como é fazer as coisas com raiva, né? Ficam ininteligíveis. - E aí Moço? Faz tempo, né? – essa sou eu. - Muito. A gente não trabalhou mais. – esse é o cliente. - A gente nunca trabalhou. Só tentamos, a gente podia trabalhar agora, né? – eu de novo. - Pô, Marcela eu agora tô só clinicando. – diz ele. - Clinicando? – Deus. - Sim. Eu também sou veterinário. Não sabia? Resultado da pesquisa A cobaia encontra-se acabrunhada, um tanto quanto deslocada. Acordou mais cedo que o habitual, alimentou-se mal e se mostrou pouco receptiva a impulsos positivos. Não quis brincar, nem interagiu a receita de bolo de fubá cremoso de Ana Maria Braga. Fazer o quê? Mas nem tudo está perdido. Eu não desisto. Na lição do “flash back” aprendi que bom mesmo é focar em novas frentes. Foi bobagem achar que o que não rolou poderia rolar. Opto imediatamente pelo módulo “clientes/parceiros que deram certo” e não é que consigo um freela? É. O negócio é multiplicar sobre o positivo. Então tá então.


64 :: 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. webdesign@luli.com.br

Vá estudar, menino! Você chama website de “home page”? Se orgulha de ser autodidata? Tsk, tsk, tsk... No país em que a auto-ajuda é o “gênero” literário mais vendido e cujo Presidente da República se orgulha de nunca ter lido um livro, não é de se admirar a popularidade de certas personalidades virtuais cuja maior façanha é a reclamação indiscriminada e a constatação ferrenha que tudo, absolutamente tudo é uma porcaria. Você certamente conhece alguns deles: são aqueles que, de tão chatos e inconvenientes, não conseguem sustentar um emprego ou amigos por determinado tempo e de quem até a própria família suspira aliviada quando vão embora. Pois no grande armário da Internet, em que todos podem dar a opinião que quiserem sobre o que bem entendem, eles estão à vontade. E podem reunir em torno de si um grupo de macacos de auditório que, por falta de opinião ou cultura, concordam com tudo o que dizem, em uma câmara de eco infinita. Pois é. O mesmo sistema de web 2.0 que permite uma grande liberdade de expressão também pode servir de palco para as declarações mais descabidas, preconceituosas e radicais. É o mesmo princípio que sustenta o fundamentalismo: fala-se o que vier à mente e manda-se para a fogueira quem ousar discordar. Não há nada de errado em se discordar do sistema vigente, mas a crítica sem proposta nada mais é que uma panfletagem vazia. Levá-la a sério pode atacar as poucas iniciativas positivas. Se levarmos em consideração o baixo índice de leitura e conhecimento dos profissionais que trabalham com Internet, é surpreendente que haja tantas críticas. Na minha opinião, muitos destes se comportam como líderes sindicais (ou crianças mimadas, o que não é de todo diferente): como não têm competência, não se estabelecem. Como não conseguem criar, se empenham em destruir. Como não estudam, atacam qualquer forma de cultura. Ao propor a queima de livros, Mao e Hitler não eram tão diferentes assim. Nesses tempos de comunicação colaborativa, as oportunidades de aprendizado estão por toda parte, em diversos formatos. Você é designer? Pois se preocupe em aprender um pouco mais sobre História da Arte, História do Design, Tipografia, Fotografia, Teoria das Cores... conheça os trabalhos dos melhores profissionais do mundo, não só na sua área (aliás, para ampliar seus horizontes, evite a sua área). Se você é programador, aprenda um pouco mais sobre Planejamento de Processos, Ciência da Informação, Teorias de Linguagem, Epistemologia e Aprendizado. É isso, e não uma nova manha de Flash ou um script diferente que fará de você um profissional respeitado. É sempre bom lembrar que técnica é só técnica e que, por melhor que seja, você sempre poderá ser ultrapassado por alguém com uma coleção melhor de bookmarks. Isso ficou bem claro quando fui para Londres terminar meu doutorado. Apesar de ter


webdesign :: 65

"Você chama website de “home page”? Se orgulha de ser autodidata? Tsk, tsk, tsk..."

na bagagem alguns cursos e uma boa coleção de livros técnicos, descobri que não tinha feito mais do que a minha obrigação, e que, para seguir adiante, teria de estudar muito, muito mais – a respeito de assuntos que, aparentemente, não tinham nada a ver com a minha área de atuação. Um pouco mais tarde ficou evidente que eram exatamente aqueles temas estranhos, desconexos e aparentemente arcaicos (Filosofia e PósModernismo, por exemplo) que fizeram toda a diferença para “amarrar” os conceitos técnicos. Curiosamente, são os únicos que ainda são válidos. Minha avó sempre me disse que aquele que tem telhado de vidro não deve jogar pedra no dos outros. Por isso, se você chama flyer de “flayer”; se seu portfólio se resume a um fotolog em Flash; se sua cultura gráfica é composta apenas dos websites que visita; se acha que design é arte (mas não estuda arte, pois acredita que tem um “dom” divino); se acredita que criatividade é incompatível com as ciências exatas; se desdenha de profissionais ou publicações nacionais (mas não faz melhor, pois é incapaz); se acredita que “nada se cria, tudo se copia” (e aplica essa máxima para as peças que desenvolve); se sua participação online mais relevante é mandar mensagens para listas criando regras e falando mal dos outros; se seu principal site é um blog que comenta assuntos sobre os quais você não tem domínio algum senão o palpite; se cria comunidades de ódio no Orkut; se as peças que você desenvolve têm cara de portal; se você está mais preocupado em CSS e XHTML, PHP, MySQL que em design ou que nas necessidades de seu usuário; se seu programa de ilustração é o CorelDraw; se você não sabe se quer ser músico ou trabalhar; se é definido como um “flasheiro” (ou jóquei de qualquer tecnologia); se é auto-intitulado “designer autodidata”; se que quer se profissionalizar sem fazer uma faculdade; se corre para comentar qualquer bobagem que lê, sem profundidade, em sites estrangeiros; se tem, enfim, a opinião formada sobre tudo – e acha tudo um lixo, uma sugestão: “— Vá estudar, menino!” Só assim você poderá se transformar naquela metamorfose ambulante tão importante nas equipes de criação de produtos digitais.





Turn static files into dynamic content formats.

Create a flipbook
Issuu converts static files into: digital portfolios, online yearbooks, online catalogs, digital photo albums and more. Sign up and create your flipbook.