outubro 2006 :: ano 3 :: n 34 :: www.revistawebdesign.com.br
outubro 2006 :: ano 3 :: nº 34 :: www.revistawebdesign.com.br
DESIGN & ARTE
Ampliando suas fontes de inspiração
Webdesign
Reportagem: Conheça as transformações ocorridas no design para web Estudo de caso: A era dos sites como estratégia de branding Especial: Cobertura do Fórum Internacional de Design e Tecnologia Digital
R$ 8,90 I SSN 1806 - 0099
9 771806 009009
00034
E D I T O R A
4 :: quem somos
Editorial “Vamos lá, Picasso, essa tela é pra ontem!!!”
Equipe Direção Geral Adriana Melo adriana@arteccom.com.br
Nossa última reunião de pauta aqui na Arteccom foi bastante rica e estimulante: falaríamos sobre arte nesta edição! É um assunto
Direção de Redação Luis Rocha luis@arteccom.com.br
Criação e Diagramação Camila Oliveira
C o m o C a ro l i n a L e s l i e , d a A g ê n c i a C l i c k ( p á g i n a 3 9 ) , e x p l i c a bem que a arte não tem que agradar nenhum público e a função do designer é justamente encontrar soluções ou, simplesmente, “agradar” este mesmo público, por que design e arte estão tão próximos, andam tão juntos? A ponto do designer, numa agência de
camila@arteccom.com.br
Leandro Camacho leandro@arteccom.com.br
Ilustração Beto Vieira beto@arteccom.com.br
Publicidade Bruno Pettendorfer Débora Carvalho
publicidade, ser chamado de “diretor de arte”? Na minha cabeça, fico imaginando um diretor de arte mais ou menos assim: - “Vamos lá, Picasso, essa tela é pra ontem, viu?” Brincadeiras à parte, acho que um designer deve, ao invés de
publicidade@arteccom.com.br
Gerência de Tecnologia Fabio Pinheiro fabio@arteccom.com.br
Financeiro Cristiane Dalmati cristiane@arteccom.com.br
se sentir um artista, conhecer muito de arte e interpretá-la como f o r m a s d e e x p re s s ã o . U m a r t i s t a , n o s e u m o m e n t o d e c r i a ç ã o ,
Atendimento e Assinaturas Luanna Daumas luanna@arteccom.com.br
chora, ri, sofre, sente angústia e, finalmente, encontra uma maneira de extravasar seus sentimentos, através de formas, cores, sons, ocupação do espaço... Um designer também pode chorar, sorrir, sofrer, se o objetivo for encontrar soluções inovadoras para seus clientes. Ou seja, 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
arte deve servir apenas como uma grande fonte de inspiração. E, com esse objetivo, preparamos várias páginas para a sua imersão
Criação e edição www.arteccom.com.br
no mundo da arte. Produção gráfica
Boa leitura.
www.prolgrafica.com.br
Adriana Melo
Distribuição www.chinaglia.com.br
9
:: 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.
interessante e essencial.
menu :: 5
apresentação pág. 4 quem somos pág. 5 menu
contato pág. 6 emails pág. 6 fale conosco
fique por den tro pág. 8 métricas e mercado pág. 10 direito na web pág. 11 post-it
portfólio pág. 12 agência: Cappuccino/HZTA pág. 18 freelancer: Renato Loose
matéria de capa pág. 20 entrevista: Design e arte pág. 28 reportagem: Design na web
e-mais pág. 38 debate: Adaptar-se pág. 44 e-mais: Virais na web pág. 48 especial: FIND pág. 51 estudo de caso: Bicmusic pág. 54 tecnologia na web: CSS Hacks pág. 56 tutorial: Caminhando pelo HTML - Parte 5
com a palavra pág. 58 mercado de trabalho: Cesar Paz pág. 60 marketing: René de Paula Jr. pág. 62 bula da Catunda: Marcela Catunda pág. 64 webdesign: Luli Radfahrer
6 :: emails
na edição nº15, de março de 2005. Uma boa pedida é acessar o site do
na web Assunto: Direito Flash, ActionScript...
IDEAFIXA como uma das principais referências para o trabalho de
projeto do SERPRO, desenvolvido
Que tal uma reportagem a
designers. Todo mês vamos incluir
justamente sobre esta área (http://
respeito do que há de novo e
alguma publicação que pode servir
www.serpro.gov.br/acessibilidade).
“realmente útil” no ActionScript
como referência no trabalho criativo
3.0 do Adobe Flash 9? Ou algo
de nossos leitores.
do tipo “o que seria da web
Assunto: Direito Política na deweb privacidade nano web Assunto: Direito Trabalho exterior Olá, pessoal da minha revista
sem o Adobe Flash”, quais suas contribuições, seus problemas, seu
predileta! Como acompanho
Gostei muito da Coleção Brasil
crescimento na utilização em web
vocês há um bom tempo (desde
Design, mas tenho uma dúvida
sites, o que é viável e inviável.
sua estréia, diga-se de passagem),
em relação aos profissionais que
Parabéns pelo canal aberto para
gostaria de sugerir um tópico
atuam no exterior. Levando em
sugestões.
super importante e que a maioria
consideração a dificuldade para
dos sites deve ter: a Política de
conseguir um visto de trabalho
Misael Moura misael_mmm@hotmail.com
Privacidade. Como constituí-la,
permanente no exterior, gostaria
que benefícios e qual segurança
de saber como estes profissionais
Oi, Misael.
ela fornece ao site. É isso.
conseguem a sua permanência
Ótimas sugestões! Estes temas
Obrigada!
no exterior de forma legal,
são boas pautas para as seções
Sou do colégio FECAP e estou
Fernanda Prevedello fernandaprevedello@gmail.com
para realizar trabalhos e se
Tecnologia na Web e Tutorial.
produzindo um trabalho de
estabelecerem em empresas sem
Pensamos em procurar algum
conclusão de curso. Gostaria de
problemas com passaportes e
saber se poderiam nos ajudar e
Ótima sugestão, tanto é que ela
profissional fera em ActionScript
extradições de estrangeiros?
nos enviar os nomes das maiores
se tornou tema da coluna “Direito
para desenvolver um tutorial para a
Leandro Guedes chborb@hotmail.com
revista. O que acha? Abraços!
empresas presentes no mercado
na web”. Vá até a página 10 e boa
de web. Obrigada.
leitura!
Janaina Lume jana.lume@gmail.com
Durante o workshop Conexão (www.arteccom.com.br/conexao), Assunto: Acessibilidade
Direito na web do Assunto: Maiores empresas mercado
Assunto: Referências Direito na web Como vai, Janaína? Sobre sua
André Matarazzo respondeu justamente esta questão. Segundo
Sugestão de pauta: a revista
dúvida: qual o segmento do
Gostaria de saber se em alguma
ele, é bom sair do Brasil com o
digital internacional (feita por
mercado web que você quer
edição vocês já fizeram matérias
visto resolvido. Se você puder
brasileiros) IDEAFIXA (www.
informações (provedores de
sobre acessibilidade na web.
conseguir dupla cidadania, melhor
ideafixa.com). Se valer a pena,
hospedagem, agências interativas
Estou fazendo meu trabalho de
ainda. Geralmente, as grandes
entrem em contato! Obrigada.
etc.)? Se forem os provedores de
conclusão do curso de Publicidade
agências procuram ajudar os
hospedagem, uma boa pedida
e Propaganda e estou levantando
profissionais estrangeiros a resolver
Janara Lopes janara@gmail.com
o máximo de informações
este problema.
Obrigado pela indicação,
(www.hostmapper.com.br/ranking-
Janara. Na verdade, já tínhamos
hospedagem-de-sites.html), que
conhecimento do trabalho de
aponta as 50 maiores empresas.
vocês, excelente por sinal! Em
Sobre as agências, procure entrar
setembro, lançamos uma nova
em contato com o pessoal da
seção (Post-it) e colocamos a
AGADi (www.agadi.com.br) e
possíveis. Obrigado! Fernando Leite dodo@canecadigital.com.br
Fizemos sim! A reportagem saiu
é acessar o site da Hostmapper
APADI (www.apadi.com.br).
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 :: métricas e mercado
Média Salarial Brasil - Agosto/2006 Analista Júnior Desenvolvimento de Internet / Sistemas Web
2.455,00
(Fonte: 195 respondentes)
Analista Pleno Desenvolvimento de Internet / Sistemas Web
3.753,00
(Fonte: 329 respondentes)
Analista Sênior Desenvolvimento de Internet / Sistemas Web
4.830,00
(Fonte: 335 respondentes)
Analista Programador(a) Web
2.866,00
(Fonte: 223 respondentes)
Coordenador(a) de Projetos Web
5.852,00
(Fonte: 180 respondentes)
Editor/Produtor de Conteúdo Web
2.456,00
(Fonte: 40 respondentes)
Webdesigner Estagiário
584,00
(Fonte: 112 respondentes)
Webdesigner Trainee
1.418,00
(Fonte: 87 respondentes)
Webdesigner
2.303,00
(Fonte: 177 respondentes)
Web Development
3.422,00
(Fonte: 46 respondentes)
Webmaster
2.442,00
(Fonte: 183 respondentes)
Fonte: 20º Edição da Pesquisa Salarial Catho (www.catho.com.br)
20h39min
Vídeos e filmes
Esse é o tempo, em termos de horas navegadas no domicílio,
Pesquisa aponta um aumento de 21% no número de in-
dos usuários brasileiros. O Brasil é o primeiro colocado na cate-
ternautas residenciais que acessaram sites de vídeos e
goria, ficando a frente de países como Japão, EUA e França.
filmes em julho de 2006. Em junho, foram 3,4 milhões de
Fonte: Ibope//NetRatings (www.ibope.com.br)
usuários únicos domiciliares. Segundo o Ibope, o maior acesso à banda larga tem incentivado um maior consumo
52%
... dos usuários corporativos serão depen-
de conteúdo áudio-visual.
dentes da prática de mobilidade para os
Fonte: Ibope//NetRatings (www.ibope.com.br)
próximos dois anos, segundo previsão da Associação Brasileira de e-business. O celular foi considerado o dispositivo móvel mais adequado. Fonte: Associação Brasileira de e-business (www.ebusinessbrasil.com.br)
Você utiliza CSS Hacks para a criação de um site? Total de votos: 272 Sim - 64%
R$ 1 bilhão e 750 milhões
Não - 36%
Este foi o faturamento total do comércio eletrônico nacio-
acesse e participe!
nal, nos seis primeiros meses de 2006. O índice de crescimento nominal foi de 79%. No mesmo período de 2005, foram apurados 974 milhões. Fonte: Web Shoppers – 14ª Edição (www.webshoppers.com.br)
Envie sugestões e críticas para redacao@arteccom.com.br
www.arteccom.com.br/webdesign
métricas e mercado :: 9
ViuIsso?
Por Michel Lent Schwartzman - michel@viuisso.com.br Site: www.viuisso.com.br
Notícias e comentários sobre comunicação digital, internet e publicidade YouTube começa a reaver ‘dindim’
M T V s e g u e o n d a d o Yo u Tu b e e l a n ç a O v e rd r i v e ? Acho que não... Notícia da Folha Online (http://www1.folha.uol.com.br/ folha/informatica/ult124u20504.
Páginas especiais para artistas como Paris Hilton e comerciais em vídeo são estratégias do maior site de vídeos do mundo para tentar começar a equilibrar seus gastos de cerca de US$ 1 mi mensais, só em tráfego de dados. O site, inaugurado em fevereiro de 2005, é o maior fenômeno de audiência do mundo, servindo mais de 100 milhões de vídeos por dia e efetivamente ameaça uma série de modelos já estabelecidos. A questão é ver em quanto tempo e de que forma ele vai encontrar seu ponto de equilíbrio financeiro e se tornar um verdadeiro negócio rentável. Leia as notícias: http://www.techcrunch.com/2006/08/22/paris-hilton-storms-youtube/ e http://www.bluebus.com.br/show. php?p=1&id=71407.
Google’s Click-to-call: do search ao telefone em um click
shtml) fala do lançamento do MTV Overdrive (só para quem usa Windows e tem o Window Media Player - http://mtv.terra.com br/ mtvoverdrive/) no Brasil. O site, que já existe nos Estados Unidos há um ano, seria a resposta da MTV para o sucesso do YouTube que, recentemente, anunciou que pretende ter em seu acervo, todos os videoclipes já feitos no mundo. Fui conferir o novo site e dei de cara com problemas de configuração, DRMs, incompatibilidades com browser, Macintosh etc. Bater no YouTube já saindo de cara com tantas restrições? I don’t think so... FaleBenQ encerra concurso com 100 vídeos O concurso ‘FaleBenQ’ (www.falebenq.com.br), criado pela 10’Minutos Interactive para a marca taiwanesa de eletrônicos recém-chegada ao
Direto do blog do Marcelo Sant’Iago (http://poucas-eboas.blogspot.com): o novo sistema de ‘click-to-call’ que o Google está apresentando e que deve estar disponível no Brasil em breve. Ao pesquisar um assunto no Google e encontrar um anúncio pago com um ícone de telefone ao lado, será possível clicar e receber uma ligação imediata do anunciante. A junção “internet+telefone” seria risível e impensável oito ou dez anos atrás. A maioria das conexões era discada e muito pouca gente tinha celular. Hoje em dia faz todo sentido. Teste o ‘click-to-call’ (http://tinyurl.com/zkpza).
Brasil, foi encerrado no final de agosto contando com a participação de mais de 100 vídeos criados por usuários com o objetivo de ensinar a falar ‘BenQ’ (‘benquíu’). Desde vídeos simples, criados com webcam, até animações elaboradas em desenho animado participaram do projeto, em que os usuários colocavam suas criações no YouTube e então enviavam os vídeos para o site FaleBenQ. Até a data, os vídeos já haviam sido visualizados mais de 200 mil vezes.
10 :: direito na web
Particularidades de uma Política de Privacidade Como constituí-la, que benefícios e qual segurança ela fornece ao site? Fernanda Prevedello (fernandaprevedello@gmail.com)
Em tempos de alto valor da “infor-
sobre quais informações serão compartilha-
mação” (senha pessoal, dados cadastrais,
das, qual a segurança contra invasões e apro-
hábitos de navegação, compras efetuadas,
priações indevidas, quais as áreas de acesso
número de cartão de crédito etc.), é natural
restrito, quais as situações e os procedimentos
que os proprietários de websites cada vez se
para liberar informações às autoridades, quais
preocupem mais quanto a alegações de vio-
conhecimentos e dados serão considerados
lação de privacidade, especialmente quando
como segredos comerciais, qual será o esco-
elas são acompanhadas de pretensão de in-
po de atividades passíveis de monitoramento
denizações, enquadramento criminal, habe-
eletrônico, além de, preferencialmente, um
com Mestrado na USP e cursos
as data etc. O tema está em evidência não
campo em branco para o internauta clicar caso
em Harvard e no M.I.T. Ex-
apenas em razão do noticiário envolvendo a
aceite receber e-mail marketing.
Gilberto Martins de Almeida Advogado formado na PUC/RJ,
Gerente Jurídico da IBM, onde trabalhou por 11 anos, no Brasil e nos EUA. Sócio de Martins de Almeida - Advogados, escritório especializado. Envie sua dúvida para: redacao@arteccom.com.br
Google (Orkut) e o Ministério Público.
E o que ela não deve conter? Regras
Mas, afinal, o que vem a ser uma Po-
conflitantes com as do Termo de Uso ou com
lítica de Privacidade? Legalmente, é uma
outras normas ou práticas do site, informe
estipulação unilateral que funciona como
inverídico sobre sigilo ou sobre não uso co-
contrato de adesão para os que freqüen-
mercial de dados, promessa não cumprida de
tem o website que a tenha adotado. Como
monitoramento e de segurança são apenas
contrato de adesão, há uma parte em que
alguns exemplos do que, infelizmente, por
se tem liberdade para definir regras a se-
desconhecimento das implicações legais, ain-
rem seguidas pelos visitantes, e há outra
da grassa no mercado.
parte em que o contrato não pode contrariar a lei sob pena de ser nulo.
Os benefícios que ela proporciona são, em primeiro lugar, de evitar mal-entendidos
A Política de Privacidade é composta
e expectativas equivocadas, ao esclarecer
de quê? Isso depende, em primeiro lugar,
claramente quais são as regras aplicáveis, e
do tipo de website, público-alvo, objetivos
em segundo lugar, de proteger a privacidade
comerciais, necessidades de segurança,
do próprio site e das pessoas que o freqüen-
dentre outros fatores a serem considera-
tam, na medida em que previne responsabili-
dos sob medida, caso a caso. Em assuntos
zação cível ou criminal. Terceiro, legitima, nas
de direito de privacidade, a palavra-chave
condições que especifica, o uso de cookies,
é proporcionalidade. Portanto, essa “cus-
web bugs, e envio de spam, contribuindo
tomização” é fundamental, sob pena de
para a sustentação comercial e econômica
a omissão de um item, ou a incompatibi-
do site, de forma legal.
lidade de outro, fazerem ruir a Política. Ou seja, desconfie de modelos pré-prontos.
Como se vê, Políticas de Privacidade são tudo, menos “política”. No fundo, são
À parte as adaptações individuais ne-
um equilíbrio entre direitos e interesses
cessárias, o conteúdo básico de uma Política
opostos, que costuma servir bem quando o
de Privacidade pode incluir regras e avisos
trabalho é de alfaiataria.
post-it :: 11
entro , d r o p Fique cas, eventos ias das di e referênc undo livros vimentam o m que mo ign na web do des Peixe Grande entra na fase de votação Se os políticos entram, neste mês, na reta final de suas campanhas eleitorais, outubro representa também o início da corrida para as agências e os profissionais freelancers buscarem votos que vão garantir lugar na fase final do “III Concurso Peixe Grande”. Entre no site www.arteccom.com.br/webdesign/peixegrande e confira quem são os concorrentes nesta pescaria.
A web 2.0 com a cara do Brasil! Os projetos brasileiros que utilizam os conceitos de web
Banco de dados sobre o design brasileiro
2.0, como Videolog.tv (www.
Essa vai para a lista de favoritos: o portal DesignBrasil (www.
videolog.tv), Gazzag (www.
designbrasil.org.br), uma iniciativa do Ministério do Desenvolvimento,
gazzag.com.br), Camiseteria
Indústria e Comércio Exterior, traz uma série de informações relevantes
(www.camiseteria.com), Aprex
para quem trabalha na área: agenda de eventos, artigos, banco de
(www.aprex.com.br), entre
profissionais, dicas etc.
outros, estão fazendo sucesso no exterior! Para se ter uma idéia, o tema foi analisado recentemente
Referências criativas
por Richard MacManus (http://tinyurl.com/zukx3), consultor web e
Conhecer o trabalho de outros profissionais e agências é uma forma
colunista do site ZDNet (http://tinyurl.com/f329t).
de ficar atualizado sobre as novas tendências e as técnicas que vêm sendo utilizadas no mercado. Confira alguns bons exemplos: K2 Internet (www.k2.pl), Platinum FMD (www.platinumfmd.com. br), Emil Kozak (www.emilkozak.com) e Glauco Diogenes (www.
Dicas
glaucodiogenes.com.br). Conhece outras boas referências? Então,
Livro do mês
mande um e-mail para redacao@arteccom.com.br.
“Ergodesign e Arquitetura da Informação: trabalhando para o
Nova geração do design na web
usuário”
Dando continuidade ao trabalho de divulgação da produção
Autor: Luiz Agner
universitária na área do design na web, indicamos a monografia “O Ícone Interfacial: Estudo e Análise Conceitual e Tecnológica” (http:// tinyurl.com/fgv2r), apresentada por Eduardo Loureiro, na conclusão
"A época de bibliografia brasileira
do curso de Comunicação Social da Uni-BH. Se você possui ou
escassa na área de criação e
conhece algum trabalho acadêmico interessante, envie sua sugestão para redacao@arteccom.com.br.
desenvolvimento de sites parece ter chegado ao fim. Isso porque, nos últimos dois anos, uma série de autores nacionais vem contribuindo para tornar esta
Agenda de eventos 07/10 - Webmarketing (www.fiti.org.br) 12 a 15/10 - RDesign Lorena (www.fatea.br/rdesign/index.php) 28/10 - Intercon (www.imasters.com.br/intercon/2006) 18/11 - 11º EWD - POA (www.arteccom.com.br/encontro) 21/11 - 11º EWD - Curitiba (www.arteccom.com.br/encontro) 23/11 - 11º EWD - Brasília (www.arteccom.com.br/encontro) 25/11 - 11º EWD - São Paulo (www.arteccom.com.br/encontro)
realidade diferente. Um deles é Luiz Agner, professor da UniverCidade e PUC-Rio, em recente lançamento pela Quartet Editora (www.quartet.com.br). Com uma linguagem simples e objetiva, o livro apresenta uma série de questões envolvendo Arquitetura da Informação, Ergodesign e Usabilidade, mostrando como estes temas funcionam como ferramentas estratégicas na construção de ambientes interativos. Como diz Peter Morville, no texto de apresentação do livro: 'a educação é a chave para o sucesso. Somente compartilhando o nosso conhecimento, nós podemos ter a esperança de superar a disciplina e de construir uma comunidade."
Participe do Post-it! Envie sugestões para redacao@arteccom.com.br.
12 :: portfólio agência - cappuccino/hzta
o r e s u l t a d o d a f u s ã o e n t re d e s i g n e t e c n o l o g i a Segundo a Wikipédia, o cappuccino é uma bebida
Investimento em pesquisa e tecnologia
de origem italiana. Sua fórmula apresenta os seguintes
A s s i m c o m o a c o n t e c e e m o u t ro s s e g m e n t o s , a
elementos: “1/3 de (café) espresso, 1/3 de leite
concorrência na área de internet fica a cada dia mais
vaporizado e 1/3 de creme vaporizado do leite”. No Brasil,
acirrada e exige que as agências interativas procurem
a tradicional receita foi adaptada e o chocolate em pó
aspectos que determinem um bom diferencial. Pensando
começou a fazer parte desta mistura.
nisso, a Cappuccino/HZTA vem destinando recursos em
Em 2006, foi a vez do mercado interativo experimentar
pesquisa e tecnologia.
o sabor de uma nova receita, no qual design e tecnologia
“O objetivo é que o resultado de nosso trabalho possa ser
surgem como os principais ingredientes responsáveis pela
visualizado em qualquer tipo de mídia digital, ou seja, podemos
geração de uma nova agência disposta a colocar seu nome
pensar em uma campanha com conteúdo para internet, celular,
definitivamente na história da internet brasileira.
palm, CD-ROM etc. Um outro diferencial é que atuamos
“A Cappuccino/HZTA (www.cappuccinohzta.com.
como o ‘braço digital’ de outras agências de publicidade e
br) foi criada a partir da fusão entre empresas que já
comunicação que ainda não tem prática no desenvolvimento
atuavam no segmento: a Cappuccino, especializada
de trabalhos para a internet”, revela Cláudio.
na área de design, e a HZTA, focada em soluções para
Além disso, o conhecimento e a experiência de
web. Unidas, elas criaram uma agência de comunicação
sua equipe na área de ilustrações se tornou uma ótima
digital, que alia os pontos fortes de ambas, oferecendo
oportunidade para a criação de uma unidade de negócios
ao mercado soluções digitais, com base em planejamento,
exclusiva. “Assim, muitas de nossas criações digitais têm
criação e tecnologia nesse setor”, explica Cláudio Roberto
um tom individualizado, pois suas ilustrações foram criadas
Tucunduva, sócio da agência.
aqui. Vendemos também mais este serviço (ilustrações)
De cara, o primeiro desafio seria unificar o posicionamento das duas antigas empresas a uma nova
para as agências para ser usado em campanhas on-line ou off-line”, aponta Leonardo Gibran, sócio da agência.
re a l i d a d e . “ P a r a q u e i s s o a c o n t e c e s s e , re a l i z a m o s
Localização estratégica
diversas reuniões entre os departamentos para reforçar
A Cappuccino/HZTA está localizada estrategicamente
o posicionamento da nova empresa e o redesenho dos
em São Paulo, considerado o grande pólo urbano do Brasil
processos. A partir da fusão, o foco se tornou atender
e o principal centro comercial de internet no país. “Não há
de maneira mais personalizada clientes que enxergam
como negar que a cultura da internet (e das outras mídias
a internet como investimento, trabalhando sempre em
digitais) é difundida com maior força e penetração na
soluções específicas para as necessidades particulares de
Grande SP, seja através da imprensa, de eventos e cursos
cada cliente”, afirma Cláudio.
que acontecem freqüentemente e outros fatores em geral.
portfólio agência - cappuccino/hzta :: 13
“Criamos um banco interno de sites favoritos, que vem crescendo progressivamente. Através dessa ferramenta, compartilhamos nosso conhecimento e nossas influências entre toda a equipe” (Anderson Bordim e Vitor Elman) Isso faz com que o mercado tenha conhecimento suficiente
futebol, boliche, kart, entre outros”, diz Cláudio.
para disponibilizar verbas para ações mais agressivas em
Preparando-se para o futuro
relação às soluções digitais”, analisam Anderson Bordim e
A evolução nos meios de acesso à internet tem
Vitor Elman, sócios da agência.
permitido a utilização de novos recursos na criação e
Porém, engana-se quem pensa que a área de atuação
desenvolvimento de interfaces digitais. Diante dos desafios
d a a g ê n c i a s e re s t r i n j a a p e n a s a S ã o P a u l o . “ Te m o s
que estão por vir, a Cappuccino/HZTA estuda de que forma
também clientes de fora, que nos contataram em busca de
pretende se inserir dentro deste contexto.
um diferencial e qualidade de trabalho, além de clientes
“As agências já começam a pensar em conteúdos
na Europa e EUA para os quais nossos preços ainda são
para criação digital não somente para a internet, mas para
bastante viáveis”, acrescentam.
outras mídias que começam a ser cada vez mais utilizadas
De olho no “banco de referências”
comercialmente, como palm, celular, entre outros. Além
Arquitetura de informação passando pelo design
disso, cada vez mais os clientes querem conhecer detalhes
de interface. Estes são alguns dos principais temas em
sobre retorno do investimento feito, uma vez que com a
pauta no processo de criação da Cappuccino/HZTA.
internet, o feedback do usuário e a medição dos resultados
E para manter sua equipe atualizada com o que há de
das ações são imediatos”, afirma Cláudio.
m a i s m o d e r n o n o m e rc a d o , a a g ê n c i a c r i o u , e m s u a
Dentre os projetos futuros da agência, o especialista
intranet, um banco de dados para que os profissionais
aponta a evolução nas ações estratégicas da empresa e a
possam cadastrar as principais referências de trabalho e
expansão de sua área de negócios. “Queremos trabalhar
compartilharem o conhecimento.
cada vez mais com a inteligência do negócio voltada a
“Passamos uma parte do tempo de criação
mídias on-line, focados no atendimento dos clientes como
buscando novas tendências através da internet.
contas, pensando sempre em vender não só ferramentas,
Criamos um banco interno de sites favoritos, que vem
mas também planejamento estratégico das ações on-line,
crescendo progressivamente. Através dessa ferramenta,
adequando às realidades on-line e off-line de cada cliente.
compartilhamos nosso conhecimento e nossas influências
Como metas para os próximos dois anos, pretendemos abrir
entre toda a equipe. Nesse banco, temos referências do
filiais no Sul e no Nordeste e melhorar a nossa captação de
que se está fazendo em todo o mundo, desde designers
projetos na Europa e nos EUA”, complementa.
australianos a poloneses. Assim, conseguimos ter um panorama global, onde, às vezes, nem a língua é uma barreira, pois o design e o conceito falam mais alto”, apontam Anderson e Vitor. Outra estratégia é o investimento em cursos de aperfeiçoamento, conforme a área e a necessidade de cada departamento. “Incentivamos o sentimento do desafio criativo da operação, sem competitividade predatória, dando liberdade de opinar nos processos de trabalho. Apoiamos ainda a realização de atividades estimulantes como shiatsu, happy hour e prática de esportes, como
Sócios da Cappuccino/HZTA reunidos
14 :: portfólio agência - cappuccino/hzta
“As agências já começam a pensar em conteúdos para criação digital não somente para a internet, mas para outras mídias que começam a ser cada vez mais utilizadas comercialmente, como palm, celular, entre outros” (Cláudio Tucunduva)
Cases - Hotsite “Seriexpert 2005”Canal Sony www.sonypictures.com.br/canalsony Tecnologias utilizadas: Action Script, Flash e Photoshop
A oportunidade de desenvolver hotsites promocionais para o canal Sony surgiu através da rede de contatos mantidos pela agência. Dentre os trabalhos já realizados, um dos destaques foi o hotsite da promoção anual direcionada aos chamados “fãs de carteirinha” do canal. “Eles precisavam de um hotsite que interagisse com o usuário e tivesse uma seqüência de atividades e/ou jogos que pudesse criar um ranking entre os participantes. Ao final da promoção, os líderes do ranking ganhariam prêmios. Desenvolvemos todo o conceito da campanha. A home do site era um braço com uma tatuagem do Sony e, ao fundo, um painel com várias fotos, imãs e imagens de personagens das séries, como seria realmente um quarto de um fã dos seriados”, relata Vitor Elman. Segundo ele, a criação buscou algumas referências do canal, como as “manchas” no contorno do site, além da própria linguagem moderna, dinâmica e ousada. “O site procurou passar também a mesma atitude que o canal tem na televisão. Conforme o usuário passa o mouse por cima da imagem do braço tatuado, a pessoa (dona do braço) se movimenta e o fundo se altera, dando uma idéia de um espaço maior. A leitura e a navegabilidade são fáceis. A fonte seguiu a linha jovem, como se fosse ‘rabiscada’ ou escrita à mão. A curiosidade é que o braço tatuado pertence a um dos nossos designers, que inicialmente ‘posou’ só para a realização de um primeiro layout, mas o resultado ficou tão bom que foi usado em definitivo”, revela.
portfólio agência - cappuccino/hzta :: 15
- Shop Tour
- Samba Comunicação
www.shoptour.com.br
www.sambacom.com.br
Tecnologias utilizadas: Flash, Illustrator, JavaScript e
Tecnologias utilizadas: Action Script, Flash, PHP e
Photoshop
Photoshop
A qualidade no trabalho e o pronto atendimento presta-
Tendo como base o tema “Nossa pegada é outra”, o
do mesmo em serviços menores foram aspectos fundamentais
desafio deste case seria criar um site que apresentasse
para que a agência conquistasse, aos poucos, a confiança do
os principais projetos da Samba Comunicação e passasse
Shop Tour. “Quando eles sentiram a necessidade de que o site
o c o n c e i t o d a a g ê n c i a , c o m u m v i s u a l q u e re m e t e s s e a
fosse reformulado, e acompanhasse a mudança de estratégia
idéia do “samba raiz”, com estilo.
do canal, passaram para nós o briefing. Assim, o desafio era
“O ponto de partida da criação foram algumas fotos
desenvolver um novo conceito: o site deveria deixar de ser
que ilustrariam um livro institucional da própria agência
somente um espaço corporativo e se tornar uma área comer-
(eram fotos artísticas da Escola de Samba Mangueira). Sur-
cial, onde a programação da TV também poderia ser vista pelo
giu a idéia de usar as fotos compostas num layout com
cliente, em qualquer hora ou local. E foi baseado nisso que
‘rabiscos’ por cima das fotos, que se tratam na verdade
iniciamos a criação”, conta Vitor.
de animações, que dão uma idéia de ritmo e movimento às
Dessa forma, foram feitos alguns estudos de combinação
imagens. Do caos dos rabiscos sai uma unidade visualmente
cromática e tipografia para que fosse alcançada a identidade
organizada e bonita, remetendo ao próprio conceito do
visual desejada. “As cores são predominantemente as do canal,
samba, que traz uma melodia em meio ao caos de tantos
porém foi adicionada uma paleta de cores de apoio com tons
instrumentos”, explica Vitor.
mais sóbrios (muitos tons pastéis), que combinaram com o azul
E as animações existentes dentro do site estão perfeitamente
tradicional do canal. Essas cores foram utilizadas para reforçar
integradas com o conceito defi nido no briefi ng. “A brincadeira
a segmentação do site (automóveis, imóveis etc.). Sobre a tipo-
interessante é a interatividade das imagens, pois conforme se
grafia, foi usada a fonte ‘Helvetica Condensed’ que dá peso à
mexe o mouse há a animação e a velocidade do movimento varia
leitura, sem serifa para colaborar com a idéia de modernidade
conforme a velocidade do mouse, dando a idéia de que o usuário
e requinte”, relata.
comanda o ritmo do samba. Foi utilizada uma fonte mais séria
No final, diz Vitor, o site acaba funcionando como uma
e elegante e com boa legibilidade para contrabalançar com os
“Central de Vídeos”. “Por isso, criamos ‘volumes’ dando a
outros elementos visuais do site. Outra curiosidade é que nossa
impressão de tridimensionalidade e com várias opções de
equipe criou o layout sem ter visto o livro institucional da agência
controle para cada vídeo. O fato legal desse case é a idéia de
(que ficaria pronto um pouco depois). Quando fomos apresentá-lo,
usar os vídeos integrados ao layout, que deu ao site uma idéia
a equipe da agência disse que o livro estava seguindo um layout
bastante próxima do conceito do programa na televisão”.
bastante similar, com a idéia dos rabiscos sobre a foto”.
18 :: portfólio freelancer - Renato Loose
www.miliciavitoria.com “A parte vetorial foi desenvolvida no Flash MX. Para as cores e finalização, optei pelo Photoshop 7”
ILUSTRAÇÕES QUE MARCAM O ESTILO DE UM DESIGNER Contato: renatolooz@gmail.com Site: www.cafeina.info Desenhar sempre foi uma prática presente na vida de Renato Loose e talvez seja um bom indício para explicar a sua
se tudo. Placas, cores, arquitetura, grafites, stickers.
escolha pelo design. “A partir do momento em que comecei a
Um bom designer deve ser observador. Entender o que
utilizar computadores, tive vontade de trazer os traçados para
acontece à sua volta, absorver e moldar à sua maneira de
o plano digital. Foi então que, por conta própria, comecei a
trabalhar as imagens. Guardando mais fontes, a inspira-
procurar e estudar quais seriam os melhores softwares para
ção pode vir de onde menos se espera, além de confe-
trabalhar. Ao mesmo tempo, fui atrás de livros sobre design
rir originalidade ao trabalho. Também retiro muitas
para conhecer melhor a evolução dos processos de criação e
lições do cinema, em especial, o europeu”.
as escolas e correntes de maior importância”, revela. Além do conhecimento autodidata, Renato buscou com-
E analisando o portfólio de Renato, é possível afirmar que as ilustrações representam o seu dife-
pletar sua formação cursando Comunicação Social na Univer-
rencial. Um exemplo está presente no site Milícia
sidade Federal do Espírito Santo (UFES). “Ela me ajudou nos
Missões Urbanas (www.miliciavitoria.com). “A
processos de criação, afinal, comunicação verbal e visual têm
intenção da imagem é mostrar que é possível
sempre o mesmo objetivo: passar uma mensagem. Fiquei mais
a convivência pacífica entre pessoas de dife-
objetivo e incisivo naquilo que me proponho a fazer. Aprendi
rentes culturas. Como se trata de um ambiente
tendo contato com pessoas que já trabalhavam na área utili-
típico das grandes cidades, utilizei a imagem
zando elementos que fazem parte tanto do ambiente visual,
distorcida de prédios e postes como forma de
quanto do escrito. Sem contar o fácil acesso a materiais como
representar o caos, a aglomeração e as fusões
livros para pesquisas de imagens e referências diversas”.
tão comuns à vida urbana. Para as cores, pensei
O resultado não poderia ter sido melhor: hoje ele conta com uma boa base referencial e de influências para realizar seu trabalho. “A base são os mangás. Depois vieram influências da
em tons mais frios e desgastados, contrastando levemente com o colorido dos personagens”. Ou seja, este é um segmento com boas
rua, do grafite e dos stencils, assim como elementos da cultura
oportunidades para os designers na web. “O
underground, especialmente a estética de tatuagens tradi-
leque é amplo e pode, por exemplo, trazer para
cionais e suspensões. A partir de estudos mais aprofundados,
rede um profissional que antes só trabalhava
incluí elementos de décadas passadas - destaque para os anos
com impresso. Para quem já está na internet,
50 e 60 - e, de vez em quando, esbarro na pop art, inspirado
as ilustrações podem valorizar ainda mais o
pelos trabalhos de Roy Liechtenstein”.
trabalho. Se o designer souber criar e mani-
Outro caminho para buscar novas referências é aguçar o instinto de observação. “Nas ruas, presto atenção em qua-
pular bem uma imagem desenhada, ele ganha em valorização e exclusividade de estilo”.
Para participar desta seção, cadastre seu portfólio no site da revista: www.revistawebdesign.com.br.
20 :: entrevista - design e arte
Design e arte são campos distintos do conhecimento humano. Porém, nada impede que ambos sejam utilizados em harmonia para a construção de representações que ajudem a tornar mais compreensíveis e sofisticados os objetos e a maneira na qual vivemos em sociedade. Nesta entrevista, Ronaldo Gazel, artista plástico, designer e diretor de arte na BHTEC e:house (www.bhtec.
vai usar. E é aí que nos encaixamos na história, e passamos a fazer parte dela.
com.br), fala como as referências fora do mundo tecnológico
Por outro lado, no que se entende por design hoje,
podem contribuir na construção de ambientes digitais mais
dentro de uma ótica artística, é plenamente possível
criativos e funcionais, além de ressaltar a importância da
desenvolver projetos de utilização alternativa, que podem
história da arte como base para o trabalho do designer.
ser altamente subjetivos e próximos até do antiuso. Nesse
Wd :: Por que e como o conhecimento da história
cenário se enquadram os experimentalistas, que buscam
da arte serve como base para trabalho de um designer
um tipo de reação mais sensorial, de semânticas totalmente
na internet?
específicas, heterogêneas, dentro de universos distintos,
Gazel :: A arte reflete o tempo em que é produzida. Conhecer a história da arte, ainda que apenas alguns pontos
sejam eles culturais, comerciais, didáticos, humanistas, matemáticos, psicológicos, estéticos.
dela, é fundamental para entendermos os questionamentos
O designer que pára de olhar o mundo com o olhar difuso,
e paradigmas que permearam as épocas e as respostas
amplo, capaz de compreender várias realidades, corre o risco
que o homem/artista deu (e ainda dá) a elas. Na verdade,
de virar uma engrenagem na linha de produção de sites, no
a história da arte, estando intimamente ligada à literatura,
melhor estilo “corte e costura” de HTML. Vai passar a apertar
à filosofia, à antropologia, à história, à religião, enfim, a
um parafuso, ao invés de compreender toda a engrenagem.
um sem-número de expressões humanas, acaba tendo
E é por isso que devemos, além de estudar a história da arte,
uma importância fundamental na vida de todas as pessoas.
firmar nossa posição como artistas designers - mentes capazes
Quanto mais longe da arte, mais perto do controle, do
de compreender as expressões artísticas não apenas como
sistema, do pensar “massificado”, pasteurizado.
uma superficialidade decorativa ou bela, e sim, uma interface
É preciso entender a história do design, para ser um
capaz de comunicar utilizando modelos não-usuais, linguagens
designer mais completo, mais consciente, mais coerente. É
não-verbais, fora do “logos”, da razão cotidiana; capazes de
preciso saber como surgiu o movimento do design; saber
questionar o que não se quer questionado; de propor o que
como o relacionamento dos objetos e do ser humano foi se
não se quer proposto; de causar o estranhamento, dando lugar
sofisticando com o passar do tempo. É importante porque
ao controverso. Enfim, capazes de compreender o mundo
uma interface é uma superfície de trabalho, de uso. E é
pictórico muito além da forma.
por isso que somos designers da web, projetamos, como
Wd :: Ao longo do tempo, os movimentos artísticos
um designer projeta um espremedor de suco, ou uma
vêm exercendo uma grande influência na produção do
cadeira, interfaces que um grupo de pessoas certamente
design. Em termos de internet, talvez um dos melhores
entrevista- design e arte :: 21
exemplos esteja no site das Havaianas (www.havaianas.
qualquer situação. Veja que paradoxo, digamos quase
com.br) e algumas campanhas on-line da Coca-Cola na
zen-budista: o artista busca gerar um reflexo altamente
França (www.coca-colablak.fr e http://secure.coca-cola.
pessoal; uma linguagem, uma “poiesis” própria, buscando
fr). Quando a arte deve ser aplicada em benefício do
o coeficiente de “arte” em um trabalho artístico, seja ela
design na web?
um vídeo, uma pintura, uma performance, um website
Gazel :: A arte pode trazer enormes benefícios para o
- linguagem essa que, apesar de desuniversalizada na
design na web, sendo uma linguagem não-verbal, capaz de
origem, tende a se comunicar com o senso-comum, tanto
despertar naquele que tem contato com ela, percepções e
na aceitação, quanto no estranhamento.
diálogos muito mais sofisticados (ou simples, diretos!) do
Já o designer normalmente trabalha com fins
que as narrativas e approachings das interfaces focadas em
utilitários extremamente bem definidos, e por isso a
percepções utilitárias puras. E o maior desses benefícios
pressão por coerência artística passa a ser mínima, em
se chama coerência estética. Essa coerência pode ser
favor de uma adequação máxima aos padrões estéticos
percebida no excelente site das Havaianas, evidenciando o
aceitos por um grupo majoritário - ou pseudomajoritário;
fato de que a ousadia em termos de linguagem, da difusão
padrões estéticos que são verdadeiros “lugares comuns”.
de valores semióticos sutis, fora do padrão midiático
Então, voltamos à história da “doxa”, do “ouvi dizer”, da
tradicional de informação, dispostos juntos a uma feliz
informação não-questionada e não-questionável. Quanto
combinação de fatores estéticos e expectativas sensoriais
menos vontade de reavaliar os valores e conceitos tidos
(revertidas de alguma forma em resultados positivos),
como inexoráveis, mais subvalorizada será a profissão de
transforma o lugar-comum dos pressupostos, das “doxas”
design, pois a pressão que passa a se exercer sobre nós,
pictóricas, dos pré-conceitos estabelecidos todos os dias.
designers, acaba sendo a mesma que um carregador de
Por isso mesmo, sites como esse, que felizmente têm
caixas: produção braçal, e não mental.
surgido em número cada vez maior, fazem tanto sucesso:
Wd :: A interação homem-computador é considerada
eles mostram que o caminho da arte no design na web é
por especialistas mais fria e distante, além de criar um
muito promissor, e dá resultados.
sentimento individualista entre as pessoas. Buscar
Wd :: Sobre a interação entre design e arte, podemos
referências nos movimentos artísticos pode ser um
afirmar que a principal diferença entre estes dois campos
caminho para proporcionar emoção e afinidade dentro
do conhecimento seja o compromisso com o público, ou
de um projeto digital?
seja, o designer tem compromisso com o público e o artista vive sem a necessidade e a pressão de fazer concessões? Gazel :: O perfil do artista hoje não pode ser traçado de modo simples, porque na pós-modernidade - período no qual vivemos, e que resgata todas as motivações e contradições do passado recente (movimentos modernos) em um timing assombrosamente rápido - há uma tal especificidade de propostas, conceitos e estéticas que permite ao artista, virtualmente, qualquer tipo de relação com o público, inclusive compromisso e descompromisso. Mesmo que uma proposta, em princípio, nos conduza a uma percepção romantizada do artista, como se ele não estivesse se importando para o público, não sofresse qualquer tipo de pressão, isso na verdade pode mostrar o contrário: a adequação do artista a nichos de mercado preparados para receber/consumir as suas características sui-generis, ou seja: para o artista, há um mercado em
22 :: entrevista - design e arte
Gazel :: Um cão, um cavalo, um boi são incapazes de
Gazel :: O cubismo representa o atonal, um universo
realizar gestos e ações que não sejam voltadas para a sua
no qual o simbolismo é completamente descartado,
própria existência física, sua preservação. Já o ser humano
cujas formas não remetem ao mundo e a seus símbolos,
é capaz de observar, gestualizar, modificar a natureza
mas sim à personalidade pura do geométrico. Alexander
pelo simples prazer estético, pela necessidade natural de
Calder (http://tinyurl.com/fbqu9), com seus mobiles, foi
mimese, sem qualquer relação com a sobrevivência.
o artista que mais conseguiu se aproximar desse ideal
Quando a interface digital (homem-computador)
cubista, na minha opinião: suas esculturas remetem a um
passa a desconsiderar ações e reações menos utilitárias,
mundo absolutamente próprio, que não dá margens a
aumentando o caráter prático em detrimento do
interpretações baseadas nas questões do cotidiano.
nos
O site internacional da Leo Burnett, apesar de gerar
robotizarmos, perdendo a habilidade de questionar, de
uma ótima sensação de profundidade, não tem uma
trocar pontos-de-vista, de negar o utilitário e promover o
influência cubista acentuada, já que, cognitivamente, ele
puramente estético/existencial. Por isso, sim, é louvável
é permeado por símbolos e letras, para a compreensão do
buscarmos referências nos movimentos artísticos para
conteúdo. Um site genuinamente cubista haveria de ser
criarmos interfaces um pouco mais humanas, que tornem
muito abstrato, com o mínimo de textos e imagens reais.
o ato de interagir um processo cada vez mais semelhante
Ainda que fosse em uma camada específica da interface,
ao agir natural do homem.
separando a arte cubista do conteúdo publicitário.
sensorial,
não-prático,
corremos
o
risco
de
Wd :: No livro “Vanguarda Européia e Modernismo
Wd :: Considerando o contexto político-econômico
explica
atual, permeado por guerras, intolerância religiosa
que a técnica da pintura cubista procurava
e injustiças sociais, é possível imaginar um resgate de
“apresentar a realidade através de estruturas
conceitos aplicados pelo movimento Dadaísta como
Brasileiro”,
Gilberto
geométricas,
Mendonça
desmontando
Teles
os
objetos
referência para projetos interativos?
para que, remontados pelo espectador,
Gazel :: Se analisarmos bem, todos os períodos da
deixasse transparecer uma estrutura
história foram permeados por esse tipo de acontecimento.
superior, a forma plástica essencial e
Sempre houve muitas guerras, muita intolerância - e
verdadeira da beleza”. De que forma
para cada época, uma contestação própria. Os artistas
esta técnica pode ser utilizada
modernistas eram naturalmente “engajados”.
pelo design na web? O site
Mas, nos dias de hoje, na dita pós-modernidade, tudo
internacional da Leo Burnett
é fragmentado - inclusive a crítica social. Encontram-se
( w w w. l e o b u r n e t t . c o m )
vários exemplos de movimentos de caráter contestador
pode ser apontado como
intrínseco, que fazem a crítica dentro de cenários
um exemplo?
específicos, quase nunca universais. O artista pode não falar da guerra como fez Picasso ao pintar “Guernica” até porque o impacto de uma pintura como guernica, nos dias de hoje, seria outro (afinal, muita água passou desde então) - mas ele critica a seu modo, uma crítica que se desuniversalizou desde a pop art, mas que se mantém viva em movimentos como o “sticker art” ou o “street bombing” - a arte urbana que envolve tantos artistas de diferentes áreas, que pintam, grafitam pela cidade, em superfícies autorizadas (ou não!), levantando questões urbanas ou simplesmente rasgando o cinza das ruas com cores vivas, intensas, volumes e tipografias sui-generis. Na internet, se houvesse um “street bombing”, seria
entrevista - design e arte :: 23
algo como uma área completamente livre dentro das interfaces (ou invadida!), que pudesse ser preenchida com arte. E, de certa maneira, eles também escandalizam, ao seu modo, como pretendiam os dadaístas. A diferença é que o engajamento é desnecessário, o mais importante é desenvolver a linguagem. Quanto ao resgate do Dadaísmo em projetos interativos, sim, é sempre uma ótima idéia! Afinal, Dadaísmo é sempre bem-vindo em qualquer situação, justamente para nos deslocar da linearidade dos ponteiros do relógio, do logos, do racionalismo. Ele é um movimento absolutamente atual, contestador em essência, e seus “jogos”, experiências
E se descobriu, findando-se a modernidade, que nenhum
como o “cadáver delicioso” (http://tinyurl.com/mrbgf)
dos movimentos estava mais ou menos próximo de uma
- espécie de colcha de retalhos de palavras, frases e
“verdade” artística - justamente porque essa “verdade”,
desenhos, ajudam-nos a reconstruir o pensar e o perceber.
ao ser encontrada, logo estaria superada.
Um “cadáver delicioso” é um ótimo ponto de partida para a criação de um projeto interativo digital dadaísta.
Podemos, então, conhecendo as características, as razões estéticas de cada movimento moderno, entender
Wd :: Acessando o site da agência Modernista!
suas circunstâncias, seus cenários - não simplesmente
(www.modernista.com), somos remetidos aos anos
reviver aquilo - mas criar uma relação entre uma questão
20, período no qual o mundo assistiria ao ápice do
atual vista sob aquela ótica. Essa é a receita para se
surrealismo (http://tinyurl.com/kurew), considerado
beber da fonte moderna e criar algo novo. E é por isso
um dos últimos movimentos de arte moderna. Como a
que não basta ter o conhecimento “dóxico”, superficial,
aplicação do inconsciente pode ajudar no processo de
sensorial, sobre uma época (apesar disso ser fundamental),
criação de uma interface digital?
entender sua picturalidade, suas formas, seu movimento,
Gazel :: Esse site da Modernista! é um bom exemplo
sua disposição, seu equilíbrio. É preciso conhecer a história
de como se comporta a arte nos dias de hoje, tanto no
da arte e ver que nenhum estilo surgiu ao acaso, mas sim
meio internet, quanto em qualquer outro. É perfeitamente
possuem origens claras - e desdobramentos que chegam
possível voltar no tempo e fazer uma releitura dos valores
até os dias de hoje, conseqüentemente. A partir desse
peculiares que formam o cerne de cada “manifesto” do
estudo fica muito fácil associar um projeto conceitualizado
período moderno. A diferença é que, naquela época, havia
hoje a uma estética moderna, seja qual for o movimento:
a nítida impressão de que o universalismo das propostas
cubismo, surrealismo, expressionismo etc.
poderia ser percebido e vivenciado como uma verdade, uma
No caso do surrealismo, é preciso mergulhar de cabeça
razão, sem prever suas contradições, sua transformação em
na psicanálise, e estar pronto para ir além da linguagem
outras verdades, tão efêmeras quanto o próprio homem.
comum, das percepções concretas, sensibilizando-se para
No período da modernidade, havia uma visão
os reflexos do inconsciente como feedback emocional para
romantizada, de um mundo inteiro para ser conquistado
a interface - o que parece bem subjetivo, porém plenamente
pela arte, ainda que por caminhos completamente
possível com interesse e muito estudo.
opostos, como os futuristas italianos, que traziam
Wd :: No livro “Iniciação à História da Arte”, da
o fascismo como uma grande virtude, um caminho;
Martins Fontes Editora, H.W.Janson e Anthony F.Janson
e o cubismo, que desconsiderava qualquer valor do
apontam que “ao contrário do Dadaísmo, a Pop Art não
mundo real, auto-suficiente em sua atonalidade. Eles
é motivada pelo desespero ou animosidade contra a
não poderiam existir sozinhos como verdade maior, como comprovou o tempo, mas foram absolutamente fundamentais, como todo movimento dentro da história.
24 :: entrevista - design e arte
civilização atual; considera a cultura comercial sua matériaprima, uma fonte inesgotável de material pictórico, mais do que um mal a ser combatido”. O uso da cultura de massa, tão emanada pelos seguidores da Pop Art, é uma linha conceitual que pode ajudar a aproximar os ambientes digitais de seu público-alvo? Gazel :: A Pop Art foi o último dos grandes movimentos modernos, e sua contribuição mais importante para a história da arte, ao meu ver, foi a mudança de percepção a respeito da apropriação e transformação de “memes” coletivos, ícones de massa, considerando uma “cultura pop”. A cultura pop, por sua vez, surgiu graças aos métodos industriais de criação e produção pictórica, a prevalescência da imagem de massa, em detrimento do conteúdo (também de massa, no entanto, de segunda ordem). Os clássicos exemplos “lata de sopa campbells” e as interferências na Marilyn Monroe e Mao Tse Tung demonstram isso com perfeição. É o início da era do consumo de imagens, à maneira industrial. Que vivemos até hoje, como num “pop” transgênico e muito acelerado. Poderíamos incluir aqui o kitsch e o neopop, mas seriam apenas categorizações para as transgenias diversas pelas quais passa a Pop Art até hoje. Continuamos consumindo o pop, construindo e desconstruindo sua forma e conteúdo de forma compulsiva, caótica, de modo cada vez mais veloz. Os ícones pop surgem e morrem quase no mesmo instante. O que mais me atrai na Pop Art é sua possibilidade de “cheating art”, ou seja, de fazer uma arte “trapaceando”, através dos meios de massa - inclua-se nessa categoria o sampling e a intervenção sobre todo tipo de imagem “lugar-comum”, desde logotipos conhecidos por todo o mundo até personagens (humanos ou não) pop extremamente regionalizados. A identificação com os “memes” acaba por facilitar a transmissão do que está agregado a ela - no caso, a arte. E é justamente nisso que vejo a grande possibilidade de se trabalhar o pop dentro dos ambientes digitais, aproveitar essa identificação quase insuperável (felizmente, quase) para se fazer ouvir. Uma espécie de comensalismo. Wd :: Segundo a Wikipédia (http://tinyurl. com/go7pj), o minimalismo representa uma série de movimentos artísticos e culturais ocorridos durante o século XX. Analisando a parte conceitual do movimento (“jogo de volumes e formas que esteja reduzido às suas configurações não mais que essenciais as suas
entrevista - design e arte :: 25
funções”), é certo dizer que a criação e o desenvolvimento
que precisa se ater a objetivos e regras já
de sites focados na usabilidade segue a mesma linha de
muito bem estabelecidas pela publicidade
pensamento?
(ou pela gerência de TI), sim. É quando a
Gazel :: De certa maneira sim, o movimento pró-
interface precisa ser o mais racional possível,
usabilidade busca enxergar e remover qualquer tipo
controlável, categorizada, sistemática. Isso
de ruído dentro da interface, com objetivo de chegar a
pode ser visto com mais intensidade nas
um coeficiente mínimo ideal de uso. É uma ótima causa.
interfaces unicamente funcionais, que de tão
O problema é que, assim como o próprio movimento
sistematizadas, acabam por virar “monstros”
Minimalista (e todos os demais movimentos modernos),
de organização, desumanizando ao máximo a
o movimento pró-usabilidade, na minha percepção,
linguagem entre o usuário e a interface.
acaba por acreditar (pela força da doutrina e do hábito)
A habilidade do designer em compreender
que só existe a realidade do uso, desconsiderando
os princípios dos quais a interface pode - e
o contraditório - que seria, nesse caso, a corrente
deve - se utilizar, sem se ater a regras gerais,
experimentalista, e que, na publicidade, poderíamos
“doxas” incontestáveis, clichês pictóricos - que
encontrar dividida em vários sub-movimentos, sendo o
normalmente nos levam a uma pasteurização das
mais importante deles o da “inversão de expectativa”
interfaces - é que vai fazer a diferença na hora de
- modo menos traumático de apresentar estéticas
conceitualizar a proposta.
pouco usuais a um público heterogêneo, abrangente,
A partir do conceito certo, sem subestimar
valendo-se de um gradiente entre o antiuso e o próprio
e nem superestimar o público (e a própria
uso, deixando o espectador/consumidor transtornado
interface), encontraremos o caminho mais
sensorialmente, abalado por alguns instantes, para,
interessante, mais adequado aos objetivos
no melhor estilo catártico, trazê-lo de volta ao mundo
(práticos e subjetivos) - pautando-se, dessa
cartesiano. Pronto, fez-se a mágica.
forma, por diversos valores semióticos e também
O mundo está girando numa velocidade espantosa,
por necessidades utilitárias, cada qual com sua
enquanto escrevo esse texto. Nós também, nossa
maneira de ser avaliada - ainda que o resultado
mente, nossos gostos, nossos paradigmas estão prontos
disso
para mudança, a cada instante. Acreditar numa linha
abstrato, uma subjetividade irritante (aos olhos do
unidirecional, em relação ao ideal do design na web, é
ser cartesiano), contrária aos critérios universais de
pura ilusão. É preciso considerar o antiuso, os reflexos da
avaliação atuais.
seja,
esteticamente,
um
picturalismo
própria frustração e a transformação que ela gera. Existem
Se esse for o caminho encontrado, é preciso
também sites que não têm qualquer relação com uma boa
encará-lo de forma corajosa. Isso porque nenhum
usabilidade (no sentido atual a que esse termo remete),
sistema de análise de interfaces que conheço
mas que usam a estética minimalista de modo primoroso,
consegue sair da esfera racional, do empirismo
cada qual a seu modo.
utilitário, até mesmo para lidar com os valores mais
Wd :: A Enciclopédia Itaú Cultural de Artes Visuais revela que “a liberdade de experimentação, o retorno
sensoriais, menos racionais - quando tratam destes, fazem-no de modo rasteiro.
às intenções expressivas e o resgate da subjetividade”
Tenho em mente que devemos mudar nossa
são algumas das principais linhas de pensamento do
opinião a cada instante, girar em torno da idéia
Neoconcretismo (http://tinyurl.com/gtnad). Diante de
inicial pelo menos uma dezena de vezes antes de nos
sua experiência na área, você acredita que os projetos
definirmos pelo conceito final. Assim, por exemplo,
experimentais on-line ainda são um campo pouco
se optamos por usar a simplicidade da forma básica,
explorado? Quais conceitos do Neoconcretismo poderiam
dos planos geométricos simples, podemos pesquisar o
ser aplicados no design na web?
cubismo ou o neoconcretismo. O importante é saber o
Gazel :: Em se tratando de design na web comercial,
porquê da escolha.
Radicado nos EUA, o carioca Nando Costa é criador do projeto Brasil Inspired (www.brasilinspired.com), no qual incentiva e divulga os trabalhos de design desenvolvidos no país. Apostando na experimentação, seu trabalho é um bom exemplo de como tal conceito pode ajudar o design digital a se tornar mais criativo. Nesta entrevista, ele fala sobre influências, cores, tipografia etc., além de analisar os desafios existentes na caminhada do profissional que vai para o exterior. Wd :: Em entrevista para a revista Zupi (http:// tinyurl.com/mzpot), você confidenciou que tem “...trabalhado tanto nos últimos anos que quase sinto que perdi um pouco da minha identidade”. Essa sensação já passou? Quais fatores constroem ou desconstroem a identidade e o estilo de um designer? Nando :: Acho que esse efeito já passou. Devo ter dito isso quando tinha a minha empresa (chamada Nakd), no Rio de Janeiro. Naquela época, como atuava como diretor de criação, a minha função, além designer, era guiar o estúdio, os designers e animadores com quem eu trabalhava, e também interagir com os clientes, pagar as contas e até lidar com as burocracias. No fim dos dois anos de minha experiência na Nakd, eu e minha esposa (Linn Olofsdotter - www.olofsdotter. com) estávamos esgotados e acho que isso nos afetou demais, nos deixou sem inspiração. Mas depois tudo passou e, hoje em dia, trabalhando como freelancer, me sinto muito mais confiante e feliz com o que faço. Sobre sua segunda pergunta, não sei exatamente como responder, pois isso depende muito de uma pessoa para outra. Não há regra. No meu caso, o fato de o meu trabalho ter perdido força, eu imagino que deve ter sido causado por cansaço, exaustão mesmo. Atualmente, con-
entrevista - AndrĂŠ Matarazzo :: 27
28 :: design na web: construindo sua história
Design na web: construindo sua historia Arquitetura, escrita, pintura, utensílios domésticos, vestimentas. É através da descoberta e da pesquisa de diversos objetos do passado que tornamos possível a reconstrução e o entendimento dos fatos e dos acontecimentos da história. Quando falamos de design na web, tratamos de um segmento que ainda engatinha para escrever definitivamente suas páginas na história deste campo do conhecimento. No livro “Uma introdução à história do design”, Rafael Cardoso aponta que “...talvez o maior desafio para o designer envolvido com a rede seja de encontrar soluções que resistam, por sua qualidade e densidade, a essa proliferação tumorosa de informações parciais...”. Diante disso, estudar os elementos que ajudaram a construir a prática do design pode ser o primeiro passo para garantir um diferencial neste mercado. “O conhecimento da história é uma das melhores formas de entrar em contato com questões profundas como identidade, representação, cultura. Acho que o designer, como todo criador, tem que buscar o autoconhecimento. E, por trabalhar com a coletividade, tem que buscar conhecer a sociedade também. A história é o autoconhecimento coletivo”, argumenta o escritor.
design na web: construindo sua história :: 29
o. t en m” m é so b ci e m rd o h a on e t Ca c to dad ael u f a ie a R c r o so a sc r a u b ce e e qu onh m rc e , t sca r do bu a i e cr qu do em o t t o e, om dad c r, tivi e gn ole i s c de a o om e c qu ar o lh ch ba “A tra or p E,
s e d 30 :: design na web: construindo sua história
Da Revolução Industrial à Era da Informação
meados da década de 1980. Para o design, as plataformas
Quais características históricas poderiam nos ajudar a
e programas de computador desenvolvidos desde então
entender a evolução do design? À primeira vista, os efei-
me parecem tão importantes quanto à própria web, que
tos da industrialização em nossa sociedade são conside-
teria outra cara e estrutura se não fosse por eles”, explica
rados o grande marco para a transformação no modo de
Rafael Cardoso, professor associado do Departamento de
produção do design, pois até então o ofício era realizado
Artes e Design da PUC-Rio.
de maneira artesanal.
“Não tínhamos design propriamente dito, tínhamos
Do HTML ao AJAX: como as tecnologias mudam a
história do design na web
artesanato que eventualmente poderia ser desenvolvido
Na busca por uma linha que norteie a prática do
com alguns padrões e repetições, mas não era regra.
design na internet, a grande dificuldade para se determi-
Podemos dizer que o design viveu três fases distintas: na
nar uma história envolve a escassez de registros e acervos
primeira fase, seu empenho era em modular produtos para
que produzam um espaço com material confiável de con-
serem seriados, ou seja, facilitar a produção. Na segunda
sulta. São poucos, mas os exemplos existentes já ajudam
fase, o design tinha que construir valores simbólicos e
a traçar um perfil da área. Estamos falando do UOL Histó-
agregar valor ao produto. Nesse momento de sociedade
ria (saiba mais, na página 36) e do Internet Archive (www.
da informação no qual vivemos, parece que estamos vol-
webarchive.org).
tando um pouco no tempo. A grande quantidade de ferra-
Apesar das dificuldades, o depoimento e a prática de
mentas e tecnologias nos dá a oportunidade de construir
quem trabalha na área servem como um bom caminho para
produtos para web que sejam quase artesanais. Embora
analisarmos de que forma este segmento de mercado cresceu
se use toda ciência de comunicação visual e se pense em
e se transformou ao longo dos seus 11 anos de existência.
comunicar para a massa, cada projeto ganha uma atenção quase artesanal”, analisa o designer Guilherme Marconi.
“A principal transformação no design para a web é a busca de sua própria identidade. Desde o seu surgi-
Levando em conta o peso que a Revolução Indus-
mento, no final do século passado, a web é uma grande
trial exerceu na forma como o design evoluiu ao longo do
tela em branco à procura de quem a preencha, tanto que
tempo, é certo considerar que o surgimento da internet
já foi considerada a maior exposição de arte interativa do
representa também uma nova etapa em sua história?
mundo. HTML, CSS, Flash, scripts, gerenciadores de con-
“Ainda falta distância crítica para avaliar se o surgi-
teúdo... Cada inovação abre um número enorme de possi-
mento da internet terá o mesmo peso histórico que teve
bilidades, e a maior glória do designer é explorá-las inces-
a industrialização. Afinal, quando falamos da chamada pri-
santemente. A maior transformação provocada pela web
meira Revolução Industrial, estamos falando de um dos
é a constante reinvenção de seus conteúdos e formatos,
acontecimentos mais transformadores em toda a história
além, é claro, da gigantesca democratização do acesso
da humanidade, de importância equivalente ao início da
aos meios de produção”, aponta Luli Radfahrer, professor-
agricultura ou das cidades há milhares de anos. Prefiro
doutor da ECA-USP.
pensar na internet como parte de um quadro maior, abran-
Para Marcelo Gluz, gerente de criação na Globo.com,
gendo a telefonia e a informatização - ou seja, o descola-
a evolução do design sempre esteve vinculada às desco-
mento radical entre o tempo em que as informações são
bertas tecnológicas. Principalmente quando estudamos as
transmitidas e o tempo em que as pessoas e as mercado-
transformações ocorridas nas tecnologias disponíveis para
rias são transportadas. Isto sim representa uma nova revo-
o desenvolvimento de ambientes digitais. “A primeira é
lução, a qual vem se adensando de maneira crítica desde
o surgimento do CSS, que permite mudar o visual de um site rapidamente, sem que se tenha que mexer nas estru-
na busca por talentos :: 31
design na web: construindo sua história :: 31
“O simples fato de a internet se utilizar de tabelas de HTML, com ângulos retos e precisão numérica, traz uma atmosfera ‘Bauhausiana’ ao design interativo” Marcelo Gluz turas. O CSS também é importante quando se fala em deixar o usuário personalizar seu espaço. Outro ponto que merece atenção é a possibilidade de interagir com o dado sem mudar de página. A primeira tecnologia que possibilitou isso foi o Macromedia Flash e agora apareceu o AJAX, tornando a experiência do usuário ainda mais fluida. Os sites se parecem cada vez mais com softwares residentes no lado do cliente. Já o aumento progressivo da banda não é um marco, mas um vetor que aponta a direção das próximas mudanças. Cabe aos designers usarem a banda com sabedoria, o que nem sempre ocorre”. Bauhaus aplicada na web? Analisando a história do design, é inegável o valor que os conceitos produzidos pela Bauhaus exerce nas diferentes gerações de profissionais, por defender a funcionalidade no design, sendo a estética uma conseqüência. Tanto é que a influência da escola alemã parece se refletir em determinados projetos de design para a web. “Todo bom design feito após a Bauhaus traz forte influência dela. Ela rompeu com o Art Nouveau em busca de um design mais racionalista, onde a forma deve ser fundamentada na função. Da mesma maneira, por sua natureza interativa, a web repele adornos supérfluos e exige grande esforço funcional. O simples fato de a internet se utilizar de tabelas de HTML, com Art Nouveau
X
Relaciona-se especialmente com a 2ª Revolução Industrial em curso na Europa, com a exploração de novos materiais e os avanços tecnológicos na área gráfica, como a técnica da litografia colorida que teve grande influência nos cartazes. Caracteriza-se pelas formas orgânicas, valorização do trabalho artesanal, entre outros. Fonte: Wikipédia (http://pt.wikipedia.org/wiki/Art_nouveau)
ângulos retos e precisão numérica, traz uma atmosfera ‘Bauhausiana’ ao design interativo. Não me agrada a idéia de disfarçar as tabelas com curvas. É preferível buscar soluções estéticas que assumam as características da mídia”, afirma Marcelo Gluz. É justamente neste ponto que os especialistas ressaltam a importância de se trabalhar a funcionalidade e a estética como aliados em um projeto de design. “A Bauhaus foi uma experiência histórica rica e maravilhosa, de grande relevância para o contexto da Alemanha, nas décadas de 1920 e 1930. É, ainda, uma lição importante de que é possí-
32 :: design na web: construindo sua história
“A escola americana é a grande influência quando se fala em tecnologia, não só no Brasil como em vários lugares do mundo. Mas vejo uma influência mais ligada aos conceitos de tecnologia do que propriamente ao design” André Nogueira
Escola de Ulm
X
É considerada a mais significativa tentativa de se restabelecer uma ligação com a tradição do design alemão. Foi sucessora da Bauhaus por seus métodos de ensino, disciplinas lecionadas, ideais políticos e por também acreditar que o design tinha um importante papel social a desempenhar. Fonte: Wikipédia (http://pt.wikipedia.org/wiki/Escola_de_Ulm)
vel realizar grandes projetos com pouco mais do que paixão e boas idéias. Infelizmente, a forma como o legado da
Hoje, justamente pelo fato de a história do design na
Bauhaus foi apropriado nos últimos 40, 50 anos tem sido
web ainda ser um processo recente e em construção, as
contra-producente para o design, especialmente no Bra-
opiniões sobre uma possível influência da escola americana
sil. Essa idéia que as pessoas costumam fazer de funcio-
nos projetos brasileiros se tornam bastantes divergentes.
nalidade é inteiramente equivocada. ‘Função’ não existe,
“Não acredito nisso, até porque não há uma ‘escola
pelo menos no sentido funcionalista, com F maiúsculo.
americana’. NYU, CalArts e Berkeley são muito diferentes
‘Função’ como contraposição à ‘Estética’ é um desastre
entre si e têm em comum apenas o fato de estarem nos
conceitual, que só tem prejudicado o design. Recomendo
Estados Unidos. Há coisas muito boas feitas no Reino Unido,
aos designers que esqueçam tudo que acham que sabem
na Suécia, no Japão e no Brasil, sem influência de teórico
sobre a Bauhaus e retornem às fontes para ver o que ela
algum (senão o designer brasileiro não estaria tão ‘na moda’
foi mesmo. Foi uma escola plural, antes de tudo, onde as
em empresas estrangeiras). O que há é um mercado muito
divergências e as dissidências eram respeitadas”, alerta
grande e bastante capitalizado nos EUA, que torna as inicia-
Rafael Cardoso.
tivas produzidas lá muito mais visíveis”, diz Luli.
Dessa forma, a dica é avaliar como os pontos posi-
Para Marcelo Gluz, existe um meio termo envol-
tivos e negativos de cada conceito vão ser aplicados na
vendo esta questão. “Bebemos muito do que é produzido
prática. “Usabilidade é a Bauhaus da web. Como a escola
nos EUA, mas não existe somente uma escola americana,
alemã, ela tem seu lado positivo - colocou a forma a ser-
assim como nem todos faziam design funcionalista na Ale-
viço da função e eliminou efeitos sem significado apa-
manha. Não acho que haja hoje uma grande revolução na
rente. No entanto, tanto os axiomas da Bauhaus como
maneira de fazer, ensinar e compreender design como
os princípios da usabilidade devem ser vistos como um
houve naquela época, mas vejo a indústria americana pro-
poste: servem de iluminação para quem está sóbrio, de
curando novas maneiras o tempo todo. Acho muito inte-
apoio para quem está bêbado. O apego excessivo à dita-
ressante o conceito de projetar plataformas interativas em
dura do funcional - representado por muitos portais de
vez de sites. O Google Maps (http://maps.google.com) e
serviços e por clientes e designers com preguiça criativa -
o YouTube (www.youtube.com) são bons exemplos disso.
acaba por gerar um material monótono, rígido, estúpido.
É possível consumir a ‘experiência YouTube’ de ver vídeos
E isso é o contrário do design”, orienta Luli Radfahrer.
em centenas de blogs mundo afora. Não só no site do You-
Escola americana no design na web
Tube. Outra manifestação importante do design americano
Quando falamos do design brasileiro, a ESDI (Escola
contemporâneo é o processo criativo baseado em proto-
Superior de Desenho Industrial) é um marco em nossa his-
tipação constante da IDEO (www.ideo.com). Ele cai como
tória, pois foi o primeiro curso de design em nível supe-
uma luva em projetos de internet e favorece a inovação”.
rior criado no país. Em termos de influência, os ideais
Um ponto de vista interessante neste debate refere-
da Escola de Ulm foram considerados como o principal
se às tecnologias envolvidas com o design na web.
modelo referencial para a ESDI.
“A escola americana é a grande influência quando se fala em tecnologia, não só no Brasil como em vários lugares
Ăcones, quando usar? :: 33
34 :: design na web: construindo sua história
do mundo. Mas vejo uma influência mais ligada aos con-
Você fala com alguém em outro continente pelo Skype,
ceitos de tecnologia do que propriamente ao design.
com webcam, e parece que a pessoa está ali, mas não
Acho que o design interativo brasileiro já tem uma iden-
está. Fica um vazio, que só pode ser suprido pelo tátil.
tidade própria bastante forte”, cita André Nogueira, dire-
Temos aí um desafio imenso para o designer de web, não
tor de arte da Simples Consultoria.
é? Se você acrescenta a isto o fato que vivemos numa
O que determina os limites do design na web
sociedade onde todo mundo fecha os vidros ao parar no
Na evolução de sua história, o design na web encon-
sinal de trânsito, para afastar quem está perto, o desafio
tra alguns desafios para o seu desenvolvimento. O pri-
para o design fica ainda maior”, aponta Rafael Cardoso.
meiro deles seria a visão de que a interação homem-com-
Ou seja, como diz Luli Radfahrer, para se fazer coi-
putador é mais fria e distante, além de criar um senti-
sas para o século XXI, é necessário pensar como alguém
mento mais individualista entre as pessoas.
do século XXI. “A interação homem-máquina, por exem-
Em comparação com as outras áreas de conhecimento
plo, não é mais fria como era. E não estou falando de
(design gráfico e de produto), podemos considerar o pensa-
malucos que conversam com o carro para que a gasolina
mento acima como uma das principais limitações (gerando
não acabe, mas de situações bastante corriqueiras: você
novos desafios) para o exercício da prática na web?
recebe cartões virtuais, briga por MSN, gesticula falando
“O computador, tal como conhecemos hoje, está
ao celular e se entristece ao receber um e-mail ruim. Em
falido. Estamos a cada dia reinventando as tecnologias.
comparação com as outras áreas, um blog é muito mais
Parece que quase 90% da população possui celulares. O
quente que um jornal, o YouTube, muito melhor que a TV,
número de pessoas com acesso à tecnologia é cada vez
MMORPGs mais eficientes que fliperamas. É necessário
maior e vertiginoso. E sabemos bem que quanto mais pes-
se livrar de preconceitos e abraçar as novas tecnologias
soas assimilam a tecnologia, novos conceitos surgem, bem
para se criar um design relevante”, ressalta.
como novas tecnologias se desenvolvem. A cada dia que passa, as pessoas têm mais experiência digital e os sites vão deixando de ser aglomerados de botões frios para se
MMORPG
X
Um jogo de computador e/ou videogame que permite a milhares de jogadores criarem personagens em um mundo virtual dinâmico
transformarem em parte da experiência simbólica das pes-
ao mesmo tempo na internet.
soas”, analisa Guilherme Marconi.
Fonte: Wikipédia (http://pt.wikipedia.org/wiki/MMORPG)
Assim, o designer precisará compreender muito bem as transformações causadas pela inserção da tecnologia no cotidiano de nossa sociedade para que os projetos na área possam transpor os possíveis obstáculos existentes.
Trabalhando com a interatividade Em 2000, no livro “Projetando Websites”, Jakob Nielsen, considerado um dos gurus da usabilidade na web,
“Não sei se a interação humano-computador é mais
apontava que o “conteúdo era o rei”, em detrimento da
fria. Isto me parece bem discutível. Mais distanciada, tal-
estética visual de um site. Nos dias atuais, a discussão
vez, no sentido de ser algo que intermedia as relações
está mais focada no desenvolvimento de interfaces digi-
humanas, como o fazem também o telefone e a televisão
tais, onde o usuário e a sua interação nestes ambientes
(tudo que é ‘tele-’, aliás, que vem do grego, para dis-
passam a ser a grande prioridade para o sucesso de pro-
tante). Não vejo isto como algo específico à web. É um
jetos nesta área.
fenômeno mais amplo da Era Industrial, com sua revolu-
Dessa forma, já não é mais um exagero afirmar que
ção nos transportes e na comunicação. Temos a ilusão de
o conceito de interatividade modifica profundamente a
que está tudo perto (imagens instantâneas do último con-
prática do design na web. “Acredito que o ‘dado é o rei’,
flito no Oriente Médio, por exemplo) e, ao mesmo tempo,
justamente porque creio em design centrado no usuário.
paradoxalmente, essa proximidade nos parece ilusória.
O designer deve focar seus esforços em potencializar a
design na web: construindo sua história :: 35
“A principal transformação no design para a web é a busca de sua própria identidade” Luli Radfahrer experiência do usuário em facilidade, rapidez e agradabilidade. Muitas vezes, o designer precisa carregar mais a mão nos grafismos para vender melhor o dado, mas normalmente os grafismos excessivos mais atrapalham do que ajudam o usuário”, diz Marcelo Gluz. Segundo o especialista, o que Nielsen não previa em 2000 era que o entendimento do usuário sobre o que é a internet evoluísse e os dogmas precisariam acompanhar essas transformações. “O que era difícil em 2000, em 2006 pode ser fácil e em 2012 pode se tornar ridículo. Um sistema interativo deve manter o usuário desafiado para que não se torne monótono. Mas também não deve ser um obstáculo entre o usuário e a informação. Esse importantíssimo equilíbrio depende do momento histórico e do nível social e etário do usuário, e, portanto, não deve ser eternizado em dogmas de usabilidade”. “O avanço tecnológico e o surgimento de serviços web2 customizáveis (como o código-fonte do Google Earth, por exemplo) traz desafios que vão além do funcional, comercial, coletivo e HTML. Blogs e comunidades como o Orkut, por exemplo, são lugares em que a questão da funcionalidade não faz mais sentido - o indivíduo vai para lá se divertir, se surpreender, pesquisar, fuçar. Isso faz com que o usuário se torne mais consciente dos recursos e opções, o que muda completamente a relação do visitante com a interface, e, naturalmente, o design”, complementa Luli Radfahrer.
Dicas de leitura:
“Design gráfico: uma história concisa” Autor: Richard Hollis Editora: Martins Fontes
“Uma introdução à história do design” Autor: Rafael Cardoso Editora: Edgard Blücher
36 :: design na web: construindo sua história
Um acervo na história do design na web nacional
largura de 480 pixels. Hoje, a maioria ainda usa configuração
Bate-papo: Márion Strecker, diretora de conteúdo do UOL
de 800 pixels, mas uma boa parte já adotou configuração de 1.024 pixels. Cada mudança dessas afeta profundamente o
Nesta entrevista, conheça os principais aspectos envol-
desenho de um site.
vendo a evolução do design das páginas iniciais do portal,
Wd :: Considerando todas essas mudanças, é certo
além da importância do “UOL História” (http://sobre.uol.
afirmar que a evolução do design na web está direta-
com.br/historia).
mente atrelada à evolução tecnológica?
Wd :: No Brasil, não temos um órgão ou entidade
Márion :: Sim, o design na web depende direta-
que registre oficialmente a história da criação e o desen-
mente das tecnologias disponíveis para a criação, da
volvimento de sites. A própria produção bibliográfica na
velocidade das conexões e das características de har-
área ainda é escassa. Dessa forma, como surgiu a idéia de
dware e software usados pelo grande público. Não
registrar a história do UOL e qual a sua importância?
adianta nada fazermos páginas maravilhosas se elas não
Márion :: Criamos esse site porque achamos que, se nós não fizéssemos esse trabalho, ninguém faria e a história
puderem ser transmitidas rapidamente e visualizadas corretamente pela maioria das pessoas.
se perderia. A cada aniversário do UOL, fazemos um balanço
É possível criar versões diferentes para velocidades e
do que foi realizado e atualizamos o site UOL História. Como
para equipamentos diferentes. Fazer isto num site pequeno
na internet não temos grandes limitações de espaço, pode-
é fácil. Fazer isto num portal do tamanho do UOL, com mais
mos nos dar ao luxo de escrever a história da internet e da
de sete milhões de páginas diferentes e centenas de parcei-
empresa e mantê-las publicadas, para informação do público.
ros de conteúdo, cada qual com sua marca e seu “look &
Wd :: De 1995 aos dias atuais, quais foram as prin-
feel”, é muito mais complicado.
cipais transformações e marcos no design para web (por
Wd :: Hoje, o conceito de Web 2.0 vem causando
exemplo, no início, o posicionamento do logotipo da
uma grande discussão sobre a criação e o desenvol-
empresa apresentava um grande destaque e ocupava um
vimento de sites. Como o UOL interpreta toda essa
espaço muito maior do que o apresentado atualmente)?
movimentação e quais modificações ela vem trazendo
Márion :: Quando foi ao ar, em abril de 1996, o UOL
para o design na web?
tinha apenas oito canais e uma marca desconhecida. Por
Márion :: Atrás do conceito de Web 2.0 estão os
isso, havia um logotipo grande na home page. Hoje, o UOL
recursos que permitem que o público interfira na maneira
tem mais de mil canais que disputam arduamente espaço na
de ver informações ou mesmo páginas na internet. É sen-
primeira página do portal. Além disso, a marca UOL ficou
sacional. Já estamos usando esses recursos em alguns
muito conhecida, por isso pudemos diminuir sua dimensão.
dos nossos serviços interativos.
Primeiro tivemos de desenhar o site para o Mosaic, que
Wd :: O UOL já projeta que tipo de modificações o
era o software navegador que as pessoas usavam em meados
futuro trará para as empresas que trabalham com servi-
dos anos 90. Depois, redesenhamos para Netscape e, mais
ços de internet, principalmente no segmento de sites?
tarde, para Internet Explorer, o navegador que a Microsoft
Márion :: Mais da metade dos nossos assinantes
resolveu instalar junto com o Windows e se tornou o mais
já usa conexão em alta velocidade. Quase metade do
popular do planeta. Para atender ao maior público possível,
nosso público já possui monitor configurado em 1.024
precisamos sempre estar atentos aos navegadores usados e
pixels. Quando a grande maioria do público estiver
fazer com que nossas páginas funcionem bem em todos eles.
nessa nova situação, veremos um novo e grande salto
No começo do UOL, as pessoas usavam modem de
no design da internet. Já temos algumas amostras disso
14.400 bits por segundo! Depois, vieram os modems de
aqui e ali, principalmente nos EUA. Parece inevitável
28.800 bps, 56 kbps e nos últimos anos estamos vendo evo-
também que a web se torne cada vez mais multimídia,
lução semelhante na velocidade chamada de “banda larga”.
com uso mais intenso de animações, áudios e vídeos,
No começo, desenhávamos as páginas sabendo que a maior parte do público usava monitores confi gurados para
além de mais interatividade.
38 :: debate - adaptar-se
É preciso ao
usuário?
Analisando a comunicação visual utilizada pelos supermercados, por exemplo, é possível descobrir o perfil de cliente que cada marca deseja atingir. Fazendo um paralelo desta realidade com o mundo digital, podemos dizer que o público-alvo é quem dita as características de um site?
debate - adaptar-se :: 39
:: Ana Starling
:: Carolina Leslie
Designer e ilustradora - Estúdio Ana Starling
Arquiteta de informação na AgênciaClick
www.anastarling.com
www.lulileslie.com
“Fiquei imaginado os sites numa prateleira de supermercado. A primeira impressão seria uma linha quase contínua, de uma única cor, com alguns retângulos em proporções 3x4, destoantes, que
“Um site de qualidade é aquele que atende os objetivos de negócios da empresa, às necessidades de seus clientes e faz isso de uma maneira clara, simples e, acima de tudo, agradável”
saltam aos olhos como um popup” “Antes de discutir o que pode influenciar a qualidade “Fiquei imaginado os sites numa prateleira de supermer-
de um site, temos que ter em mente o que é um bom site.
cado. A primeira impressão seria uma linha quase contínua,
A meu ver, um site de qualidade é aquele que atende os
de uma única cor, com alguns retângulos em proporções 3x4,
objetivos de negócios da empresa, às necessidades de
destoantes, que saltam aos olhos como um popup.
seus clientes e faz isso de uma maneira clara, simples e,
Essa linha de produtos diferentes, dispostos todos
acima de tudo, agradável.
juntos no mesmo espaço, vistos ao mesmo tempo. Nessa
Um site projetado para meninas de 14 a 18 anos não
rede, por natureza globalizada, a comunicação é comu-
deve agradar a um executivo de 40. E isso é ótimo. Pode
mente homogênea. Parece mais difícil distinguir o
ser que esse site também não agrade a quem o projetou e
público específico ou o que, e como, ele
isso faz parte do processo de design. Temos que lembrar
deve ser interpretado e representado
sempre que o público-alvo pode ser bem diferente de nós
nesse meio. Talvez pela influência dos
e que algumas escolhas devem ser feitas de modo racional
recursos tecnológicos disponíveis, pela
e não emocional.
maçante repetição estética originada por es-
Muitos diretores de arte acreditam que o público-
ses recursos e pelo próprio meio, pela pouca
alvo pode estragar seu layout, porque vêem seu trabalho
exploração do digital, que permite, cada vez
como arte, quando deveriam vê-lo como design. A arte é
mais, a personalização e novos caminhos para
uma forma de expressão que, em geral, tem mais valor se
a comunicação.
não faz concessões a nenhum público. O design, pelo con-
Mas quem é esse público digital? O mesmo
trário, é uma ciência preocupada em encontrar soluções,
dos supermercados? O que está no supermercado
o que não pode ser feito sem se levar em conta às pessoas
está realmente direcionado para o seu público? Na rede dos três W’s, os navegadores podem navegar por oceanos mais distantes e traçar caminhos mais longos, mais personalizados. Explorar o meio é permitido, possível. Mas isso poderá surgir e acabar submerso no meio ditatorial comercial.”
e suas necessidades.”
40 :: debate - adaptar-se
“Você pode tomar a decisão de criar um layout extremamente leve e colorido (supondo que isso agradará o ‘povão’), mas arbitrariamente o :: Rhawbert Costa Sócio da Nitrocorpz Design
produz para uma resolução de tela de 1024x768 pixels. E aí, o porquê
www.nitrocorpz.com
desta decisão?” “Sim e não. Explico: depende da intenção do designer, sua bagagem cultural, imagética e técnica, processo e prazo de produção, remuneração etc. Interesses de ambas as partes, concomitantes ou não, também influenciam o resultado final, para o bem ou para o mal. Apenas definição de público-alvo é insuficiente para se começar a decidir. Precisamos de mais informações, dados concretos, números. Você pode tomar a decisão de criar um layout extremamente leve e colorido (supondo que isso agradará o ‘povão’), mas arbitrariamente o produz para uma resolução de tela de 1024x768 pixels. E aí, o porquê desta decisão? Quais os impactos da mesma? Por que não? É correta? Virtualmente impossível de responder sem obter mais informações. Decisões como esta acontecem às dezenas em uma velocidade incrível quando se projeta algo para a internet. Muitas vezes, o público-alvo nem sequer é o cliente do seu cliente, mas um misto das vontades pessoais dele com as necessidades do mercado que ele quer (ou acredita) atuar. Misture isso com sua interpretação da situação e pronto: você tem mais um projeto disponível para que o mundo todo acesse. Esta analogia apresentada (supermercado) serve como faísca para iniciar discussões mais profundas que independem bastante do tipo de trabalho visual em pauta: pode ser um cirurgião plástico ou um designer de interiores, no final são seres humanos que tomam as decisões, algumas vezes baseadas em fatos concretos, noutras não, mas sempre sujeitos a ‘errar’.”
debate - adaptar-se :: 41
Rodrigo Manfredi Diretor de arte da Submarino.com www.rodrigomanfredi.com
“O público-alvo é sempre o principal ponto a ser considerado quando se vai fazer qualquer comunicação, tanto on-line quanto off-line. Cada segmento de mercado tem necessidades e aspirações diferentes e conhecer esse perfil auxilia a agência ou o estúdio no direcionamento para a comunicação de seu cliente. Quando penso na criação de um website, isso não é diferente: sempre levo em consideração quem está do outro lado da tela e um estudo de seu perfil é essencial para que o usuário possa desfrutar ao máximo as informações e os serviços disponíveis para ele no site. Partindo desse ponto, parece claro dizer que o público-alvo dita o caminho a ser seguido pela comunicação de um site. Isso seria trivial se não estivéssemos falando de uma mídia tão dinâmica como a internet, no qual podemos ir até o limite do que o usuário espera e surpreendê-lo com algo a mais - e quase que, de maneira instantânea, analisar os resultados positivos ou negativos. Geralmente, essas inovações criam um novo hábito no consumidor que estava acostumado apenas com o mesmo e acabam virando referência para os próximos sites que vão ter o conteúdo semelhante ao seu. Elas são responsáveis, em sua grande maioria, pelas novas tendências que são seguidas por todos, mas só as que são assimiladas pela grande audiência da internet se estabelecem como parte relevante nos sites comerciais. Minha conclusão é que existe uma via de mão dupla, onde de um lado estão designers e desenvolvedores criando e desenvolvendo novas tecnologias e aplicações para a internet e do outro o público-alvo que, a cada dia, usa a internet de maneira mais intensa e torna-se mais crítico em relação ao que é útil e o que pode ser descartado nos sites.”
“Quando penso na criação de um website, isso não é diferente: sempre levo em consideração quem está do outro lado da tela e um estudo de seu perfil é essencial”
42 :: debate - adaptar-se
Participação dos assinantes
pa gan r ticip e he prê e mio s!
O público-alvo dita a qualidade do seu site?
Paulo Altieri comunicacao@adg.org.br
Não necessariamente. Por exemplo, um site com apelo popular não significa que seja melhor ou pior em termos de qualidade. Para um público “requintado”, a visão de um site como este é diferente da do público-alvo; o mesmo ocorreria se fosse ao contrário. Aqui a qualidade se aplica a ambos, mas o que dita isso é ponto de vista de um público. Outro público, outro ponto de vista.
vencedor!
Vânia Marques vania.marques@vivo.com.br
Nosso “freguês” é o usuário e suas críticas, sugestões e comentários que norteiam o nosso trabalho. Obviamente buscamos sempre surpreendê-los, antecipando suas necessidades e imprimindo um padrão de qualidade a altura do público-alvo.
Anderson Silva webmaster@nhsinformatica.com.br
A qualidade do site está diretamente relacionada com o grau de exigência do seu público-alvo. Isso acontece não só com sites, mas com programas de televisão, estilos musicais, moda, arquitetura etc.
Julio Cezar juliocezar@nce.ufrj.br
Acredito que exerça uma certa influência, porém não será o público-alvo em si o fator determinante para a qualidade do site. Um site de qualidade será sempre aquele que busque um diferencial, mesclando informação de forma clara e design moderno e ousado.
Michel Rozatti mike.net@uol.com.br
O público defi ne o fi m do site ou a “tribo” a qual ele pertence. A qualidade é atingida exatamente quando o site supre as necessidades de seu público e só vai conseguir realmente atingir seus objetivos, isto é, ter acessos, quando for considerado interessante por esse público.
Se você é assinante, participe desta seção pelo site www.arteccom.com.br/webdesign/clube
O autor da melhor resposta ganha prêmios.
e-mais - sites polĂticos :: 43
44 :: e-mais - virais na web
Virais na web:
uma “nova” fórmula para se propagar informação? Provavelmente, você recebeu no ano passado uma
hoje é sinônimo de bom, de marcante, de web de primeira.
imagem, onde o desafio era descobrir, dentre os diversos
Sendo bom e marcante, a peça tem a capacidade de ser
objetos que a ornamentavam, referências a bandas de
passada para frente no boca-a-boca”, acrescenta André
pop/rock. Ou, ainda, foi estimulado pela indicação de
Matarazzo, sócio da Gringo.nu (www.gringo.nu).
um amigo a entrar no site www.subservientchicken.com
Virais como conseqüência da Web 2.0?
e digitar ações para que uma galinha “louca” fizesse o que
Analisando os recentes projetos lançados no mercado,
você pedisse.
é possível afirmar que o atual conceito de participação
Criatividade e estratégia para disseminar uma
ativa dos usuários na evolução dos ambientes interativos
informação, fugindo do formato de propaganda
explique o crescimento das campanhas virais pela web e o
tradicional. Os exemplos acima são alguns dos bons
investimento de grandes marcas neste tipo de projeto?
casos de campanhas virais, que hoje se tornaram uma das
Para Ricardo Figueira, diretor de criação da
principais ferramentas para as grandes marcas espalharem
A g ê n c i a C l i c k ( w w w. a g e n c i a c l i c k . c o m . b r ) , a l g u n s
seus planos de comunicação ao mercado. Ou seja, elas
pontos podem esclarecer melhor essa percepção sobre
representam para a internet a tradução da velha tática do
participação interativa, viralidade e investimento. “O
boca-a-boca.
primeiro deles é que o consumidor é, por natureza, um
“Marketing viral é uma ferramenta de guerrilha e uma
formador de opinião. Alguém que, de alguma forma,
forma de colocar uma marca na web como informação e
passa por experiências que lhe proporcionam vantagens,
não como propaganda. É transformar o produto ou serviço
benefícios ou não. É alguém que vive em redes sociais, seja
de uma empresa em um conteúdo divertido e inovador com
no trabalho, entre amigos de faculdade ou simplesmente
o objetivo de que o consumidor passe a mensagem para
p o r a f i n i d a d e d e i n t e re s s e . Tro c a n d o e m m i ú d o s , o
frente. Gerar um boca-a-boca on-line”, explica Marcelo
consumidor é alguém capaz de gerar o bom e velho boca-
Coelho, da Espalhe (www.espalhe.inf.br), agência de
a-boca, e a diferença é que a internet tornou-se uma
marketing de guerrilha do Brasil. “A verdade é que ‘viral’
ferramenta de amplificação disso em larga escala, com uma
e-mais - virais na web :: 45
dimensão e velocidade absurdas”, diz.
As etapas na criação de um viral
Outra questão envolve a transformação na forma
Segundo os especialistas, as etapas na hora de se
como a mensagem é transmitida. “Se antes a propaganda
criar uma campanha viral pela web seguem a mesma
era baseada em emissão e recepção, hoje ela não só pode
l i n h a u t i l i z a d a p a r a o u t ro s t i p o s d e c a m p a n h a s o n -
como deve transformar um receptor em também emissor.
line. “Definição, planejamento, criação e produção. A
Na minha opinião, essa é uma das grandes diferenças da
viralização ocorre (ou não) uma vez que a campanha já
propaganda moderna para a propaganda tradicional, onde
está no ar. Se o usuário se identificar, ela emplaca. Se não,
a mensagem deve ter potencial de reação e o meio deve
não decola. Na nossa experiência, não é recomendável se
permitir a sua redistribuição”, afirma.
confiar 100% no viral como estratégia de divulgação. É
A conseqüência desse cenário para quem trabalha com
necessário investir em formas tradicionais de divulgação,
ambientes digitais é um maior investimento das grandes
pelo menos no começo da campanha”, aponta Michel Lent
empresas em formatos de sites que vão além do tradicional
Schwartzman, diretor geral da 10’Minutos Interactive
modelo institucional. “Muitos usuários procuram uma
(www.10minutos.com.br).
relação mais emocional com a marca (e vice-versa), e esse
Traçar o perfil do público-alvo também é um bom
tipo de relação é mais fácil de ser construído através de
caminho para se garantir o sucesso dessas campanhas.
sites periféricos ao site ‘institucional’. É por isso que existe
“Primeiro de tudo, conhecer profundamente o público
tanto espaço para hotsites, campanhas menores, virais.
primário a ser atingido, seus valores e seus hábitos com
Hoje, as marcas usam vários canais on-line e não apenas o
os meios interativos. Após entender exatamente em quem
seu .com.br”, aponta Matarazzo.
você vai provocar a ‘reação’, é imprescindível projetar o
Trabalhando com os riscos
tipo de ‘reação’ a ser provocada e, principalmente, qual
Os riscos envolvidos em campanhas virais são grandes,
é a mensagem residual que ela vai transmitir. Por fim,
pois seu sucesso dependerá exclusivamente de sua afinidade
disponibilizar e desenvolver meios para que as pessoas
com o público-alvo para espalhar seus objetivos, além da
possam repassar as suas experiências ou convidar novos
necessidade de se passar uma espontaneidade. Dessa forma,
participantes para a ação”, orienta Ricardo Figueira.
existe alguma forma para se medir os riscos antes de lançar uma campanha desse tipo?
Falando no desenvolvimento de sites voltados para campanha virais, colocar o termo “indique/envie
“O viral mais fácil é aquele que se espalha dentro
para um amigo” parece ter se tornado uma ferramenta
d e u m t a rg e t d e t e r m i n a d o , p o r a f i n i d a d e . M a s t e m
padrão. “Quanto mais fácil para o consumidor repassar a
também o viral que se espalha para todos os lados,
mensagem, maior será o retorno, por isso a mecânica de
indeterminadamente. São as ‘grandes idéias’ da web que
‘indique um amigo’ é tão popular. Mas, mesmo esta simples
todos sabemos e comentamos. Normalmente, o viral vem
mecânica, pode ser incrementada de alguma maneira. Um
acompanhado de riscos sim, e nem sempre mensuráveis.
exemplo é o ‘Share the Love!’, da Amazon: um esquema
Entendo que conceitualmente seja arriscado, mas em compensação o projeto é mais barato (viral de verdade
Payback
X
Ou prazo para recuperação do capital. É um indicador voltado
se espalha sem comprar mídia, por exemplo, que é cara)
à medida do tempo necessário para que um projeto recupere o
e o alcance do possível estrondo é fenomenal, fora que
capital investido.
quando algo cativa o usuário emocionalmente, o payback
Fonte: USP (http://tinyurl.com/meojo)
de b r a n d a w a re n e s s é gigantesco. Em tudo na vida, quanto maior o risco, maior possível o ganho envolvido”,
Brand awareness
afirma André Matarazzo.
Refere-se ao conhecimento que o público tem da marca. Fonte: Revista FAE BUSINESS (http://tinyurl.com/lm72j)
X
46 :: e-mais - virais na web
para indicar o produto que você comprou, dando descontos para amigos e comissão na venda para quem indicou. Tudo
Exemplos de campanhas virais
isso por trás de uma bonita mensagem de ‘compartilhe o amor”, cita Ricardo Cavallini, diretor de operações da Euro
- Algoz - Fiat (www.algoz.com.br)
RSCG 4D (www.eurorscg4d.com.br).
- Burger King - Subservient Chicken
A tática é investir na curiosidade para que o usuário
(www.subservientchicken.com)
fique tentado a descobrir a informação que se deseja
- Crossbar - Nike (http://tinyurl.com/lyxgy)
espalhar. “Geralmente, são sites simples, que visam sempre
- “Do you see music?” - Virgin
a facilidade para o usuário transmitir a mensagem para
(http://tinyurl.com/8ackj)
o seu grupo de influência. Mas isso não é uma regra. O
- Fale Benq (www.falebenq.com.br)
site www.oquetemnocopovermelho.com.br, por exemplo,
- Grocery Store Wars (www.storewars.org)
provoca o usuário a participar e descobrir o enigma. A
- Marc Ecko (www.stillfree.com)
própria navegação do site é complicada para instigar a
- “Neither this site nor Mozilla is connected with
ânsia do visitante pela descoberta. Hoje, para conquistar o
Microsoft” (www.ie7.com)
usuário, precisamos oferecer algo ousado e atraente para
- Sith Sense (http://tinyurl.com/zx9cw)
que ele se sinta orgulhoso de ter achado aquele site e
- Spread Internet Explorer
recomende para todos os seus amigos. Uma grande forma
(www.spreadinternetexplorer.com)
de fazer isso é permitir que o usuário participe. Deixe
- Super Bonder Reality Test
que o internauta, por exemplo, produza um conteúdo
(http://infectous.plugin.com.br/reality)
com a informação da sua empresa e possibilite que ele
- Whopperettes (www.whopperettes.com)
distribua facilmente para os amigos. Métodos muito usados ultimamente são o ‘Envie para um amigo’, a personalização
Fontes: André Matarazzo, Marcelo Coelho, Michel Lent, Ricardo Cavallini e Ricardo Figueira
da mensagem e o RSS”, indica Marcelo Coelho.
Dicas de leitura
Principais etapas na criação de virais
- “O marketing depois
1) Identificar um diferencial que irá viralizar o
de amanhã”
produto;
(www.depoisdeamanha.com.br)
2 ) Te r u m a i d é i a i n o v a d o r a e m c i m a d e s t e
Autor: Ricardo Cavallini
diferencial;
Editora: Digerati Books
3) Identificar os disseminadores desta idéia na web: blogueiros, jornalistas, usuários de l i s t a s d e d i s c u s s õ e s o u u s u á r i o s d e re d e s d e relacionamento;
“Blog corporativo”
4) Traçar uma estratégia para a viralização da idéia:
(www.blogcorporativo.net)
onde atacaremos? Quais disseminadores tentaremos
Autor: Fábio Cipriani
conquistar primeiro?;
Editora: Novatec
5) Soltar o viral. Fonte: Marcelo Coelho (Espalhe - www.espalhe.inf.br)
estudo de caso - Samambaia :: 47
48 :: FIND
O FIND na visão de um designer Por Felipe Memória Designer da Globo.com e professor da PUC-Rio. Mediador da mesa-redonda realizada durante o evento. Se vocês me perguntarem qual foi a primeira im-
seus clientes e fazer apenas trabalhos interessantes.
pressão que tive do Fórum Internacional de Design e
Como o custo se mantém baixo e, para ele, “dinheiro
Tecnologia Digital - FIND, posso dizer que o evento foi
não é importante”, a Sagmeister Inc. pôde sair do con-
o mais legal que eu participei nos últimos anos. Isso por-
vencional.
que todas as palestras tiveram um nível excelente, com
Sagmeister causou polêmica ao afirmar outra coisa
trabalhos extraordinários e diferentes pontos de vista.
que também concordo totalmente, mas que pode pa-
Um bom exemplo disso foi o culto a simplicidade: do
recer muito estranho vindo de um designer: nem todo
“Less is more”, defendido pelos primeiros palestrantes,
mundo precisa de uma marca. Reparei isso quando minha
versus o “Less is bore”, do Stefan Sagmeister.
mulher me pediu uma marca para a empresa de eventos
Falando nele, considerei a sua presença a maior
que ela estava abrindo, já com alguns clientes. Meu pon-
“surpresa” do evento, pois muitos aqui no Brasil não
to é o seguinte: a marca é irrelevante neste momento.
conheciam seu trabalho, que é simplesmente genial e
Vai trazer zero clientes a mais. Precisamos pensar no que
inspirador. Stefan levou o público ao êxtase com seus
realmente importa: o produto.
projetos experimentais supercriativos e loucos. Falou
E foi isso que Stefan defendeu na mesa-redonda.
da dificuldade em deter o crescimento de seu estúdio,
Recusou receber $ 20 mil de um cliente, afirmando que
o que faz com que tenha liberdade para poder escolher
ele não precisava de uma marca e bolou uma outra es-
Networking e visita aos estandes dos patrocinadores durante o coffee-break
Gui Borchert se preparando para sua palestra sobre criatividade e inspiração
Mais de 500 profissionais lotaram o Copacabana Palace para prestigiar o evento
PJ Pereira respondendo a pergunta de um participante on-line
Sagmeister se preparando para a mesa-redonda
Inamoto apresentando um dos cases da AKQA
FIND :: 49
tratégia para a empresa, dando gratuitamente idéias de
Microsoft em que eles usaram um enorme e tradicional
onde o dinheiro deveria ser realmente investido para
GIF animado no fundo da página.
fazer o negócio andar. Sagmeister sai da mesmice e da mediocridade. Virou ídolo e foi aplaudido de pé.
Em seguida, Gui Borchert foi dogmático em relação à busca contínua pela excelência. Para isso, apresentou
Já PJ Pereira e Rei Inamoto abriram o FIND com
cases interessantes da RGA, em que existiam limitações
uma apresentação bem feita e organizada, mostrando um
de projeto, como: briefing simples demais, trabalhos que
bom nível de entrosamento. A dupla da AKQA abordou
poderiam não ser interessantes num primeiro momen-
muitos conceitos do uso da internet como fonte de en-
to (como o cartão de natal da empresa e o Nike Run),
tretenimento, como plataforma para jogos on-line.
mas que tiveram um resultado surpreendente através de
Dentre os cases, destaque para as campanhas en-
abordagens diferentes e criativas.
volvendo games, que são um prato cheio para abordar a
Um ponto interessante de sua palestra, no qual me
questão da experiência do usuário. Os cases mostravam
identifiquei imediatamente, foi a força de vontade e a
integração do produto com celular e e-mail, idéias com
quantidade de horas de trabalho. Tal posicionamento
potencial de viralidade e principalmente possibilidade
causou até certa polêmica também na mesa-redonda.
de pessoas interagirem. O vídeo da campanha do X-Box
O ponto principal, muito bem destacado pelo PJ no
mostrou exatamente isso, com a multiplicação dos joga-
debate, é o seguinte: por mais que você seja talentoso
dores. O slogan genial do produto diz tudo: “X-Box live:
e consiga fazer coisas sensacionais em oito horas diárias
It’s good to play together”.
de trabalho, sempre vai aparecer alguém tão talentoso
Outra visão importante, destacada por Rei, ressal-
quanto você que trabalhe mais horas. E o mercado é as-
tava como eles tomam extremo cuidado em não aplicar a
sim, competitivo. Não é realmente muito popular afirmar
tecnologia simplesmente por ela existir, pelo desejo de
isso, mas concordo totalmente que coisas extraordiná-
aplicá-la. Como prova disso, apresentaram um case da
rias são pagas com olheiras.
PJ Pereira, Adriana Melo, Gui Borchert, Stefan Sagmeister, Rei Inamoto e Felipe Memória
Fotos: Odilon Jr. (odilon.fotografias@bol.com.br)
50 :: estudo de caso - Bicmusic
A era dos sites como estratégia de branding O gerenciamento estratégico de uma marca,
x
também conhecido pelo nome de branding, vem
Branding
sofrendo profundas transformações diante do uso cada
É o conjunto de ações ligadas à administração das marcas, nas
vez maior da internet no cotidiano das pessoas. Dessa forma, as ações on-line se tornaram importantes ferramentas de aproximação e
mais diversas áreas, com o objetivo de manter ou ampliar sua posição no mercado e consolidá-la cada vez mais na mente dos consumidores. Fonte: Desafio21 (http://tinyurl.com/khgrb)
relacionamento com o público-alvo das grandes empresas. Um exemplo recente desse cenário aparece
investirem no conceito de entretenimento na hora
no hotsite da campanha BIC Music (www.bicmusic.com.
de se criar e desenvolver campanhas interativas,
br), que apresenta o mundo musical como temática
tendência que começa a vingar no Brasil. Quais são os
para os novos isqueiros ilustrados da empresa.
desafios na hora de se trabalhar com tais projetos?
“O projeto é uma ação 100% de branding,
Heloísa :: É uma forma de fazer uma aproximação da
objetivando rejuvenescimento de marca e aproximação
empresa com o seu target, e não simplesmente vender
com seu target. Além disso, a BIC decidiu lançar a
um produto. É achar pontos comportamentais do seu
campanha de divulgação exclusivamente pela internet,
público-alvo e criar uma aproximação fundamentada nos
por se tratar de um tema musical e bastante vinculado
seus hábitos e gostos a fim de fazer parte o maior tempo
ao público jovem, que tem uma afinidade altíssima
possível não só da sua rotina, mas também do lazer.
com a inter net”, explica Heloísa Ticianelli, gerente
Wd :: Falando na interface gráfica do hotsite,
de Marketing e Novos Negócios da EverMedia (www.
vemos que os isqueiros personalizados da campanha
evermedia.com.br), responsável pelo planejamento e
BIC Music receberam um destaque com as ilustrações
criação da campanha.
de cada estilo musical (Rock, Soul, Eletrônica, Hip Hop
Para sabermos mais detalhes do desenvolvimento
e Pop Rock). De que forma vocês trabalharam a criação
deste projeto, além de Heloísa, conversamos também
destas ilustrações para que elas pudessem se encaixar
c o m D o u g l a s B o c a l ã o , c o o rd e n a d o r d e c r i a ç ã o d a
dentro do projeto gráfico?
agência. Confira a seguir.
D o u g l a s : : To d a s a s i l u s t r a ç õ e s p a s s a m a i d é i a
Wd :: Em termos de internet, já se tornou comum
de movimento, cores e da liberdade de expressar seu
no mercado inter nacional as grandes empresas
próprio estilo musical. A idéia principal é que cada
estudo de caso - Bicmusic :: 51
usuário possa olhar para o site e se identificar com ele. Além disso, todos os estilos musicais trabalhados no
Quais influências e como vocês definiram esta etapa dentro do processo de criação?
site têm características marcantes. Buscamos trazer uma
Douglas :: Nossa principal influência foi a street
identidade forte também para o layout. Para chegarmos
art (arte de rua), onde a diversidade de cores e
neste resultado, a equipe saiu a campo para estudar
d e f o r m a s o rg â n i c a s é m u i t o g r a n d e . A r i q u e z a d e
referências gráficas em casas noturnas, muros grafitados
detalhes que podemos encontrar passeando pelas
e capas de disco. O mix de tudo isso resultou em formas
r u a s é i m p r e s s i o n a n t e . Vo c ê p o d e v e r c a r t a z e s ,
orgânicas, setas, curvas e cores harmoniosas.
grafites, placas de trânsito e até sinalização de lojas
W d : : Vo c ê s u t i l i z a r a m m u i t a s s e t a s e t r a ç o s or namentados para indicar as seções do hotsite e
que podem inspirar e trazer aquele estalo que faltava na criação de um site.
orientar a navegação do usuário, além delas ilustrarem
W d : : A t i p o g r a f i a d o p ro j e t o é i n s p i r a d a e m
a própria marca do projeto. Que tipo de estudos vocês
fontes fantasia e parece ter recebido um tratamento
fizeram para definir o estilo gráfico a ser utilizado?
e s p e c i a l . C o m o a s u a e s c o l h a s e i n s e re d e n t ro d o
Douglas :: Faz parte da nossa metodologia o processo
conceito geral do hotsite?
de imersão, onde vamos buscar referências gráficas
Douglas :: A tipografia também sofreu influência
mundiais, seja por meio de livros, revistas, observando as
da arte de rua. Na maioria dos títulos, aplicamos
pessoas na rua ou buscando sites pela internet.
contornos característicos de grafitismo, além das
Mas não podemos confundir imersão com meditação.
cores fortes e marcantes. Utilizamos a família de
Apenas pensar no assunto não traz resultado, é preciso
fonte Bauhaus, que apesar de ser uma fonte clássica,
muito esforço, rascunhos, estudo de cores, versões preliminares, até alcançarmos o layout desejado. Neste caso, definimos que as formas utilizadas no hotsite tinham que expressar movimento - um dos elementos primordiais na música. Quisemos ambientar o hotsite para trazer as mesmas sensações de uma balada. Wd :: A combinação cromática do hotsite é puxada para tons fortes, porém elas ficaram bem harmoniosas.
“A equipe saiu a campo para estudar referências gráficas em casas noturnas, muros grafitados e capas de disco” (Douglas Bocalão)
52 :: estudo de caso - Bicmusic
transmite modernidade e se encaixa perfeitamente com a comunicação criada para o site. Wd :: O hotsite foi projetado para resoluções de tela acima de 1024x768 pixels. Por que vocês adotaram este padrão, já que as estatísticas no Brasil ainda apontam um certo equilíbrio nesta área? Douglas :: Na verdade, o hotsite prioriza a resolução 1024, mas também atende a 800x600. O usuário tem uma experiência maior com a resolução 1024, já que visualiza mais elementos na tela. Porém, a navegabilidade continua sem nenhum comprometimento em 800x600.
www.bicmusic.com.br
Mas acreditamos que a tendência seja a resolução 1024.
Todos os 52 samples foram criados exclusivamente
Wd :: Um dos destaques do projeto está na
para a BIC. O mixer é a sustentação do concurso cultural.
disponibilidade da ferramenta BIC Web Mixer, no qual
Quem gosta de música vai entrar no site, criar a sua,
o produtor musical Veiga criou, com exclusividade, os
divertir-se com os downloads e concorrerá a iPods. Os
52 samples disponíveis por lá. Como surgiu a idéia de
vencedores ainda poderão ter suas músicas em MP3 no
criar um mixer on-line e que tipo de tecnologia foi
seu próprio iPod.
utilizada para que ele pudesse se tornar funcional?
Wd :: Ainda sobre tecnologia, a EverMedia
Heloísa :: A BIC está lançando uma série limitada
criou uma versão Wap do hotsite. Diante da
temática de música. A EverMedia ficou responsável por
experiência com este projeto, vocês poderiam citar
toda estratégia exclusivamente on-line. A idéia foi criar
os principais desafios no desenvolvimento de sites
uma experiência inovadora para quem aprecia música e, a
para dispositivos móveis?
partir daí, surgiu a idéia do BIC Web Mixer. A ferramenta foi toda desenvolvida em Flash 7.0 e ASP.
Douglas :: Uma das principais barreiras é a d i v e rg ê n c i a e n t re a s t e c n o l o g i a s d a s o p e r a d o r a s e
na web ::::53 estudoTecnologia de caso - Bicmusic 53
das diferentes plataformas dos aparelhos. Podemos comparar a atual fase dos dispositivos móveis com a época em que o Netscape ainda brigava com o Internet Explorer e os designers quebravam a cabeça para criar sites compatíveis com os dois browsers. O mais sensato a fazer é seguir os padrões de desenvolvimento da W3C (The World Wide Web Consortium - www.w3.org) e criar wapsites simples, com navegação objetiva e fácil.
Wapsite da BIC Music
x
No wapsite desenvolvido pela Evermedia para a BIC Music, o internauta pode acessar a página por meio do browser do celular e fazer o download de 15 ringtones (toques para celular), escolhendo a música e o formato que preferir. Além disso, as músicas produzidas pelo próprio usuário poderão ser baixadas, via cabo, para os celulares compatíveis com MP3.
Wd :: Assim como a campanha, a sua divulgação será feita especificamente em mídia online e focada em portais voltados para o público jovem (Vírgula, Jovem Pan e MTV). Quais fatores influenciaram nesta decisão? H e l o í s a : : A campanha está focada no público jovem, pois é o que tem maior afinidade com a música. Por sua vez, é quem passa mais tempo na web. O Brasil está entre os países que mais gastam tempo na web e esse índice vem crescendo significativamente. Por esta razão, veio a escolha do investimento exclusivo neste canal e nos portais com perfis jovem e musical.
“Nossa principal influência foi a street art (arte de rua), onde a diversidade de cores e de formas orgânicas é muito grande” (Douglas Bocalão)
54 :: Tecnologia na web
Tecnologia na web CSS Hacks: em busca da renderização igualitária nos navegadores Reúna um grupo de desenvolvedores web em uma mes-
Explorer calculam a largura dos elementos diferente de bro-
ma sala e faça a seguinte pergunta: “quem nunca precisou
wsers como Konqueror, Mozilla, Opera e Safari (KMOS). Esse
utilizar CSS Hacks para garantir uma boa renderização nos
problema só era resolvido com o uso de CSS Hacks”, afirma
mais diversos navegadores de internet, por favor, levante a
Diego Eis, criador do Tableless (www.tableless.com.br).
mão?”. Certamente, uma minoria vai conseguir se destacar dentro do grupo.
Outro muito comum envolve o modo de compatibilidade definido (quirks ou strict mode). “Um dos mais comuns, e
“Todos nós, envolvidos com desenvolvimento, já passa-
que pode ser facilmente evitado, é colocar, inadvertidamen-
mos pela frustrante - ou para muitos, já esperada - experiên-
te, o IE6 para trabalhar em modo de compatibilidade (quirks
cia de constatarmos que nosso layout visualizado com preci-
mode), o que faz com que tenha os mesmos problemas na
são e perfeição em um navegador X, mostra-se totalmente
interpretação do Box Model que o IE5.x/Win tem. Isso acon-
‘quebrado’ e irreconhecível no navegador Y. Inconsistências
tece quando se coloca uma linha em branco, um comentário,
desta ordem devem-se ao fato de um mesmo código ser tra-
ou uma declaração XML antes do DOCTYPE. E muita gente,
tado de modo diferente por diferentes navegadores. E isto
sem saber porque está tendo problemas, acaba se valendo
não é exclusividade das CSS. Qualquer código ou script a ser
de hacks para que sua página seja exibida de forma correta
interpretado no lado do cliente, obviamente dependerá do
no IE6”, alerta Bruno Torres.
dispositivo que o usuário estiver usando”, relata Mauricio
IE: trabalhe com comentários condicionais
Samy Silva (www.maujor.com/blog).
Segundo os especialistas consultados pela reportagem,
Então, como poderíamos definir os CSS Hacks? “São
quando falamos de interpretação de CSS para o Internet Ex-
códigos CSS que se aproveitam de uma determinada falha
plorer, uma boa pedida é se aprofundar no assunto “comen-
(ou falta de suporte a algum recurso) em um determinado
tários condicionais”.
browser para fazer com que alguma propriedade CSS seja
“O Internet Explorer é a principal fonte de problemas
aplicada exclusivamente para aquele browser ou em qualquer
para os desenvolvedores, no que se refere à falhas de inter-
um exceto aquele. Ou seja, funcionam mais ou menos como
pretação de estilos CSS. Hoje sabemos da existência de uma
‘filtros’ detectores de browsers. Um filtro não confiável a lon-
funcionalidade do Internet Explorer, desde a versão 5 (para
go prazo, já que mudanças no código do browser podem fa-
Windows), que permite enviar determinado código apenas
zer com que um ou mais hacks deixem de funcionar”, explica
para este browser, inclusive com a possibilidade de enviar
o desenvolvedor web Bruno Torres (http://brunotorres.net).
apenas para versões específi cas. São os comentários con-
Erros mais comuns de renderização
dicionais, comentários HTML que são interpretados apenas
Entendido o conceito da aplicação de CSS Hacks, pode-
pelo Internet Explorer. Tudo que estiver dentro de um comen-
mos apontar algumas das principais falhas na interpretação
tário desse tipo será ignorado por qualquer browser, já que
dos navegadores que obrigam os desenvolvedores a utilizá-
é, efetivamente, um comentário, mas será interpretado pelo
los. “Sem dúvida, o erro mais comum é o de Box Model. Re-
IE. É isso que devemos usar, já que é uma funcionalidade do-
sumidamente, é um bug de cálculo de largura de elementos.
cumentada pela Microsoft e funciona a contento, sem causar
As versões 5 e 6 (dependendo do DOCTYPE) do Internet
maiores problemas”, orienta Bruno.
Tecnologia na web :: 55
nível avançado
Versão 7 do IE trará boas notícias? Em breve, a Microsoft vai lançar no mercado a versão 7 do Internet Explorer e promete melhorar a interpretação do
Referências on-line
CSS em seu navegador (http://tinyurl.com/9wev8). “O IE 7, para citar alguns avanços, virá com suporte mais robusto para
- Box Model Hack http://www.maujor.com/tutorial/boxmodelhack.php
seletores CSS2, restabeleceu o elemento HTML como a raiz do documento (acabou com a entidade superior ao HTML),
- Comentários Condicionais
não mais reconhece o hack underscore e corrigiu o bug da
www.maujor.com/tutorial/condcom.php
double margin”, cita Maurício Samy. “Se o IE7 for tudo isso que estão falando, muitos de nos-
- IE7 and IE7 http://meyerweb.com/eric/thoughts/2005/10/17/ie7-and-ie7/
sos problemas estarão resolvidos. Poderemos desenvolver com mais tranqüilidade e teremos mais recursos para utilizar
- O que é Quirks Mode?
em nossos projetos. A vida do desenvolvedor se tornará mais
http://www.revolucao.etc.br/archives/o-que-e-quirks-mode/
fácil. Tomara. Caso contrário, o IE7 será um novo fantasma, um novo problema”, analisa Diego Eis. No entanto, a grande esperança reside no trabalho cole-
- O que são, para que servem e exemplos de CSS Hacks http://www.tableless.com.br/csshacks
tivo incessante de pesquisadores pelo mundo. “Hoje em dia, após alguns anos de uso massivo do CSS, com diversos desen-
- Pandora’s Box (Model) of CSS Hacks And Other
volvedores ao redor do mundo pesquisando comportamentos,
Good Intentions
buscando formas de contornar falhas de maneira ‘lícita’, ou seja, sem o uso de hacks, temos cada vez menos que recorrer a estes para resolver nossos problemas”, finaliza Bruno.
Livros
http://tantek.com/log/2005/11.html#d26t1820
- Position Is Everything http://www.positioniseverything.net/index.php
- Quirks Mode http://www.quirksmode.org
- “CSS Hacks & Filters” Autor: Joseph W. Lowery (http://tinyurl.com/z7x5t)
- “Eric Meyer on CSS”
- Vídeo-tutorial sobre CSS Hacks http://www.tableless.com.br/videotutorial/videotutorial2/
Autor: Eric Meyer (http://tinyurl.com/l2rho) Fontes: Bruno Torres, Diego Eis e Maurício Samy Fontes: Bruno Torres e Maurício Samy
56 :: tutorial
Caminhando pelo HTML - Parte 5 Elcio Ferreira Desenvolvedor e instrutor na Visie Padrões Web http://visie.com.br/
Em nosso singelo tutorial do mês passado, escreve-
recemos informações adicionais a respeito dos outros docu-
mos a arquivo HTML muito simples, para demonstrar como
mentos, através do atributo title. Vamos fazer a mesma coisa
é simples a linguagem HTML. Este mês, vamos tornar as
agora, usando outra tag do HTML. Dentro da seção HEAD de
coisas divertidas, relacionando nosso arquivo HMTL com
nossa página, vamos inserir:
outros arquivos. Isto é o que torna a web especial, a ca-
<link href=”florentina.xml” />
pacidade de relacionar documentos. Para começar, vamos falar da forma básica e essencial de relacionar documentos
<link href=”florentina.css” /> <link href=”florentina2.css” /> <link href=”print.css” />
H T M L : a t a g A . Vo c ê v a i s e l e m b r a r q u e , m ê s p a s s a d o ,
Com isso, relacionamos nosso documento a quatro outros,
construímos um trecho de código assim:
um arquivo RSS e três arquivos CSS. Mas isso não basta. É preci-
<ul>
so dizer ao navegador o que fazer com esses documentos e de
<li>Home</li> <li>Produtos</li> <li>Serviços</li> <li>Trabalhe conosco</li> <li>Sobre</li> </ul>
Essa lista será o menu de nosso site. Para isso, será pre-
que tipo eles são. Fazemos isso com os atributos rel e type: <link rel=”alternate” type=”application/rss+xml” href=”florentina.xml” /> <link rel=”stylesheet” type=”text/css” href=”florentina. css” /> <link rel=”alternate stylesheet” type=”text/css” href=”florentina2.css” />
ciso que, ao clicar, nosso feliz visitante seja enviado a uma
<link rel=”stylesheet” type=”text/css” href=”print.css”
nova página. Você provavelmente sabe como se faz isso:
/>
<ul>
Com isso, estamos dizendo ao navegador que o pri-
<li><a href=”home.html”>Home</a></li> <li><a href=”produtos.html”>Produtos</a></li> <li><a href=”servicos.html”>Serviços</a></li>
meiro arquivo é um formato alternativo de nosso conteúdo (alternate), e que ele é do tipo application/rss+xml, ou seja,
<li><a href=”trabalhe.html”>Trabalhe conosco</a></li>
que é um arquivo RSS. Na segunda linha, dizemos ao nave-
<li><a href=”sobre.html”>Sobre</a></li>
gador que estamos relacionando uma folha de estilo (sty-
</ul>
lesheet) e que é do tipo text/css, ou seja, um arquivo CSS.
Simples, não? Talvez simples demais. Podemos aproveitar esse
A terceira e quarta linhas também são do tipo CSS, mas a
trecho de código para acrescentar informações adicionais a respeito
terceira apresenta uma folha de estilo alternativa (alternate
da página para qual linkamos. Por exemplo:
stylesheet). Isso fará com que o navegador não carregue
<li><a href=”sobre.html” title=”Saiba mais sobre a Florentina
essa folha de estilo a não ser que o usuário peça. Ainda
Móveis e sua fundadora, Florentina Maria”>Sobre</a></li>
Agora temos uma indicação mais clara do que este link nos trará. A este tipo de “informação sobre a informação” os eruditos da web chamam de metainformação. Há mais de uma utilidade para essa metainformação. A mais conhecida é o fato de que o navegador exibe esse texto numa tooltip quando o usuário passa o mouse sobre o link. Entre outras utilidades está o fato de que robôs de busca, como, por exemplo, o Google, entendem e indexam o conteúdo da tag title. Se você percebeu bem, para tornar nosso HTML rico, útil e interessante, fizemos duas coisas. Primeiro o relacionamos com outros documentos, através da tag link. Em seguida, ofe-
podemos melhorar isso: <link title=”Feed RSS da Florentina Móveis” rel=”alternate” type=”application/rss+xml” href=”florentina.xml” /> <link title=”Estilo CSS padrão” rel=”stylesheet” type=”text/css” href=”florentina.css” /> <link title=”Estilo CSS alternativo” rel=”alternate stylesheet” type=”text/css” href=”florentina2.css” /> <link title=”CSS de impressão” media=”print” rel=”stylesheet” type=”text/css” href=”print.css” />
O navegador agora sabe que o título de nosso Feed é “Feed RSS da Florentina Móveis”. Sabe também os títulos das nossas folhas de estilo. Assim, pode mostrar esse menu:
tutorial :: 57
Outro exemplo desse esforço de inserir metainformações são os microformatos. Microformatos são pequenos trechos de HTML comum, escritos seguindo regras específicas, geralmente contendo nomes de classe específicos, que, devido a essas regras, carrega mais metainformações que o simples HTML. Para explorar isso melhor, sugiro que você baixe a extensão Tails Export para Firefox (http://tinyurl.com/gflh2). Infelizmente, a Tails Export está disponível apenas para Windows. Mas há uma série de outras ferramentas capazes de lidar com microformatos que você pode usar. Por exemplo, para o microformato hCard você encontra uma extensa lista em: http:// Isso permite ao nosso usuário escolher com que estilo verá
tinyurl.com/e5yvk.
a página. Você deve ter notado também que o link “CSS de im-
De posse da Tails Export, entre no site do Tantek Çelik (http://
pressão” não aparece na lista. Isso se deve ao atributo media. O
tantek.com) e dê uma olhada na barra de status do navegador. Lá
navegador detecta corretamente o tipo de media de cada arquivo
você pode, por exemplo, exportar as informações de contato dele
css através desse atributo. Ele exibe então na lista aqueles cujo
para um vcard. O formato de arquivo vcard é entendido por aplica-
media for screen (tela) ou all (tudo). O valor default de media é
ções como o Outlook. Assim, ao entrar no site do Tantek, você pode
all, então, se você não especificar um valor para media, seu CSS
adicioná-lo aos seus contatos do Outlook com dois cliques. Como
será exibido em todas as medias. Note no código que, para o
ele fez isso? Dê uma olhada nesse trecho de código:
último link, estamos colocando media=”print”. Isso faz com que
<div class=”item vcard” id=”livebait”>
este CSS seja usado quando o usuário imprimir a página. Assim, posso ter uma “versão de impressão”, em que eu escondo menus, publicidades, fundos coloridos, mudo a fonte etc. E que funciona automaticamente, basta o usuário imprimir a página. Por fim, é importante dizer que ultimamente têm se trabalhado muito em novas maneiras de se inserir metainformação em uma pági-
<a href=”http://flickr.com/photos/tantek/ 187850720/”><img src=”http://static.flickr.com/74/187850720_fce42bc7e2_ t.jpg” alt=”photo of restaurant entrance” class=”photo” /></a> <a
href=”http://local.yahoo.com/
details?id=11054799” class=”url fn org”>
na. Uma das novidades de nossos dias é o fato de você poder inserir,
Live Bait</a>
por exemplo, a seguinte tag META no HEAD de sua página:
<div class=”tel”>+1 (212) 3539100</div>
<meta name=”ICBM” content=”-23.626508,-46.639688” />
<div class=”adr”>
Dessa forma, o navegador, se suportar este recurso, sabe as coordenadas geográficas de sua casa, empresa, ou seja, lá de onde for o site. Quer ver funcionando? Uma das maneiras de se usar isso é através de uma extensão para Firefox, chamada GeoURL. Você pode baixá-la em http://tinyurl.com/fqpbq e, em
<div class=”streetaddress”>14 East 23rd St.</div> <span class=”locality”>New York</span> <span class=”region”>NY</span>, <span class=”postalcode”>10010</span> </div> </div>
seguida, acessar qualquer site com essa tag META. Por exem-
Há um atributo class para cada um dos valores que será
plo, o nosso: http://visie.com.br. Ao fazê-lo, você deve ver um
exportado no vcard. E pronto, simples assim. O resto é com o
pequeno globo colorido em sua barra de status. Assim, você
navegador. Para saber mais sobre as classes possíveis e outros
pode saber onde fica nosso escritório. Clique nele com o botão
microformatos, acesse o site oficial do projeto: http://microfor-
direito do mouse e divirta-se:
mats.org. Com isso, nosso HTML já é rico e poderoso, altamente relacionado com outros documentos na web. E não deixou de ser uma linguagem muito simples. Praticamente todo o resto que faríamos para transformar nosso código em um site apresentável será feito com outras duas linguagens: CSS e Javascript. Sim, isso já é outra história.
58 :: mercado de trabalho
Cesar Paz Guilhermo Reis Engenheiro com pós-graduação em marketing e comércio exterior. Diretor Presidente da AG2 - Agência Especialista emDigital. Arquitetura de Informação Usabilidade. É autor do Kit deAgências Conhecimento sobre AI de Inteligência Fundador e diretor daeAGADi (Associação Gaúcha das Digitais) e APADi (http://tinyurl.com/p4j6w). Atualmente, é responsável por coordenar projetos e manutenções nos (Associação Paulista das Agências Digitais). Colunista do jornal Propaganda e Marketing e do site Webinsider. websites do Banco Real. cesarpaz@ag2.com.br reis@guilhermo.com
Koruja! -
Oi, cara, tudo bom? Recebi teu portfólio, achei bem legal.
-
Pô, valeu.
-
Como é mesmo o teu nome?
-
Koruja.
-
Coruja?
-
É Koruja, com K.
-
Não, cara, teu nome, teu nome de batismo...
-
Pode me chamar de Koruja, todo mundo me conhece por Koruja.
-
Como assim, Koruja?
-
Koruja, pô!
Então tá, né. Resolvi não lutar contra a natureza, me condicionar ao nível de interlocução imposto e quem sabe, com sorte, descobrir que tipo de Koruja era aquela. -
Ahmmm, ok, Koruja... Onde você já trabalhou?
-
Em lugar nenhum.
-
Como? Mas e o teu portfólio?
-
Ah, eu fiz a maioria das coisas em casa, vagabundeando. Fiz uns freelas também.
Puxa, me comovi com tamanha honestidade! Naquele instante, entendi que o lado do meu cérebro que funcionava não era o mesmo lado do cérebro do Koruja e que, embora ele falasse um idioma que se aproximava muito do meu, o diálogo não iria rolar. Não sei exatamente por que, além do desespero por qualquer profissional que conhecesse um pouco de Photoshop e soubesse copiar algumas linhas de HTML, resolvi, naquele verão de 1998, rasgar todos os manuais de recursos humanos e dar uma chance para o Koruja! -
Muito bem, Koruja. Você pode começar amanhã um “estágio” de um mês...
-
Bacana, onde é meu ninho?
Hoje, inverno de 2006, aquele Koruja não teria chance. O desenvolvimento de soluções para o ambiente de internet amadureceu. As agências digitais cresceram e criaram novas competências e metodologias. Um “web tudinho” que fazia projeto de interface, criação, direção de arte, webdesign e programava HTML foi substituído por cinco especialistas nas estruturas maiores e por dois ou três nas menores. A especialização permitiu a produção de projetos web em escala e uma profissionalização das estruturas de desenvolvimento. Hoje, para fazer parte dos principais “times” de soluções de internet no país, vários critérios passam a ser fundamentais no processo de seleção e manutenção de talentos por parte das empresas que se tornaram players do setor. Na AG2, empresa que ajudei a criar e dirijo até hoje, valorizamos, cada vez mais, nos nossos profissionais, as seguintes características:
mercado de trabalho :: 59
"Um `web criar tudinho´ que os fazia projeto interface, criação, direção “É preciso as casas, prédios, as de praças e principalmente as placas de arte, webdesign e programava HTML foi substituído por cinco de sinalização.” especialistas nas estruturas maiores e por dois ou três nas menores."
1.
Motivação pessoal: o profissional precisa ter ânimo, energia, inquietação, capacidade de indignação e
espírito empreendedor. 2.
Trabalho em equipe: pobre do cara que não sabe compartilhar informações. São valorizados apenas
aqueles que sabem motivar, incentivar os colegas, planejar e organizar os processos e ter sinergia na construção de objetivos com o grupo. 3.
Gestão: a capacidade natural de relacionamento com as pessoas e habilidades no gerenciamento de proces-
sos e recursos são fundamentais para dar conta da dinâmica dos diferentes tipos de projetos web. 4.
Visão positiva: não vejo chance para talentos que têm na “dificuldade” e nos “problemas” a sua matéria-prima.
Ter visão positiva de si próprio, da sociedade e da empresa em que trabalha é condição para a evolução profissional. 5.
Fazer acontecer: apenas alguns profissionais têm uma enorme capacidade de realização, outros se per-
dem em processos, fórmulas, manuais e questões técnicas. A capacidade de “fazer acontecer” pressupõe que o profissional tenha entendimento de prioridades, iniciativa, persistência, determinação, performance e compromisso com o negócio. O Koruja se mostrou um bom profissional e era um cara supercriativo, e nos ajudou bastante. Não sei se tem a ver com o “nome”, mas sempre foi um grande parceiro das madrugadas de trabalho. Preferia produzir à noite! Ficou conosco quase dois anos e depois foi trabalhar com vídeo. Eu continuei tendo que desesperadamente identificar, contratar e reter talentos. O fato é que mesmo sabendo que nem tudo no mundo é resultado de racionalidade, tratei de reconstruir pacientemente todos os manuais de recursos humanos que eu mesmo havia rasgado no início da internet. Passei a ser muito mais científi co na busca e na retenção dos melhores profissionais.
OTIMIZE SUAS AÇÕES DE ENVIO DE E-MAIL. Monitore seus resultados: saiba quem leu, que horas leu e onde clicou.
GRUPO DB4 “Assim que começamos a usar o Easy Mailing conseguimos despertar nos clientes do grupo DB4 a importância do e-mail marketing e o resultado que ele pode gerar se feito de maneira profissional, com documentação, relatórios e ética. Encontramos nos softwares da Dinamize ferramentas de e-mail marketing robustas, profissionais e com ótimo custo benefício.” Diogo Boni.
VEJA MAIS DEPOIMENTOS EM NOSSO SITE.
www.easymailing.com.br
tel. 55 51 3061.0636
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
Manifesto antibanquinho (Esse banquinho aí do teu lado... não, não, aquele ali. Me empresta? Coisa rápida, é só para fazer um manifesto.) Caríssimos, do alto desse banquinho quarenta anos vos contemplam, e é alçado a esta altura imerecida que proclamo: abaixo os banquinhos. (Pronto, aqui está teu banquinho. Não pretendo usá-lo de novo, obrigado)
Vocês me conhecem, eu não sou de botar a boca no trombone à toa, no máximo um manifesto aqui e uns podcasts ali, mas chega uma hora que temos que tomar posição. E é imbuído do senso de dever que digo: arredemos pé das nossas posições. Estamos entrincheirados demais. Estou falando sério. Outro dia acompanhei de perto um site novo ser metralhado por todos os lados: desenvolvedores fuzilando a compatibilidade com browsers, designers estapeando a usabilidade, criativos bombardeando o coitado do logotipo. O episódio só não foi trágico porque o dono do site tinha um bom-humor e à prova de balas. Nem adianta pensar em desarmamento. Cada lado ali (engenheiros, designers, marketeiros, etc) demorou anos pra conseguir seu arsenal: estudaram, praticaram, se aprimoraram, se organizaram... e se engessaram. Se ao menos o confronto fosse bonito, algo como uma bela roda de capoeira... mas nunca é: cada um fica na sua trincheira jogando farpas e insultos de lá pra cá. Enquanto isso, felizes da vida, passam ao largo os verdadeiros inovadores, os visionários, aqueles que ao invés de defender territórios desbravam novos mundos. OK, basta de alegorias e metáforas. Já deve ter dado para entender. Eu estou cutucando os donos-da-verdade de plantão, aqueles profissionais que sobem no banquinho para... (que outra palavra eu uso? Ai ai ai...) ditar (ufa!) regras a torto e a direito. Abaixo os banquinhos. Abaixo quem se julga acima. Abaixo as opiniões incontestáveis. Abaixo o absolutismo. Absolutismo nunca fez sentido, e na internet faz menos ainda. Suponhamos que você faça um site para a sua agência. A agência quer se posicionar junto ao mercado como criativa e antenada com o state-of-the-art em novas mídias, e para isso faz um site multimídia, inovador e irreverente. Pronto, o site está no ar. Começa o tiroteio: xiitas vão chiar (xiitas chiam by default) que o site não é tableless, não é W3C-compliant e que não roda no Opera pra Linux. Alguns puristas vão achar que o site é banda-intensiva e exclui propositalmente quem tem banda estreita e máquinas antigas. Outra ala vai apontar seus canhões contra o fato de que a mudança do logo foi meramente cosmética, enquanto chovem flechas de quem diz que aquela é uma sub-utilização dos recursos novos do flash XYZ. Nessa hora eu bato o pé duas vezes: em primeiro lugar, desçamos do banquinho. Se a agência escolheu uma linha X de comunicação com seu target e esse target por acaso não te inclui, ela deve saber o que faz. Se a agência quer ser vista dessa maneira e não de outra, idem. Não há uma solução de comunicação que seja universal, há sempre escolhas a se fazer.
marketing :: 61
"Abaixo os banquinhos. Abaixo quem se julga acima. Abaixo as opiniões incontestáveis. Abaixo o absolutismo."
Se ela errou o tiro, que aprenda com as conseqüências. Em segundo lugar: se a agência foi capaz de produzir aquela comunicação e não outra, isso diz muito dela, sobretudo sobre seus méritos e... limitações. Para exemplificar melhor suponhamos outro cenário: uma agência mediana encomenda seu site a um terceiro e o resultado é algo absolutamente arrasador e genial, muito acima da cultura digital da própria agência, um site impecável, revolucionário, trendsetter. Isso não seria propaganda enganosa, mostrar uma fachada que não corresponde ao que ela é capaz de pensar e realizar? Ou alguma ética estranha diz que um site impecável ,mas irreal é preferível a um site “pecador” mas verossímil? Pecado por pecado, meus blogs pessoais são forrados de pecadilhos técnicos. Nem poderia ser diferente, porque não sou técnico. Meu podcast vai ao ar do jeito que eu gravo, sem edição ou cortes. Nem poderia ser diferente, porque não sou locutor nem apresentador. As milhares de fotos que eu publico não têm retoques, além de Levels e Crop. Eu não quero criar uma ficção de mim mesmo, e não tenho o menor pudor quanto a imperfeições. Nossas deficiências são tão nossas quanto as nossas qualidades, e mesmo que eu tenha minhas certezas, elas são inseparáveis da minha história, da minha perspectiva, do lugar onde estou sentado. Minha opinião é absolutamente parcial. Toda opinião é. Quer pensar outside the box e inovar? Saia da trincheira. E não é nenhum banquinho que vai te tirar do buraco :)
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
E se eu chamasse Catundo? O que seria de Catunda, se Catundo fosse? Já me peguei pensando na frase acima. Em muitos anos trabalhando não foram poucas às vezes que imaginei como seria minha vida profissional se eu fosse um Catundo. Meus pais só tiveram filhas, mas me lembro até hoje da preocupação do velho em nos ensinar a trocar pneus, entender de cebolões e nos preparar para uma vida independente. Repeti a quarta série do primário e como castigo (ou prêmio) tive que trabalhar um ano para aprender a gostar da escola e dar valor pros estudos. Ledo engano, me apaixonei foi por trabalhar e não parei mais. Foram anos trabalhando e estudando até que ficou só o trabalho. A gente tá sempre aprendendo e estudar também nunca é demais. Pensando bem, valeu a lição. Escolhi a TV bem cedo e fiquei nela por longos quatorze anos. É muito tempo quando na época, fazendo as contas, não somamos mais de trinta poucos. Nesse tempo, vi assistentes virarem braços direitos de diretores, diretores propriamente ditos, editores chefes, gerentes de programação... E eu quase na mesma. Mas, e seu chamasse Catundo, será que eu teria me tornado um respeitado profissional de TV? Hum... Confesso que quando migrei pra internet me senti bem mais confortável com esse assunto. Mas será que se eu chamasse Catundo eu seria um bem sucedido cidadão ponto com? A ausência total da TPM teria me ajudado a galgar um lugar no pico do universo www? Hum... E eu escutaria: - Bonita camisa, Seu Catundo. - Boa jogada, Catundo. Tacada de mestre. Deixe-me segurar seu charuto! (sai fora). - Seu Catundo, reunião na sala 14 com aquela gostosa do RH. - Seu Catundo, sua esposa na linha 2. (que estranho) - Seu Catundo, sua braguilha está aberta. (cruzes) Mas o que me diverte não é só pensar no sucesso financeiro que eu teria se Catundo eu fosse, mas também no dia-a-dia profissional. Receberia Catundo, em seu e-mail, as fotos das últimas beldades da Playboy e Sexy enviadas pelos amigos? Sim e seriam consumidas nisso boas horas de trabalho, muito bem gastas por sinal. Perderia Catundo mais outras boas horas de seu dia mergulhando no infinito de uma boa olhada nos atributos físicos de suas colegas de trabalho? É lógico que sim e por que diabos não? É notória a capacidade feminina de se apegar aos detalhes, mínimos que sejam, podem apostar: as mulheres tudo vêem, tudo memorizam, tudo relembram e depois “algumas vezes” jogamos isso na cara dos seres masculinos. Mas e Catundo? Catundo, como portador de um cromossomo y no lugar de um dos x perderia a capacidade de fazer mais de uma coisa ao mesmo tempo? Catundo, ao tentar fazer a barba atendendo a um telefonema, perderia ¼ do sangue de seu corpo? Não. Definitivamente não quero fazer a barba. Na vida prática, preencher um gênero masculino no lugar do feminino nos formulários
bula da Catunda :: 63
"A ausência total da TPM teria me ajudado a galgar um lugar no pico do universo www? Hum... "
por aí me faria abrir mão de algo que muito me anima: minha suscetibilidade ao mundo invisível. A crença em quiromantes, tarólogas e astrólogas poderia ser sensivelmente reduzida. Eu, enquanto Catunda, sucumbo sem pestanejar a uma bola de cristal e um baralhinho enfeitado, se rolar um incenso e uma toalha colorida então, acredito até que sou a reencarnação de uma jabuticabeira. Fazer o quê? Mas, voltando ao mundo real, se é que ele existe - ser um Catundo poderia tornar-se determinante na hora de receber um cheque de um pagamento atrasado, por exemplo, ou de colocar o “tal” na mesa e falar com voz grossa (sem parecer ataque de mulherzinha) que não dá mais pra trabalhar desse jeito. Já dou risada só de pensar. Seria tão divertido. Eu poderia apresentar o Aprendiz. Será? A viagem de ser um Catundo é a mesma de ser um orangotango. Tudo seria diferente se num dia treze de sessenta e poucos eu tivesse usado uma fita azul no lugar de um lacinho cor-de-rosa. Eu poderia ser um halterofilista, um surfista, um guitarrista... Mas não sou. Eu sou a Marcela, sou mulher, adoro meu trabalho e sonho com um mundo melhor (para todos os gêneros) mesmo não sendo miss.
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. luli@luli.com.br
Para que, afinal, seu cliente precisa de um website? Já faz algum tempo que a época dos “geninhos” fazedores de sites acabou, uma época em que o importante era “estar” na web, o que quer que isso significasse. Com ela, também acabou a época dos “achismos” e dos chutadores, o que garantiu, para muitas empresas sérias, verbas significativamente maiores para o desenvolvimento de ações digitais. À medida que o mercado de comunicação digital evolui, mais e mais pessoas começam a usar com galhardia termos antes reservados aos mascadores de bits e outros sujeitos de óculos esquisitos e cortes de cabelo improváveis. Já não se fala mais em portais, a onda agora é fazer com que as campanhas de comunicação sejam “virais”, criem comunidades, usem blogs e, para os mais versados nas artes mercadocibernéticas, usem características colaborativas de Web2 etc etc etc. No entanto, a busca por efi ciência não parece ser uma prioridade hoje em dia. Dos dois lados do balcão de negociações, nada é menos sexy que se falar em taxas de conversão ou sucesso de operações. É um raciocínio torto, para se dizer o mínimo. Pois se qualquer profissional de comunicação se apressa em defender a importância da área digital para a fidelização de um público, por que a maioria deles continua a se comportar como adolescentes mimados que detestam uma planilha de Excel? É triste reconhecer, mas muitos profissionais de design digital não sabem/querem/gostam de ler um Briefing, um relatório de pesquisa ou um planejamento estratégico de seus clientes. Em português, isso quer dizer que esses profissionais não são capazes de identificar claramente quais são os objetivos da comunicação. Aí, como diz aquela velha expressão, “se não sabes aonde vais, por que teimas em correr?”. Muitos se defendem argumentando que seus clientes são incapazes de elaborar um plano mínimo, e que mudam de idéia de acordo com o que está na moda ou que foi mostrado pela concorrência, sem ao menos considerar se a solução proposta é boa para eles. Pode até ser verdade, mas de qualquer maneira, é o cliente quem contrata seus serviços e, para citar outras duas velhas expressões, “o freguês tem sempre razão” e “a corda sempre rompe do lado mais fraco”. Se a vida é dura e noção é um artigo em falta entre os profi ssionais de marketing, o que se deve fazer? Para começar, levar a sério a idéia de ser parceiro de seu cliente. Isso significa ter um interesse real por suas conquistas e colaborar efetivamente para que ele as conquiste. Caso contrário, o designer se comporta como um pintor ou pedreiro: faz exclusivamente o que é mandado, dane-se se não der certo. Agindo assim, não é de se esperar que ganhe mal. Falando o óbvio, clientes trabalham para empresas e, portanto, devem visar lucro em suas operações. Para isso, é preciso identificar um objetivo para a ação digital e uma estimativa de recursos para viabilizá-la a contento. Um blog corporativo, por exemplo, deve ter de dois a cinco
webdesign :: 65
"É triste reconhecer, mas muitos profissionais de design digital não sabem/querem/gostam de ler um Briefing, um relatório de pesquisa ou um planejamento estratégico de seus clientes. "
posts por dia. Isso significa de 10 a 25 posts por semana, ou 500 a mil e poucos posts por ano. O cliente é capaz de arcar com isso? Não? Então não arrisque, pois a coisa pode ficar feia. O mesmo raciocínio se aplica a outras áreas. Para que se quer o website? Para aumentar reconhecimento de marca? Para dar maiores informações sobre produtos e serviços? Para Vender on-line? Para dirigir a atenção para outros canais de vendas (como concessionárias em websites de automóveis, por exemplo)? Para prestar serviços ao consumidor? Para cortar custos? Para aumentar a fidelidade à marca? Para ações promocionais? Para cada uma dessas perguntas há uma resposta clara, direta e eficiente. Ela não passa por CSS ou AJAX, mas consegue estabelecer uma meta – e, o que é melhor, mensurá-la. Isso serve para justifi car verbas para o desenvolvimento de novas ações e a contratação de seus futuros serviços, mesmo que eles não sejam os mais baratos ou mais rápidos do mercado. Me parece uma boa recompensa para a árdua tarefa de ler algumas páginas de planejamento, mas eu posso estar enganado.
VOCÊ TAMBÉM PODE AJUDAR! Você também pode colaborar doando cestas básicas para o projeto Magê-Malien.
Todos temos o compromisso de cuidar para que o nosso país seja um lugar melhor. Um gesto de solidariedade não muda o nosso mundo, mas muda o mundo daquele
barraca da Pescaria
que recebeu a sua ajuda.
Capoeirista passarinho
Para doação de alimento entre em contato: arteccom@arteccom.com.br
Magê-Malien - Crianças que Brilham Faça parte você também deste projeto. Informações: www.arteccom.com.br/ong
Gustavo Loureiro, sócio diretor da agência STAGE3, já fez sua doação.
A alta qualidade do serviço de hospedagem da Acquaria Web Solutions lhe dá a tranqüilidade para dirigir sua empresa, com a certeza de que seu cliente terá acesso a qualquer momento a seu endereço na internet. www.acquaria.com.br tel: (47) 8414.4383 acq@acquaria.com.br
Você quer Hospedagem Profissional? Servidores estáveis e que não saem do ar? Então venha conhecer a DataHosting, suporte diferenciado e qualificado, planos especiais de revenda, plataforma windows e linux. www.datahosting.com.br tel: (11) 6951.2954 - (11) 6939.7305 atendimento@datahosting.com.br
Hospedagem de sites com infra-estrutura de altíssimo nível, planos a partir de R$ 8,90/mês. HTML, PHP, CGI, Flash, FrontPage, DreamWeaver, MySql, e-mail com anti-vírus/spam, suporte 24x7 entre outros recursos. www.hphost.com.br tel: (11) 6684.9597 info@hphost.com.br
maxiservers DATA CENTER HOSTING Com o maxiservers você acerta no alvo, o melhor e mais seguro em hospedagem de sites! A partir de 14,90 mensais você hospeda seu site de forma fácil, rápida e segura. Acesse Já! www.maxiservers.com vendas@maxiservers.com
A Brasil Hosting assume a missão de “prestar os melhores serviços, oferecer preços justos e respeitar o consumidor”. Assine agora mesmo um dos nossos planos e sinta a diferença de um hosting com ética. www.brasilhosting.com tel: (48) 4052.9591 atendimento@brasilhosting.com
Oferece hospedagem profissional linux e windows com recursos grátis como loja virtual, blog, enquete, boleto. Possui planos de revenda ideais para webdesigners. Suporte qualificado 24 horas e registro de domínios. www.portal123.com/ tel: Minas Gerais (31) 3761.2253 São Paulo (11) 4052.9253 suporte@portal123.com.br
Provedor fundado no ano de 2001, com infra-estrutura própria e datacenter no Brasil. Plataforma Windows com suporte integrado à Net 2.0, ASP e PHP5 no mesmo ambiente, contando ainda com MYSQL gratuito e SQLServer 2000. www.iphotel.com.br tel: (11) 6971.0438
Hospedagem de sites a partir de R$ 6,60, planos Windows e Linux, servidores semi-dedicados e dedicados de alta-qualidade, suporte altamente qualificado e 24 horas. www.novahost.com.br tel: (21) 2702.3653 vendas@novahost.com.br
Hospedagem com infra-estrutura no Brasil, 6 anos no mercado. Planos Windows e Linux, antivírus, anti-spam, banco de dados, relatórios de acesso, disponibilidade de 99,5%. www.creativehost.com.br tel: (11) 3849.1166 atendimento@creativehost.com.br
Hospedagem de Sites a partir de R$ 15,00 mensais com 30 dias grátis para testar nossa qualidade. Sistemas para Imobiliárias, Concessionárias e Lojas Virtuais Online. http://www.braghost.com.br braghost@braghost.com.br
Hospedagem de Qualidade em Windows e Linux. Planos a partir de R$ 4,90 mensais. Atendimento personalizado por telefonia fixa, Voip, Skype e e-mail, eliminando a distância para que você tenha liberdade de escolha. www.jotachost.com.br tel: (11) 4063.2395 - (41) 3352.9153 sac@jotachost.com.br
R$ 5 mensais ou R$ 50 ao ano. 800MB de espaço em disco, 20GB de transferência,PHP, MySQL, Emails e subdomínios ilimitados.Também registramos seu domínio. Atendimento imediato pelo MSN. www.triangulohost.com.br tel: (34) 3316-2433 hostmaster@triangulohost.com.br
studioserver Internet Solution
Hospedagem de Sites, Revenda de Hospedagem e Registro de Domínios, tecnologia ASP, PHP e .net no mesmo plano, teste grátis por 30 dias e comprove a qualidade de nossa infra-estrutura e atendimento. www.redehost.com.br tel: Rio Grande do Sul (51) 3042.2030 São Paulo (11) 4063.7574 Rio de Janeiro (21) 3527.0848 comercial@redehost.com.br
Hospedagem de sites em plataforma Linux e Windows. Registro gratuito de domínios internacionais, acesse o nosso site e participe de nossa promoção. www.rjhost.com.br tel: (21) 2577.5545 vendas@rjhost.com.br
Top Hospedagem Hospede seu site com quem conhece do assunto. Servidores de Alto Desempenho! Suporte Rápido e Eficiente! Tranqüilidade e segurança para você! Top Hospedagem - Qualidade é a nossa marca. www.tophospedagem.com.br tel: (31) 3077.3310
Soluções completas para webdesigners e desenvolvedores.Sistema inteligente e seguro de email com disco virtual.Qualidade, estabilidade e segurança. www.speedhost.com.br tel: São Paulo (11) 5644.1047 Rio de Janeiro (21) 3523-0387 Paraná (41) 3015.3077
Loja virtual GRÁTIS. Assine um plano de hospedagem 3 ou 4 e ganhe uma loja virtual completa e de fácil administração. Escreva o código WBM no formulário de inscrição e ganhe ativação + 1 mensalidade. www.studioserver.com.br tel: (13) 3273.3379 comercial@studioserver.com.br
ZARP HOST Hospedagem de Sites Oferecemos registro de domínios e hospedagem em ASP, PHP e CGI. Planos a partir de R$ 9,90. www.zarphost.com.br contato@zarphost.com.br
Para anunciar nesta seção, envie um e-mail para publicidade@arteccom.com.br, com o título "busca host" ou ligue para (21) 2253.0596
ABC ABCMIX Flash Tutorials Vídeo-aulas interativas em flash para Joomla! CMS. Viewlets sob encomenda para treinamento web e provedores de hospedagem. www.joomlaflashtutorials.com tel:(61) 8464.4383 tutorials@abcmix.com
Toda a experiência em treinamento presencial disponível agora na forma digital. Aprendizado rápido, na velocidade de seus negócios. www.actionsoft.com.br tel: (11) 6864.4709 carlos@actionsoft.com.br
A Bluestar Technology oferece toda a linha de treinamentos oficiais Borland, CA e Conectiva Mandriva. Temos ainda treinamentos profissionalizantes em Programação Web, com Java, Delphi e PHP. Invista em você, na sua carreira e no seu futuro. www.bluestar.inf.br tel: (61) 3347.9255 atendimentodf@bluestar.inf.br
Promoção de cursos de informática -Pacote Office -Montagem, Manutenção, Configuração de Computadores -Programação (Lógica de programação) -Redes e Linux -Windows e Internet tel: (21) 3393.6351 - (21) 3473.8683 ctl.informatica@pig.com.br
Domine os softwares de Web Design: Illustrator, Indesign, Photoshop, Dreamweaver, Fireworks e Flash. www.aisinformatica.com.br tel: (21) 2548.8989 copagerente2@hotmail.com
SERVIÇOS E TREINAMENTO EM INFORMÁTICA
Web Design, ASP, PHP, SQL, JAVA e outros. O participante dominará os padrões, conceitos e as boas práticas de desenvolvimento para os principais modelos adotados pelo mercado. www.digidatabrasil.com.br tel: (21) 2233.8967 - (21) 2203.2276 digidata@digidatabrasil.com.br Av. Pres. Vargas, 482 - sobreloja 206 - Centro - Rio de Janeiro/RJ
Disponibilizamos uma ampla gama de treinamentos, visando a capacitação para um mundo competitivo. Os cursos abrangem desde o básico de informática até os profissionalizantes. www.diginetinformatica.com.br tel: (71) 3382.7898 R: 124 - Elio Earli marketing@diginetinformatica.com.br
Ligue gratis:
Descrição: Especializada em treinamentos individualizados, a Digital ensina a trabalhar com softwares da área web, assim como os mais usados pelo desenvolvido mercado offshore da região. www.digitaltreinamentos.com.br tel: (22) 2762.1903 contato@digitaltreinamentos.com.br
0800 7 720 721
A Fuctura é uma empresa que constantemente está preocupada com qualidade e com novas tecnologias. Na área de treinamento oferecemos cursos tradicionais, cursos on-line como o curso de Tecnologias AntiHackers e de ponta como o curso de Bolsa de Valores. www.fuctura.com.br tel: (81) 3088.0992 e-mail: contato@fuctura.com.br
Web Designer + Fotografia Web Developer A melhor qualificação profissional em desenvolvimento de páginas e sites para a internet. Você conectado às novidades do mercado. Web Designer é na People ! www.people.com.br tel: (19) 3739.6400 ou 0800 7 720 721
Usabilidade, Arquitetura da Informação, Web 2.0, Webwritting, Tableless, Python, Zope e Plone com os maiores especialistas do mercado. Aprenda conceitos e ferramentas que serão seu principal diferencial competitivo. www.simplesconsultoria.com.br tel: (11)3898.2121 cursos@simplesconsultoria.com.br
A Tecnoponta treina há quinze anos profissionais preparados diretamente para o mercado de Web. Crie dinamismo, organize e manipule dados na Web, processando informações em Background . Cursos de Flash Action Script, Ajax e Tableless, ASP.NET c/ C#.NET www.tecnoponta.com.br tel: 3222.9492 treinamento@tecnoponta.com.br
Aprenda Oracle, Java, Linux, ITIL
Curso WEB Marketing e Comunicação Digital 28 à 30/08 - Rio de Janeiro 18 à 20/09 - Porto Alegre 16 à 19/10 - São Paulo Conheça a programação completa no site www.wbibrasil.com.br tel: (51) 3233.1771 marketing@wbibrasil.com.br
Operador de Microcomputador, Assistente Administrativo, Analista de Suporte Técnico, Linux /Star Office, Programação, Inglês, Telemarketing e Excelência no Atendimento, Editoração e Produção Gráfica, Web Design, Hotelaria e Turismo www.databyte.com.br tel: (21) 2482.4763 Unidade Madureira – Av. Ministro Edgard Romero 415
INVISTA EM SEU FUTURO Cássio Raphael Vitiello de Sousa Especialista Oracle - Sócio Diretor www.worldsoft.com.br tel: (11) 3289.5963 contato@worldsoft.com.br
AGORA NO BRASIL! O melhor treinamento Linux, pertinho de você. tel: (11) 3124.6000
Cursos Presenciais ou e-Learning. Computação Gráfica, WEB Design, AutoCAD, 3D Studio. Horários Flexíveis, Início Imediato, Garantia de Aprendizado. Marque uma Aula GRÁTIS! www.treinasoft.com.br tel: 11 5573.9067 Citreinasoft@treinasoft.com.br Av. 11 de Junho, 63, (Metrô Santa Cruz)
Multiplique conhecimento! Nossos Treinamentos: OpenOffice, Banco de Dados, Gestão e Qualidade, Programação Java, Análise de Sistemas, PHP e MySQL PHP com Ajax, Gnu/ LINUX LPI tel: (61) 3244.2510 atendimento@x25.com.br SGAS 910 Ed. Mix Park Sul sl 239 – Brasília/DF
Para anunciar nesta seção, envie um e-mail para publicidade@arteccom.com.br, com o título "busca cursos" ou ligue para (21) 2253.0596