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
Um aprendizado além da tecnologia As crianças do projeto Magê-Malien, sob a coordenação do Mestre Bode, marcaram presença na edição carioca do 11º EWD. Eles trouxeram alegria e mostraram como os ensinamentos da capoeira ajudam na construção de futuros cidadãos.
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.