Edição 81 - Novembro/Dezembro 2010

E D I T O R A
NOVEMBRO/DEZEMBRO 2010
vista
nova re
ntas!
agora ju
R$ 11,90
A revista dos profissionais de internet
PARA OS NEGÓCIOS
Design
COMO CRIAR FANTÁSTICAS
COMPOSIÇÕES DE IMAGENS
FAÇA A SUA MARCA
VOAR MAIS ALTO
NA REDE SOCIAL QUE MAIS
CRESCE NO BRASIL
Tecnologia
ESPECIALISTAS FALAM
SOBRE A IMPORTÂNCIA
DO FRONT-END ENGINEER
Marketing
COMO EXPLORAR O
MARKETING DE GUERRILHA
NAS REDES SOCIAIS
E-commerce
SAIBA POR QUE A NETSHOES
DOMINOU O MERCADO
E ainda
EXPERIÊNCIA INTERNACIONAL,
SMARTY PHP, BASTIDORES DOS
SITES DE COMPRAS COLETIVAS,
USABILIDADE PARA E-COMMERCE,
CASES, PORTFÓLIOS E MUITO MAIS
81 > FRONT | WIDE |
1
EDITORIAL
Um novo desafio
Quando a internet surgiu de forma comercial no Brasil, há
pouco mais de dez anos, o grande desafio das agências de
publicidade era convencer os clientes sobre a importância
de uma empresa estar presente na web. Alguns compraram
a ideia, foram acompanhando a evolução das tecnologias e,
assim, desde então mantêm seus sites atualizados, dinâmicos,
reforçando a imagem de sua empresa, garantindo um canal de
comunicação relevante com os seus clientes.
Hoje, a internet já está praticamente consolidada como um
dos maiores meios de comunicação. Agora a discussão é
outra: como explorar ao máximo toda a interatividade que a
rede proporciona?
Inicialmente, foi o Twitter que despertou o interesse das
empresas, pela alta velocidade na disseminação das
informações. Rapidamente, caiu nas graças das celebridades,
tomando conta das mídias de massa. Surgiu, então, mais
um grande canal de comunicação, o que significa maior
proximidade com o público-alvo, interação, melhores
produtos e resultados. As empresas finalmente podem
se comunicar de forma instantânea com seus clientes,
monitorando as suas marcas.
Após o Twitter e o sucesso nacional do Orkut, chegou ao Brasil
a rede social adotada mundialmente – o Facebook, que já
conquistou mais de 500 milhões de usuários, tendo inspirado
inclusive o filme The social network, sucesso de bilheteria. Por
meio de página oficial, interação, fotos, vídeos, anúncios ou
aplicativos, as empresas podem atrair cada vez mais clientes
e divulgar seus produtos e serviços. Estando atentas, é claro,
ao novo perfil do consumidor: exigente, questionador e
participativo. Daí, surge um novo horizonte para as agências…
Esse mercado está apenas engatinhando e as empresas estão
ainda se conscientizando da importância das mídias sociais.
O desafio para as agências hoje é, antes de tudo, educar o
cliente. Portanto, leia bastante, informe-se, experimente, reúna
argumentos, demonstre resultados e, então, convença-o a
investir na internet e, sobretudo, nas novas mídias.
81
Direção Geral
Adriana Melo
Direção de Redação
Flávia Freire
Jornalismo
Tiago Bosco
Revisão
Rodrigo Gerdulli
Projeto Gráfico
Tabaruba Design
Direção de Criação e Ilustração
Camila Oliveira
Ilustração (colaboração)
Carolina Vigna-Marú
Versão iPad
Tabaruba Design
Ocara Digital
Publicidade
Luanna Chacon
Thiago Nabuco
Atendimento
Michelle Ferraz
Tecnologia
Neilton Silva
Rafael Zuma
Financeiro
Eduardo Costa
Eventos
Cristiane Dalmati
Revista Wide
www.revistawide.com.br
Arteccom
Eventos, editora e treinamento
www.arteccom.com.br
www.twitter.com/arteccom
Boa leitura e bons negócios!
Adriana Melo
[email protected]
E, para quem já tem iPad, esta edição (nov/dez) é gratuita no tablet. Aproveito
www.facebook.com/arteccom
www.flickr.com/arteccom
para agradecer à agência Tabaruba (Luciana Junqueira e Bruno Lemgruber),
Marcelo Torrico e Ane Hinds pela dedicação e empenho na concepção do
www.youtube.com/arteccom
projeto. Ficou muito bom o resultado, parabéns!
Produção gráfica
www.ediouro.com.br
Fale conosco
Atendimento: [email protected]
Redação: [email protected]
Publicidade: [email protected]
2
| WIDE | 81 > FRONT
Distribuição
www.chinaglia.com.br
81 > FRONT | WIDE |
3
CAPA
Facebook para
os negócios
Marketing por meio
de aplicativos, páginas
oficiais e anúncios na
rede social que mais
cresce no Brasil
50
E-MAILS E TWEETS > 06
E-mails, Tweets
FIQUE POR DENTRO > 08
Notícias, Blogs, Métricas,
Agenda, Livros, Direito
na web, Internacional,
Empreendedorismo
Design
> p. 14
Tecnologia
> p. 60
PORTFÓLIOS > 14
Agência: Diretta, Freelancer:
Jorge Brivilati, Ilustração: Guto
Lins, Lente Digital: Alexandre
Cavalheiro, Fontes de
Inspiração: Fabio Lopez
REPORTAGEM > 60
Smarty: garanta muito
mais produtividade no
desenvolvimento de projetos
em PHP com esse sistema de
templates
REPORTAGEM > 24
Composição de imagens:
especialistas falam sobre
o que é essencial para ter
sucesso com essa técnica
ENTREVISTA > 68
Confira a entrevista
exclusiva com o britânico
Graeme Rocher, líder
de desenvolvimento e
cofundador do Grails
ENTREVISTA > 30
A Wide conversou com André
Beltrão, autor do livro Manual do
freela: Quanto custa meu design?
OPINIÃO > 34
Profissionais brasileiros falam
sobre o desafio de encarar uma
experiência internacional
ESTUDO DE CASO > 40
Moda feminina na web:
analisando o recém-lançado
portal da loja Mercatto
COLUNAS > 44
Ilustração: Carolina VignaMarú, Internacional: Julius
Wiedemann, Design: Luli
Radfahrer
4
| WIDE | 81 > FRONT
OPINIÃO > 74
Profissionais do Brasil e do
exterior falam da importância
dos front-end engineers nas
equipes de desenvolvimento
ESTUDO DE CASO > 78
Case do site Noite Universitária,
que recebe cerca de um
milhão de page views mensais,
comprova o poder do Grails
COLUNAS > 82
Magento: Mario Sam,
Usabilidade: Robson Santos,
Flex: Paulo Teixeira, Segurança:
Ivo Machado, Tableless: Diego
Eis, Mercado de TI: Paulino
Michelazzo
Marketing
> p.94
REPORTAGEM > 94
Peixe Urbano, OfertaX,
Imperdível, ClickOn etc.:
conheça os bastidores dos sites
de compras coletivas, a mais
nova febre da web no Brasil
CAMPANHA > 100
A importância do e-mail
marketing para uma campanha
digital. Confira o case da
LojaMelissa.com
ENTREVISTA > 104
Marketing de guerrilha e as
mídias sociais. Entrevista com
Darren Barefoot, coautor do
livro Manual de marketing em
mídias sociais
COLUNAS > 108
Marketing de conteúdo: Bruno
Rodrigues, Web fora da caixa:
René de Paula
E-Commerce
> p. 112
REPORTAGEM > 112
Qualidade no atendimento ao
cliente. Entrevista exclusiva
com o americano Aaron
Magness, diretor de negócios
da Zappos
ESTUDO DE CASO > 120
Saiba porque o Netshoes,
site de vendas de artigos
esportivos, conquistou a 4ª
posição no ranking das lojas
virtuais mais acessadas do país
ENTREVISTA > 124
A sócia-diretora da Usability
Expert, Amyris Fernandez, fala
sobre usabilidade aplicada ao
e-commerce
COLUNA > 127
E-commerce: Mariano Gomide
de Faria
Os links citados nesta edição estão reunidos na página principal do site da
revista. Acesse www.revistawide.com.br.
A Arteccom não se responsabiliza por informações e opiniões contidas nos
artigos assinados, bem como pelo teor dos anúncios publicitários.
Não é permitida a reprodução de textos ou imagens sem autorização da Editora.
u m a e m p re s a
81 > FRONT | WIDE |
5
E-MA ILS
E-mails
e tweets
Olá, trabalho com webdesign
e tenho um cliente que está
querendo que eu gerencie para
ele o Twitter, crie campanha via
Twitter etc. Gostaria de uma dica
de vocês de quanto o mercado
cobra por isso atualmente. Sei
que valores dependem muito
do que será realizado e da mão
de obra empregada na questão,
mas preciso ter uma base para
não pedir nada muito além nem
aquém da realidade do mercado.
ELSO NETO – [email protected]
Elso, na edição anterior da
revista Wide, publicamos uma
tabela de preços da APADI que
especifica os valores médios
dos produtos e serviços básicos
mais utilizados nas agências
digitais associadas. Em relação
a redes sociais, é especificado
o valor de R$ 3 mil mensais
para seeding (divulgação de
produtos e serviços nas redes
sociais em ambientes que
estão receptivos ao consumo
Participe! fale conosco pelo site
www.revistawide.com.br envie sua dúvida de Direito
na Web para [email protected]
desta informação), e o valor de
R$ 8 mil mensais para gestão
de presença/relacionamento
nos canais sociais (respostas a
comentários, mensagens em
microblogs, e-mails enviados
por esses canais e análise de
métricas dos canais). Mas,
lembre-se de que ambos os
valores devem ser ajustados
conforme a sua experiência
profissional e o porte da
empresa do seu cliente. Confira
uma reportagem sobre esse
novo cargo na próxima edição!
Primeiramente, parabéns pela
Wide! Estávamos precisando
dessa publicação no mercado.
A programação visual ficou
linda! Queria muito fazer uma
sugestão: sou um apaixonado
por leitura, e tenho acompanhado bastante o crescimento
da rede social O Livreiro (www.
olivreiro.com.br), voltada
pra livros e discussões sobre
leitura. E eles estão lançando
várias novidades. De repente,
vale a pena fazer uma matéria
com eles, não acham?
LEONARDO BRAGANÇA – LEONARDO@
COMUNICACAO.ETC.BR
Obrigado pela sugestão, Leonardo.
A rede social O Livreiro é
realmente muito interessante e
merece um destaque na revista.
Levaremos o assunto para a reunião de pauta da próxima edição.
Olá, adorei a mudança para a
Wide, porque eu gostava da
Webdesign também, mas só
assinava a TIdigital, e agora
eu tenho as duas em uma
só. Gostaria de sugerir como
pauta o OpenCMS, que é uma
ótima solução em CMS para
a linguagem Java. Tem várias
empresas que o utilizam
para desenvolvimento de
grandes portais corporativos e
governamentais, e estão sempre
contratando, pois é difícil achar
bons profissionais.
RAFAEL LAGES – [email protected]
É isso mesmo, Rafael, a Wide
traz a vantagem de ter as revistas
Webdesign e TIdigital em uma só,
além de contar com as editorias
marketing digital e e-commerce.
Sua sugestão é ótima, muito
obrigado! Aguarde, que logo
publicaremos uma reportagem
sobre o OpenCMS.
T W E E T S [@arteccom, #revistawide]
@tritoq
@arteccom parabéns, o melhor conteúdo web do Brasil!
O trabalho de vocês está
excelente #revistawide ;)
@claushu
Na 1ª edição da revista Wide da
@arteccom tem uma matéria
sobre a campanha digital da @
silva_marina! Bem interessante!
#Marina43 #Wide
@ronald_rarf
Sensacional a matéria
de capa da #revistawide,
parabéns @arteccom
@marrybaptista
Gostei da revista Wide.
Proposta bem interessante.
#find2010
@juliobitencourt
Comprei ontem a revista Wide
da @arteccom. Muito boa! Leitura mais que recomendada!
@magicdigital
Já estou com minha #revistawide na mão, parabéns aos
idealizadores #find2010
Sugestões dadas através dos e-mails enviados à revista passam a ser de propriedade da Arteccom.
6
| WIDE | 81 > FRONT
@agenilson
Revista Wide #tudojuntoemisturado deu muito certo!
@cristianoweb
Não pude ir no #FIND2010 mas
pelo que li por aqui foi um sucesso o evento e o lançamento
da #RevistaWide né?! Parabéns @arteccom e equipe!!
81 > FRONT | WIDE |
7
N OT Í C I A S
Lojas Magento
no celular
Fique
por dentro
IE9 muito mais rápido que IE8
A campanha da Microsoft não só afirma que o novo Internet
Explorer 9 é onze vezes mais rápido que a versão anterior do
software como também ressalta ser mais veloz em desempenho
JavaScript do que as versões mais recentes dos navegadores
Firefox e Safari. Em relação ao Chrome 6, o IE9 tem maior
rendimento quanto à velocidade do HTML5, segundo teste
realizado pelo site Downloadsquad.com. Além de utilizar 90%
do processamento de gráficos pelo GPU (Graphics Processing
Unit), em vez do CPU, o browser traz uma barra de navegação
mais limpa, integração com Windows 7 para que os sites sejam
acessados diretamente sem a necessidade de primeiramente
abrir a janela do navegador, um gerenciador de downloads
integrado, atualizações automáticas, recuperação automática
de quedas e a capacidade de sair de uma guia dentro de uma
sessão de navegação para que o usuário possa visualizar duas
páginas da web ao mesmo tempo. Usuários de XP nem tentem
baixar o IE9, pois ele não rodará, mas, a quem usa o Windows
Vista ou 7, basta acessar www.internetexplorer9.com.br para
fazer o download e conferir as novidades..
Google x Apple x Dell
Depois de apresentar um tablet para
competir com o iPad, a Dell está estudando
as possibilidades para entrar na guerra com
as gigantes Apple e Google no mercado de
aparelhos que unem TV e internet. Esses
O core da plataforma
Magento acaba de lançar
o aplicativo Magento
Mobile. Com ele, é possível
integrar dispositivos móveis
Android, como o iPhone e
o iPad, com a plataforma de
e-commerce mais utilizada
no mundo, permitindo que
o desenvolvedor customize
sua loja móvel por meio do
próprio aparelho. O lojista
também pode ter acesso
à admin da loja virtual, ao
catálogo de produtos, ao
caixa, ao estoque, aos pedidos
de pagamentos e a muito mais
pelo celular. O resultado para
o usuário é de uma interface
intuitiva, que oferece todas as
funcionalidades que as lojas
acessadas pelo computador
disponibilizam. Para
entender como o aplicativo
funciona, assista ao vídeo
de apresentação em migre.
me/1o2QV. Para baixá-lo,
acesse migre.me/1o37d.
dispositivos oferecerão aos telespectadores a
possibilidade de fazer pesquisas e downloads,
instalar aplicativos, além de muitas outras
funcionalidades interativas. Agora, é só
aguardar o lançamento dos televisores no ano
que vem para conferir o que cada um trará de
diferencial para conquistar o mercado.
MÉTRICAS
10,2%
Percentual que representa os gastos mundiais das empresas com CLOUD
398
Solicitações feitas pelo Brasil ao Google no primeiro semestre deste ano para a
COMPUTING de todo o orçamento destinado à contratação de serviços
RETIRADA DE INFORMAÇÕES DO SITE DE BUSCAS. A Líbia é a segunda,
terceirizados de TI. A pesquisa realizada em quarenta países, com 1547 participantes,
com 149 pedidos de remoção e, em seguida, estão os Estados Unidos, com 128.
constatou que o investimento na tecnologia é considerado prioritário para 39% das
O Google já completou mais de 67,6% dos pedidos de retirada brasileiros. Fonte:
empresas este ano. Fonte: Gartner (www.gartner.com)
Google (www.google.com)
8
| WIDE | 81 > FRONT
BLO GS DO MÊ S
Guia sobre Design
O Guia sobre Design (www.guiasobredesign.
com.br) é a continuação do Projeto Sobresites.
O designer carioca Eduardo Vieira, sócio da
Tribo 12, trata de assuntos sobre design gráfico,
webdesign, cursos, tipografia, tecnologia,
prototipagem e muito mais. Os textos promovem
a discussão sobre as questões do design,
sua influência e todo o tipo de requisição e
questionamento relevantes ao tema, oferecendo
um material de apoio e pesquisa para auxiliar na
busca por informações de alto nível de qualidade.
O autor incentiva os leitores a sugerirem temas
e novas categorias para o blog e a trocarem
informações através do link de contato.
E-Commerce News
Há pouco mais de um ano no ar, o blog E-Commerce
News (www.ecommercenews.com.br) é uma excelente
referência para lojistas, agências de desenvolvimento
web, profissionais da área de e-commerce e internet em
geral. O blog é mantido por uma instituição empenhada
em produzir e disseminar informações sobre comércio
eletrônico, divulgando dicas, notícias, entrevistas,
pesquisas, balanços, lançamentos, cases, artigos e
tutoriais. Logística, SEO e tecnologias para a construção
de lojas virtuais também fazem parte dos assuntos
tratados no site. Constantemente atualizado, os leitores
podem ainda ter suas matérias publicadas enviando-as
para o blog. Além do Feed, assinar a newsletter garante
notícias em primeira mão no seu e-mail.
Conhece algum blog interessante focado em
criação, tecnologia, marketing ou e-commerce?
Envie sua dica para [email protected]
90%
Índice que o Brasil superou em relação ao número de EMPRESAS QUE
200mil
Déficit estimado de PROFISSIONAIS DA ÁREA DE TECNOLOGIA DA
ADOTARAM AS TECNOLOGIAS DA WEB 2.0, que incluem redes sociais,
INFORMAÇÃO no Brasil em 2013. Hoje, existem 600 mil pessoas atuando
como Facebook e Twitter, para os negócios, segundo pesquisa realizada pela
em setores de TI no país e ainda há uma demanda de 71 mil. Fontes: ABES,
McAfee em 17 países. No Brasil, nove em cada dez empresas estão lucrando
ASSESPRO, BRASSCOM, FENAINFO, SOFTEX e SUCESU (migre.me/1o4Tl)
com as ferramentas. Fonte: BBC Brasil (www.bbc.co.uk/portuguese)
81 > FRONT | WIDE |
9
LIVRO S
Como abrir uma loja
virtual de sucesso
MAURICIO SALVADOR
AGEN DA
12 a 15/11
FLIPORTO DIGITAL
Local: Olinda
www.fliportodigital.net
A quarta edição da Festa
Literária Internacional de
Pernambuco será realizada na
Biblioteca Pública de Olinda
e abrigará o polo tecnológico
da Fliporto para divulgar e
valorizar obras literárias, seus
escritores virtuais e demais
interessados no ramo digital.
Evento gratuito.
20 e 21/11
BRASIL GAME SHOW
Local: Rio de Janeiro
www.brasilgameshow.com.br
A Rio Game Show, maior feira
de games do país, chega à
terceira edição e passa a se
chamar Brasil Game Show.
O evento deverá receber 20
mil visitantes nos dois dias
e ocupará o triplo da área
utilizada no ano passado,
no Centro de Convenções
SulAmérica.
Ingressos: de R$ 20 a R$ 30.
22/11
FÓRUM NORDESTE
DIGITAL
Local: Recife
www.convergeeventos.com.br/
seminarios/nordestedigital
O evento apresentará
palestras que abordarão
os desafios dos CIOs em
tecnologia da informação,
10
| WIDE | 81 > FRONT
Gramma
www.grammanet.com.br
Como vender por meio das principais
princípios de sustentabilidade,
mobilidade 2.0 para negócios,
Cloud Computing, SaaS e
virtualização, Web 2.0, redes
sociais e muito mais.
Ingressos: de R$ 440 a R$ 550.
29 e 30/11
JUST JAVA 2010
Local: São Paulo
www.sucesusp.org.br/evento_
ver.asp?id_palestra=23
ferramentas para criação de lojas virtuais,
dicas de plataformas de e-commerce,
análise de métricas, gestão de logística,
atendimento aos clientes e muito mais.
JavaScript – Guia do
programador
MAURÍCIO SAMY SILVA
Novatec
www.novatec.com.br
O autor apresenta a linguagem
JavaScript, fornecendo uma
fonte de consulta valiosa das suas
O principal evento da
comunidade Java brasileira
será realizado no Centro
Universitário SENAC e
contará com nove palestras que
passam por temas como Java
no ambiente servidor, Java em
pequenos dispositivos, casos
de sucesso da linguagem, dicas,
problemas e soluções do dia a
dia do desenvolvedor.
Ingressos: de R$ 120 a R$ 150.
funcionalidades focadas nos modernos
conceitos dos Padrões Web.
Google Android
RICARDO R. LECHETA
Novatec
www.novatec.com.br
O autor explica todos os passos necessários
para que o desenvolvedor construa
aplicações para dispositivos móveis, como
localização por GPS e comunicação com
04/12
a internet, com a plataforma open source
Android SDK.
15° EDTED
Local: Recife
www.edted.com.br
O Encontro de Design e
Tecnologia Digital, maior
evento de internet do país,
levará aos pernambucanos
palestras sobre Joomla!,
Tagging, Magento, redes
sociais e muitos outros temas
por meio de profissionais
renomados do mercado.
Inscrições antecipadas com
desconto.
Ingressos: de R$ 24 a R$ 74.
Twitter: chiclete &
camisinha
TAGIL OLIVEIRA RAMOS
Novatec
www.novatec.com.br
Os segredos e as técnicas para ter
sucesso no microblog em uma
linguagem bem-humorada, baseandose numa abordagem de marketing
comportamental (behavioral marketing).
Participe do Fique por dentro! Envie notícias,
curiosidades, sugestões ou críticas para
[email protected].
DIREITO NA WEB
INTE R N ACIO N AL
Gilberto Martins de Almeida
é advogado formado na PUC/RJ, com Mestrado na USP e
cursos em Harvard e no M.I.T. Ex-Gerente Jurídico da IBM,
onde trabalhou por 11 anos, no Brasil e nos EUA. Sócio de
Martins de Almeida – Advogados, escritório especializado.
PROTEÇÃO JURÍDICA
DE NOVAS “FORMAS”
DE NEGÓCIO
Sou webdesigner e estou desenvolvendo uma nova
forma de negócio online, mas que utiliza tecnologias e
técnicas já existentes. O meu diferencial reside apenas
na forma inovadora em como irei usar tais tecnologias
para oferecer um serviço inovador. Gostaria de saber
se posso “patentear” ou garantir algum tipo de
exclusividade nessa minha nova forma de negócio.
Como eu faria isso e como se daria esse “monopólio”?
LEANDRO BARRETO
- [email protected]
A linguagem de negócios e a linguagem jurídica muitas vezes
coincidem, e em outras não. Para um empreendedor, nova
“forma” de negócio costuma ser um novo negócio ou um novo
“jeito” de fazer negócio, o que um juiz classificará como uma nova
ideia ou uma nova forma. Por que o juiz faz essa distinção e em
que ela pode ser útil ao empreendedor?
Simplesmente porque patentes protegem apenas ideias. Embora
o prazo de exclusividade que elas garantem seja curto (17 anos),
protegem contra o surgimento de concorrência, pois abrangem o
núcleo da ideia. Assim, nenhum competidor poderá livremente
copiar a ideia, nem mesmo se quiser vesti-la com outra forma.
No Brasil, ao contrário de nos EUA, a lei (Código da Propriedade
Industrial) é mais restritiva quanto a se poder patentear métodos
comerciais. Portanto, se a ideia se resumir estritamente a um
novo método comercial, as chances de se conseguir uma patente
são maiores no exterior.
Por outro lado, se a nova “forma” de fazer negócio envolver
uma nova ideia de como integrar equipamentos e programas,
ela terá chances de ser enquadrada dentre as chamadas
“patentes de combinação”.
Finalmente, quando um software funciona numa nova ideia
de simbiose com o hardware (por exemplo, o firmware que
testa os componentes do computador durante o processo de
inicialização), ele pode ser patenteado.
E quanto ao código ou look-and-feel de software (inclusive
de webpages ou websites)? Se tiverem originalidade, podem ser
registrados como direito de autor, impedindo livre cópia por terceiros.
Aqui se protege a “forma”. Por isso, novo código ou novo visual podem
ser protegidos ainda que realizem a mesma função de produtos
concorrentes (desde que estes não tenham sido patenteados).
Como se vê, há várias opções, razão pela qual convém uma análise
concreta de em quais dessas possibilidades se pode enquadrar, no
Brasil e/ou no exterior, certa nova “forma” de negócio.
Twitter em
tudo!
LISBOA
Enviado por Erick Rosa
www.leoburnett.pt
É difícil falar de alguma novidade na área digital. Afinal,
tudo envelhece com a velocidade de um “reload”. Mas, vou
arriscar a deixar aqui dicas
que tenho encontrado online
e que devoram horas do meu
dia, os aplicativos que utilizam
o Twitter como conteúdo: o
Tweetdeck (www.tweetdeck.
com) , o Echofon (www.echofon.
com) e o Flipboard (www.
flipboard.com) . O primeiro,
no computador; o segundo,
no telefone; e o terceiro, no
iPad. Agora, há um grupo que
produz conteúdo online que
é genial: The Gregory Brothers
(www.thegregorybrothers.
com) . É difícil explicar o que
eles fazem com tão poucos
caracteres. Procure-os no Google, no YouTube e no iTunes.
E, finalmente, o Toy Camera
montados e aprovados com
mais clareza pelo cliente.
O usuário pode montar o
website com navegação,
rodapé e páginas realmente
dinâmicas interagindo com
templates e funcionalidades
criadas na medida para cada
projeto. A possibilidade de
envio e visualização online
pelo cliente facilita ainda mais
o processo de aprovação,
uma vez que o cliente tem a
opção de enviar comentários
sobre determinadas seções,
áreas ou simples conteúdos
do protótipo.Ficamos grande
parte do desenvolvimento
concentrados nos protótipos,
estudando as ações
dos usuários, testando
posicionamentos, oferecendo
soluções criativas e, então,
uma vez aprovado o protótipo,
tratamos no Photoshop e
seguimos com as etapas
posteriores.
(www.creativeapplications.net/
iphone/toycamera-iphon) , para
o iPhone, que transforma qualquer fotógrafo amador em um
cheio de estilo. Recomendo.
ProtoShare
VANCOUVER
Enviado por Marcio Bonfim
www.opacitydesign.com
Estamos há alguns meses
testando uma ferramenta de
protótipos e interfaces que
tem aumentado a velocidade
dos processos de trabalho: a
ProtoShare (www.protoshare.
com). Estou encantado com
a eficiência e a variedade
disponível de componentes
para que os protótipos sejam
81 > FRONT | WIDE |
11
E MP R E E N D E D O R IS MO
Kauê Linden
Empresário e publicitário, fundou a Hostnet quando tinha apenas 17 anos. Em dez anos de
trabalho, além das atribuições executivas, criou projetos como a Olímpiada de Algoritmos
nacional, que estimula o interesse de estudantes pela área de desenvolvimento de TI, e o
site Artistaderua.com, que visa divulgar artistas que se apresentam em palcos improvisados
nas calçadas de grandes cidades brasileiras.
"SOMOS EMPRESA LEGAL"
Algumas vezes conhecemos
pessoas que são marcantes
pelo que fazem. Foi o que
aconteceu comigo quando
tive a oportunidade de visitar
pela primeira vez uma favela,
juntamente com Jon Maddog
Hall — um dos principais
evangelizadores do movimento
software livre no mundo — e
conhecer um empreendedor
que chama a atenção pelo
seu negócio. Marcelo Balisteri
começou a trabalhar como
vendedor de picolé nas praias do
Rio de Janeiro com apenas nove
anos de idade. Isso bem antes de
a internet se tornar uma febre e o
seu principal ganha-pão. Hoje, ele
não é ainda um milionário e nem
está preocupado com isso, mas é,
sem dúvida, um ser humano de se
tirar o chapéu e um exemplo de
empreendedorismo.
12
| WIDE | 81 > FRONT
Atualmente, seu principal negócio é
prover internet a baixo custo e sem fio para
comunidades que residem em favelas.
Tudo começou quando os primeiros
computadores usados foram doados
pelas patroas das mães de seus amigos.
Na falta de acesso à internet dentro da
comunidade, Marcelo encontrou uma
oportunidade. Aos poucos, juntamente
com um amigo que mais tarde se tornaria
seu sócio, conseguiu uma conexão e,
em seguida, foram expandindo entre
outros moradores da comunidade que
necessitavam de acesso à rede.
Emprega em seu ofício as técnicas do
jeitinho brasileiro, mas sem gambiarra.
Reutiliza antenas antigas de transmissão
de TV e software livre. Compete, segundo
ele mesmo, com grandes empresas de
telecomunicações, mas deixa claro que
seu diferencial é ser local. Garante que
seu suporte é muito mais ágil e não é
restrito ao acesso de internet, além de
sua equipe conseguir chegar à casa de
um cliente com problemas em poucas
horas. Começou na informalidade, mas
hoje exibe seus certificados e CNPJ sem
reclamar dos impostos ou evidenciar
qualquer frustração em toda sua vida
como empreendedor.
Seu sorriso estampado confirma o
orgulho que sente por levar tecnologia,
antes tão restrita, para diversas casas e lanhouses espalhadas pelo morro íngreme
da favela do Parque da Cidade, que divide
o mesmo morro que a Rocinha, a maior
favela do Rio de Janeiro.
Seu trabalho não passa despercebido.
Se no começo correu atrás de
investimento e foi taxado de maluco,
hoje conta com o apoio da incubadora
Gênesis, da PUC-Rio. Seu escritório fica na
associação de moradores. Ele não abre
mão de oferecer gratuitamente internet
para aqueles que exerçam alguma
atividade social na favela em que residem.
Sacou a consideração social?
Com a ajuda da incubadora Gênesis,
Marcelo conseguiu ainda emplacar um
projeto que levará à sua comunidade uma
escola técnica de informática para ajudar
a formar pessoal capacitado ao serviço
de provimento de acesso à internet via
rádio, criação gráfica, desenvolvimento
de aplicativos para a web, gerenciamento
de hotspot para hotéis e restaurantes e
sistema de monitoramento digital.
O empreendedor Marcelo Balisteri
não é famoso, não é rico, não tem
milhares de seguidores no Twitter, não
é convidado ainda para dar palestras.
Mas, já conquistou cerca de 300 clientes
pagantes, firmou parcerias importantes
e mostra orgulho de suas origens.
Recompensa sua comunidade com
um trabalho social. Enquanto alguns
passam a vida reclamando da falta de
oportunidades ou arrumando culpados
e desculpas para seus fracassos, ele
aprendeu a encontrar oportunidades no
meio das dificuldades.
Quer ver Marcelo falando por ele
mesmo? Visite migre.me/1pIg1 e saiba mais
sobre essa personalidade. Todos nós sempre
temos que aprender com pessoas assim.
81 > FRONT | WIDE |
13
Agência
PORTFÓLIO
Criatividade e inovação.
Estas são as marcas da agência Diretta
Com onze anos de estrada, mais de vinte contas ativas
atualmente e uma equipe de dezessete profissionais, a Diretta
consolidou-se em 2010 como uma agência full service visando
ampliar a atuação no mercado online.
Unindo a criatividade com a excelência em
planejamento, Daniel Perrone, oriundo do mercado
publicitário, e Peu Reis, que trabalhava em mesa de
operações de Bancos, resolveram, em 1999, fundar
a Agência Diretta. Com o legado do trabalho de
Daniel em agências como DPZ, McCann Erickson
e Foot Cone & Belding, a Diretta, em seu primeiro
ano, atuava apenas offline. Em 2000, a agência
percebeu o grande potencial que o mercado online
oferecia e se dedicou a estudar com mais detalhe a
comunicação que crescia aos poucos na internet.
“A Diretta criou um modelo de atuação no
mercado digital e, de lá para cá, a equipe foi crescendo
à medida que as contas vinham. Atualmente, a
agência possui mais de vinte contas ativas (muitas
delas com mais de cinco anos de casa) e é vista
por seus clientes como um grande polo criativo
e de estratégia digital. No ano de 2010, a Diretta
posicionou-se como full service agency para ampliar
a atuação no mercado online e conta com dezessete
profissionais, escolhidos a dedo e de acordo com as
habilidades que a agência oferece dentro do cenário
nacional”, conta Daniel Perrone, destacando a visão
que a agência tem sobre o mercado.
“Há muito o que explorar no mercado digital
brasileiro. Existe espaço para todas as agências,
mas haverá uma segmentação natural de estilos,
definições e objetivos entre cada uma delas. A
Diretta se posta como agência “full line” criativa e
acredita que o impacto causado pelos seus trabalhos
deve ser semelhante à primeira visita a um parque
de diversões, como a Disney World. Sem uma grande
experiência inovadora ou criativa não há impacto,
por consequência não há reciprocidade do target
para o cliente”, afirma.
Diretta
ANO DE FUNDAÇÃO 1999
NÚMERO DE FUNCIONÁRIOS 17
UMA RÁDIO SERTANEJA, UM GAME VIRAL E UM SITE
CIDADE-SEDE São Paulo (SP)
que mostra todas as etapas do circuito de rodeio
promovido pela própria marca, que trabalha essa
parte de eventos ao longo dos anos. Esses três canais
foram desenvolvidos pela Diretta ao portal chamado
“Sertanejo Bavaria”, que está sendo produzido dentro
do MySpace e será a principal landing page para a
campanha de mídia, que terá como principal mote a
música sertaneja.
Sobre o JavaScript, a biblioteca jQuery foi utilizada
preservando o markup limpo e acessível. “Graças ao
jQuery foi possível fazer animações suaves. A mudança
entre páginas, barras de rolagem, imagens randômicas
da home, fotos ampliando na galeria, logos em etapas
anteriores e validação do formulário são exemplos do
uso da tecnologia”, relata.
SITE www.diretta.com.br
E-MAIL [email protected]
TWITTER @direttabr
14
| WIDE | 81 > DESIGN
CIRCUITO BAVARIA
www.circuitobavariaderodeio.com.br
Sobre a tecnologia
PHP + HTML5 + JAVASCRIPT (JQUERY) + AJAX + FLASH
Montagens das páginas em HTML5 e jQuery, com
gerenciamento de conteúdos via PHP. Diversos plugins de
jQuery auxiliaram na construção do website. Os flashs foram
inseridos de maneira não obstrutiva, para que apareça, em
forma de imagem, nos dispositivos que não dão suporte para a
tecnologia (como iPhone).
POP UP
www.popupstore.com.br
OUTRO PROJETO DESENVOLVIDO PELA DIRETTA foi o
case da marca Pop Up Store, que consiste em um portal
em Flash. Nele, concentra-se toda a parte institucional
da marca no meio digital, um blog com as novidades e o
acesso às redes sociais Twitter e Facebook.
“A proposta da Pop Up Store, da empresária Fabiana
Justus (filha do Roberto Justus), era ter uma presença
extremamente jovem no meio digital, pois esta seria
sua principal ferramenta de comunicação junto às suas
clientes, em sua maioria mulheres entre 16 e 35 anos,
antenadas com moda, tecnologia e uso das ferramentas
sociais. A Diretta recebeu do cliente apenas o logotipo
da empresa e foi incumbida de desenvolver toda a
identidade e a comunicação”, conta Perrone.
Sobre a tecnologia
FLASH + FLASH VIDEO + PHP
O Flash AS2 é a base do site, integrando todos os atalhos para o conteúdo da marca
na internet. Já o PHP é utilizado para fazer o cadastro de usuários que queiram
receber a newsletter e para mostrar a última mensagem do Twitter da Pop Up.
81 > DESIGN | WIDE |
15
Freelancer
PORTFÓLIO
“Me inspiro em tudo que vejo,
sem limitações”
Com foco em produções de interfaces digitais e de interações,
Jorge Brivilati trabalhou em algumas das principais agências de
publicidade no Brasil, como AlmapBBDO, Publicidade Interativa e
CUBO.cc. Atualmente, é diretor de arte da JWT Brasil.
Pode-se dizer que um vendedor de cursos de
informática foi o maior responsável na escolha
profissional de Jorge Brivilati, que atualmente
estuda cinema e se encontra focado em criações
audiovisuais e interações.
“Fazia eletrônica no 2º grau e me preparava para
seguir na carreira de biologia marinha quando me
deparei com um vendedor de cursos de informática
ligando para minha casa e oferecendo um desconto
em cursos de webdesign, por indicação de uma
prima minha. Assim, comecei a fazer um curso de
Photoshop, Fireworks, Pagemaker, Dreamweaver
etc. Já existia a necessidade de trabalhar com alguns
softwares, pois fotografava desde cedo, então sempre
buscava mais técnicas para melhorar as fotos.
Interessei-me tanto que, em pouco tempo, estava
ministrando cursos na mesma instituição. Estudava
bastante em casa e fiz cursos de design gráfico; em
contrapartida comecei a ir mal na escola pelas noites
perdidas fazendo layouts — experimentava bastante.
Comecei a fazer alguns freelas para familiares e
clientes externos. Daí para a frente, vi que estava
fazendo algo de que realmente gostava e até levava
jeito — segui carreira”, conta.
Jorge Brivilati
E-MAIL [email protected]
SITE www.brivilati.com
TWITTER @brivilati
16
| WIDE | 81 > DESIGN
Sobre suas referências criativas, Jorge tem uma
gama extensa de fontes. “Inspiro-me em tudo que
vejo, sem limitações. Seja um gráfico de jornal, uma
diagramação de revista, um character generator de
um programa de TV, a direção de arte de um filme…
Muita inspiração vem de fontes fotográficas, já que
é outra paixão — busco bastantes referências em
composições, atitudes e cores. Outra fonte são as
telas e os muros pintados por designers, desenhistas
e ilustradores que estão espalhados pela internet,
por ruas e galerias. Procuro me basear, também, nos
próprios amigos que trabalham comigo e que acho
ter um padrão de qualidade muito elevado; a troca de
ideias com eles é algo constante.”
A KIBON, EMPRESA NO MERCADO DE SORVETES,
resolveu apostar em dois tradicionais bombons
(Sonho de Valsa e Ouro Branco) numa campanha
que tinha como objetivo atingir o público feminino.
“Tendo em vista nosso público, que era basicamente
mulheres, decidi criar um ‘sonho gelado’, como se
estivéssemos numa plataforma mágica, nas nuvens;
usando algo que as agradasse visualmente, por meio
de cores, movimentos, fumaça e traços. As cores
foram escolhidas pois, além de estarem em harmonia
com os produtos, eram ótimas para se trabalhar
juntas”, conta Jorge, que também comenta as etapas
de produção da campanha:
“Este projeto passou por todo um estudo dessas
áreas, iniciando pela arquitetura. Como raramente
temos tempo hábil para fazer testes de usabilidade
pós-criação, fizemos durante o processo de criação,
investigando o que poderia ou não ser confuso
ou usável no site. Dentre todos esses processos,
demoramos por volta de quatro semanas para lançar
o site inteiro no ar.”
BOMBOM DE COLHERADA
http://brivilati.com/kibon.html
Sobre a tecnologia
FLASH + AS2 + PHP + AFTER EFFECTS + PHOTOSHOP +
ILLUSTRATOR + MAYA
“A necessidade de tornar o site dinâmico, tanto em movimento
quanto em interação, nos levou a utilizar tais programas e
linguagens”, relata Jorge.
PÁSCOA CHOCOLOVERS
http://brivilati.com/choco.html
O SITE CHOCOLOVERS TINHA COMO OBJETIVO ser
um receptivo para a promoção da Nestlé na época
da Páscoa, quando o usuário participava por meio
de SMS’s. “Precisávamos mostrar de forma fácil como
participar, os prêmios e com quais códigos o usuário já
estaria participando. Por meio de mídia online, PDVs
e o próprio site da Nestlé, o convidaríamos até o site”,
explica Jorge.
Jorge Brivilati também conta detalhes referentes
ao processo criativo do projeto. “Primeiro de tudo,
precisávamos pensar em um jeito de alinharmos
todos os meios de comunicação para criarmos uma
identidade do projeto. Daí, depois de alinharmos tudo,
comecei o layout, estudando cada sessão do site e
como usaria alguns elementos fundamentais nele.”
Sobre a tecnologia
FLASH + PHOTOSHOP + ILLUSTRATOR + AS3 + PHP
“Por ser um site com muitos elementos divertidos e coloridos, precisávamos de
movimento para lhe dar vida, para o usuário entrar no universo de uma ‘fábrica
maluca’ de chocolates. Nada melhor que usar Flash para criar esse ambiente e, ao
mesmo tempo, torná-lo leve e com boa taxa de processamento, incluindo o loading,
que também tinha um movimento legal, muito bem animado”, revela Jorge.
81 > DESIGN | WIDE |
17
Ilustração
PORTFÓLIO
Guto Lins
Designer e professor do Departamento de Artes e Design da
PUC-Rio, Guto Lins tem ampla experiência no mercado editorial,
fonográfico e de entretenimento. É autor e ilustrador de livros
infantis, e seu trabalho é reconhecido com o selo “Altamente
Recomendável” da Fundação Nacional do Livro Infantil e Juvenil.
WIDE Como define seu estilo?
GUTO O que norteia tudo é o design. Fui
aprendendo a desenvolver linguagens e
idiomas diversos, já que os discursos e os
receptores também mudam. Cada projeto,
cada texto, cada momento histórico pede
uma solução específica. Já tive, inclusive,
a oportunidade de reeditar textos meus
em outra editora e anos depois. Em alguns,
mantive a solução original e, em outros,
parti para técnicas e resultados diversos.
Até diametralmente opostos.
WIDE Onde você busca referências para o
seu trabalho?
GUTO Como diz a lenda, o processo
intelectual se divide em 10% de
inspiração e 90% de transpiração. Os
links filosóficos correm lado a lado ao
aproveitamento econômico da peça
final e o resultado plástico tem que
atingir às expectativas. Cada projeto
pede referências específicas, as quais
podem ser desde publicações oficiais até
soluções estéticas dirigidas, a princípio,
para áreas diversas. O segredo é ir
acumulando tais REFERÊNCIAS: páginas
de revistas, fotos, sites…
Guto Lins
E-MAIL [email protected]
SITE www.manifestodesign.com.br
18
| WIDE | 81 > DESIGN
MÃE
(2008)
Cliente Projeto pessoal. Livro Mãe.
Técnicas Colagem digital sobre ilustração vetorial.
ARROTO
(2004)
Cliente Ilustração para o livro Manual de boas
maneiras.
Texto: Guto Lins / Editora: Jorge Zahar / 2004.
Técnicas Colagem de objetos + foto + aplicação de
elementos digitalmente.
MACHÃO (2000)
Cliente revista Domingo (Jornal do Brasil).
Técnicas Colagem digital.
FUMANTE (1995)
Cliente revista Marie Claire.
Técnicas Pastel a óleo, aquarela, lápis de cor e
lâmina de barbear.
81 > DESIGN | WIDE |
19
Lente Digital
PORTFÓLIO
Alexandre Cavalheiro
Formado em design gráfico e fotografia, Alexandre Cavalheiro
atualmente presta serviço para a agência Markplan, na qual já
realizou diversos trabalhos para clientes de grande porte, como
Samsung, LG, Coca-Cola, Chevrolet etc. Além da agência, possui o
seu próprio estúdio de design, onde é diretor de arte e desenvolve
atividades profissionais e experimentais.
WIDE Ângulo, iluminação, textura, movimento, corte…
O que mais se destaca no seu trabalho?
ALEXANDRE Observar silhuetas, texturas e como a
luz pode trabalhar a nosso favor. Agradeço ao design
gráfico e à web por essa posição orientalista que dá
valor à unidade absoluta entre imagem e espectador.
Para o meu trabalho, a fotografia é espontânea de
uma atenção visual perpétua, que segue naquele
momento a sua eternidade. O design, por seu
grafismo, elabora aquilo que a nossa consciência
procurou naquele instante. A foto é uma ação
imediata; o desenho, uma contemplação. Viajar
Alexandre Cavalheiro
E-MAIL [email protected]
SITE www.estudiotrac.com.br
20
| WIDE | 81 > DESIGN
para vários lugares me ajudou muito a refinar minha
percepção daquilo que vejo e registro.
Gosto muito de levar as pessoas aos lugares através
das minhas imagens; a fotografia tem esse papel.
Lanternas Lyon França
Câmera Canon Eos 450d
Objetiva 18-55 mm - Velocidade 1/125s f:11
Bellecour Lyon França
Câmera Canon Eos 450d
Objetiva 18-55 mm - Velocidade 1/125s f:11
Tram Geneve Suiça
Câmera Canon Eos 450d
Objetiva 18-55 mm - Velocidade 1/3s f:5.6
Janelas Roma
Câmera Canon Eos 450d
Objetiva 18-55 mm - Velocidade 1/350s f:5.6
81 > DESIGN | WIDE |
21
Fontes de Inspiração
PORTFÓLIO
Fabio Lopez
Designer por formação e mestre pela ESDI (Escola Superior de
Desenho Industrial da UERJ), Fabio Lopez trabalha desde 1998
com pesquisa e desenvolvimento de fontes digitais e tem projetos de design gráfico apresentados em exposições e publicações
nacionais e internacionais. Em 2010, foi o jurado brasileiro da
Tipos Latinos – 4ª mostra latino-americana de tipografia. Fabio
também é freelancer em projetos de identidade, lettering, moda e
ilustração, e pratica design subversivo nas horas vagas.
WIDE Como surgiu a ideia de criar esta fonte?
transmissão da mensagem?
uma pesquisa sobre o processo de criação de fontes
de texto. Para ilustrar esse levantamento, peguei
um projeto tipográfico de minha autoria — a fonte
Colonia — e o refiz totalmente, aplicando os diversos
parâmetros técnicos coletados na pesquisa. A fonte
foi inteiramente remodelada e essa tarefa constituiu
a parte prática do meu trabalho de graduação.
Tipograficamente, é um projeto completo, mas sua
importância maior reside em ter sido um laboratório
de tipografia, servindo ainda hoje como um bom
ponto de apoio para estudantes e designers. Em
2003, realizei algumas modificações e ampliei a
família e, no ano seguinte, a fonte participou de
algumas mostras e publicações, tendo sido destaque
na 7ª Bienal de Design Gráfico da ADG.
FABIO Podemos entender uma tipografia como
Fabio Lopez
E-MAIL [email protected]
SITE www.flopez.com.br
TWITTER @flopezdesign
22
| WIDE | 81 > DESIGN
WIDE De que maneira o design de tipos influencia na
FABIO Meu trabalho de graduação na faculdade foi
sendo o tom de voz empregado para dar sonoridade
ao texto. Quando optamos por uma fonte tradicional,
por exemplo, estamos associando uma bagagem
cultural específica a essa mensagem e, por
consequência, relacionando o conteúdo do texto
a uma carga semântica particular e bem definida.
Quando optamos por usar uma tipografia mais
contemporânea nesse mesmo texto, as associações
são diferentes e a mensagem também tem seu
caráter modificado. A tipografia não tem o poder de
mudar o texto, mas pode interferir na percepção
da mensagem a partir de relações subjetivas
estabelecidas na sua estrutura formal. Nós, designers,
somos treinados para fazer isso de maneira precisa,
conduzindo os leitores pelas trilhas visuais que
deixamos no texto.
81 > DESIGN | WIDE |
23
Arte +
tecnologia
O universo das composições de imagens
Por Tiago Bosco
Por meio de programas gráficos, o designer encontra-se diante de um
universo amplo para manipular qualquer tipo de figura através da arte. Essa
é a composição de imagens, artifício explorado de maneira recorrente pelos
profissionais na web.
A primeira lição
Helena de Barros
24
| WIDE | 81 > DESIGN
DESIGN
A
rtistas que marcaram época, como
Leonardo da Vinci e Michelângelo, por
exemplo, eternizaram-se pelas suas
belas pinturas à base de pincel e tinta.
Desde o período do Renascimento,
alguns séculos se passaram. Hoje, muitos artistas têm a tecnologia
a serviço da própria arte. É nesse contexto em que a composição
de imagem se insere no trabalho dos designers. Por meio dela, a
criatividade artística alinha-se com programas gráficos, proporcionando, assim, diversas possibilidades para o resultado de uma
determinada imagem.
Fernando Bittar, um dos diretores de arte da agência Gringo
(www.gringo.nu) , define o que é composição de imagem. “É o
processo de organizar diferentes elementos visuais com o
objetivo de compor uma segunda imagem a partir deles.” A
designer Marcela Rezende (www.marcelarezo.com), especialista
em composição, comenta o trabalho que desenvolve. “Defino o
trabalho que faço como a criação de cenários virtuais mediante a
fusão de diferentes imagens e contextos. É como se fosse a criação
de um mundo fictício, ou até mesmo irreal, por meio da junção de
diversas referências fotográficas. Esse trabalho se realiza através
da composição propriamente dita e, junto a ela, agregamos os
ajustes de cores, tons, luminosidade, proporção, escala dos
objetos, o ângulo de tomada e a perspectiva de cada elemento que
compõe a cena. Tudo isso possibilita um realismo enorme, criando
possibilidades de executar muitos trabalhos que às vezes seriam
impossíveis de realizar por motivos funcionais e organizacionais.
Em alguns casos, a fusão de imagens nos possibilita até a criação
de mundos inimagináveis e inexistentes.”
Um questionamento muitas vezes recorrente entre os
profissionais que trabalham com composição de imagens é até
onde vai a liberdade artística de criação. A designer gráfica Helena
de Barros (www.helenbar.com) comenta as variantes que podem
ocorrer, dando como exemplo o que ela desenvolve. “O trabalho que
realizo de fotomontagem é um trabalho artístico, com motivações
pessoais, no qual tenho liberdade total para fazer o que quiser. Num
trabalho de design, a abordagem seria outra, com as restrições do
briefing e de contexto relacionadas a cada caso específico. Quando
se trata de um trabalho de design, é importante que o profissional
saiba adequar sua linguagem e seu estilo para valorizar o conteúdo
e o discurso do trabalho em questão.” Flavio Albino, um dos sócios
da agência Platinum (www.platinum.com.br) , especializada em
composição de imagens, explica o limite da liberdade de criação.
“Depende do cliente. Tivemos casos de não ter qualquer tipo
de liberdade, ou seja, executar o layout pré-aprovado, e tivemos
casos em que fomos contratados para inclusive criar os layouts e
dar ideias, como no caso da Disney. A agência que tinha a conta
dos parques da Disney estava há quase um ano tentando aprovar alguns layouts sem sucesso. Eles nos passaram o briefing do
trabalho e pediram que sugeríssemos um layout. Fizemos um
brainstorm e começamos o processo de criação das imagens praticamente do zero”, comenta.
Como em todo trabalho, algumas regras devem ser respeitadas
visando a um bom resultado final. Em se tratando de composição
de imagem, não é diferente. Flavio Albino destaca a importância
de coerência entre a luz e os ângulos. “Sem isso, nenhuma composição vai ficar real”, afirma. Marcela Rezende aponta o bom senso
estético somado a alguns recursos, como a Regra dos Terços, a profundidade de campo, a diferenciação pela cor e a perspectiva. “Tem
que existir uma relação confortável para os olhos entre o objeto e a
cena”, analisa. Já Helena de Barros enumera algumas regras básicas
para composições realistas:
“As regras só existem quando se procura simular uma composição realista. Nesse caso, o principal é realizar recortes bem acabados, ter imagens com resoluções compatíveis dentro da escala
em que serão utilizadas, manter critérios coerentes de proporção,
profundidade focal e de iluminação entre os elementos. Mas, se a
composição não for realista, o que importa mesmo é o conceito, o
estilo e a linguagem, o impacto da imagem como um todo.”
Com o desenvolvimento da tecnologia, máquinas fotográficas
digitais e softwares gráficos acabaram se tornando facilitadores no
trabalho dos designers. Sob essa perspectiva, quais as armadilhas
As melhores ferramentas
para esse tipo de trabalho são
o nosso cérebro, mãos e olhos
Helena de Barros
Demeter - Helena de Barros
81 > DESIGN | WIDE |
25
DESIGN
É importante que o
designer saiba adequar sua
linguagem e seu estilo para
valorizar o conteúdo e o
discurso do trabalho em
questão Flavio Albino
Vela d’água - Agência Platinum
Caravela
Agência Platinum
que os profissionais devem evitar para que um projeto não deixe
de ser inovador? Para Fernando Bittar, achar que o domínio da
ferramenta é o principal fator no sucesso de um trabalho é um
grande risco. “Isso pode ajudar muito, como um catalisador, no
processo. Mas, no fim das contas, o que realmente importa é a ideia
inicial, a mensagem ou a história que você quer contar em cada
trabalho.” Opinião compartilhada por Flavio Albino: “Não deixar que
os limites das ferramentas (softwares, máquinas digitais etc.) sejam
os seus limites. As ferramentas estão ali para viabilizar a sua ideia, e
não para limitá-la. Isso acontece com certa frequência na Platinum
26
| WIDE | 81 > DESIGN
até pelas nossas imagens serem tão complexas e inovadoras. Muitas
vezes começamos um trabalho sem ter ideia de como vamos
executá-lo, mas sabemos que temos que dar um jeito e, com isso,
a gente cria várias soluções inusitadas. Não declinamos desafios,
gostamos deles porque nos obrigam a pensar e a criar”, analisa.
Helena de Barros destaca a capacidade humana, que, para ela,
sobrepõe-se a qualquer ferramenta. “As melhores ferramentas para
esse tipo de trabalho são o nosso cérebro, mãos e olhos. Os problemas e as questões de uma imagem são criados e propostos por nós
mesmos e somos os únicos capazes de solucioná-los”, afirma.
Ethonic - Marcela Rezende
Boxing
Marcela Rezende
PROGRAMAS GRÁFICOS E CURSOS ESPECÍFICOS
Um bom curso é o primeiro
passo para quem quer
trabalhar com composição
Marcela Rezende
Para quem inicia nesse universo de composição de imagem ou
mesmo para aqueles que têm curiosidade, é comum se perguntar
qual o melhor programa gráfico a ser utilizado. Nesse quesito, o os
programas da Adobe são unânimes entre os especialistas. “Existem
muitos softwares de 3D, cada um é forte em uma coisa, então vai
do gosto pessoal de cada profissional. Mas, o Photoshop é o que vai
unir tudo”, afirma Flavio Albino, opinião compartilhada por Helena
de Barros: “Considero os programas da Adobe muito consistentes
e bem construídos. Talvez não sejam os melhores para quem está
começando, mas com paciência e prática, são excelentes para se
desenvolver um bom trabalho”. Fernando Bittar também destaca
os programas da Adobe, mas faz uma ressalva importante: “O
software geralmente é indiferente para o sucesso de um trabalho,
81 > DESIGN | WIDE |
27
DESIGN
os princípios básicos podem ser aplicados em qualquer programa.
Mas, particularmente, utilizo os da Adobe. Photoshop e Illustrator
são dois que estão sempre presentes no meu dia a dia”, explica.
Cursos específicos sobre composição de imagem também são
importantes para a capacitação de um profissional. É o que orienta
Marcela Rezenda: “Um bom curso é o primeiro passo para quem quer
trabalhar com composição. Dominar o software é fundamental. As
técnicas utilizadas nesse tipo de trabalho geralmente são ensinadas
em módulos avançados de cursos. Para quem pretende iniciar na
área de manipulação de imagens, indico os cursos certificados pela
Adobe.” Fernando Bittar explica que os cursos também podem
contribuir para o desenvolvimento da prática profissional. “Cursos
na área são interessantes não só pelo aprofundamento teórico, mas
também como uma oportunidade de praticar esses princípios sem
a pressão de prazos, clientes etc.”, finaliza.
O software geralmente é
indiferente para o sucesso
de um trabalho, os
princípios básicos podem
ser aplicados em qualquer
programa Fernando Bittar
Radio Levi’s - Agência Gringo
Under - Agência Gringo
28
| WIDE | 81 > DESIGN
81 > DESIGN | WIDE |
29
Ser
freelancer
Como planejar, administrar
e organizar suas tarefas
Por Tiago Bosco
A Wide conversou com André Beltrão, autor do livro Manual do freela: Quanto
custa meu design?, lançado recentemente pela editora A2B. Beltrão nos conta
detalhes sobre o trabalho do profissional freelancer, com dicas e sugestões, e
ainda comenta sobre a sua mais nova publicação.
30
| WIDE | 81 > DESIGN
DESIGN
André Beltrão
André Beltrão dirige a agência Creamcrackers (www.creamcrackers.com.br), onde coordena projetos de identidade visual,
merchandising e embalagem. É designer gráfico graduado pela PUC-Rio, MBA Excecutivo em Marketing pelo Ibmec-RJ e
professor dos cursos de Design e Publicidade da UniverCidade-RJ - E-mail: [email protected]
WIDE De onde partiu a ideia de lançar o livro Manual do freela:
Quanto custa meu design?
ANDRÉ A ideia de criar a coleção Manual do freela surgiu nos
workshops que organizamos no Studio Creamcrackers, de 2006
a 2008, e nas oficinas que ministrei em encontros de estudantes.
Eles foram pensados para cobrir uma lacuna que havia, fazendo a
ponte entre os programas de empreendedorismo, marketing e os
conhecimentos de design para dar algumas ferramentas a mais
para aqueles que querem se lançar no mercado.
WIDE Muitos iniciantes na profissão devem se perguntar como
fazer para conseguir seus primeiros trabalhos freelas. O que você
diria para esses jovens profissionais?
ANDRÉ É preciso criar uma rede de contatos, cultivar uma postura ética e buscar o máximo de conhecimento profissional em
sua área e em áreas afins. É importante montar um portfólio
consistente e ser autêntico. Um dos próximos Manuais do freela será exatamante sobre esse assunto, e está sendo preparado
pelo Bruno Porto, que atualmente leciona Design na China. Será o
manual de autopromoção.
WIDE Vale a pena ser freelancer? Até que ponto? Dá para se viver
somente com essa função?
ANDRÉ Vale sim, se você for disciplinado, perseverante e organi-
zado. É bom não ter chefe, mas ao mesmo tempo você tem diversos chefes (cada cliente, até certo ponto, é seu chefe). É bom poder
ganhar mais se você trabalhar mais, porém não ter salário fixo
é algo que traz preocupações. Depende muito de onde se quer
chegar e os riscos que se está disposto a correr. Dá para viver dos
freelas, sim, mas o caminho natural é evoluir para uma agência
depois de algum tempo.
WIDE Com toda a sua experiência, quais as maiores dificuldades encontradas pela maioria dos designers que trabalham
como freelancer?
ANDRÉ Acho que a maior dificuldade é sempre financeira. O freela
O caminho natural é evoluir
para uma agência depois de
algum tempo
está mais sujeito às flutuações do mercado, como crises, altas etc.
Se não se planejar bem, pode cair naquela armadilha de passar
alguns meses com muitos trabalhos, sem tempo de procurar
novos projetos e, em seguida, ficar meses com poucos trabalhos
e já tendo gastado o que conseguiu nos meses anteriores. É
importante ser organizado e planejado.
WIDE No livro você afirma que “ser eficiente é manejar essas três
variáveis: tempo, dinheiro e qualidade”. Você poderia nos contar
e detalhar melhor como obter sucesso dessa forma?
ANDRÉ O conceito diz que ganhamos em eficiência quando conseguimos fazer algo mais rápido sem prejudicar a qualidade nem
cobrar mais por isso; quando conseguimos melhorar a qualidade
sem levar mais tempo para fazer, e pelo mesmo custo; e quando
conseguimos lucrar mais sem prejudicar a qualidade nem levar
mais tempo para fazer. As três têm a ver com gerar mais recursos,
otimizar o trabalho e superar as expectativas dos clientes.
WIDE Você também apresenta que o freelancer deve ter
noções de administração, marketing, contabilidade etc. Na sua
opinião, qual a melhor maneira de o profissional adquirir essas
habilidades?
ANDRÉ A meu ver, quem quer ser um bom profissional de design,
freela ou não, precisa complementar sua formação com algumas matérias de outras áreas de conhecimento, como psicologia social, marketing e administração. Pode fazer isso cursando
81 > DESIGN | WIDE |
31
André Beltrão preparou para a Wide dez dicas para
o designer freelancer obter sucesso na profissão.
1. Seja você mesmo;
2. Procure conhecer o que seu cliente faz;
3. Procure trabalhar com clientes e produtos de que você
goste ou com os quais se identifique;
4. Seja planejador;
5. Seja controlador (não dependa dos outros);
6. Seja analítico (perceba o que está acontecendo, tire
conclusões);
7. Seja econômico;
8. Seja organizado;
9. Busque aprender sempre mais;
10. Saiba se vender.
É preciso acreditar no
que você está fazendo e
em si mesmo
Não necessariamente nessa ordem.
matérias eletivas na universidade, cursando uma pós-graduação
ou mesmo fazendo cursos de extensão.
WIDE “Design é uma profissão essencialmente empreendedora,
mas os estudantes de design não estão acostumados a práticas
de gestão.” Com base nessa sua afirmação presente no livro, o
que os estudantes de design podem fazer para obter um melhor
desempenho, alinhando prática profissional e gestão?
ANDRÉ Precisam primeiramente conseguir administrar seu
tempo e, em seguida, planejar o que querem ser, definir metas e
esboçar planos de estratégia para atingi-las. Em paralelo, estudar
e fazer cursos complementares. Recomendo começar depois de
ter se preparado um pouco.
WIDE Quais tipos de cursos você indicaria a um profissional
freelancer?
ANDRÉ Para quem quer trabalhar sozinho ou abrir uma agência,
além das áreas de conhecimento complementar mencionadas
antes, recomendo alguns cursos oferecidos pelo Sebrae, por
32
| WIDE | 81 > DESIGN
exemplo, o de como iniciar um negócio, de atendimento e
o Empretec. Esses cursos são motivadores e, enquanto os
acadêmicos fornecem informações teóricas e conhecimentos de
base, estes transmitem informações práticas.
WIDE Quais os fatores que devem ser levados em consideração
pelo freelancer, para que ele calcule corretamente o custo de um
projeto e cobre da forma mais adequada?
ANDRÉ 1) Saber quais os custos e as despesas mensais ele tem ou terá
em um futuro próximo, para saber o custo de sua hora de trabalho e
o de sua estrutura.
2) Saber delimitar a extensão do trabalho para avaliar o tempo
necessário. Isso ele pode obter na reunião de briefing, que permitirá
prever o tempo e multiplicar a previsão pelo custo-hora para
descobrir o gasto.
3) Precisa buscar informações sobre os produtos do cliente e sobre
a estrutura da empresa. Isso pode ajuda a prever, por exemplo, se o
seu contato é que aprovará o projeto ou se há uma estrutura muito
verticalizada onde o contato não tem grande força — isso ajuda
Neste livro, André Beltrão
mostra de maneira divertida,
concisa e didática os segredos
para a gestão eficiente da
carreira do freelancer.
São muitas – e fundamentais
– as dicas: como alocar os
diversos custos fixos e também
os variáveis de cada projeto; de
que forma calcular juros para
parcelamentos; quando dar
descontos; qual a hora ideal de
abrir uma empresa; dicas para
se relacionar com os clientes
(inclusive com os difíceis) e
como valorizar o seu trabalho
e administrar trabalho/vida
pessoal, sem dramas.
a prever se haverá mais ou menos riscos de retrabalho e o papel
econômico que seu projeto terá para a organização e, em função
disso, estipular a margem de reserva de tempo e de lucro desejadas.
4) Saber como é a política de pagamento/faturamento do cliente para
definir os percentuais de impostos e as taxas a incluir no preço.
WIDE Qual o recado que você deixaria para os jovens designers
que pretendem seguir uma carreira como freelancer?
ANDRÉ É preciso acreditar no que você está fazendo e em si
mesmo. Busque oportunidades, seja proativo e participativo;
o sucesso de seus clientes será o seu. Tenha paciência,
determinação e mande ver!
80
81 > DESIGN | WIDE |
33
M
N
I
E
D
A
L
I
Z
A
R
B
Encarado o desafio de uma experiência internacional
Uma experiência internacional é garantia de amadurecimento e
valorização profissional? Qual o diferencial que a vivência no exterior
faz na carreira e no currículo? Profissionais brasileiros contam detalhes
de suas experiências profissionais fora do país e orientam aqueles que
desejam encarar o desafio
34
| WIDE | 81 > DESIGN
Ilustração - Carolina Vigna-Marú
DESIGN
OPINIÃO
Caio Lazzuri
Diretor de arte da Goodby, Silverstein & Partners,
nos EUA.
www.goodbysilverstein.com
A capacidade de se adaptar e produzir em cenários e situações
diferentes é essencial para quem trabalha com comunicação,
especialmente quando o foco é comunicação digital.
Trabalhar fora da sua zona de conforto faz com que você se
torne um profissional mais versátil.
Além da chance de aprender sobre novas culturas, é obrigatório
que você se familiarize com a cultura corporativa de onde quer que
você esteja, o que, consequentemente, expande seu repertório.
A parte internacional de minha carreira começou em 2003 em
uma região não muito convencional.
O primeiro chamado foi para um freela para a operação da
telecom britânica Vodafone no Oriente Médio. O trabalho era focado
nos países do Golfo Persa. Especificamente Bahrain e Kuwait.
Após os primeiros meses, nossa abrangência se estendeu para o
Líbano, em Beirut, e outros treze países na África. Resultado, o “freela”
se estendeu por dois anos, em que eu dividia meu tempo morando
entre Beirut e Bahrain. Em 2005, após o assassinato do então
primeiro ministro Rafik Hariri, a frágil estabilidade libanesa foi pro
buraco e a escalada no número de atentados à bomba atingiu meu
bom-senso em cheio e me fez voltar para o Brasil.
Passei quase um ano em São Paulo, onde, junto com amigos e
ex-parceiros de trabalho, começamos uma divisão de novas mídias
dentro de uma produtora de publicidade tradicional, a Academia de
Filmes. De lá para cá, a Academia mudou de nome para Margarida e
nosso departamento virou a Colmeia, empresa que tem feito muita
coisa legal aí no mercado brasileiro.
Durante esse período, recebi uma proposta da AKQA, agência
digital responsável por grandes campanhas para grandes marcas,
como Nike, Xbox, Visa, entre outras. A ideia era viver e trabalhar em
São Francisco, Califórnia. Topei e me mandei novamente do Brasil.
Trabalhei na AKQA por dois anos, de 2006 a 2008, quando tive
a oportunidade de participar de produções incríveis para grandes
clientes e, o que é mais importante, cercado de gente interessante e
muito competente. O que mais me impressionou nesse momento
foi o quão madura a estrutura da empresa me pareceu: o processo,
a atenção aos detalhes e o compromisso real com a qualidade do
produto final. Além disso, o óbvio: prazos e verbas mais razoáveis
em comparação ao mercado brasileiro.
Depois de um determinado período, o modelo híbrido da AKQA
(agência + produtora) acabou por limitar minha capacidade de
produzir com a qualidade necessária. No caso da Nike, por exemplo,
a maioria do trabalho era guiado pela ideia principal da AOR
(Agency of Record), nesse caso, da Wieden+Kennedy. Eram eles os
detentores dos assignments maiores, e isso me despertou o interesse
em trabalhar para um tipo de agência mais tradicional e com um
leverage maior com os clientes.
Foi então que recebi o convite da Goodby, Silverstein & Partners,
onde trabalho hoje em dia. Agência extremamente criativa,
mundialmente relevante e, apesar da origem tradicional, muito bem
articulada nas disciplinas digitais. Além se ser um grupo de rockstars de diversos países diferentes (tem gente de 39 países por aqui).
Entre Brasil, Bahrain, Líbano e EUA, as diferenças culturais não
poderiam ser maiores, porém os objetivos profissionais são, de certa
forma, similares. Todos nós estamos sempre em busca da excelência
máxima, tanto conceitualmente quanto do ponto de vista de
execução e, consequentemente, resultados.
Uma diferença marcante entre o modo de produção brasileiro e
americano é a seguinte: brasileiro tem muito torque, porém não tem
muita estamina. E o americano é absolutamente o contrário. Em São
Paulo é tudo muito rápido, não somos treinados para trabalhar em
projetos de longa duração. Consequentemente, é fácil para quem sai
do Brasil para trabalhar no mercado norte-americano, por exemplo,
frustrar-se com a quantidade de reuniões e a extensão dos projetos.
DICAS PRA QUEM QUER TER UMA EXPERIÊNCIA NO EXTERIOR:
Pense no lugar onde você quer morar com muito cuidado. E no
lugar em que você quer trabalhar também. Pesquise sobre o custo
de vida e todos os detalhes que vão afetar seu dia a dia. É melhor
fazer a lição de casa e acertar o lugar do que ficar pulando de galho
em galho ou acabar frustrado num lugar estranho e longe dos seus
amigos e família.
Outra coisa, para quem é criativo, o visto de trabalho depende do
seu desempenho profissional.
Em outras palavras, depende de reconhecimento internacional,
que em geral significa prêmios e ter seu trabalho exposto em
publicações globais e relevantes.
Última dica. Se você receber uma proposta de um lugar que não
conhece, a empresa que deseja lhe contratar tem a obrigação de lhe
levar até lá, para que você possa conhecer o lugar onde pretende
morar. Empresas que não oferecem esse tipo de coisa dificilmente
têm dinheiro para arcar com os custos legais incluídos ao contratar
um profissional de outro país.
81 > DESIGN | WIDE |
35
DESIGN
Marcio Holanda
Diretor de Arte da agência Ogilvy, Itália
www.ogilvy.it
A minha experiência internacional está diretamente ligada à
agência em que trabalho há sete anos, a Ogilvy. Depois de quase
três anos na Ogilvy Brasil, surgiu a oportunidade de trabalhar na
Ogilvy do México, um país com um mercado muito parecido com o
nosso, porém com particularidades culturais muito interessantes.
E, posteriormente, de ir à Itália, na sucursal da Ogilvy de Milão,
onde estou hoje.
De modo geral, trabalhar no exterior como diretor de arte
não é muito diferente do Brasil, até porque, no caso de agências
internacionais como a Ogilvy, que é responsável pela comunicação
de tantos clientes também internacionais, o processo criativo
acaba sendo parecido para algumas das marcas em que eu já tinha
trabalhado no Brasil. Além disso, as ferramentas de trabalho nada se
diferem: o velho e bom pacote de programas da Adobe.
O que difere do Brasil é o que está ao redor disso: a mudança
de ambiente, de língua, de cultura — fatores que algumas vezes
influenciam no processo criativo. Exemplo disso é quando
estamos meu redator/dupla e eu em processo de brainstorm para
uma campanha. Deparo-me com ideias, conceitos, expressões
artísticas que não funcionariam no Brasil. Ou o contrário. Cheguei a
apresentar para o meu amigo redator o ritmo do Forró in the Dark,
uma banda que está fazendo sucesso no exterior. Para ir mais a
Cinthia Ruiz
Gerente de design da Metatron
www.metatron.com.br
Após concluir minha graduação no Brasil, já como profissional,
decidi fazer uma especialização que fosse realmente um diferencial
no meu currículo e me desse uma boa base de conhecimento, para
que estivesse preparada e transmitisse credibilidade à empresa que
estivesse disposta a apostar em mim.
Foi então que me inscrevi em um programa de bolsa para
estudos na Espanha. Escolhi o Máster en Artes Digitales da
Universidade Pompeu Fabra, em Barcelona. Fui aceita!
Nunca tive grande interesse em morar fora do Brasil, o que
contribuiu muito para minha insegurança em me dispor a passar
um ano e meio sozinha, em um país estranho. Mas, eu não poderia
desperdiçar essa oportunidade, ainda mais ganhando uma bolsa de
estudos. Sempre fica em minha cabeça uma frase que meu irmão me
36
| WIDE | 81 > DESIGN
fundo na explicação, falei da festa de São João, mas acho que ele não
entendeu muito bem. “Festa di San Giovanni?”. Como explicar a alma
da Festa de São João para um estrangeiro?
E ainda na parte cultural, o idioma influencia bastante, mesmo
para quem é diretor de arte. É óbvio que saber a língua local é de
extrema importância. O inglês me ajudou no início, mas tive que me
empenhar muito para aprender o espanhol e o italiano depressa,
recorrendo a livros e estudando em casa. Mas tanto no México como
na Itália as pessoas são bastante tolerantes quando um estrangeiro
ainda não fala bem suas línguas. E toda a dificuldade de adaptação
do início se dilui a partir do momento em que se expressa melhor a
língua local, tanto fora quanto dentro do ambiente de trabalho.
Agora, para quem quer embarcar nessa grande experiência
no exterior: em alguns países, como a própria Itália, a imigração
é tratada de forma muito rigorosa em termos de burocracia. Por
isso, é muito importante para quem quer ter uma experiência
internacional já sair do país com os papéis na mão. Isso ajuda no
momento da contratação de qualquer empresa no exterior.
Já na parte “vida pessoal”, morar no exterior é uma delícia.
Consigo realizar o desejo de conhecer lugares que só conhecia
por meio de livros ou da TV, desde Chichen Itza ao Coliseu. Parece
piegas o que eu digo, mas conhecer pessoas, lugares e outras
tradições só acrescentam à bagagem cultural, o que, sem dúvida,
influenciará no processo criativo.
É isso. A minha experiência profissional e pessoal no exterior me
faz crescer muito, aprender mais coisas e também aprender mais
sobre nós mesmos, brasileiros. E, seguramente, é uma experiência
que sempre recomendo.
disse na época: “Se você não for e depois não conseguir chegar onde
quer na sua carreira, sempre vai se perguntar se teria feito diferença”.
Criei coragem e fui. Hoje é uma experiência que aconselho a
todos. Gostei tanto que resolvi ficar mais um ano trabalhando por lá,
até que senti que era hora de voltar para o Brasil.
Afirmo que foi uma experiência incrível! Quanto aos estudos,
tive contato com uma visão bem diferente, pude aprender e realizar
trabalhos que não imaginava no ramo audiovisual. Em Barcelona,
movimentos culturais e artísticos fervilham e minha universidade
estava sempre envolvida em eventos interessantes. Esse Máster é
muito conceituado e, como toda cidade cosmopolita, recebe muitos
estrangeiros, o que nos dá a oportunidade de trocar conhecimento
com diferentes culturas.
Desde que eu voltei, muitos amigos e até desconhecidos
já me procuraram para pedir conselhos, pois planejavam (ou
simplesmente sonhavam) ter uma experiência no exterior, fazer o
mesmo Máster que eu ou até mesmo se candidatar à mesma bolsa
que ganhei. Meu conselho é simples: vá! Certamente, algum proveito
você vai tirar. Você merece investir em si mesmo. É normal temer
o desconhecido, mas a insegurança é superada pela gratificação de
vencer os desafios. Você ganha força para enfrentar os seguintes.
Bruno Porto
Designer e professor na Raffles Design
Institute, na China
http://sh.raffles.edu.cn
Qualquer experiência — didática, profissional, de caráter pessoal
— fora da “zona de conforto” lhe faz crescer. Não é preciso sair
do país para isso; um workshop experimental ou um emprego
em outra cidade já mexem com sua capacidade de percepção. A
experiência internacional tem a característica de proporcionar
“tudo ao mesmo tempo agora!”, deixando-lhe mais atento para
detalhes e ampliando sua capacidade de aprendizado, como
quando você está jogando um jogo e não conhece bem as regras.
Após me formar, em 1995, passei um ano estudando design
tipográfico e de cartazes na School of Visual Arts, em Nova York.
Época fantástica, entre as aulas de Ed Benguiat e Paul Davis,
mas minha primeira semana lá foi um perrengue atrás do outro,
procurando apartamentos nos classificados com medidas em pés
e polegadas, e não pelo sistema métrico.
É uma besteira, mas exemplifica como se aprende a lidar com
problemas, mesmo nas coisas que seriam mais simples, desde
o primeiro minuto do primeiro tempo. Além de lhe deixar mais
“esperto”, mais flexível, viver no exterior permite que você frequente
associações profissionais, visite exposições, assista a palestras e
conheça pessoas com quem dificilmente esbarraria no Brasil. Aliás,
fazer contatos, inclusive com profissionais brasileiros, também
é uma constante: foi morando em Nova York que fiquei amigo
do Michel Lent (que fazia seu mestrado na NYU, e foi a primeira
pessoa a me mostrar um site) e do designer editorial Marcus Villaça,
então editor de arte da New York Magazine e hoje entre Lisboa e
Budapeste produzindo publicações para iPad pela sua Rocket Pig
Media. Por meio dele, fui parar no Art Directors Club, que organizava
almoços com palestras, e visitei a revista Rolling Stone. O principal,
no entanto, é adquirir conhecimentos e desenvolver projetos
possíveis, quase que exclusivamente, no exterior.
Vivo em Xangai desde 2006, onde vim dar aulas de
Comunicação Visual — em especial, Tipografia. Mesmo tendo
lecionado por dez anos no Rio de Janeiro, precisei ter muito jogo
de cintura, pois o raciocínio cognitivo, os valores estéticos, as
referências culturais e mesmo as relações pessoais/profissionais
na China seguem regras e padrões diferentes dos ocidentais.
Um exemplo de resultado prático é o recém-lançado livro Asian
Graphics NOW!, da editora alemã TASCHEN, que desenvolvi junto
ao editor Julius Wiedemann, ao editor de arte Daniel SicilianoBretas e ao designer e educador Sadao Maekawa, que vive em
Tóquio. Sadao e eu pesquisamos e contatamos centenas de
profissionais de Japão, China, Índia, Coreia, Cingapura, Vietnã,
Tailândia, Indonésia, etc. para submeterem projetos para o livro.
Com 430 páginas, é a obra mais abrangente sobre design asiático
contemporâneo, e isso só foi possível por estarmos na Ásia,
pesquisando nas ruas, em revistas, pegando indicações in loco.
81 > DESIGN | WIDE |
37
DESIGN
Herbert Mascarenhas
Sócio da agência Baião de Dois
www.baiaodedoisdesign.com.br
Minha experiência foi na Europa, especificamente em Londres. Fui
em busca de uma nova referência para a vida. Minha ida não foi
planejada, por isso tive que pensar na melhor forma de aproveitar
a experiência quando eu já estava por lá (uma ideia que parece
absurda… e é). Tirei os dois primeiros meses para planejar o que fazer
e como. Depois desse período, tentei entrar para a equipe de três
empresas que eram consideradas referência na minha área.
Esbarrei na questão do visto de estudante em uma (fica a dica),
no inglês em outra (o cargo era para coordenador) e na terceira não
fui recebido (impressionante o número de agências de emprego
filtrando seu contato direto com as empresas). O plano B eram
empresas menores que tinham um trabalho que eu admirasse. Fui
contratado por um estúdio de design chamado UsTwo e passei seis
meses trabalhando com ingleses e um sueco — em uma pequena
equipe de cinco pessoas.
Parte da alma da Baião de Dois (minha empresa) foi criada a
partir dessa experiência na UsTwo. Como uma empresa com cinco
pessoas foi capaz de se transformar em Official Design Partner da
SonyEricsson Europa e Ásia?! Eu estava lá e pude sentir como esse
tipo de coisa era possível. A experiência foi muito válida.
Hoje, penso e vejo que o período na Europa foi fundamental na
minha formação humana. Abri a cabeça para observar aspectos
negativos e absorver aspectos positivos de uma cultura nova
e, em Londres, encontrei uma cultura baseada em relações de
honestidade, como eu nunca conheceria sem sair do Brasil. Pelo
pouco que pude conhecer nas viagens a turismo que fiz aos Estados
Unidos e a outros países da Europa, posso dizer que Londres foi,
talvez, o melhor destino que eu poderia escolher. Recomendo.
Sobre experiências diversas, posso citar duas que recomendo
aos mais novos e aventureiros. A primeira foi a decisão de ficar
hospedado em casa de família para tentar uma imersão na cultura
deles. E, para ter uma experiência mais completa, troquei de casa
algumas vezes. Convivi com três famílias muito diferentes, em três
casas diferentes, em três bairros diferentes. A segunda foi a decisão
de dormir na rua uma noite. Certo dia, saí de uma festa e disse para
alguns amigos que iria dormir na rua para ver se a cidade realmente
era segura. Deu tudo certo, não congelei e mais histórias foram
somadas ao repertório.
Da história toda, o que mais me surpreendeu foi o fato de eu ter
voltado para o Brasil. Ninguém acreditava que eu voltaria. Mas, o
inverno me derrubou. Não o frio, mas as noites iniciando às 16h e a
cara de depressão das pessoas no metrô… Confesso que não estava
preparado para isso. Além do mais, descobri que o Brasil é um lugar
fantástico. E eu amo Brasília.
Darlan Moraes
Diretor de criação da agência BBDO Proximity, Rússia
www.bbdomoscow.ru
Sempre costumo dizer que o Brasil é um país sedutor (tanto para
estrangeiros como para brasileiros). É difícil sair da “terrinha”, largar
o tempo bom (que em muitos países do mundo não tem), a comida
excelente, as belezas tropicais, a nossa cultura “joie de vivre” tão
admirada por pessoas de todo o mundo. Mas — se você consegue
cortar o cordão umbilical — a experiência é impagável.
Você, como estrangeiro, tem que dar o sangue dobrado porque
custa caro para uma empresa (vistos, passagens de avião, assistência
médica etc. ). O estrangeiro acaba tirando o lugar de um cidadão do
país e, assim, tem que valer muito a pena para eles lhe contratarem.
Aí vira rotina a super-ralação, a necessidade de se superar a cada
38
| WIDE | 81 > DESIGN
job, de não largar o projeto até que ele saia muito bom.
Em publicidade, a ralação é normal. No Brasil, quase rotina. Essa
palavra é parte do meu dia a dia porque fui promovido de redator
a diretor de criação por aqui. Acho essa a maior diferença entre
trabalhar no Brasil ou fora dele.
Marcar gol no campo adversário é sempre mais difícil. Ganhar
uma partida em gramados alheios, um grande sucesso.
81 > DESIGN | WIDE |
39
DESIGN
Moda feminina
na web
Famosa grife carioca de moda feminina,
a Mercatto, lançou recentemente o seu
novo portal, dedicado às tendências para o
próximo verão. O site, que é caracterizado
por ter uma navegação diferenciada, conta
com a beleza da atriz Paola Oliveira presente
em toda comunicação da marca.
40
| WIDE | 81 > DESIGN
Bruno Chamma, diretor de criação e um dos sócios da agência digital
Kindle (www.kindle.com.br), que desenvolveu o novo site da Mercatto
(www.modamercatto.com.br), nos conta detalhes e curiosidades da
produção desse trabalho. Confira.
WIDE Em termos de estratégia, o que a Kindle considera mais importante para atender os seus clientes?
BRUNO No início, a Kindle se destacou rapidamente pelo requinte
gráfico e pelo bom uso do Flash, mas rapidamente percebemos
que apenas isso era pouco para atender a todas as necessidades da
comunicação de nossos clientes. Aumentamos nosso escopo dentro
da comunicação digital formando uma área de TI muito forte, assim
como departamentos de mídia online, mídias sociais e planejamento.
Um diferencial importante é que transcendemos apenas a esfera
digital e montamos uma nova e grande área de publicidade e design,
pois hoje acreditamos em uma comunicação integrada .
WIDE Um dos mais recentes trabalhos lançados pela Kindle envolveu
a criação e o desenvolvimento de uma nova plataforma do site para
divulgar a marca Mercatto. Quais eram as principais necessidades e
expectativas do cliente em relação a esse projeto? E qual o tempo e o
perfil da equipe envolvida na produção?
BRUNO A Mercatto é uma grande rede, com 34 lojas de moda feminina, focada na classe C, e para esta coleção de verão contratou a
atriz Paola de Oliveira para traduzir em contos o tema da campanha: Liberdade. O briefing era criar um site com uma navegação
inteligente e diferenciada, que transmitisse o conceito e explorasse
as imagens que foram produzidas em uma sessão de fotos e vídeos
em Itacoatiara (Niterói, RJ). A equipe da Kindle desenvolveu esse
projeto em um pouco mais de dois meses e envolveu dois diretores
de arte, um profissional de motion, dois programadores de Action
Script, um HTMLer e, ainda, trabalhamos em conjunto com um fotógrafo e uma produtora de vídeos para desenvolver o lookbook.
WIDE No site, talvez o detalhe mais interessante seja a navegação
diferenciada em que o usuário tem acesso ao conteúdo arrastando o
mouse pelo layout. Como surgiu essa ideia? Como foi, ou está sendo,
a aceitação?
BRUNO Desde o início, queríamos que um dos diferenciais fosse
a navegação. Mesmo sendo inovadora, ela é de fácil aprendizado,
pois, ao entrar no site, uma mensagem aparece indicando a forma
de se navegar. A ideia nasceu de um brainstorm preliminar que
nossa equipe desenvolve antes de começar um projeto. A aceitação
está sendo muito legal e até já tivemos algumas cotações de novos
projetos em função da visibilidade positiva alcançada por esse.
WIDE Por que o Flash foi escolhido para ser a plataforma utilizada
nesse projeto?
BRUNO Como o tema da coleção é Liberdade, escolhemos o Flash
81 > DESIGN | WIDE |
41
DESIGN
para reforçar esse conceito principal, pois favorece a construção
de uma navegação diferenciada. Também utilizamos diferenciais
pontuais, como o lookbook interativo em vídeo, e diversos outros
detalhes de animação, que fazem com que o usuário tenha uma
experiência única com a marca na web.
WIDE Um player que contém um grande acervo de músicas está presente no layout do site. Com isso, o usuário navega ouvindo alguns
hits da música internacional. Qual fator influenciou para vocês adotarem essa ferramenta (player) no projeto e em que contexto ela se
insere no ambiente da marca (Mercatto)?
BRUNO A rádio Ibiza já desenvolvia um trabalho muito legal de
marketing musical com a Mercatto, preparando um set de mais de
1000 músicas, atualizado mensalmente, e que transmite a essência da marca sob outra óptica sensorial. O nosso trabalho foi trazer
um pedaço desse bom trabalho desenvolvido para dentro da web,
aproximando cada vez mais o ambiente real do virtual
WIDE Sobre o design de interfaces, quais fatores influenciaram na
escolha da tipografia a ser utilizada?
BRUNO No site utilizamos basicamente dois tipos de fontes. Para os
títulos, usamos a Bodoni, que tem uma ligação forte com universo
42
| WIDE | 81 > DESIGN
Desde o início, queríamos
que um dos diferenciais
fosse a navegação
da moda feminina, e, para os textos, utilizamos a Din, uma fonte que
apresenta boa leitura, que teve uma boa harmonia com a Bodoni e
que, além disso, é leve e elegante.
WIDE Sobre a combinação cromática, percebe-se uma predominân-
cia no uso de tonalidades de azul e rosa. Quais aspectos determinaram a paleta de cores a ser utilizada na criação do site?
BRUNO Quando o cliente definiu o tema, foi feita uma grande pesquisa de imagens para amarrar bem o conceito da coleção. Essas
imagens da pesquisa somadas às imagens que produzimos com a
Paola Oliveira, em Itacoatiara, indicaram o caminho cromático a ser
seguido. Para a imagem de fundo, criamos uma arte em tons pastéis
e cinzas, com baixa saturação, para compor, sem interferências, a
boa visualização do conteúdo.
80
81 > DESIGN | WIDE |
43
Ilustração Carolina Vigna-Marú
Audrey Kawasaki
Para vocês não ficarem aí achando que o meu perfume
predileto é naftalina, a coluna deste mês é sobre uma
artista jovem e contemporânea, nascida em 1982, a
Audrey Kawasaki (audrey-kawasaki.com).
Em tempo: não use moderno para se referir
a artistas do nosso tempo. O termo diz
respeito ao Modernismo, movimento que
terminou mais ou menos na metade do
século passado.
Toda obra possui várias relações
espaço-tempo, tanto em si quanto de sua
época e sociedade. O cineasta francês
Robert Bresson (1901-1999), por exemplo, é
famoso por usar espaços desconexos, sem
uma relação direta entre si. Assim como em
Bresson, o espaço em Kawasaki também
é fragmentado, mas ela leva esse conceito
um passo além e a personagem também é
desconexa e, ambos são, simultaneamente,
autossuficientes o bastante para
sustentar sozinhos a narrativa. Ou seja, os
elementos em Kawasaki são desconexos e
fragmentados. Somos todos.
A obra de Kawasaki é uma dúvida entre
o erótico e o inocente, uma mistura entre
a ilustração e a pintura, uma fusão entre
ficção e realidade. Kawasaki é um espelho
do nosso tempo. É muito difícil um artista
conseguir refletir o seu próprio momento
e, ao mesmo tempo, emocionar pessoas.
É necessário manter uma sensibilidade
extrema sem perder o senso crítico, mesmo
que não estejamos — e não estamos —
falando de uma arte de protesto ou um ato
de resistência.
Essa dubiedade, que tão bem retrata
Kawasaki, é nossa, de nosso tempo. Pela
primeira vez na história, sabemos que a
seriedade e o respeito não terminam na
primeira fazendinha virtual. É esta geração
— e nenhuma outra — que consegue
trabalhar com o MSN ligado, mp3 a toda,
44
| WIDE | 81 > DESIGN
falando no Skype e com novecentas
janelas abertas. Curiosamente, vejo
muitos tratando tal comportamento como
problema enquanto acho que é a solução.
Nós somos muitos, complexos e ricos.
Assim como acontece com o design ou
qualquer outra coisa, a pintura é fruto de
uma sequência de escolhas. Ao escolher
determinada cor, enquadramento, traço e
elementos, o artista conta uma história, um
texto. Consequentemente, a imagem tem
uma conotação, que varia de acordo com o
contexto histórico-social tanto do artista e
da obra quanto do fruidor (nome que se dá
àquele que frui, que usufrui, determinado
conteúdo). O fruidor empresta à obra o seu
próprio espaço-tempo, por meio da sua
interpretação. Daí surgem todos aqueles
chavões do tipo “a beleza está nos olhos
de quem a vê” e outras frases de efeito
igualmente bregas.
O design é também objetivo e subjetivo,
e a construção de uma linguagem que
reflete a si própria e o mundo. O webdesign
é, se não a primeira, a mais bem sucedida
linguagem que assimila esse papel
do fruidor em sua própria estrutura,
modificando-se e evoluindo enquanto
existe, em tempo real. O webdesign é a única
linguagem que modifica a sua estrutura
narrativa — e não apenas a forma e/ou o
conteúdo — durante a conversação. Esse
fato já é mais que suficiente para definir
o webdesign como único e, portanto,
dificílimo. O espaço-tempo no webdesign,
por conseguinte, é volátil e etéreo.
Kawasaki entende esse espaço-tempo
dúbio que se ajusta conforme existe e, por
isso mesmo, existe. Ela consegue unir com
perfeição e harmonia a criação da imagem
e do espaço como reflexo das questões
desse mesmo tempo. Em termos técnicos,
ela também ousa: usa madeira crua como
suporte e mistura a ilustração com a pintura,
deixando o traço absolutamente aparente.
Ela não faz um julgamento de valores.
Não vivemos em um tempo onde
julgamentos moralizantes sejam possíveis
(felizmente). Nem sempre observamos
isso, mas, aos trancos e barrancos, a
humanidade caminha, sim, para uma maior
tolerância, e a internet exerce um papel
fundamental nessa evolução. Vivemos
um tempo que se permite questionar e
que admite o dúbio e o diferente. Não
precisamos mais ter certezas. Esse é o
discurso de Kawasaki. E isso é ótimo.
Provavelmente, Kawasaki será vista
no futuro com uma estranha curiosidade,
com um olhar quase sociológico a respeito
das pessoas e dos costumes de nossa
época. O fato é que será vista e isso já diz
muito. André Malraux (1901-1976) afirmou
que a arte é a única coisa que resiste à
morte. Ele tem razão.
Carolina Vigna-Marú é designer e ilustradora das antigas, do tipo que raspou fotolito com gilette e
fez separação de cores no papel vegetal, mas que não é saudosista e acha tecnologia o máximo. Trabalhou com multimídia e foi SysOp de BBS. Desenvolve sites desde 1996, especializando-se em CMS e em
SEO com tableless e CSS. Começou em uma editora pequena em 1982 e nunca mais parou. Gosta muito
de ilustração vetorial, mas não dispensa um bom papel e lápis. Fotógrafa amadora e apaixonada por tudo
que é gráfico. [email protected]
81 > DESIGN | WIDE |
45
Internacional Julius Wiedemann
Tablets e Smartphones,
a terra santa dos desenvolvedores
Nas últimas semanas, temos visto um grande
número de artigos sobre o fim da web e o começo
de uma nova era para a internet. E isso se deve
ao fato de estarmos cada vez mais “mobile”. Outra
discussão intensa é se o caminho para os usuários
(ou o mercado em geral) adotará as Apps como
forma de acessar conteúdo ou se tudo rodará dentro
de browser (para o qual deveríamos ter 3G a uma
velocidade decente, que hoje só existe praticamente
na Coreia do Sul em termos de mobile). E pode ser
também que os dois lados sejam igualmente fortes e
sirvam aos usuários de maneiras differentes. Ambos
os mercados representam, na minha visão, a melhor
oportunidade dos últimos dez anos para designers
trabalharem lado a lado com desenvolvedores.
abertos e fechados ainda me parecem
muito controversas. Mesmo com todo
o sistema fechado da Apple, o valor
agregado de termos o controle de todos
os nossos “assets” digitais dentro de uma
conta só ainda é muito grande. É claro
(para o bem, em muitos casos) que isso
restringe a inclusão de arquivos piratas,
principalmente devido a uma dificuldade
de compartilhamento. A Apple lançou
guidelines mais precisos sobre o que
aceitará ou não dentro da sua loja, deixando
mais claro para desenvolvedores o que
ela deseja. Também parece estar abrindo
a possibilidade de desenvolvimento em
uma plataforma da Adobe, que permitirá
criar Apps multiplataforma. Com a pressão
correta do mercado, a Apple entendeu que
tem que ceder.
A pergunta que não cala (e nem pode
calar) em todo o desenvolvimento de
algo digital é “Qual é o próximo passo?” ou
“Quem vai lançar algo pra concorrer com
isso?”. No momento, minha vida gira em
torno da construção de uma estratégia
para entrarmos com as publicações da
Taschen (www.taschen.com) no mercado
digital. Depois do iPad, tudo mudou para
publicações ricamente ilustradas e que
também possam oferecer uma integração
entre várias mídias. Em setembro, o iPad
ganhou um novo concorrente de peso (ou
quase) com o lançamento do Galaxy Tab,
da Samsung, que eu testei com minhas
próprias mãos, quando estive em Berlin
JÁ O ANDROID, UMA PLATAFORMA bem
mais aberta — sua grande vantagem,
tanto para desenvolvimento quanto
para tipos de conteúdo —, sofre com a
falta de standards, deixando usuários
com menos acesso a updates (em razão
do número de operadoras que usam o
sistema) e oferecendo uma loja ainda
muito confusa. Para complicar um pouco,
desenvolvedores raramente conseguem
fazer dinheiro com seus Apps. Mas, a
sua grande vantagem competitiva até
agora parece estar em comer o mercado
do sistema operacional da Nokia.
Esta, por sua vez, acabou de trocar os
dois maiores cargos da empresa, seu
46
| WIDE | 81 > DESIGN
visitando a IFA (www.ifa-berlin.de).
Um pouco sobre o aparelho. Menor,
mais leve, mais grosso e mais lento que o
concorrente, ele roda Android e também
Flash (mas muito devagar, infelizmente). A
câmera embutida é um grande “plus”, além
do fato de que se pode fazer chamadas
telefônicas (apesar do tamanho não ser
realmente apropriado para isso). Uma coisa
é certa, a Samsung veio mesmo para brigar.
Em poucos anos, ela passou da terceira
maior vendedora de TVs para a liderança
e, no mercado de celulares, do quarto lugar
para o segundo, perdendo hoje apenas
para a Nokia.
As teóricas vantagens sobre os sistemas
Depois do iPad,
tudo mudou
para publicações
ricamente ilustradas,
e que também
possam oferecer
uma integração entre
várias mídias
presidente e o chefão da divisão de
celulares. Considerados até pouco
tempo atrás como possuidores da
melhor usabilidade, os aparelhos
Nokia conseguiram evoluir para os
smartphones também, contudo não
conseguem agregar valor com o seu
portal www.ovi.com. No entanto,
prometem grandes mudanças, com
uma visão mais orientada para software
e menos para hardware. Mas a corrida
ainda tem dois grandes players
dispostos a investir pesado para se
manterem vivos (e saudáveis) nessa
briga de gigantes. A BlackBerry assumiu
há pouco tempo a terceira posição entre
os fabricantes de celular e, com seu
grande foco no mercado de negócios,
abocanhou em poucos anos uma fatia
grande do mercado. Eu mesmo, usuário
de BlackBerry (e também do iPhone),
não sou muito encantado com a loja de
Apps, que funciona muito devagar se
comparadoa ao iTunes e à AppStore da
Apple. Porém, ainda prefiro responder
e-mails no BlackBerry.
com os próprios consumidores de
aparelhos como o Trio, que sempre teve
ótimo feedback do mercado.
EM RESUMO, DESENVOLVEDORES e
designers deveriam manter os olhos
abertos em todas essas avenidas. Perece
muito, mas antes de uma consolidação
maior ainda haverá um aumento de
ofertas, principalmente nos tablets. Eu
sempre penso que o ideal seria hoje
termos rede sem fio em toda parte, o que
ainda não ocorre. O 3G está devagar, e já se
fala em 4G. Mas, uma coisa é certa, o futuro
está nos aparelhos móveis, mostrando
mais uma vez que a internet só cresce em
importância. Até o próximo round.
CORRENDO POR FORA VEM A
Julius Wiedemann
MOTOROLA, ex-líder mundial de
celulares, que introduziu o primeiro
modelo realmente popular em 1985.
Desde então, a gigante passou a atuar
em diversas áreas, e foi perdendo
posições ao longo dos anos. Com a
recente aquisição da Palm, a empresa
espera poder virar o jogo, começando
Diretor de publicações digitais da editora
alemã Taschen (www.taschen.com),
além de editor-chefe das áreas de design e
pop culture. Julius viaja 70% do seu tempo,
dividindo residências entre o Rio de Janeiro, Cambridge, no Reino Unido, e Colônia,
na Alemanha.
[email protected]
81 > DESIGN | WIDE |
47
Webdesign Luli Radfahrer
O único bem comum a todos
Existe um recurso que é verdadeiramente
democrático e distribuído com justiça: o tempo.
Pouco importa sua origem ou padrão de vida, todas
as pessoas têm disponível para si uma quantia de
tempo que, na média, é bastante próxima. Pena que
seja consumida de formas tão diferentes.
48
| WIDE | 81 > DESIGN
A administração do tempo é uma
habilidade muito maldistribuída.
Enquanto alguns são extremamente
produtivos e eficientes, capazes de
realizar muitas tarefas em pouco tempo,
outros se atolam em um pântano de
atividades infrutíferas, que lhes custam
foco, relacionamentos e saúde.
À medida que o mundo se torna mais
carregado de informação e complexidade,
é natural que os conteúdos se empilhem.
Mas, essa confusão deve ser controlada,
não adotada. Muita gente se defende em
sua bagunça citando o velho mito que
os mais talentosos são naturalmente
desorganizados. Isso é uma bobagem;
uma coisa não tem nada a ver com a outra.
Profissionais de grande produção tendem
a ser tão arrumados em seu trabalho
que até parecem obsessivos. Ao mesmo
tempo, nada é mais comum do que gente
talentosa e que poderia se dar melhor na
carreira. Ou na vida.
Há muito tempo que se diz que tempo
é dinheiro. Não é. Tempo é muito, muito
mais importante do que dinheiro. Não há
quantia no mundo que compre algumas
horas ou dias. Mesmo assim, poucos
recursos são mais escassos (e, que ironia,
mais desperdiçados) do que o tempo livre.
Em uma época de crescente especialização
e demandas, ele deveria ser considerado
uma poupança, usado para descansar,
aprender, encontrar amigos. Deveria, enfim,
ser administrado com mais cuidado. Mas,
não é. A própria ideia de um “passatempo”
mostra isso. Mesmo que “gastedinheiro”
existam aos montes, eles pelo menos não
são tão descarados.
Quem trabalha com
tecnologia tem um
problema a mais com
relação ao tempo:
máquinas não estão
sujeitas a distrações
A SOCIEDADE ESTRESSADA
CONTEMPORÂNEA mostra como o tempo é
uma riqueza. Na falta dele, muitos gastam
suas reservas — de sono, de férias, de
relações sociais e afetivas — de um jeito
atrapalhado, sem qualquer planejamento,
com grandes desperdícios. Alguns
percebem depois de várias horas, semanas
ou anos que boa parte do tempo que
empenharam em um trabalho, uma ideia,
uma relação, foi inútil. Outros não têm
tanta sorte e deixam para o final da vida ou
da carreira para se preocupar com o que
realmente consideravam importante. Ou
nem isso. Quantas vezes você já ouviu a
frase “ah, se eu soubesse naquela época o
que eu sei hoje…”? Acredito que muitos que
relembram o passado o fazem mais pelo
desejo de mais tempo e energia do que
pela vontade de rever certas decisões.
QUEM TRABALHA COM TECNOLOGIA TEM
um problema a mais com relação ao
tempo: máquinas não estão sujeitas a
distrações. Elas são extremamente rápidas
em tarefas repetitivas, não pegam trânsito
no deslocamento para o ambiente de
trabalho e funcionam 24 horas por dia
sem precisar almoçar, ir ao banheiro ou
dormir. Nessas condições, é natural que
estejam sempre à frente de seus colegas
humanos, mesmo que sejam só assistentes
prestativos e ansiosos por novas tarefas.
Não importa.
A demanda excessiva por
atenção costuma atordoar, mesmo
inconscientemente, quem lida com ela.
Como uma creche ou uma aula para
crianças hiperativas de 6 anos de idade,
os computadores e os celulares estão
cada vez mais cheios de aplicativos e
mensagens pipocando o tempo todo.
Um por um, todos demandam atenção
exclusiva, como se cada um fosse o
centro do mundo. Sempre que o serviço é
interrompido para se dedicar a eles, mais
um pouco de tempo é perdido. E outro
tanto para retomar a concentração, até ser
interrompido de novo. Assim, fica difícil
trabalhar.
Multitarefa é bom para máquinas,
contanto que não demandem muita
atenção de quem as opera. Para seus
usuários, fazer duas ou mais coisas ao
mesmo tempo parece mais uma forma
de dispersão do que uma técnica de
eficiência. O zen-budismo prega que uma
atividade deve ser realizada por vez e
que cada tarefa deve concentrar todo o
interesse. Não há, nas mitologias, religiões
ou repositórios de sabedoria milenar,
quem pregue fazer várias coisas ao
mesmo tempo. A mesma regra vale para
todas as espécies vivas deste planeta.
Indivíduos produtivos tendem a
ser “monotarefa”. Faz sentido. Ter uma
prioridade por vez é bom, ajuda a manter
a concentração e o foco. Isso não é
possível quando se tem uma caixa de
entrada lotada ou uma lista de tarefas com
dezenas de itens. Pilhas intermináveis de
urgências temporárias não aumentam
a produtividade: só pioram a angústia.
Quem tem de administrá-las (uma queixa
de dez em cada dez profissionais da área
digital) nunca conseguirá a paz de espírito
para desenvolver um bom trabalho. Seu
cotidiano é, afinal, parecido com o de um
médico de UTI de um hospital de guerra.
POUCOS SE DÃO CONTA DE QUE O
TRABALHO difícil e gratificante é aquele
que desafia as capacidades, não o que
sobrecarrega. E que a melhor forma de
realizá-lo é acordar cedo, encará-lo de
frente e fazer uma coisa de cada vez. Não
adianta se queixar de uma situação ou
mesmo tentar atacar um problema se as
causas ou o ambiente que o promovem
continuam fora de controle.
Hoje em dia, em que praticamente
todo mundo se sente sobrecarregado
e malremunerado, a melhor forma que
conheço para contornar essa situação
está no controle de como o tempo é gasto.
Se as tarefas não vão diminuir, só resta
administrá-las. Contudo, isso não é um
processo fácil. Depende muito do ambiente
em que acontece e da sinceridade das
intenções de quem o pratica.
Luli Radfahrer
PhD em Comunicação Digital, já dirigiu a
divisão de internet de algumas das maiores
agências de propaganda e portais do
Brasil. Hoje é professor-doutor da ECA-USP
e consultor independente, com clientes
no Brasil, Estados Unidos e Oriente Médio.
Autor do livro Design/Web/Design:2, posta
textos semanais sobre criatividade, design
de interfaces e inovação no blog,
www.luli.com.br.
[email protected]
81 > DESIGN | WIDE |
49
PARA OS NEGÓCIOS
O marketing no Facebook
tem mostrado grandes
resultados para quem
resolveu investir nessa rede
social aqui no Brasil, seja
por meio de aplicativos
para interagir com os
usuários, de anúncios para
gerar receita direta para
a empresa ou de páginas
oficiais para intensificar
a comunicação entre o
cliente e a marca.
Por Flávia Freire
50
| 81 > CAPA | WIDE
T
udo começou em fevereiro de 2004,
quando o norte-americano Mark
Zuckerberg lançou o site “The Facebook”
com o apoio dos amigos de faculdade
Andrew McCollum e Eduardo Saverin
— sim, um brasileiro fez parte dessa fantástica criação. Inicialmente,
a rede social era restrita aos estudantes da universidade onde estudavam: Harvard, nos Estados Unidos, e o sucesso foi tanto que, em
menos de um mês, mais da metade dos estudantes se registrou no site.
Em dois anos, a rede social foi expandida para mais de dois mil colégios e mais de 25 mil universidades ao redor do mundo. Isso se deu
pela ajuda de outros dois colegas de Mark, Dustin Moskovitz e Chris
Hughes, que fizeram um excelente trabalho de promoção, levando o
The Facebook para os estudantes de Canadá, México, Reino Unido,
Austrália, Nova Zelândia, Irlanda, Índia, Alemanha e Israel.
O domínio www.facebook.com, sem o artigo “The”, foi comprado em 2005, e o site ganhou uma nova interface, muito mais
amigável aos usuários. Finalmente, em 11 de setembro de 2006, o
Facebook foi aberto para cadastro de todos os usuários da internet
maiores de 13 anos de idade.
Hoje, o Facebook só cresce e aprimora seus recursos em todo o
mundo devido à dedicação de mais de um milhão de desenvolvedores
de mais de 180 países construindo aplicativos. São 500 milhões de usuários ativos na rede social criada por uma empresa que possui cerca
de 800 funcionários — dentre eles, Paul Buchheit, inventor do Gmail —,
sediada em Palo Alto, na Califórnia. Não é à toda que Mark Zuckerberg,
de apenas 26 anos, é um dos bilionários mais jovens do mundo.
Não foram só alegrias…
Em setembro do ano de seu lançamento,
os proprietários do HarvardConnection, site
concorrente do Facebook, impetraram uma
ação no Tribunal de Massachussetts contra
a rede social de Mark Zuckerberg, alegando
que ele havia roubado o código fonte de
seu site, já que, em dezembro de 2003, Mark
teria prestado serviço por algumas horas
à empresa e por isso teve total acesso aos
códigos do site HarvardConnection, posteriormente chamado
de ConnectU.com. A ação exigia uma indenização de U$ 75 mil
de Mark e seus sócios por danos e forçava-os ao fechamento
do Thefacebook.com. A ação não procedeu e, em dezembro do
mesmo ano, o site ultrapassou um milhão de usuários cadastrados.
Tal história é retratada no filme The Social Network (www.
aredesocial.com.br), produzido com base no livro Bilionários
Acidentais, de Ben Mezrich (www.benmezrich.com). A estreia, em
outubro deste ano nos EUA, foi um grande sucesso de bilheteria, o
que promete salas de cinema lotadas a partir de dezembro no Brasil.
MARKETING NO FACEBOOK
Em maio de 2007, surgiram dois importantes recursos que
introduziram o marketing no Facebook: o Facebook Marketplace
(apps.facebook.com/marketplace), um aplicativo para adicionar
classificados gratuitamente no site, e a Facebook Platform
(developers.facebook.com), uma API (Application Programming
Interface) para o desenvolvimento de aplicações para a rede social.
Seis meses depois, foi lançado o Facebook Ads (www.facebook.
com/ads/create), um sistema de veiculação de anúncios baseado
no perfil do usuário e de seus amigos.
Mas não foi somente por meio de aplicativos sociais e de anúncios
que as empresas decidiram infiltrar suas marcas e campanhas
no Facebook. Elas perceberam que o modelo totalmente “sem
privacidade” da rede social poderia trazer muitos benefícios. O fato de
os dados de perfis dos usuários, como sexo, idade, profissão, hobbies,
entre outros ficarem expostos, e de todos os usuários poderem
saber o que os amigos dos amigos estão “pensando” por meio de
suas conversas e mensagens, facilitou os estrategistas de marketing
a atingirem as pessoas que realmente poderiam gostar de seus
produtos. Fora que as páginas oficiais, que são criadas gratuitamente
no Facebook para que os usuários possam “curtir” a proposta e assim
divulgar para os amigos, podem oferecer a comunicação instantânea
que os internautas estão acostumados hoje. Tais páginas oficiais
possibilitam a entrada ilimitada de usuários, enquanto os perfis
permitem somente que o usuário tenha até cinco mil amigos.
Comparado ao Orkut, o Facebook não tem ainda tanta audiência
no Brasil, já que, dos usuários online, 68,4% está no Orkut enquanto
apenas 8% possui cadastro no Facebook. Mas, com base no rápido
crescimento que a rede social sofreu este ano no país — de abril a
setembro houve um salto de três milhões para mais de seis milhões
de usuários —, as grandes marcas brasileiras estão investindo em
ações de marketing no Facebook.
De acordo com dados do site Facebakers (www.facebakers.
com/countries-with-facebook/BR), em número de usuários,
o Brasil ocupa a 20ª colocação em um ranking de 212 países, e a
maioria dos usuários brasileiros que possuem perfil no Facebook
têm de 25 a 34 anos de idade, ou seja, um público com poder
de compra. As mulheres estão mais presentes na rede social,
representando 55% dos usuários. Então, já é hora de prestar mais
atenção ao reboliço que o Facebook está causando no país.
O investimento em anúncios no
Facebook é um dos itens que
crescem mais rapidamente na
linha de serviços de muitos
departamentos de marketing ao
redor do mundo
Clara Shih
81 > CAPA | WIDE |
51
CLARA SHIH: A “MÃE” DOS NEGÓCIOS NO FACEBOOK
Para saber mais sobre marketing no Brasil por
meio do Facebook, conseguimos uma entrevista
exclusiva com quem realmente entende do
assunto: a especialista em redes sociais Clara Shih,
considerada uma das mulheres mais influentes do
mundo digital em 2010 pela revista norte-americana
Fast Company (www.fastcompany.com/article/
clara-shih-hearsay-labs). O título foi muito bem
aplicado a essa norte-americana nascida em Hong
Kong, que, em 2007, juntamente com o engenheiro
de informática do Facebook, Todd Perry, criou o
aplicativo Faceconnector, que ajuda empresas a se
inserirem nas redes sociais, tendo melhores resultados
econômicos. Este ano, lançou a segunda edição do
livro The Facebook era: tapping online social networks
to build better products, reach new audiences, and sell
more stuff (www.thefacebookera.com), que trata
de práticas empresariais nas redes sociais.
acessam a rede social?
CLARA O Facebook começou mais dedicado aos estudantes universitários, mas nos últimos anos realmente se espalhou. Hoje,
pessoas de todas as idades, áreas geográficas estão acessando o
Facebook. No Brasil, os usuários do Facebook são mais velhos do
que em outros países. A maioria é de pessoas entre 25 e 34 anos
de idade, comparada ao grupo de 18 a 24 anos nos Estados Unidos
e na Europa. Três porcento dos brasileiros estão no Facebook e,
entre os brasileiros que estão online, 9% estão no Facebook.
WIDE Apesar de toda a popularidade do Facebook, por que ele
não tem uma presença forte no Brasil, em comparação, por exemplo, com o Orkut?
CLARA O Orkut está em primeiro lugar no Brasil e continua a ser
muito mais popular do que o Facebook. Se olharmos para o exemplo da Índia, no entanto, onde o Orkut foi dominante durante muitos anos, podemos ver essa mudança ao longo do tempo. A partir
de janeiro de 2010, o Facebook já o ultrapassou e agora está crescendo muito mais rapidamente do que o Orkut na Índia.
WIDE O que lhe levou a escrever o livro The Facebook era? Do
que ele trata em geral?
WIDE Empresas brasileiras estão apostando na rede social,
CLARA Em 2007, criei o Faceconnector, um aplicativo que integra
então como você poderia aconselhá-las a usar o Facebook com
criatividade para o marketing?
CLARA O sistema de publicidade do Facebook é único em duas
maneiras. Primeiro, ele permite que os anunciantes utilizem a técnica de HyperTargeting nas mensagens de seus anúncios com
base nas informações do perfil dos usuários. Por exemplo: uma
empresa que vende ingressos para jogos de futebol pode especificar que deseja anunciar apenas para usuários que escrevem
em seus perfis que amam futebol. Em segundo lugar, os anúncios
do Facebook trazem benefícios da natureza social do Facebook,
então, se alguém “curtir” um anúncio, pode saber quais de seus
amigos já estão “curtindo” o anúncio ou o produto. Isso permite
que os anunciantes tenham o poder da palavra do marketing
boca a boca a uma medida que antes não era possível.
o Facebook com um software de gestão de relacionamento com
clientes. Esse aplicativo atraiu muita atenção porque foi o primeiro
estudo de caso de negócio na plataforma do Facebook. Ele era
ainda muito recente no desenvolvimento do Facebook, e eu
estava sendo abordada por várias editoras para escrever um livro
explicando as oportunidades de negócio em redes sociais. O The
Facebook era descreve a transformação social nas comunicações
introduzida pela mídia social e como isso afeta as estratégias das
organizações e abordagens de venda, marketing, atendimento ao
cliente, recrutamento e desenvolvimento de produto.
WIDE Na sua opinião, por que o Facebook se tornou tão popular
no mundo inteiro? Qual o grande segredo dessa rede social?
CLARA O Facebook não foi o primeiro site de rede social, mas
52
o que realmente o diferencia dos demais é o seu foco, desde
o início, em refletir e ampliar, em vez de substituir nossos
relacionamentos offline do mundo real. Redes sociais anteriores,
como a Friendster, por exemplo, começaram a parecer como
spams, porque haviam muitas solicitações e mensagens de
estranhos. Em contraste, o Facebook tem feito um bom trabalho
em proporcionar um ambiente confiável onde os usuários
sentem que estão entre amigos.
perspectivas estão e, para um número crescente de empresas
a nível mundial, isso é permitido no Facebook. Além disso, há o
novo potencial por trás do HyperTargeting e do marketing boca
a boca, e o The Facebook era representa claramente esse novo
paradigma do marketing online.
WIDE Você tem informações sobre o perfil dos brasileiros que
WIDE O que o Facebook oferece às empresas para que elas
| 81 > CAPA | WIDE
WIDE Para você, qual a importância do Facebook para o
marketing online?
CLARA Os anunciantes têm que estar onde os clientes e as
CAPA
possam alavancar suas campanhas?
CLARA Além dos anúncios com HyperTargeting, o Facebook
oferece aos anunciantes de grandes marcas diversos recursos
exclusivos para ajudar na promoção da campanha, incluindo
vídeo para complementar o anúncio (mais usado por meios de
comunicação, programas de TV, filmes etc.), presentes virtuais
patrocinados, RSVP in-line para eventos e a possibilidade de
“curtir” uma página do Facebook.
WIDE De acordo com a chefe de operações do Facebook, Sheryl
Sandberg, a rede social aumenta em dez vezes as receitas provenientes de investimentos em publicidade. Com base nisso, as
empresas já estão conscientes de que o Facebook é um bom
lugar para fazer marketing?
CLARA O investimento em anúncios no Facebook é um dos
itens que crescem mais rapidamente na linha de serviços de
muitos departamentos de marketing ao redor do mundo, especialmente em países como os Estados Unidos, e na Europa, onde
o Facebook já tem uma pegada forte e crescente.
WIDE Como o monitoramento das campanhas no Facebook é
feito pelas agências ou pelos anunciantes?
CLARA A maioria das agências onde trabalhei utilizam uma
combinação da análise fornecida pelo Facebook com suas
próprias métricas para mostrar o ROI (Retorno do Investimento) da
campanha. Cada vez mais os clientes estão exigindo das agências
digitais informações sobre métricas para que possam mensurar
e comparar o retorno das campanhas em redes sociais. O uso de
mídia social para atendimento ao cliente, por exemplo, requer
uma medição que leva em conta a redução de custos de suporte
ao cliente devido às mensagens serem expostas em um canal
público, onde outros clientes podem tirar suas dúvidas.
WIDE O que você acha que o Facebook ainda precisa oferecer em
termos de aplicabilidade de ações de marketing?
CLARA O próximo grande passo do Facebook é criar uma
rede de publicidade semelhante ao Google AdSense, que
permite que os anúncios sejam mostrados não apenas no site
do Facebook, mas também por meio de editores do Facebook
Open Graph (developers.facebook.com/docs/opengraph).
Isso proporcionaria aos anunciantes oportunidades ainda
melhores para atrair público.
WIDE Explique a sua análise “o sucesso da publicidade no
Facebook é devido ao fato de sua abordagem basear-se no que as
pessoas gostam, e não do que elas procuram, como faz o Google”.
CLARA O Google Search encontrou um grande mercado ao
focar na intenção de compra das pessoas no momento em que
elas estão procurando comprar. Isto é, quando alguém procura
por uma câmera digital no Google, há uma grande chance de
essa pessoa estar interessada em pesquisar ou comprar uma
câmera em breve. Isso é o que torna o Google AdSense tão eficaz.
O Facebook aborda publicidade online a partir de um ângulo
diferente. Baseado no perfil das pessoas e nas informações
de status em tempo real, assim como no que seus amigos têm
comprado. O Facebook identifica indivíduos que possam estar
interessados em comprar um determinado produto ou serviço
e, assim, pegar essas pessoas antes que elas estejam prontas para
adquiri-lo, ajudando a influenciar na decisão de compra. Um
anúncio ideal visando à solução no futuro deve combinar esses
dois elementos, ou seja, quem a pessoa é (informação do perfil
na rede social) e o que seus amigos estão fazendo, bem como o
que eles estão procurando naquele momento.
WIDE Na sua opinião, qual o futuro dos negócios no Facebook?
CLARA Atualmente, estamos com a mídia social no mesmo
patamar em que estávamos há dez anos com a internet.
Estamos vendo um claro valor em aproveitar o poder das
conexões e relações sociais nas empresas, mas ainda existem
muitas oportunidades de inovar e inventar novas formas
de marketing, vendas, recrutamento e desenvolvimento de
produtos. E isso já começou a acontecer, mas acredito que em
poucos anos veremos uma plataforma com capacidade ainda
maior no Facebook, que permitirá informações de gráfico social,
e os anúncios serão disponibilizados na rede de parceiros do
Facebook Open Graph, não apenas do próprio site do Facebook.
MARKETING POR MEIO DE PÁGINAS OFICIAIS
Todo cliente deseja ser bem atendido, gosta de ter um bom relacionamento com a marca e, com a velocidade de comunicação que se
é permitida hoje, ele exige por respostas rápidas. Para tudo isso, as
redes sociais são excelentes ferramentas.
No Facebook, a maioria das empresas opta por criar páginas
oficiais de suas campanhas para que os usuários possam se
tornar fãs e manter uma relação mais próxima com suas marcas
preferidas. É o caso da campanha Fiesta Stories (www.facebook.
com/newfiestastories) , criada pela agência JWT, que começou
pelo Facebook e depois foi para TV e revistas. “Escolhemos essa
plataforma porque queríamos falar diretamente com um perfil
específico de consumidor: aquele que é interessado em adquirir
Escolhemos essa plataforma
porque queríamos falar
diretamente com um perfil
específico de consumidor: aquele
que é interessado em adquirir tudo
em primeira mão
Fábio Brandão, diretor de criação da JWT
81 > CAPA | WIDE |
53
CAPA
tudo em primeira mão. Por isso, o carro chefe dessa comunicação
são as mídias sociais. Em poucas semanas, já atingimos números
maiores do que grandes lançamentos da Ford nos EUA. Cada um dos
documentários já foi assistido por milhares de pessoas. E estamos só
no começo, muitas outras histórias ainda serão mudadas”, declara
Fábio Brandão, diretor de criação da JWT.
Uma das vantagens de lançar páginas oficiais no Facebook é
que não têm custos para o cliente. “É gratuito. Só se paga o custo
de produção e os custos de mídia”, explica Fábio, sobre os recursos
interativos, como os aplicativos, que podem ser inseridos na página
oficial, contratando uma agência ou profissional para criar o app.
Para criar uma página oficial, acesse www.facebook.com/pages/
create.php, selecione o segmento de sua página oficial, dê um nome
a ela e clique em “Criar uma página oficial”.
Pronto, agora é só implementar a página com as informações
desejadas e divulgá-la para que o maior número de pessoas possam
“curtir” e, então, divulgar para os amigos.
Existem empresas que se cadastram no Facebook através de perfis, como fez a marca de roupas Wöllner (www.facebook.com/wollner.rj) há seis meses. Com apenas duas pessoas no departamento de
marketing responsáveis por inserir as novidades da marca no perfil,
essa forma de marketing no Facebook foi a melhor opção para o estilista Lauro Wöllner, antes de pensar em lançar um aplicativo ou um
anúncio da marca. “Estamos crescendo diariamente. A cada ação
que fazemos, aumentamos em 20% o número de clientes cadastrados. A resposta é muito rápida, temos um planejamento de ações no
qual, mensalmente, criamos campanhas voltadas para lifestyle da
marca, gerando interatividade com os clientes e premiando-os com
gifs exclusivos para a galera do Facebook. E estamos estudando os
aplicativos, em breve lançaremos”, declara.
Lauro destaca, ainda, a importância do feedback dos usuários
do Facebook em relação à marca. “O grupo é formador de opinião,
ou seja, todo feedback vindo dessas mídias é de grande valor para
a construção das estratégias de marketing. Nos dias atuais, precisamos estar mais próximos do cliente e passar credibilidade, realidade.
Hoje, o Facebook é o centro das atenções, ele influencia a forma de
nos comunicar com as pessoas, nas dicas em relação às nossas escolhas de consumo, sendo uma grande fonte de informação, um guia.
54
| 81 > CAPA | WIDE
Página oficial do New Fiesta no Facebook
Por isso, optamos por trabalhar fortemente essa ferramenta, que está
nos trazendo grandes resultados. A melhor forma de manter um bom
relacionamento é atualizar o perfil diariamente e criar ações e interatividade para que o cliente visite e indique para os amigos”, diz.
Todo feedback vindo dessas
mídias é de grande valor para
a construção das estratégias
de marketing
Lauro Wöllner, estilista
MARKETING POR MEIO DE APLICATIVOS SOCIAIS
Grande atrativo dos usuários, os aplicativos funcionam como uma
ótima maneira de interação entre os clientes e as marcas. Hoje, o
Facebook possui mais de 550 mil aplicativos na rede, e 70% dos
500 milhões de usuários “curtem” mensalmente aplicativos em
seus perfis. Segundo o site DoubleClick Ad Planner (www.google.
com/adplanner) , o subdomínio apps.facebook.com, onde estão
localizados todos os aplicativos criados para o Facebook, é o mais
acessado, com 210 milhões de visitantes únicos por dia. Então, já é
hora de o aplicativo da sua empresa estar entre eles, não é mesmo?
Os aplicativos são como hotsites, só que integrados às páginas
oficiais do Facebook. Eles oferecem um serviço atraente e interativo de forma a incentivar os amigos do usuário a compartilhá-lo
também. No Brasil, os três aplicativos que mais possuem fãs
são o Nike Futebol, com mais de 140 mil; o Azul – Linhas Aéreas
Brasileiras, com quase 110 mil; e o BlackBerry Brasil, com mais de
43 mil usuários. E esses números crescem a cada dia.
Álbuns de fotografias com as coleções da Wöllner
www.facebook.com/BlackBerryBrasil
www.facebook.com/AzulLinhasAereas
www.facebook.com/nikefutebol
81 > CAPA | WIDE |
55
CAPA
SOCIAL SHOPPING
Para chamar a atenção e atingir o sucesso, é importante inovar. A
Privalia (www.privalia.com.br), site de vendas de produtos com desconto, lançou um aplicativo chamado “Fan Shop”, produzido pela
Privalia Espanha no Facebook de todos os países em que atua, no
qual disponibiliza sua loja dentro da rede social, oferecendo exclusividade aos mais de 35 mil fãs e um acesso prioritário a expressivas
campanhas. Fora isso, o resultado do conceito Social Shopping disponibilizado no aplicativo foi melhor do que o esperado no Brasil.
“Os usuários, além de comprar, podem interagir entre eles. No meio
offline, é comum os consumidores fazerem compras acompanhados de um amigo, e é essa a experiência que disponibilizamos no
Fan Shop: a possibilidade de fazer suas compras online e pedir a
opinião de uma amiga sobre uma peça desejada, mas com a comodidade de fazer isso sem sair de casa. Aumentamos a base de fãs
e superamos nossas expectativas em relação à venda das marcas
que estiveram no Fan Shop. Estamos contentes com os resultados”,
declara Andre Shinohara, CEO da Privalia.
O site Giuliana Flores também vem investindo em ações de
marketing no Facebook por meio de aplicativos, mas a empresa
optou por lançar campanhas diferenciadas de acordo com as datas
comemorativas, como a que desenvolveu em setembro para o Dia da
Secretária. “A ação funciona dando foco nas características pessoais
e profissionais de quatro exemplos bastante distintos de secretárias
que estão muito presentes no cotidiano de empresas e escritórios no
Brasil. A Giuliana Flores humanizou a ação e deixou na mão de seus
amigos, fãs e seguidores nas redes sociais a tarefa de decidir qual
modelo de secretária deve ganhar um prêmio junto a eles. O objetivo
é que criemos uma interação de nosso público no Facebook com tais
personagens mediante um aplicativo de enquete, a fim de aumentar
nossa visibilidade — por estar dentro do nosso ambiente a ação — e
engajamento com todos os amigos e futuros clientes”, explica Juliano
Souza, gerente de marketing da empresa.
Muitas empresas atualmente investem em marketing por meio
No meio offline, é comum os
consumidores fazerem compras
acompanhados de um amigo, e é
essa a experiência que
disponibilizamos no Fan Shop
Andre Shinohara, CEO da Privalia
Aplicativo “Fan Shop” da Privalia
O poder de persuasão dos aplicativos para o Facebook foi comprovado pela Privalia. O número de fãs na página dobrou na primeira semana e aumentou mais de 220% em menos de um mês. As
vendas das campanhas do Fan Shop aumentaram cerca de 30%.
“As redes sociais conquistaram um grande espaço entre os brasileiros nos últimos anos, não apenas como um canal de comunicação
entre amigos e familiares, mas também como uma nova forma de
relacionamento entre as empresas e os seus clientes. Marcar presença nas redes sociais é uma forma direta de as marcas atingirem
seus consumidores potenciais, transmitirem mensagens estratégicas e os recompensar por sua fidelidade”, declara Andre, que mostra a força da campanha da Privalia no Facebook em comparação
com o Orkut. “Apesar de o Orkut ser a rede social líder no país, nossa
maior concentração de fãs está no Facebook, com mais de 35 mil
usuários. No Orkut, nossa página oficial possui cerca de 4500 membros. Além disso, o Facebook disponibiliza, hoje, ferramentas que
facilitam a integração e oferecem maiores oportunidades de interação com os fãs.”
56
| 81 > CAPA | WIDE
Aplicativo “Escolha sua secretária” da Giuliana Flores
É preciso ter uma cultura de
vanguarda, querer sempre
interagir com os usuários, ter
uma empresa preparada para
receber críticas e elogios
Juliano Souza, gerente de marketing da Giuliana Flores
das redes sociais, mas é importante enfatizar que o trabalho nessas
redes não deve somente focar venda e lucro financeiro, segundo
Juliano. “O resultado do trabalho em redes sociais deve focar inúmeras outras métricas que devem ser analisadas como ROI. Estas,
primordialmente, estão relacionadas à visibilidade da empresa
(branding e engajamento), análise e qualificação de seus serviços e
criação de situações especiais (eventos e ações) para gerar interesse
e fidelizar clientes. É preciso ter uma cultura de vanguarda, querer
sempre interagir com os usuários, criar situações que os interessem
e satisfaçam suas expectativas, ter uma empresa preparada para
receber críticas e elogios, prevenir problemas e, por fim, almejando
retorno financeiro, investir em ações promocionais e concursos culturais de grande porte para que intensifique o maior bem que um
site pode ter: referência (cadastros), clientes satisfeitos e venda.”
O monitoramento do trabalho de SMM (Social Media Marketing)
da Giuliana Flores é feito pela Buzz Social Media (www.buzzsocialmedia.com.br), empresa do grupo All In Media, por meio da ferramenta
Buzzer. “Eles monitoram o resultado das ações e da comunicação
realizada pelo site nas redes sociais, gerando relatórios detalhados
do resultado e análise do trabalho semanalmente”, declara Juliano.
MARKETING POR MEIO DE ANÚNCIOS SEGMENTADOS
Segmentados porque o anunciante pode direcionar seus anúncios
de acordo com informações dos usuários, como sexo, idade, interesses, entre outras. O Facebook possui uma plataforma de anúncios
extremamente intuitiva e com vantagens bastante convidativas.
Os anunciantes podem pagar a partir de R$ 0,01 por clique ou por
impressão, mas, quanto maior o investimento, mais chances de o
anúncio ser exibido com frequência na rede social. Os anúncios
criados no Facebook ficam localizados em uma área estratégica
na página de perfil dos usuários, chamando bastante a atenção
dos visitantes. Observe na imagem a seguir:
CONSTRUINDO APLICATIVOS
A equipe de desenvolvimento da Facebook Platform disponibiliza
a SDK (Software Development Kit) para Android, C#, JavaScript, PHP
e Python. Você pode baixá-las em developers.facebook.com/docs.
Após desenvolver o aplicativo, acompanhe o tutorial disponibilizado no site developers.facebook.com/docs/guides/canvas para
inseri-lo no Facebook. Mais informações sobre a Facebook Platform
podem ser encontradas em www.facebook.com/platform. Para interagir com outros desenvolvedores, acesse o fórum em forum.developers.facebook.net.
Wide no iPad
Esta edição da revista Wide está inteiramente disponível
para iPad. Basta baixar o aplicativo Revista Wide no iTunes
pelo seu iPad. Lá, você poderá conferir esta reportagem
com muito mais vantagens e assistirá com exclusividade a
um vídeo para acompanhar todo o processo de criação de
um aplicativo para Facebook desenvolvido em Flash por
Marcelo Albagli, sócio da Canvas. Poderá, ainda, conferir
como foi feita a inserção do aplicativo na rede social!
Aplicativo “Fan Shop” da Privalia
De acordo com o site Alexa (www.alexa.com/topsites), o Facebook
está em segundo lugar entre os 500 sites mais acessados do mundo.
No Brasil, a rede social está na 14ª colocação em um ranking dos
100 sites mais acessados, na frente até mesmo do gigante Twitter
por uma posição. Não é preciso mais motivos para impulsionar
empresas e serviços a criarem anúncios no Facebook, certo?
Então, montamos um passo a passo de como gerar um anúncio na
plataforma da rede social, com todas as informações necessárias.
Confira na página a seguir.
81 > CAPA | WIDE |
57
TUTORIAL
CRIANDO UM ANÚNCIO NO FACEBOOK
Ao clicar em “Continuar”, você verá a seguinte tela:
Aqui, você acompanhará o processo de criação do anúncio da
revista Wide no Facebook que fizemos como demonstração.
Primeiramente, acesse o site www.facebook.com/advertising
e clique em “Crie um anúncio”. Você visualizará o seguinte
formulário:
Em “URL de destino”, inserimos http://www.revistawide.com.
br/ . O título deve ter até 25 caracteres com espaços e ser per-
suasivo, pois é o que mais chamará a atenção no seu anúncio,
depois da imagem. Então, colocamos “Assine com desconto!”.
O texto do corpo do anúncio deve ter até 135 caracteres com
espaços. São poucos dígitos que devem ser usados, com muita
cautela, para deixar o texto envolvente e atrativo. No caso do
anúncio da revista Wide, optamos por colocar o valor do desconto na assinatura da revista, pois assim acreditamos que a
maioria dos usuários que poderão clicar no anúncio já serão os
interessados em realmente assinar a revista. Essa tática é mais
utilizada quando o investimento no custo por clique é restrito,
garantindo mais o ROI.
Hora de fazer
upload da imagem
do anúncio. É
importante destacar
que o anúncio estará
sob um fundo branco,
portanto o ideal é usar
cores que contrastem
e causem impacto.
Utilize uma imagem
com as dimensões
110x80 pixels. Veja,
ao lado, o resultado
visual do anúncio da
revista Wide:
58
| 81 > CAPA | WIDE
Neste segundo passo, o box em destaque no alto à direita da
tela vai estimando o número de pessoas que o anúncio alcançará
de acordo com as informações preenchidas no formulário. Para
o nosso anúncio, em “Localização” deixamos “Brasil – em toda
parte”. Em “Perfil demográfico”, especificamos usuários de 15 a 50
anos de todos os gêneros.
Agora vem a parte mais importante desta etapa de criação do
anúncio, a escolha de itens que o público-alvo do anúncio tem
interesse. Ao colocarmos termos relacionados ao perfil dos leitores da revista Wide, chegamos a um alcance de 24.980 pessoas.
Observe:
CAPA
Terminada esta etapa, a próxima tela é a seguinte:
veiculado, mas você pode preencher o campo com o valor que
deseja pagar, e pode ser até centavos.
Atenção: quanto maior for o seu lance por clique ou visualização,
maior a probabilidade de o seu anúncio ser exibido no Facebook.
Pronto! Simples assim. Após essas rápidas etapas será exibida uma página com todas as informações do anúncio. Se quiser modificar algo, basta clicar em “Editar anúncio”. Se estiver
tudo correto, siga com o processo clicando em “Fazer pedido”.
Basta definir a bandeira do cartão de crédito e seguir com a finalização do contrato.
Nesta fase, são definidos primeiramente a moeda da conta
(não tem o real como opção) e o fuso horário. Em “Nome da campanha”, colocamos Revista Wide. E, em “Orçamento diário”, deve
ser estipulado um valor máximo que seu cliente esteja disposto a
gastar por dia. O seu anúncio pode começar a ser exibido imediatamente após o processo de construção ou apenas quando você
quiser que ele comece a ser veiculado, clicando em “Executar
esta campanha apenas durante datas específicas”.
Agora, clique em “Definir um lance diferente (modo avançado)”. Serão dadas duas opções de pagamento: CPM (pagamento
por impressões) e CPC (pagamento por cliques).
Se você optar por pagar por impressões, deverá definir
quanto deseja investir a cada mil visualizações de seu anúncio
no Facebook. Caso você prefira pagar por cliques, deve informar
quanto deseja pagar por cada clique em seu anúncio. Ambas as
formas de pagamento nunca excederão o orçamento diário estipulado. O Facebook sugere o valor ideal para que você pague
por clique ou impressões para que seu anúncio seja melhor
Nós já estamos lá! Acesse www.facebook.com/arteccom para
participar de promoções, sugerir temas para reportagens e ficar
por dentro de todas as novidades da empresa, inclusive da revista
Wide. Se a sua empresa ou a de seu cliente ainda não faz parte do
Facebook, lembre-se de que são quase seis milhões de usuários
brasileiros na rede social esperando para “curtir” e consumir o seu
produto. E, pelo celular, temos mais de 150 milhões de usuários
ativos no mundo acessando a rede. Fora isso, os dados levantados
pelo eMarketer (www.emarketer.com) no primeiro trimestre
de 2010 afirmam que os usuários que passam mais tempo no
Facebook gastam mais em compras na internet, com o tíquete
médio chegando em US$ 67. Queremos vê-lo dedicar toda a sua
criatividade para, quem sabe, ultrapassar o Michael Jackson ou a
Lady Gaga em número de fãs. ;-)
81 > CAPA | WIDE |
59
TECNOLOGIA
REPORTAGEM
SMARTY
MUITO MAIS
PRODUTIVIDADE
NA RELAÇÃO
DESIGNERDESENVOLVEDOR
Por Flávia Freire
A
plaudido por quem usa, o Smarty
(www.smarty.net) é um sistema
de template para PHP que merece
destaque por propor organização no
código. “O Smarty, também conhecido
como Templates Engines Smarty, é o sistema de templates
oficial do PHP. É gratuito e pode ser utilizado em aplicações
comerciais. Sua principal função é separar a marcação (HTML) da
programação (PHP), facilitando a manutenção desses arquivos. Na
forma tradicional de desenvolvimento, temos a inserção de tags
PHP dentro do HTML, transformando nosso código no famoso
e conhecido código ‘spaghetti’”, explica Carlos Eduardo Treméa,
instrutor e coordenador do curso de webdesign na Microlins de
Porto Alegre e desenvolvedor PHP da Linea Comunicação.
Veja, a seguir, a comparação usando os dois métodos de desenvolvimento, feita por Carlos Treméa:
Na primeira imagem, desenvolvedor e programador trabalham no
mesmo arquivo. Já na segunda, isolamos fisicamente em dois arquivos: a marcação e a programação. Dessa forma, desenvolvedor e
designer conseguem trabalhar de maneira complementar.
O Smarty auxilia na produtividade do designer e do desenvolvedor, já que evita o retrabalho pelo fato de o designer não
precisar ter acesso ao código PHP. “A grande vantagem de fazer
uso do Smarty é o fato de o desenvolvedor poder confiar no que
o montador HTML e CSS irá alterar. Visto que o código PHP não
ficará embutido no HTML, o trabalho da pessoa responsável por
codificar o layout do sistema é facilitado. Durante o processo de
desenvolvimento, é comum o arquivo ter que voltar ao montador
para algum ajuste, o problema é que antes o PHP também estava
indo junto nesses códigos HTML e, muitas vezes, eles eram alterados acidentalmente, bugando a aplicação e dando retrabalho
para o desenvolvedor. Normalmente, dentro de uma empresa,
essas duas tarefas (desenvolvimento PHP e montagem HTML)
são separadas, e o Smarty auxilia nesse processo, facilitando o
trabalho de ambos”, declara Cristian Trentin, consultor de projetos web e analista e desenvolvedor PHP, que não deixa de usar o
Smarty em nenhum de seus projetos. “Hoje, faço uso do Smarty em
todos os sistemas que desenvolvo, aumentando a produtividade
e diminuindo o prazo de entrega dos projetos. Um fator que me
dava muito trabalho era gerenciar a terceirização da montagem
dos templates. Como foco na qualidade do desenvolvimento PHP,
o Smarty veio me auxiliar há alguns anos nesse ponto. Posso afirmar que meus projetos hoje têm uma qualidade muito maior do
que a grande maioria que se encontra no mercado. São poucos os
que têm a preocupação com a qualidade dos projetos entregues.
Muitos programadores pensam que o principal é entregar apenas
uma aplicação funcionando, não levando em conta a documentação, a padronização, as metodologias de desenvolvimento e
outros fatores. E muitos acham que o cliente jamais saberá o que
está por baixo da parte gráfica, mas deixo de fechar vários contratos pelo simples fato de o projeto não ter um padrão.” Cristian
ressalta também a estrutura do Smarty. “Ele possui um compilador interno com sua própria sintaxe. Os comandos do Smarty
são aplicados diretamente no arquivo HTML e são chamados de
‘modificadores’. Esses modificadores permitem aplicar algoritmos
de decisões ‘if/else’ e de loop, por exemplo. De forma simples, o
Smarty armazena os valores de variáveis processadas no aplicativo e, na página HTML, aplica esses valores inserindo os modificadores. De posse dessas informações, o Smarty ‘compila’ uma
página à parte; o ‘cache’ dessa página ‘compilada’ nada mais é do
que a página HTML feita pelos designers com os códigos PHP inseridos pelos modificadores do Smarty”, completa.
Para os profissionais freelancers, o Smarty cai como uma luva.
“Seu uso facilita o processo e a terceirização de trabalhos, já que
posso enviar um HTML para outra pessoa criar/alterar e não me
preocupar se o meu código PHP ainda funcionará. A facilidade de
implementação no uso do Smarty foi um ponto forte quando estava
em busca de uma template engine, sem falar na parte inteligente
das funções de cache. Mas o que mais gosto nele é a velocidade”,
diz Cristian. Para Ciro Feitosa, gerente de desenvolvimento da BSG
e desenvolvedor PHP há oito anos, são vários os motivos que levam
um profissional a adotar esse modelo. “Velocidade de desenvolvimento, organização para equipes trabalharem em conjunto e facilidade de manutenção do código ou template”, diz.
Devido a essa separação mais segura e detalhada de funções,
81 > TECNOLOGIA | WIDE |
61
TECNOLOGIA
o Smarty segue o conceito MVC (Model View Controller). “O desenvolvedor que busca o Smarty está interessado em qualidade de
desenvolvimento, pois a utilidade básica dele é separar o projeto em
camadas, usando N camadas ou arquiteturas mais populares, como
o MVC. Com isso em mente, tanto o programador PHP quanto os
programadores de interface poderão trabalhar simultaneamente no
mesmo projeto, agilizando muito o processo geral de produção, isso
sem contar na própria separação das camadas, que facilita o debugging, as correções e a manutenção do código. O Smarty oferece uma
biblioteca de opções de apresentação, ou seja, na minha programação eu não preciso me preocupar em como apresentar a informação,
apenas envio a variável para ele e, lá no View, decido como a informação será exibida, como, por exemplo, negrito, itálico, uppercase, lowcase…”, explica Cristiano Gomes, desenvolvedor da Labz Produtora
Digital e programador PHP há cinco anos. Ciro Feitosa esclarece que
o Smarty não implementa totalmente o conceito MVC. “O Smarty
‘tenta’ implementar o padrão MVC porque, na verdade, ele só possui
duas camadas por padrão: a lógica e a apresentação.”
MONTE OHRT E ANDREI ZMIEVSKI
Eles estudaram Ciência da Computação na University of Nebraska, em
Lincoln, nos EUA, e dedicaram suas experiências à criação do Smarty.
Confira mais nesta entrevista exclusiva.
Monte Ohrt
Andrei Zmievski
(Nebrasca, Estados Unidos)
(República do Uzbequistão)
Criador do Smarty e atual
diretor de tecnologia da
New Digital Group
Cocriador do Smarty e atual
diretor e fundador da Analog
(www.analog.coop)
(www.newdigitalgroup.com)
WIDE Como surgiu a ideia de criar um sistema de template para PHP?
MONTE A intenção inicial em 2001 era a de construir um sistema
de template para permitir que designers terceirizados editassem
templates com segurança. Isto é, sem abrir mão da compatibilidade com o servidor do PHP. Juntamente com isso, veio uma
sintaxe simplificada de template {tag}.
ANDREI O primeiro sistema de template que Monte e eu
usávamos depois que começamos a desenvolver em PHP era o
FastTemplate. Ele fazia bem o trabalho, mas não era muito poderoso, então o modificamos bastante e chamamos o resultado
de SmartTemplate. Usamos esse sistema de template por um
tempo, mas sentimos que ainda estava faltando muitas coisas
que seriam legais para desenvolvedores e designers. Escrevi
uma proposta para um sistema de template baseado em C para
ser incluído no PHP por padrão, e houve uma grande discussão durante alguns meses sobre isso, mas o resultado final foi
que as pessoas tinham a sensação de que ele não pertencia ao
core do PHP. Tive que voltar para minha casa, no Uzbequistão,
por alguns meses. Enquanto estive por lá, estava conversando
com o Monte pela internet e ele disse que estava começando a
62
| WIDE | 81 > TECNOLOGIA
desenvolver um novo sistema de template, chamado Smarty.
Quando voltei, ele já tinha um protótipo inicial do trabalho, e
comecei a ajudá-lo nisso. Lembro-me que foquei no conceito
dos modificadores e os implementei, além de desenvolver os
arquivos de configuração. Para a versão 2.0, criei a arquitetura de
plugin e converti tudo o que era possível para plugins. Também
palestrei sobre o Smarty em vários eventos.
WIDE Poderia explicar a simplicidade de desenvolvimento ofere-
cida pelo Smarty?
MONTE Com o Smarty, o ciclo do design se torna uma experi-
ência menor e mais fácil, já que só lidam com a sintaxe {tag} do
Smarty, que é o projeto específico para marcar a apresentação,
ao contrário do PHP.
WIDE Você esperava todo este sucesso quando lançou o Smarty?
MONTE Não esperava, mas imaginei que seria possível, pois tive-
mos um grande sucesso com os nossos próprios clientes antes
de disponibilizá-lo para o mundo, e essa foi uma das razões para
torná-lo open source.
WIDE Quais as novidades da versão 3.0 RC? Quais foram as melhorias mais importantes aplicadas a essa nova versão?
MONTE Várias melhorias, algumas notáveis: a nova engine foi
totalmente reconstruída para PHP 5. Muitas funções do PHP 5 foram
incorporadas à estrutura interna do Smarty. Um novo lexer/parker
nos dá mais recursos na própria linguagem, como in-template math,
mensagens de erro mais refinadas, chamadas recursivas e definições
de função in-template. O Smarty apresenta, agora, template e data
objects, recursos de PHP stream e herança de template.
Hoje, faço uso do Smarty
em todos os sistemas que
desenvolvo, aumentando
a produtividade e
diminuindo o prazo de
entrega dos projetos
WIDE No Brasil, há um bom número de desenvolvedores que uti-
Cristian Trentin
lizam o Smarty e que têm boa participação na comunidade?
MONTE O Smarty é utilizado no mundo inteiro. Temos milhares
de desenvolvedores de cada canto do mundo que visitam o site
diariamente. De acordo com nosso analytics, 2,4% do tráfego do
Smarty vem do Brasil.
ANDREI Sempre achei os desenvolvedores brasileiros muito
inteligentes e entusiasmados. Eles também organizam grandes
comunidades e tomam alguns partidos legais.
81 > TECNOLOGIA | WIDE |
63
TUTORIAL
COMEÇANDO A UTILIZAR
Para fazer o download do Smarty, basta acessar o site www.
smarty.net/download.php e baixar a última versão disponível,
que é a 3.0, lançada em julho deste ano, mas que ainda está na
fase Release Candidate. Lembre-se que a ferramenta que você irá
baixar trabalha apenas com PHP 5.
Ao terminar o download do arquivo compactado, abra a pasta
“demo” e, então, você verá quatro pastas:
convenção, utiliza a extensão .tpl. O arquivo mais importante da
biblioteca Smarty é o Smarty.class.php, que precisa ser inserido em
todos os scripts que façam utilização do Smarty”, completa Carlos.
Segundo Cristian Trentin, não há mistérios nem dificuldades no
aprendizado para quem já é programador PHP. “O próprio manual
contém o Smarty para programadores e o Smarty para designers
de template (montadores). Para ambos, a curva de aprendizado é
muito pequena. Algumas horas de estudo lhe permitirão criar sua
primeira aplicação fazendo uso de templates.”
Para Ciro Feitosa, o Smarty diferencia-se por usar um propósito
de simplicidade. “Mesmo iniciantes conseguirão usá-lo de forma
simples, uma vez que o padrão de template é muito fácil de ser assimilado. Outro ponto a seu favor é que o Smarty possui dezenas de
funções pré-prontas que facilitam o trabalho, como, por exemplo, a
criação de campos de formulários (html_options, html_checkboxes,
html_radios etc.). Isso acelera o desenvolvimento, quando se trata de
registros dinâmicos vindo de um banco de dados, por exemplo”.
ANALISANDO O CÓDIGO
Para entendermos como o Smarty funciona, Ciro elaborou um
exemplo de aplicação com Smarty. Confira:
CARLOS TREMÉA EXPLICA ESSES DIRETÓRIOS:
cache: pasta usada pelo Smarty para armazenar os arquivos usados quando a opção de cache está habilitada.
configs: pasta que deve conter os arquivos de configuração ‘.conf’.
templates: pasta em que devem estar os arquivos ‘.tpl’, onde ficam
os códigos HTML e do próprio Smarty.
templates_c: pasta usada pelo Smarty para armazenar as páginas
compiladas. Essa pasta deve ter permissão de escrita no servidor.
Para o Smarty começar a funcionar, são necessários apenas dois
diretórios, segundo Ciro. “São eles: templates, onde ficarão todos os
templates; e templates_c, diretório de cache dos templates. A criação
de subdiretórios dentro do ‘templates’, por exemplo, fica a critério do
responsável pelo projeto. Esses nomes podem e, por razão de segurança, devem ser alterados modificando os atributos $template_dir e
$compile_dir da classe Smarty em ‘Smarty.class.php’.
Para começar a utilizar o Smarty, Carlos Treméa disponibilizou
uma vídeo-aula, que pode ser assistida em vimeo.com/10230706,
na qual explica todo o processo de instalação da versão 2.6.26,
a última estável, e ensina como dar os primeiros passos com a
template engine. “A utilização do Smarty é muito fácil. Depois de
fazer o download dos arquivos, basta instanciar um objeto para a
utilização dos métodos dessa classe. Um arquivo deve ser criado
para se fazer a utilização dos comandos HTML. Esse arquivo, por
64
| WIDE | 81 > TECNOLOGIA
Ambiente fictício: e-commerce rodando PHP/MySQL com uma
tabela “pedidos”.
Campos da tabela: id (int), data/hora (timestamp), valor (float),
comprador (string), status (0 = pendente; 1 = pago; 2 = cancelado).
PHP: deve ler a tabela de pedidos no banco de dados e associá-la a
um array.
Template: deve mostrar esse array numa tabela.
CÓDIGO PHP:
<?php
/**
* neste ponto você deve inicializar e
instanciar o Smarty
* além, é claro, de conectar ao bd
*/
// inicialize e instancie o Smarty
// conecte ao bd
/**
* percorre a tabela e associa a um array
*/
$sql = “SELECT
*
FROM
pedidos
ORDER BY
datahora DESC”;
$dados = mysql_query($sql);
TECNOLOGIA
while ($linha = mysql_fetch_array($dados,
MYSQL_ASSOC)) {
$pedidos[] = $linha;
}
$smarty->assign(‘pedidos’, $pedidos);
/**
* mostrar o template do smarty
*/
$smarty->display(‘pedidos.tpl’);
?>
<head>
<title>Exemplo de Smarty</title>
</head>
<body>
{$nome} //Aqui passamos a variável que irá
conter o conteúdo passado pelo php
</body>
</html>
Já Carlos Eduardo Treméa especifica o arquivo de configuração
do Smarty:
CÓDIGO TEMPLATE:
ARQUIVO DE CONFIGURAÇÃO DO SMARTY:
<table>
<tr>
<th>ID Pedido:</th>
<th>Data:</th>
<th>Comprador:</th>
<th>Status:</th>
</tr>
{foreach from=$pedidos item=p}
<tr>
<td>{$p.id}</td>
<td>{$p.datahora|date_format:”%d/%m/%Y
%H:%M”}</td>
<td>{$p.comprador}</td>
<td>{if $p.status == 0}Pendente{elseif
$p.status == 1}Aprovado{else}Cancelado{/
if}</td>
</tr>
{/foreach}
</table>
<?php
//constante para o smarty
define(‘SMARTY_DIR’,’lib/Smarty/libs/’);
//pasta onde esta o smarty
include(SMARTY_DIR.’Smarty.class.php’);
//Criando um objeto da classe Smarty
$smarty = new Smarty();
$smarty->cache_dir = “cache”;
$smarty->config_dir = “configs”;
$smarty->compile_dir = “templates_c”;
$smarty->template_dir = “templates”;
?>
Cristian Trentin também exemplifica a diferença entre o código do
desenvolvedor e o código que é modificado pelo designer de template:
Código PHP:
<?php
//Requere o arquivo smarty.inc.php
require_once(ROOT.”system/include/
smarty.inc.php”);
//Seta o nome para o tpl
$smarty->assign(‘nome’, ‘Fulano de
tal’);
//Display no template
$smarty->display(‘index.tpl’);
?>
CÓDIGO TEMPLATE:
<html>
ARQUIVO PHP (AQUI FICA TODA PROGRAMAÇÃO E REGRA DO
NEGÓCIO):
<?php
//incluindo o arquivo de configuração do
Smarty
include(‘config.php’);
$nome = ‘Carlos Eduardo’;
$site = ‘www.kadunew.com/blog’;
$smarty->assign(‘teste’,$nome);
$smarty->assign(‘site’,$site);
$smarty->display(‘index.tpl’);
?>
ARQUIVO TEMPLATE (RESPONSÁVEL POR MOSTRAR TUDO QUE
FOR EXECUTADO NO ARQUIVO PHP. DEVE VIR ENTRE CHAVES
“{...}”):
<html>
<body>
<h1>Trabalhando com Smarty</h1>
{$teste}
<br />
{$site}
</body>
</html>
81 > TECNOLOGIA | WIDE |
65
TECNOLOGIA
O Smarty possui dezenas de
funções pré-prontas que
facilitam o trabalho, como,
por exemplo, a criação de
campos de formulários
Ciro Feitosa
PLUGINS E INTEGRAÇÕES PARA SMARTY
O Smarty permite a alteração dos seus delimitadores, a criação de
plugins e a integração com diversos frameworks. “Basta dar uma
pequena pesquisada na internet para localizar como integrá-lo
com ZendFramework, CodeIgniter e CakePHP, entre outros”, esclarece Cristian Trentin.
O repositório oficial de plugins do Smarty pode ser acessado
em www.smarty.net/contribs/plugins. Segundo Cristiano Gomes, os
plugins do Smarty são extremamente fáceis de instalar. “Por meio
da propriedade ‘plugin_dir’ da classe ‘Smarty’ é possível configurar
o caminho até a pasta em que ficam os plugins. Eles são carregados
sob demanda, e o Smarty só inclui os códigos daquele plugin se o
modificador referente a ele for encontrado dentro do HTML.”
PLUGINS MAIS UTILIZADOS:
SmartyValidate: utilizado para validação de formulários. www.
phpinsider.com/php/code/SmartyValidate
SmartyFormtool: oferece uma gama de controles de JavaScript
para formulário. www.phpinsider.com/php/code/SmartyFormtool
SmartyPaginate: oferece um sistema de paginação de resultados.
www.phpinsider.com/php/code/SmartyPaginate
SmartyMenu: para menus dropdown onMouseOver controlado
por CSS. www.phpinsider.com/php/code/SmartyMenu
HORA DE ESTUDAR!
Nada melhor do que o manual oficial de Smarty em português
para conhecer todas as funções da template engine. Ele pode ser
acessado em www.smarty.net/manual/pt_BR.
O fórum oficial (www.smarty.net/forums) possui mais de 14 mil
usuários e é a melhor referência para encontrar respostas para
suas dúvidas. E a lista de discussão para desenvolvedores do Brasil
e de Portugal fica em br.groups.yahoo.com/group/smarty-pt.
Se código bom é código limpo e bem-estruturado, e sendo você
um desenvolvedor dedicado a seguir as regras rígidas de organização, o Smarty não pode deixar de fazer parte do seu trabalho.
66
| WIDE | 81 > TECNOLOGIA
80
81 > TECNOLOGIA | WIDE |
67
TECNOLOGIA
Front-end
Profissionais do Brasil e
do exterior falam sobre a
importância da presença
desse especialista nas equipes
de desenvolvimento
68
| WIDE | 81 > TECNOLOGIA
Ilustração - Carolina Vigna-Marú
O reconhecimento sobre a necessidade de um front-end
engineer em uma equipe ainda é baixo. Seria isso razão do
desconhecimento das funções desse profissional por parte
dos diretores e gestores de projetos?
Os profissionais front-end não tiram o espaço dos designers nem
dos desenvolvedores. Eles focam suas habilidades nas melhores
práticas do design e do desenvolvimento, dando mais força à
usabilidade e à interatividade do site, preocupando-se, ainda,
com acessibilidade, internacionalização, arquitetura da informação, mobilidade e qualidade do projeto em geral.
Então, se o profissional front-end precisa entender de Web
Standards, Web 2.0, HTML, CSS, JavaScript, AJAX, interface, media
types, cross-browser, cross-platform e tantas outras áreas do
desenvolvimento de um site, como ele deve se preparar e qual a
formação ideal para que se torne especialista? As empresas têm
mostrado interesse em profissionais com esse perfil? Quais partes
do projeto ele deve acompanhar e quando pode dar início ao seu
trabalho? Até que ponto os profissionais front-end são essenciais
para o sucesso de um site?
Para responder a tais questões e mostrar a importância desse
profissional, convidamos cinco especialistas no assunto e atuantes
na área.
Marcel Duran
Front-end engineer na equipe de Search do Yahoo!,
no Vale do Silício
www.javascriptrules.com
A base de conhecimento do profissional
front-end compreende três principais
camadas: conteúdo, apresentação e
comportamento, em que HTML, CSS e
JavaScript se encaixam respectivamente.
Para que a integração dessas camadas seja
bem-sucedida, o profissional deve ter um
vasto repertório em diversas áreas, como
performance, segurança, experiência
do usuário, acessibilidade, testes/qa e
internacionalização.
Por envolver distintas áreas do
conhecimento, não há formação específica
para o front-end. Esses profissionais são,
em sua maioria, autodidatas com ou
sem formação na área de tecnologia. Sua
atualização e o aperfeiçoamento de suas
habilidades são feitos por meio de leitura
de livros técnicos, blogs, fóruns, listas de
discussões, vídeos e conhecimento de
frameworks e ferramentas que dão suporte
ao desenvolvimento do projeto. É comum
esses profissionais publicarem blogs e
participarem de discussões sobre as diversas
áreas envolvidas com expoentes da área.
O trabalho do front-end é essencial para
a qualidade e o sucesso de um projeto web
durante todas as etapas, desde a escolha do
framework ao levantamento de métricas
de uso/performance do site em produção.
Como seu conhecimento é abrangente,
uma decisão sem sua devida supervisão,
embora aparentemente correta, pode
significar retrabalho ou fracasso de um
futuro ciclo, gerando custo extra e outros
problemas para a equipe. Isso se deve à falta
de conhecimento das partes envolvidas no
desenvolvimento do projeto. Muitas vezes,
Empresas brasileiras têm demonstrado
pouco ou nenhum interesse pelo
profissional front-end, ao contrário do
mercado norte-americano, onde há uma
enorme demanda. Grandes empresas
do Vale do Silício, como Yahoo! e Google,
promovem a cultura front-end por meio
de encontros desses profissionais, para
que apresentem e discutam os mais
diversos assuntos relacionados ao seu
Empresas brasileiras têm demonstrado
pouco ou nenhum interesse pelo
profissional front-end, ao contrário do
mercado norte-americano, onde há uma
enorme demanda
detalhes sutis passam desapercebidos
ou são completamente ignorados por
designers, programadores ou até mesmo
gerentes de projeto que desconhecem, por
exemplo, a diferença entre renderizações
em distintos browsers, a mantenabilidade
de um framework, possíveis brechas de
segurança, responsividade mínima para
garantir a melhor experiência ao usuário
e melhores práticas de performance e
qualidade de código.
trabalho. Além de ser um espaço rico
para o intercâmbio de conhecimento,
esses eventos também são uma excelente
ocasião para networking e ofertas de
vagas disponíveis. Como há poucos
profissionais front-end disponíveis no
mercado, recrutadores de empresas norteamericanas têm usado diversos incentivos
financeiros e outros benefícios para atraílos, como bônus por referência a amigo que
chegam a 10 mil dólares em alguns casos.
81 > TECNOLOGIA | WIDE |
69
TECNOLOGIA
Rafael Mumme
Desenvolvedor front-end senior na HUGE
de Nova Iorque
www.hugeinc.com
@mumme
O desenvolvedor front-end exerce um papel fundamental
na criação e implementação de qualquer website. É um erro
subestimá-lo. Acompanhando a rápida evolução da internet e dos
navegadores, a profissão se desenvolveu bastante nos últimos dez
anos, exigindo conhecimento profundo na sua área de atuação e
constante atualização. Além disso, o desenvolvedor front-end deve
ter uma visão geral sobre diversas outras áreas.
No Brasil, o cargo ainda é desvalorizado e, por isso, vários
profissionais se tornam desenvolvedores server-side. Dessa
forma, é muito difícil encontrar front-ends brasileiros experientes
e qualificados. No entanto, nos Estados Unidos a situação é bem
diferente. O mercado é aquecido e o profissional é bem remunerado.
A visão por aqui é a de que investir nessa área é importante e gera
um retorno lucrativo. Por isso, grandes empresas, como Yahoo!,
Google, Twitter, Microsoft e Adobe, investem pesado em front-end.
HOJE, CADA VEZ MAIS DISTANTE DO APELIDO DE HTMLER OU COPYAND-PASTER, O DESENVOLVEDOR FRONT-END É RESPONSÁVEL POR:
qBTTFHVSBSDPNQBUJCJMJEBEFDSPTTCSPXTFSFDSPTTQMBUGPSN
qQSPEV[JSDÒEJHPMJNQPCFNEPDVNFOUBEPFFTUSVUVSBEP
qDSJBSQÂHJOBTXFCSÂQJEBT
qTFHVJSPTXFCTUBOEBSET
qBQMJDBSUÉDOJDBTEF4&04FBSDI&OHJOF0QUJNJ[BUJPO
É importante ser caprichoso e dedicado e, como em qualquer
outra profissão, muito trabalho e estudo são essenciais. A web é sua
fonte principal de conhecimento, onde novos artigos, bibliotecas
e estudos são publicados diariamente — e, o que hoje é padrão,
amanhã se torna obsoleto.
Por se tratar de uma profissão que requer programação, é comum
ver profissionais formados em Tecnologia da Informação atuando
nessa área. A progressão natural da profissão é a especialização em
uma de suas áreas de conhecimento, como, por exemplo, especialista
em performance ou consultor SEO. O cargo de gerente, liderando
outros desenvolvedores, também é uma boa opção.
O desenvolvedor front-end deve participar de todas as fases de
um projeto web. É ele quem conhece as restrições dos diferentes
navegadores, devendo atuar com sugestões e alternativas para
tornar o projeto viável. Muitas vezes, sua presença pode ser
considerada frustrante, mas trabalhar com limites nos torna mais
criativos e eficientes. O sucesso de um projeto web está diretamente
ligado a sua experiência e qualificação.
Por fim, trabalhar como desenvolvedor front-end é gratificante
e desafiador. Empresas que valorizam e respeitam nosso trabalho
crescem e contribuem para uma internet ainda melhor.
70
| WIDE | 81 > TECNOLOGIA
Grandes empresas, como
Yahoo!, Google, Twitter,
Microsoft e Adobe,
investem pesado em
front-end
Eduardo Lundgren
Engenheiro de software na Liferay Inc. e criador do AlloyUI
JavaScript Framework
www.eduardolundgren.com
Houve uma época em que o
desenvolvedor de softwares
desempenhava um papel generalizado,
sendo responsável tanto pela criação
e integração do hardware quanto pela
modelagem e desenvolvimento do
software utilizado. Essa realidade está
mudando e hoje há uma intensificação
da divisão do trabalho, fracionando as
etapas do desenvolvimento, de modo
que o engenheiro desenvolva tarefas
ultraespecializadas, o que tem se
mostrado bastante eficaz. Por outro lado,
o fracionamento das tarefas não garantiu
uma divisão igualitária para todos os ramos
do desenvolvimento.
A falta de um profissional
especializado nessa área pode
representar risco ao projeto
Em algumas empresas ainda existe muito
preconceito em relação aos profissionais
especializados em front-end. A falta de
um profissional especializado nessa área
pode representar risco ao projeto. Numa
aplicação web, seja ela intra ou extra-net,
no geral, o back-end é responsável por
apenas cerca de 20% da performance
do software, o que inclui a execução do
código no servidor, o tempo das consultas
ao banco de dados, a geração dos dados
de saída (HTML, XML, JSON etc.) e a
transferência dos dados para o client-side
(browser). Uma vez recebidos os dados
do servidor, o browser tem que processar
e renderizar o HTML, executar os in-line
scripts, requisitar JavaScript, CSS, imagens
e todos os outros componentes externos
utilizados pela página HTML. O front-end
é responsável por mais de 80% do tempo
gasto no carregamento de uma página web.
As empresas mais visionárias valorizam
cada vez mais os profissionais dessa
área, o que as tornaram líderes quando
comparadas a empresas em que diretores e
gestores não sabem diferenciar o papel de
um desenvolvedor front-end numa equipe.
Boa parte das arquiteturas e das
design patterns utilizadas em softwares
desenvolvidos em linguagens como
JAVA e C++ podem ser aplicadas, por
exemplo, a frameworks desenvolvidos em
JavaScript. Na área de softwares para web,
o desenvolvedor responsável pelo frontend pode ter conhecimentos avançados
de programação. Por isso, não é seguro
assumir que um profissional front-end é
também um designer.
Para se tornar um especialista em
qualquer assunto requer-se muito estudo
e prática. Tal constatação também se
aplica ao profissional front-end. Utilizar
alguns conceitos de Engenharia de
Software é fundamental para desenvolver
componentes ou frameworks em JavaScript.
Se envolver com projetos open source na
área também é algo muito importante.
Muitas empresas têm mostrado
interesse em profissionais com esse
perfil. A presença de um front-end é
relevante na maioria das fases de um
projeto web, pois, trabalhando em
sintonia com os desenvolvedores
back-end, resulta em uma divisão
mais organizada das camadas de uma
aplicação e sua integração, o que, muitas
vezes, produz códigos menos complexos
no back e no front-end. Portanto, se a
preocupação do seu projeto web é ter um
código mais organizado, uma integração
entre as camadas mais inteligente e uma
performance melhor, a presença de um
especialista nessa área é indispensável.
81 > TECNOLOGIA | WIDE |
71
TECNOLOGIA
Guilherme Chapiewski
Sr. Engineering Manager no Yahoo! Inc.
gc.blog.br
@gchapiewski
Antigamente, ninguém pensava muito na interface. Aliás, mais
antigamente ainda — quando a web começou — era tudo “preto no
branco” e sem imagem; os sites eram praticamente texto corrido.
Depois, a web era feita quase que totalmente de sites institucionais,
que também não tinham requerimentos especiais, além de ter
uma aparência legal para não “queimar o filme” da empresa. Com a
chegada da Web 2.0, isso tudo mudou.
O domínio de especialidades
de front-end pela equipe é
essencial para o sucesso de um
produto na web
Hoje em dia, a “User Experience” na web é mais do que essencial.
Um site que oferece uma boa experiência faz com que seus usuários
sejam mais engajados e passem mais tempo usando o produto, que
é o que todo mundo busca no fim das contas.
Não se tem boa UX com um “design bonito” (ou com aquelas
introduções em Flash desnecessárias). Para uma boa experiência
na web, além de um design que facilite o consumo do conteúdo,
a sua interface precisa ser fácil de usar, leve, oferecer uma boa
interatividade, ser otimizada para dispositivos móveis e por aí vai.
Atualmente, não basta apenas ter um produto legal. Ele não
decola se a interface for ruim. A nova geração de produtos na web
é pensada para causar um efeito “wow” nas pessoas. Olhe para
o Twitter, o Facebook, o próprio Yahoo!. Todos estão sempre se
reinventando, buscando trazer uma experiência cada vez melhor
para seus usuários e, nesse cenário, as disciplinas de front-end são
muito importantes.
Particularmente, acredito que, na maioria dos casos, você
não terá uma pessoa que só trabalha com design, outra com
implementação de interface, outra só com back-end etc. Parte
dos skills de Front-end é absorvida pelos designers, e outra, pelos
72
| WIDE | 81 > TECNOLOGIA
desenvolvedores, e, na maioria dos projetos, são essas as duas
especialidades que existirão. Ou seja, não vejo ninguém tirando o
espaço de ninguém :)
No geral, vejo as especialidades de front-end mais ligadas ao
desenvolvimento do que ao design. O desenvolvedor já teve
contato com diversas linguagens de programação, então ele tem
facilidade para entender como usar JavaScript, programar para
vários browsers, HTML, CSS etc. Ainda, para trabalhar com AJAX e
fazer otimizações, é preciso entender do protocolo HTTP, de como
o servidor processa requisições ou até mesmo de infraestrutura
(como funciona um cluster, uma CDN etc.). Desenvolvedores,
geralmente, já estão acostumados com essas coisas, então acaba
sendo relativamente fácil entender do resto.
Não quero dizer com isso que designers não devem procurar
entender essas disciplinas; muito pelo contrário. É um diferencial
enorme para designers saber como funciona principalmente
HTML, CSS e JavaScript, primeiro porque eles começam a
compreender melhor as possibilidades que têm, segundo
porque previne que façam interfaces impossíveis de serem
implementadas e, terceiro, porque podem passar a prototipar e
definir melhor a interatividade que desejam oferecer. Os melhores
designers que conheci muitas vezes fizeram a diferença por
dominarem esses tópicos.
Sobre o mercado, observo que as empresas estão
extremamente interessadas em profissionais especialistas
em front-end, porém estão mais interessadas ainda em
desenvolvedores ou designers multidisciplinares, que, dentre
outras coisas, são especialistas em disciplinas de front-end.
Por último, não diria exatamente que profissionais de front-end
são essenciais para o sucesso de um site. Eu reescreveria para: “o
domínio de especialidades de front-end pela equipe é essencial para
o sucesso de um produto na web”. Acho que não necessariamente
você precisa ter profissionais que fazem só isso na equipe; pode-se
ter designers e/ou desenvolvedores especialistas em front-end,
funcionará do mesmo jeito. Além disso, para mim está bem claro que
você precisa muito dessas especialidades para desenvolver o Gmail,
ou o Facebook, ou o Yahoo! Pipes, mas não necessariamente para
um site institucional, por exemplo.
Preocupadas com a
qualidade dos produtos,
inúmeras empresas
estão à procura de
profissionais com esse
perfil: desenvolvedores
com sólidos
conhecimentos em
linguagem de marcação,
folhas de estilo,
JavaScript e Flash
Felipe Silva
Desenvolvedor front-end da Globo.com
@felipe_silva
Para muitas empresas, as disciplinas
relacionadas ao universo de front-end são
compartilhadas entre designers, arquitetos
de informação e desenvolvedores.
Para outras, elas ficam a cargo de um
profissional exclusivo. Quando as
empresas começaram a aplicar técnicas
ágeis para gestão e desenvolvimento
de produtos, utilizando times
multidisciplinares, esse cenário ficou
ainda mais confuso.
O desenvolvimento de sites/aplicações
web com foco na experiência do usuário
é um caminho sem volta. Isso somado à
melhoria dos navegadores, crescimento da
banda larga, número de dispositivos móveis
com acesso à internet no mercado e novas
tecnologias, o que acabou transformando
o desenvolvimento de interfaces em algo
extremamente complexo.
É importante existir um profissional
de front-end focado em estudar e se
manter informado sobre o avanço dessas
tecnologias. Designers e desenvolvedores
back-end devem aproximar-se do
desenvolvimento front-end, sobretudo
porque a experiência do usuário em uma
interface depende diretamente do trabalho
realizado por eles.
Costumo dizer que, para ser um frontend engineer, é preciso ser formado em
Tecnologia da Informação e ter intimidade
com práticas e teorias relacionadas ao
design, ou, ainda, ser formado em Design e
ter intimidade com lógica de programação
e arquitetura de software. Isso porque a
construção de interfaces complexas exige
conhecimento em engenharia de software,
design e arquitetura de informação. Por
esse motivo, existem no mercado de
trabalho front-end engineers com diferentes
formações acadêmicas.
Apesar das possibilidades citadas, aqui
na Globo.com a grande maioria dos front-
end engineers são formados em Tecnologia
da Informação ou afins. Com a evolução do
hardware dos usuários, navegadores mais
poderosos e as novas tecnologias, foi possível
migrar grande parte das regras de negócio
dos sites e aplicações web para o cliente
(navegador do usuário). Dessa forma, são
necessários muita lógica de programação,
conhecimento em arquitetura de software
e outros atributos que pertencem à grade de
uma faculdade de tecnologia.
Preocupadas com a qualidade dos
produtos, inúmeras empresas estão
à procura de profissionais com esse
perfil: desenvolvedores com sólidos
conhecimentos em linguagem de
marcação, folhas de estilo, JavaScript e
Flash. Além de serem capazes de portar os
sites e as aplicações web para os diversos
navegadores e dispositivos disponíveis no
mercado. Usabilidade, SEO e performance
também fazem parte do grupo.
81 > TECNOLOGIA | WIDE |
73
TECNOLOGIA
Por Flávia Freire
Graeme Rocher
O britânico líder de
desenvolvimento da
SpringSource e cofundador
do Grails fala sobre esse
poderoso framework de
aplicações web
74
| WIDE | 81 > TECNOLOGIA
Graeme Rocher
Líder de desenvolvimento da SpringSource e cofundador do Grails.
Inicialmente chamado de “Groovy on Rails”, o Grails (www.grails.
org) foi lançado em março de 2006 como um framework de alta
produtividade para o desenvolvimento de aplicações web na plataforma Java, baseado nos frameworks Hibernate (www.hibernate.
org) e Spring (www.springsource.org).
O britânico coautor do livro Definitive guide to Grails (migre.
me/1rVX5), Graeme Rocher, é líder de desenvolvimento da
SpringSource e roda o mundo palestrando sobre Grails, Groovy
(groovy.codehaus.org) e Java.
WIDE Quando o Grails foi criado? Por qual razão você decidiu lançar
um framework Java? Quais melhorias você quis oferecer por meio do
Grails, comparando com outros frameworks Java?
GRAEME O Grails foi criado em 2005. Havia uma lacuna de um framework que oferecesse características dinâmicas encontradas em
frameworks como Ruby on Rails e Django, mas desenvolvido para
a JVM (Java Virtual Machine). As melhorias encontradas no Grails
são realmente em relação à produtividade. Você não encontrará
um framework mais produtivo na JVM hoje.
WIDE O Grails é livre e open source?
GRAEME Sim. O Grails é livre e sob a licença Apache 2.0 liberal
Open Source.
WIDE O Grails complementa o desenvolvimento de aplicações Java,
desde que sejam construídas em Spring e baseadas em Groovy, a
principal linguagem dinâmica para a plataforma Java. Para desenvolver aplicações em Grails, que tipo de conhecimento sobre Spring e
Groovy é necessário?
GRAEME Muitas pessoas desenvolvem aplicações sem o conhecimento de Spring, no entanto há muito a ser ganho com o aprendizado de Spring. Quanto ao Groovy, quando você quiser usar
qualquer framework é bom aprender a linguagem em que foi
desenvolvido. Então, saber Groovy é necessário. Esclarecendo
que a curva de aprendizado de Groovy é muito menor para os
desenvolvedores Java do que para os desenvolvedores de outras
linguagens, devido à similaridade do Groovy com o Java.
WIDE O que significa o princípio “Convenção sobre Configuração”
no Grails?
GRAEME Em vez de requerer aos desenvolvedores que especifiquem valores de configuração via anotações ou XML, o Grails
infere na configuração das convenções nas fontes dos projetos.
WIDE Como o Grails ajuda os times de desenvolvimento a adotar
metodologias ágeis?
GRAEME Linguagens dinâmicas tipicamente funcionam muito
bem em times ágeis devido à facilidade de simular o comportamento dinâmico. Existem também ótimas ferramentas de teste no
espaço Groovy, como Spock para testes BBD (code.google.com/p/
spock), Geb para testes funcionais (github.com/geb/geb), assim
como a construção de Grails em framework mocking.
WIDE Grails é um framework fácil de aprender para os desenvolvedores Java? E para desenvolvedores de outras linguagens?
GRAEME Groovy é uma linguagem muito flexível que fornece
as características necessárias para que uma ampla variedade de
desenvolvedores com diferentes origens sintam-se confortáveis.
Temos desenvolvedores PHP, Ruby e Python usando Grails com
facilidade. Essas mesmas pessoas achariam muito mais difícil e
menos agradável usar uma estrutura baseada em Java.
WIDE O que é possível desenvolver com Grails? Existem plugins para
todas as funcionalidades que um desenvolvedor pode vir a precisar
para construir um site?
GRAEME Cada aplicação é diferente e existem muitos problemas,
que seria impossível se ter um plugin para cada cenário, mas os
cenários comuns são cobertos por nossos plugins, incluindo necessidades como segurança, caching, web services e assim por diante.
WIDE Por que o Grails garante que projetos Web 2.0 sejam feitos em
semanas, em vez de meses, entregando aplicações de qualidade em
um tempo reduzido?
GRAEME Isso é baseado em informações de nossos clientes e nas
experiências da comunidade. O feedback que recebemos é de um
81 > TECNOLOGIA | WIDE |
75
TECNOLOGIA
Temos desenvolvedores
PHP, Ruby e Python usando
Grails com facilidade
ciclo de desenvolvimento dos projetos drasticamente reduzido
em relação a outros frameworks Java.
WIDE Qual o diferencial do Grails em comparação com outros
frameworks web dinâmicos da JVM?
GRAEME Não existem muitos outros frameworks web dinâmicos na
JVM. A principal outra opção é o JRuby on Rails e, comparando os
dois, o Grails é mais integrado ao Java e suas ferramentas. Com Grails
você pode usar as mesmas IDE’s, depuradores, ferramentas de monitoramento e gerenciamento, perfis e assim por diante. Contudo, com
JRuby on Rails você fica mais no ecossistema Ruby do que no Java.
A outra grande vantagem do Grails em relação ao JRuby on Rails é
a performance. Em nossos testes, o Grails pode lidar de três a cinco
vezes mais com requisições por segundos do que o JRuby on Rails.
WIDE Qual a vantagem de ser desenvolvido por Spring?
GRAEME A vantagem é que com Grails se tem produtividade e
usabilidade de um framework web dinâmico, mas você também
tem toda a flexibilidade oferecida pelo container do Spring. O Spring
pode ser usado para uma diversidade de funções, como remoting,
integração empresarial, processamento em lote e por aí vai. É muito
mais que um simples container de injeção de dependência. Com
Grails você tem todo o poder necessário, então nunca encontrará
uma barreira que o impossibilite de continuar.
WIDE O Grails está agora na versão 1.3.4 binária. O que essa versão
traz em produtividade na plataforma Java em comparação às versões anteriores?
GRAEME O Grails 1.3 introduziu o gerenciamento de dependências
para plugins, verificação de lixeira, consultas nomeadas, entre
outras funcionalidades. Tais características são descritas com mais
detalhes nas notas de lançamento: grails.org/1.3+Release+Notes.
WIDE Onde os desenvolvedores podem encontrar tutoriais e a docu-
mentação para aprender a desenvolver com Grails? Existe informação sobre o framework e material para estudo em português?
GRAEME A referência de documentação mais recente pode
ser encontrada em www.grails.org/doc/latest. Existem diversos
tutoriais sobre Grails, alguns deles podem ser encontrados na nossa
página de tutoriais: www.grails.org/Tutorials. Eu não falo português
(embora meu espanhol seja digno), por isso não posso recomendar
76
| WIDE | 81 > TECNOLOGIA
fontes, mas sei que há uma grande comunidade no país, a Grails
Brasil (www.grailsbrasil.com), que parece ser bastante ativa e um
bom lugar para solicitar informações.
WIDE E sobre a comunidade e as listas de discussão, quais são as
oficiais e como está a frequência em relação à colaboração dos
usuários?
GRAEME Há o fórum oficial, SpringSource Grails, que se encontra em
migre.me/1rWSA, e uma lista de discussão em grails.org/Mailing+lists.
A lista recebe mais de cem e-mails por dia e o fórum, apesar de novo,
já é bastante ativo.
WIDE Poderia destacar alguns sites desenvolvidos com Grails?
GRAEME Existem muitos grandes sites escritos em Grails, incluindo
o Manymoon (www.manymoon.com), o eHarmony (www.eharmony.
com), o Walmart MP3 Music Downloads (mp3.walmart.com), o Sky
(www.sky.com) e a página de análise de produtos da revista Wired
(www.wired.com/reviews), só para listar alguns..
Confira o estudo de caso de um site totalmente desenvolvido em Grails na
entrevista a seguir.
80
81 > TECNOLOGIA | WIDE |
77
Grails para os
melhores momentos
Há poucos anos no mercado,
o framework já garante
recursos ilimitados para
a criação de todo tipo
LOGIA
TECNO de aplicação web. O site
| 80 >
Noite Universitária é a
comprovação brasileira da
produtividade do Grails.
78
| WIDE | 81 > TECNOLOGIA
TECNOLOGIA
Um dos mais famosos sites de eventos do Rio de Janeiro, o Noite
Universitária (www.noiteuniversitaria.com.br), está no ar desde
2001. Devido ao seu grande sucesso, em 2007 passou por uma reformulação para atender melhor aos mais de 300 mil usuários cadastrados e foi totalmente reconstruído em Grails. Hoje, o site recebe,
por mês, cerca de 61 mil visitantes e aproximadamente um milhão
de page views mensais.
O responsável técnico pelo desenvolvimento do site Noite
Universitária em Grails é o sócio das startups Peladeiro.com.br e
Manubia.com.br, Felipe Fortes Nascimento, mestre em Engenharia de
Software pela PUC-Rio e desenvolvedor e consultor de TI nas áreas de
Arquitetura de Sistemas Web e Processos Ágeis de Desenvolvimento
de Software. Com mais de doze anos de experiência na área, é ele
quem fala dos recursos do framework utilizados em todo o sistema,
que inclui controle de login, processamento de imagens, envio de
e-mails, módulo administrativo, geração de relatórios e muito mais.
WIDE Por que o Grails foi o framework escolhido para desenvolver o
Noite Universitária? Você tomou essa decisão ou a empresa estipulou
o framework que desejava para o site?
FELIPE O Grails foi o escolhido por ser um framework que junta
alta produtividade de desenvolvimento com a robustez do mundo
Java e dos diversos frameworks consagrados nos quais o Grails se
baseia (Spring, Hibernate, Sitemesh etc.). A decisão foi tomada por
mim. Na época do desenvolvimento inicial do Noite Universitária,
o Grails estava em sua versão 0.3. Então, foi uma aposta que no final
se mostrou acertada.
Uma das grandes vantagens do Grails é que ele usa Groovy, uma
linguagem executada na JVM. Ou seja, no final das contas é tudo
Java. E isso possibilita o uso de bibliotecas e frameworks Java diretamente na sua programação Groovy. Tudo do mundo java que
existe há anos pode ser usado numa aplicação Grails. Isso é uma
enorme vantagem.
WIDE É preciso ser especialista em Java, Spring e Groovy para desenvolver um site em Grails? O quanto se deve saber de cada uma dessas linguagens?
FELIPE Como o Grails é um framework na linguagem Groovy,
conhecê-la é essencial. Porém, é muito fácil de se aprender quando
se conhece Java. Se uma pessoa conhece Java, não terá qualquer
dificuldade para programar em Groovy e, consequentemente, em
Grails. Não é preciso ser especialista em Spring ou Hibernate, mas
conhecer esses frameworks pode ajudar bastante.
WIDE Quais plugins do Grails foram utilizados no site Noite
Universitária e em quais aplicações?
FELIPE Quando iniciamos o desenvolvimento com Grails, o framework estava na versão 0.3. Era muito incipiente ainda. Por conta
disso, não havia a grande oferta de plugins que há hoje. Usamos os
plugins básicos de Hibernate Plugin e Quartz Plugin, mas tivemos
que criar nossas próprias soluções para alguns dos problemas que
tivemos. Se fosse hoje, certamente usaríamos plugins como o Mail
Plugin, ImageTools Plugin, Email Confirmation Plugin e outros.
WIDE Nas fotos, as marcas d’água do Noite Universitária são gera-
das pelo fotógrafo em algum programa de edição de imagem ou há
algum sistema criado em Grails que faz a inclusão do logotipo nas
fotos?
FELIPE A marca d’água nas imagens é criada em tempo de execução pela aplicação Grails. Após o fotógrafo fazer o upload da imagem, o sistema a manipula para diminuir seu tamanho e criar a
marca d’água. Fizemos isso usando o projeto ImageMagick. Há um
post no meu blog exatamente sobre isso: migre.me/1rX6A.
FELIPE Todo o site do Noite Universitária é desenvolvido em Grails,
WIDE Como foi criada a opção de enviar a foto para um e-mail, que é
proposta quando um usuário clica em uma foto o a vê ampliada?
FELIPE Sendo o Grails baseado em Spring, fica fácil usar todas as
possibilidades desse incrível framework. Usamos algumas facilidades que o Spring tem para envio de e-mails com anexos. Essa é a
grande vantagem do Grails: poder aproveitar tudo do mundo Java
facilmente e com agilidade.
desde a interface voltada para os visitantes do site até o módulo administrativo de conteúdo, passando por manipulação das imagens de fotos.
WIDE Quando o Noite Universitária estava sendo construído, foi
WIDE O sistema desenvolvido em Grails para o Noite Universitária
inclui quais funcionalidades do site?
81 > TECNOLOGIA | WIDE |
79
TECNOLOGIA
encontrada alguma dificuldade no desenvolvimento por conta de o
Grails estar sendo utilizado? Foi preciso recorrer a outras linguagens
ou frameworks para completar o projeto? Quais?
FELIPE No início, tivemos algumas instabilidades do sistema em
produção. Mas isso se deu por causa da imaturidade do Grails na
época. Hoje, já na versão 1.3.x, o Grails está muito mais maduro e
robusto. Não recorremos a qualquer outra linguagem. Com exceção
da manipulação de imagens, na qual usamos o ImageMagick, todo o
restante é baseado no Grails e nos frameworks do mundo Java nos
quais ele se baseia.
conteúdo possui todas as facilidades para administrar o conteúdo do
site. Há um módulo administrativo de conteúdo voltado para essas
pessoas. Todo esse módulo foi desenvolvido em Grails.
WIDE O Grails pode ser integrado a outras plataformas/linguagens/
frameworks?
FELIPE Atualmente, muitas plataformas ou frameworks oferecem
facilidades para integração via web services. O Grails dá grande
suporte ao uso de web services, tanto os web services SOAP quanto
REST. Além disso, o Grails, por ser Groovy, é totalmente integrado à
linguagem Java. Pode instanciar classes Java dentro de um código
Groovy. Isso é nativo na linguagem e, consequentemente, nas aplicações desenvolvidas com Grails.
WIDE O site Noite Universitária armazena uma grande quantidade de
WIDE Qual é o diferencial dos sites desenvolvidos em Grails em rela-
ção aos sites desenvolvidos em Ruby on Rails ou Django?
FELIPE Para o usuário final não há diferenças. Independentemente
da linguagem ou do framework, o que o usuário final vê e usa é
fruto da criatividade dos desenvolvedores e designers com foco
em usabilidade. A diferença está nos bastidores. O uso de Grails dá
agilidade e produtividade no desenvolvimento, o que torna um
sistema mais barato de ser desenvolvido. Grails, Ruby on Rails e
Django oferecem conceitos similares para os desenvolvedores em
termos de produtividade. A vantagem do Grails, na minha opinião,
é o leque de opções e bibliotecas prontas e maduras do mundo Java
que podem ser facilmente usadas numa aplicação Grails.
WIDE Na seção “A boa!”, por que você optou por um sistema em
Flash, em vez do Grails? O responsável pela inserção de conteúdo
no site consegue atualizar essa seção em Flash com facilidade ou é
preciso saber Flash?
FELIPE A opção por Flash nessa seção foi uma decisão de negócio, pois todos os designers parceiros e fornecedores do Noite
Universitária trabalham com essa tecnologia. Então, para aproveitar
um conhecimento já existente desses profissionais, foi mantido o uso
de Flash para as peças publicitárias. O responsável pela inserção de
O uso de Grails dá agilidade
e produtividade no
desenvolvimento, o que
torna um sistema mais
barato de ser desenvolvido
80
| WIDE | 81 > TECNOLOGIA
dados, como informações sobre eventos e, principalmente, as fotos
tiradas neles. Qual o banco de dados utilizado para armazenar todo o
conteúdo? Qual a razão da escolha por esse banco de dados?
FELIPE O banco de dados é o MySQL. Esse sistema de banco de
dados é largamente utilizado por uma infinidade de sites na internet. A escolha se deu pelos custos para utilização desse banco de
dados, que é gratuito, e a sua qualidade, que é excelente. O MySQL
nos dá todas as funcionalidades, estabilidade e velocidade que precisamos para o Noite Universitária.
WIDE É fácil adicionar funcionalidades a um layout com o Grails? E
em relação ao painel administrativo para inserção de conteúdo, qual
a vantagem deste ser criado com o framework?
FELIPE O Grails dá muita facilidade para se adicionar novas funcionalidades a um layout existente, ou até a um novo layout de uma nova
seção do site. O Grails utiliza o projeto SiteMesh para gerenciar essa
questão de layout. O SiteMesh é um framework de layout de páginas
web. Isso já vem embutido no Grails e o desenvolvedor não precisa
se preocupar com os detalhes de configuração do SiteMesh. O Grails
facilita muito. Sobre o módulo administrativo para inserção de conteúdo, as vantagens citadas anteriormente também são válidas aqui. O
módulo administrativo é uma aplicação web que precisa manipular
informações, acessar banco de dados, segurança etc. Desenvolver
aplicações web com Grails é ágil, produtivo e poderoso.
WIDE Na seção “Eventos” há um sistema de busca em que o usuário
pode especificar o local, a festa ou a data e mandar buscar. Como
esse sistema foi criado? Por meio de algum plugin?
FELIPE Não foi utilizado qualquer plugin especial nesse caso. São
queries de banco de dados realizadas mediante as facilidades do
Grails, como Dynamic Finders, muito fácil de se utilizar. Porém,
estamos analisando a possibilidade de usarmos o Searchable
Plugin para outros fins, outras buscas. Esse plugin facilita o uso do
Compass Framework, que é um framework de Java famoso por
implementar as funcionalidades de search engine, como se fosse
um Google dentro do seu sistema.
WIDE Com Grails, é possível criar sistemas de pagamento? Quais
meios de pagamento podem ser implementados com o framework
e de que forma?
FELIPE É possível criar qualquer sistema web, para qualquer finalidade,
utilizando o Grails. No caso de um sistema de pagamentos, que necessita integração com bancos, com operadoras de cartão de crédito e alta
segurança, o Grails fornece todo o necessário para implementar um
sistema dessa natureza. Porém, geralmente, se o foco do meu sistema
não é o pagamento em si, então nesse caso vale mais a pena se integrar
a um sistema existente, como PagSeguro, MoIP, Pagamento Digital ou
BrasPag. Para essa integração, mais uma vez o Grails fornece tudo que
é necessário para se integrar a um sistema dessa natureza.
WIDE Você também desenvolveu o sistema Manubia (www.manu-
bia.com.br) em Grails, que é um controle financeiro pessoal gratuito.
De onde surgiu a ideia de desenvolver esse sistema? O que ele
oferece? E o que você poderia destacar em relação ao desenvolvimento dele em Grails?
FELIPE O Manubia.com.br é uma startup, uma pequena empresa
de internet que nasceu com recursos próprios dos sócios, que
queriam desenvolver um sistema de finanças pessoais com muita
velocidade e o menor investimento possível. Nesses casos, o Grails
se encaixa como uma luva, pois com ele é muito rápido desenvolver um sistema web. O Grails dá muita produtividade e. com isso,
torna-se mais barato desenvolver com ele. A ideia do Manubia veio
pela necessidade dos dois sócios de utilizar um sistema financeiro
pessoal. Não havia no mercado nacional um sistema com as características e a facilidade de uso que os sócios queriam. Por isso, resolveram desenvolver um. Ele oferece a uma pessoa a possibilidade
de controlar seus gastos com facilidade e, assim, melhorar sua vida
financeira. O Grails ajudou muito, por exemplo, na hora de importar
arquivos OFX, que são exportados pelos sites dos bancos. Há uma
biblioteca Java que sabe ler arquivos OFX. Essa biblioteca foi facilmente utilizada na aplicação Grails.
80
81 > TECNOLOGIA
80 > 08/09 | WIDE |||
81
Magento Mario Sam
REGRAS PROMOCIONAIS
CUPOM DE DESCONTO
Fim de ano está aí, e com ele, o número
de promoções pela internet. Para não
ficar em desvantagem, você precisa de
uma ferramenta bem preparada, como
o Magento E-commerce, que oferece
duas funcionalidades nativas para
regras promocionais (Promotions).
As regras disponíveis no Magento são: “Promoção de Catálogo”
(Catalog Price Rules) e “Promoção de Carrinho” (Shopping Cart
Price Rules). Neste artigo nos concentraremos na segunda opção —
as regras no carrinho de compras —, em que é possível criar cupons
de descontos.
Em outra oportunidade, abordaremos as regras aplicadas
no catálogo de produtos, nas quais podemos aplicar descontos
de forma automatizada para determinadas situações, como
frete grátis para determinado valor ou forma de pagamento. Por
exemplo: 5% de desconto para pagamentos no boleto bancário.
Cupom de desconto é a regra promocional mais conhecida
da internet, e você pode criar campanhas para monitorar qual
promoção obtém o melhor resultado. Assim, se você cria um
cupom promocional que será divulgado no Twitter, outro que será
enviado por newsletter, outro que será usado por seus parceiros
(como blogs), outro para mídias impressas etc., você consegue
mensurar, por meio de relatórios de vendas, quais campanhas
deram melhores resultados.
Vejamos, agora, como criar um cupom de desconto. Acesse
seu backend e vá em Promoções > Promoção de Carrinho e
clique no botão “Criar Regra”. Na tela, aparecerá um formulário
solicitando informações gerais sobre sua regra e um menu à
esquerda com as opções de configuração.
Vejamos as opções da guia “Informação da Regra”. O campo
“Nome da Regra” serve para identificar no backend a regra e suas
82
| WIDE | 81 > TECNOLOGIA
condições, como, por exemplo, “Cupom de natal para clientes da
newsletter”. Logo abaixo vem o campo “Descrição”. Caso deseje
colocar mais informação, o que pode ser útil quando você possui
uma equipe de operadores e quer evitar duplicidade de regras,
você informa, na descrição, os detalhes de como a regra será usada.
A seguir, o campo “Status”, que pode ser Ativo ou Inativo. Ativo
quando a regra estiver disponível para o público, e Inativo quando
a campanha estiver fora de contexto. Imagine que você enviou um
cupom por e-mail no Natal e o cliente tente utilizar meses depois,
no Dia dos Pais.
No próximo campo, “Grupo de Clientes”, você deve selecionar
“Todos” se quiser que o cupom seja utilizado por qualquer cliente.
IMPORTANTE!
Lembre-se que, ao criar regras para determinado grupo de clientes,
ao acessarem sua loja virtual e usarem o cupom receberão uma
mensagem de invalidez. Isso acontece porque, ao entrar no site,
eles serão visitantes, e o cupom só será aceito depois de efetuado
o login.
Abaixo temos o campo “Cupom”, no qual você selecionará
a opção “Cupom Específico”. Dessa forma, um novo campo
irá surgir na tela: “Código Cupom”. Podemos considerar
que seja o mais importante do formulário, pois é o código a
ser enviado a seus clientes que, além de sugestivo, deve ser
fácil de ser digitado e convidativo. Como exemplo, usaremos
“SUPERDESCONTO2010NATAL”.
Os campos “Usos por cupom” e “Usos por cliente” têm a
mesma função, informar quantas vezes o cupom poderá ser
utilizado. Se sua promoção é para os 100 primeiros, então digite
“100” no campo “Usos por cupom”. Ou se cada cliente pode
utilizar no máximo cinco cupons, digite “5” no campo “Usos por
cliente”. Deixe em branco ou digite “0” para infinito (uso livre).
Os campos “Da Data” e “Para Data” são outra forma de
limitar o período de utilização dos cupons, como no caso de datas
comemorativas ou voucher, em que o cliente precisa utilizar
dentro de um período.
O campo “Prioridade” é usado quando você possui diversos
cupons ativos. Imagine que o cliente tente utilizar dois cupons
diferentes, qual deles será aplicado primeiro? Você define aqui.
Se você habilitou a opção de RSS Feed no seu Magento, pode
usar o campo “Publicar na Lista RSS” para informar sobre o
cupom promocional.
Na opção de menu à esquerda “Condições”, não entraremos
em detalhes, pois nosso cupom de exemplo será válido em
qualquer situação. Mas, saiba que você pode criar regras bem
específicas, como validar o cupom apenas para determinado CEP,
produto, subtotal, quantidade de itens etc.
A próxima opção de menu “Ações” é onde a regra realmente
ganha vida. Aqui você informará se o desconto será um valor
percentual sobre o valor do carrinho, se será um valor fixo ou,
ainda, do tipo brinde (compre X e leve Y). Informará, também,
o valor do desconto. Em nosso exemplo, deixaremos aplicado
um valor percentual de 10. Entre as outras opções disponíveis,
destaque para o campo “Aplicar Somente esta Regra”. Para
casos em que existem diversos cupons ativos, você pode informar
“Sim” se desejar que o cupon invalide todos os demais, ou “Não”
caso queira permitir o uso de diversos cupons simultaneamente.
No final da tela ainda há a opção para criar condições de
uso antes de aplicar o desconto, caso você queira definir regras
específicas para o cupom.
Por último, temos a opção “Legendas”, que é a frase que será
apresentada no frontend da loja quando o cliente utilizar o cupom.
Essa frase pode ser personalizada por visão de loja.
Salve sua regra e faça um teste adicionando o código do cupom
no carrinho de compras. Minha dica é que você explore todas as
opções disponíveis no formulário e, a cada alteração, realize novos
testes para conhecer bem o comportamento do sistema e o poder
desta funcionalidade. Esse exemplo foi testado na versão 1.4.1.1 do
Magento e pode ser aplicado nas versões anteriores.
Fico por aqui, desejando a todos um ótimo Natal, boas festas e
muito sucesso! Nos vemos em 2011.
Mario Sam
Formado em Webdesign e Programação com pós-graduação em
Gerenciamento de Projetos no modelo ITIL e PMP pela Unisul, certificado
SCPJ pela SUN. Projetista de sistemas web e consultor e-commerce. Presta
consultoria em marketing digital e comércio eletrônico para a Midiacom.
Mantém o blog www.mariosam.com sobre estratégias digitais e o blog
magento.mariosam.com sobre Magento.
81 > TECNOLOGIA | WIDE |
83
Flex Paulo Augusto Teixeira
CONSTRUINDO COMPONENTES E EVENTOS
CUSTOMIZADOS
No artigo anterior, redigi sobre a importância
de usar componentes e uma básica maneira
de implementar essa forma de se trabalhar no
desenvolvimento de aplicações Flex.
Quando trabalhamos com componentes
customizados, sempre temos a necessidade
de trocar dados entre o componente e o
arquivo que o está chamando, ou trocar
esses dados entre um componente e outro
componente.
Interagir entre componentes trocando dados é uma coisa muito
simples de fazer, mas muitas pessoas ficam com dúvidas quando
precisam implementar. E até mesmo quando é explicado, muitos não
compreendem de primeira. Por isso, tentarei demonstrar, de forma
prática, como usar eventos customizados e dispará-los entre os seus
componentes customizados.
Para um melhor entendimento, demonstrarei como trocar
informações entre um componente e o arquivo que o está chamando,
ou seja, escutar um evento que ocorre dentro de um componente
pelo lado de fora. Costumamos chamar de “jogar os dados para cima”,
já que uma hierarquia de componentes funciona como uma escada.
O código do itemRenderer do artigo anterior (setembro/10),
demonstra bem a necessidade de troca de informações
entre componentes, já que, quando você altera o número do
NumericStepper, informa-se à DataGrid esse valor. Porém, no caso
do ItemRenderer, temos o objeto “data”, que contém o conteúdo da
DataGrid e, com isso, posso manipulá-lo de dentro do componente.
E o que fazer se, por exemplo, você tem um componente que
contenha um ComboBox com uma listagem de produtos que, ao
selecionar um produto no ComboBox, seja enviado para fora do
componente o produto selecionado?
Então, será necessário implementar uma classe de eventos que
transporte valores dentro dela. Confira o código:
84
| WIDE | 81 > TECNOLOGIA
CLASSE CUSTOMPRODUCTEVENT.AS
01 package br.com.revistawide.materias.
02 {
03
import flash.events.Event;
04
05
public class CustomProductEvent
extends Event
06
{
07
public static const PRODUCT_
EVENT:String = "productEvent";
08
private var product:Product;
09
10
public function
CustomProductEvent (
11
type:String,
12
bubbles:Boolean = false,
13
cancelable:Boolean = false
14
)
15
{
16
super(type, bubbles,
cancelable);
17
}
18
19
override public function
clone():Event
20
{
21
return new
CustomProductEvent (PRODUCT_EVENT);
22
}
23
}
24 }
Feito isso, já temos a classe de evento customizada para
transportar produtos para fora de um componente. Agora,
vejamos como implementar dentro de um componente a
utilização dessa classe:
01 <?xml version="1.0" encoding="utf-8"?>
02 <mx:HBox xmlns:mx="http://www.adobe.
com/2006/mxml" width="100%"
03
horizontalAlign="center">
04
<mx:Metadata>
05
[Event(
06
name="
productClick ",
07
type="
br.com.revistawide.materias.products.
CustomProductEvent ")]
08
</mx:Metadata>
09
10
<mx:Script>
11
<![CDATA[
12
import br.com.
revistawide.materias.model;
13
import mx.events.
FlexEvent;
14
15
public var
arrProdutos:Array;
16
private function
productClick (event):void
17
{
18
var customEvent:
CustomProductEvent = new CustomProductEvent
(CustomProductEvent. PRODUCT_EVENT);
19
customEvent.
product = event.target.product;
20
dispatchEvent(customEvent);
21
}
22
]]>
23
</mx:Script>
24
25
<mx:ComboBox id="cbProdutos"
dataProvider=”{arrProdutos}” click="{
productClick (event)}" />
26 </mx:HBox>
Dessa forma, onde colocarmos esse componente na tela teremos a
opção de usar o atributo “productClick” e, por meio dele, executar
um método recebendo o valor passado pelo evento, como na linha
a seguir:
01 <componentes:MyCustomComponent productCli
ck=”interactionMethod(event)”/>
O método “interactionMethod” receberá o evento disparado
contendo o produto selecionado.
Jogamos para fora do componente o Product clicado e podemos
manipular essa informação a partir do recebimento dos dados.
Devemos dar atenção a essa parte de criação de eventos
customizados, pois é muito utilizado no desenvolvimento Flex e,
como falei no início, gera muitas dúvidas.
Na documentação do Flex tem mais detalhes sobre eventos
customizados. Lá você poderá entender melhor sobre eventos e para
implementar seus eventos customizados.
Não deixe de pesquisar mais sobre Components e Events; esse é
um assunto muito interessante e, quem tem interesse de fazer prova
de certificação, é abordado bastante sobre eventos em geral durante
a prova. São muitas pegadinhas a respeito de eventos, como o evento
Close e Closing. Os eventos relacionados a Drag and Drop, Upload e
Custom Events, é claro.
Estou muito contente de poder colaborar com a revista
publicando estes artigos de Flex e ColdFusion. Estou focando meus
estudos no Flex 4, para poder escrever artigos legais a respeito das
novidades da nova versão. Espero que estejam gostando do conteúdo
e que esteja ajudando no aprendizado dos leitores. Mais uma vez,
obrigado pelo tempo de todos e bom desenvolvimento.
Paulo Augusto Teixeira
Consultor de TI, Adobe Certified Expert Rich Internet Application Specialist,
Certified Flex 3 e Certified ColdFusion 8. Trabalha há 11 anos como
consultor e desenvolvedor, já atuou para empresas de vários lugares do
Brasil e do exterior, onde teve a oportunidade de adquirir conhecimentos
das áreas de Seguros, Petróleo e Gás, SMS e Direito Petrolífero.
E-mail: [email protected]
Twitter: @pauloteixeira
81 > TECNOLOGIA | WIDE |
85
Usabilidade Robson Santos
USABILIDADE E NEGÓCIO NO SITE BADOO
Nós, brasileiros, de maneira geral, adoramos
bater papo, fazer amigos, jogar conversa fora,
paquerar e todas essas coisas que envolvem
interações sociais. Jogo de futebol, festas
populares, rodas de samba, disputas de
porrinha e de truco, tudo é motivo para passar
horas a fio em contato com outras pessoas.
1
O desejo e o interesse em estar com outras pessoas têm sido facilitado
por meio dos diversos websites de redes sociais disponíveis na
internet. Desde o lançamento do Orkut, no início dos anos 2000, até a
popularização do Facebook, passando pelo hegemônico MSN, agora
denominado Windows Live Messenger, temos visto uma grande
quantidade de sites de relacionamento surgirem sem o mesmo
sucesso, como Hi5, Friendster e outros.
Esse não é o caso do Badoo (us1.badoo.com), criado em Londres,
em 2006, por um grupo de jovens programadores e empreendedores
técnicos. A ideia era criar uma rede social online que transcendesse
as barreiras nacionais, mas que, ao mesmo tempo, representasse
as culturas únicas de seus usuários. O objetivo era se espalhar
por cidades grandes e pequenas para que os usuários pudessem
conhecer novas pessoas de sua região.
No Brasil já são
mais de 8.120.858
de cadastrados
na rede, que
tem como
principal objetivo
proporcionar a
seus membros
a capacidade de
conhecer novos rapazes e garotas da mesma área geográfica. O site
inclui várias características de grandes redes sociais, mas a prioridade
86
| WIDE | 81 > TECNOLOGIA
é oferecer aos usuários jogos e ferramentas para conquistar atenção e
expandir seus círculos sociais.
Vejamos alguns aspectos de usabilidade e também de negócios
que diferenciam o Badoo das demais redes sociais.
1. PROPÓSITO DO SITE
Fica claro, desde o início, que se trata de um website de encontros,
em que é possível encontrar pessoas das proximidades. Claro que
existem outros sites de encontros, como o ParPerfeito, mas, como se
vê na página inicial do Badoo, não se trata somente de romance, mas
de conhecer gente nova. Também não há a distinção de gênero, como
na imagem do casal presente no site ParPerfeito (figura 3).
2. BUSCA FÁCIL DE OPERAR
A busca por pessoas é feita com base na região do usuário, bem
como no gênero e em preferências informados no cadastro (figura 4).
Contudo, ainda é possível mudar os parâmetros durante o tempo de
permanência no site.
O ajuste de parâmetros de busca é feito na mesma tela de exibição
de resultados, pela barra expansível na lateral esquerda. Ajustes na
abrangência geográfica são feitos na barra deslizante superior, que
altera a busca na cidade ou no
país (figura 5).
Os resultados são
apresentados dinamicamente
à medida que os parâmetros
são alterados. Isso torna o
sistema bastante eficiente,
dando condições de nova
busca, caso os resultados não
tenham sido satisfatórios.
3. FERRAMENTAS EFETIVAS DE CONTATO
Possibilitar que o usuário deixe recados nas páginas de perfil de
outros usuários é lugar comum nos sites de redes sociais de um modo
geral. No Badoo, essa funcionalidade não existe, sendo oferecidas
outras possibilidades de contato, como:
Conexões: somente quatro opções estão presentes no menu
principal do site: Pessoas perto, Encontros, Conexões e Mensagens.
Redigidos em linguagem direta, sem metáforas, o que facilita o
entendimento e deixa
poucas dúvidas sobre
o destino de cada link.
Poucas seções do site
possuem menu local,
como o que é exibido
na tela de “Conexões”.
Encontros: esta seção
permite verificar se há
interesse mútuo entre
os usuários.
A ferramenta tem operação
simples, bastando
selecionar uma das três
opções – “Sim”, “Talvez”,
“Não” – apresentadas acima
das imagens de cada pessoa
mostrada na tela (figura 7).
A usuário recebe um aviso
de que houve interesse,
podendo, então, responder
selecionando uma das três
opções. Os resultados são mostrados na seção “Conexões”.
4. ESTÍMULO À COMPRA
O usuário pode
utilizar os serviços
gratuitamente, mas
há a possibilidade
de ampliar alguns
recursos, como
melhorar o
posicionamento nos
resultados de busca
ou ter a foto exibida
no cabeçalho do site
(figura 8).
A frase “Me coloque aqui” (sic) é um atrativo para quem deseja ser
visto imediatamente, mesmo antes que uma busca seja feita. A frase
tem um apelo quase irresistível e, ao ser clicada, é exibida uma caixa
de diálogo para que se escolha a forma de pagamento. Sim! Aqui
vem a grande diferença em termos de negócio: o usuário paga uma
pequena quantia, referente ao envio de uma mensagem de celular. É
a mesma estratégia de preços da loja de aplicativos da Apple: serviços
de valor, por um custo baixo por unidade.
Outra maneira de ter visibilidade
no site é por meio da compra
de posições elevadas na lista de
resultados de busca, estimulada
pela frase “Suba ao primeiro lugar”
(figura 9). O texto é redigido para ter
impacto sobre o usuário, incluindo
um ícone de mão com polegar apontando para baixo.
Uma vez selecionada a frase, é exibida uma caixa de diálogo para
seleção da forma de pagamento (figura 10), geralmente um valor baixo
por unidade, o que estimula a compra em massa
Assim, podemos resumir
em quatro pontos os
aprendizados da análise
do Badoo:
1. Apresente claramente o propósito do site;
2. Torne a tarefa principal fácil de realizar;
3. Crie ferramentas para tornar o uso mais fácil e atrativo;
4. Ganhe dinheiro, um pouquinho de cada vez, mas muitas vezes.
Robson Santos
Graduado em Design pela Esdi/Uerj, é o primeiro doutor em Design da
América Latina. Realiza pesquisas em ergonomia, usabilidade e experiência
do usuário e atualmente trabalha como pesquisador sênior no Instituto
Nokia de Tecnologia, em Manaus.
E-mail: [email protected]
Twitter: @interfaceando
81 > TECNOLOGIA | WIDE |
87
Segurança Ivo Machado
CROSS-SITE HISTORY MANIPULATION (XSHM)
Esse tipo de ataque explora falhas de
segurança na política SOP (Same Origin
Policy). SOP é o conceito de segurança
mais importante dos browsers modernos.
Tal política diz que páginas web de
diferentes origens, por padrão, não podem
comunicar-se entre si.
mas executá-la a partir de um site diferente dentro de um IFRAME
a torna vulnerável.
EXEMPLO – CONDITION LEAKAGE
Condition Leakage ocorre quando um atacante pode injetar
valores sensíveis de um determinado conditional statement na
aplicação atacada. Por exemplo, se um site utiliza a seguinte lógica:
Página A: se (condição) – Redireciona (página B)
O XSHM baseia-se no fato de que os objetos de browser no clientside não são segmentados em uma base por site. Manipulando
o histórico do browser, pode-se fazer com que o SOP seja
comprometido, permitindo que CSRF’s bidirecionais aconteçam,
ocasionando diversos riscos, como:
q7JPMBÈÇPEBQSJWBDJEBEFEFVTVÂSJPT
q-PHJOTUBUVTEFUFDUJPO
q.BQFBNFOUPEFSFDVSTPTFOUSFPVUSPT
INFORMAÇÕES INFERÊNCIA
É possível a inferência de informações sigilosas de uma página em
uma origem diferente, se implementar em um redirecionamento
condicional. Suponha um aplicativo de RH, que não seja
publicamente acessível, no qual o usuário pode pesquisar
empregados por nome, salário e outros critérios. Se a pesquisa
não tem qualquer resultado, um comando de redirecionamento é
executado com uma página "Not found". Ao apresentar a seguinte
URL: http://Intranet/SearchEmployee.aspx?name=Jon&SalaryFro
m=3000&SalaryTo=3500, e observando o redirecionamento Not
found, os atacantes podem inferir informações sensíveis sobre o
salário de um trabalhador. Isso pode ser feito usando o vetor de
ataque que se segue:
1. Criar um IFRAME com src = “NotFound.aspx”;
2. Lembre-se do valor atual da history.length;
3. Alterar src do IFRAME para “SearchEmployee.aspx? Name =
Jon & SalaryFrom = 3000 = 3500 & SalaryTo”;
4. Se o valor da history.length permanece o mesmo, então sua
pesquisa não tem resultados.
Ao repetir o ataque acima e tentar diferentes valores de salário,
um atacante pode reunir informações detalhadas de qualquer
funcionário. Esse é um vazamento de informação Cross-site muito
sério. Se um aplicativo tem uma função como uma página de
pesquisa com redirecionamento condicional, então essa aplicação
é vulnerável a XSHM e, essencialmente, é semelhante a uma
exposição direta à Universal XSS — a aplicação em si é XSS-safe,
88
| WIDE | 81 > TECNOLOGIA
Um atacante pode executar um Cross-site Request Fogery (já falado
em outros artigos) e conseguir uma indicação sobre o valor da
condição existente como feedback. Esse ataque é executado a partir
de um site atacante. O site, então, envia um Cross-site Request para
o site vítima e, manipulando o History Object, obtém um feedback
sobre a informação requerida que o site vítima irá expor.
VETOR DE ATAQUE:
1. Criar um IFRAME com src=Pagina B;
2. Salve o valor atual do history.lenght;
3. Modifique o src do IFRAME para página A;
4. Se o valor do history.lenght for o mesmo, isso quer dizer que
a condição é verdadeira.
PROTEGENDO A APLICAÇÃO
Para conseguir uma proteção eficiente contra XSHM, ambas as
URLs do site de origem e a que será redirecionada devem conter
um token randômico. Por exemplo, redirecionando para uma
página de login, será seguro apenas no seguinte caso:
If ( !isAuthenticated)
Redirect(„Login.aspx?r=
+ Random())
Para prevenir um ataque de URL/Parameter enumeration,
qualquer URL deve conter um forte token randômico.
Ivo Machado
Diretor de Serviços da e-Horus Security & Audit, é formado em Análise de
Sistemas com MBA em Gestão de Riscos, e atuou em empresas nacionais
e multinacionais, como HP, BM&F, Nextel, BHS e Comgas. Especialista em
Segurança da Informação, Gestão de Riscos e Planos de Continuidade de
Negócios, já trabalhou no Brasil e no exterior.
E-mail: [email protected]
81 > TECNOLOGIA | WIDE |
89
Tableless Diego Eis
O NOVO CSS
Fiz uma palestra estes dias no TDC2010
(The Developer's Conference 2010) sobre
as novidades do CSS3. É impressionante o
quanto, de uma hora para outra, o CSS mudou
tanto. Talvez você não tenha percebido
isso porque toda a euforia se centralizou no
HTML5. O fato é que, para o designer e para o
dev client-side, as mudanças do HTML5 foram
mínimas. Para ser direto, o HTML5 não mudou
a vida de quem implementa websites todos
os dias. Mudou muito para os programadores
JavaScript e server-side, mas não para
quem cuida de interface. Infelizmente, até os
desenvolvedores client-side perderam o foco.
A verdade é que a grande diferença para
os devs de client-side está concentrada nas
novas features do CSS.
O desenvolvedor client-side tem que ficar atento. Sua profissão
vai mudar, bem como suas responsabilidades e deveres. Você
não vai mais se limitar a escrever apenas HTML, CSS e codificar
layouts. Você terá que aprender um bocado de JavaScript,
pode ser até jQuery ou outro framework (eu prefiro jQuery),
para fazer tarefas que antes eram consideradas exclusivas para
programadores. Seu foco mudou. Você é responsável por fazer
funcionar tudo o que não é server-side. É de sua responsabilidade
a interação do site, a compatibilidade entre browsers, a
portabilidade para outros dispositivos, o comportamento de
elementos e até mesmo a animação, dependendo do objetivo.
Abra os olhos. O CSS não serve mais para pintar quadradinhos.
Se antes você achava muito controlar cores de fontes, background,
diagramação, tamanho de fonte, largura e altura, hoje você já
consegue manipular animação, portabilidade específica para
aparelhos, transparência, sombra em elementos e texto, dégradé
de cores etc. Alguns estão dizendo que o CSS está virando o
Photoshop para a web. De fato, você consegue fazer muita
coisa que antes apenas resolvíamos utilizando imagens. Hoje, já
conseguimos criar sombras e dégradé diretamente pelo código.
90
| WIDE | 81 > TECNOLOGIA
Outro ponto importante é que o CSS agora faz parte da terceira
camada de desenvolvimento. Para relembrar: o desenvolvimento
client-side pode ser dividido em três camadas. A primeira delas
é a informação, controlada e exibida por meio do HTML. A
segunda camada é a formatação, manipulada pelo CSS. A terceira
é exclusiva do JavaScript. É a camada de comportamento,
responsável por pequenas animações, efeitos etc. Agora, o CSS
também faz parte dessa camada. Juntamente com o JavaScript,
você conseguirá controlar melhor o comportamento dos elementos,
manipulará a forma com que os elementos serão animados etc.
Desde o começo, o CSS foi feito para controlar o visual das
páginas web. Pensando um pouco mais, o CSS controla a forma
com que o conteúdo aparecerá nos diversos meios de acesso.
Apelei? Acho que não. O mesmo conteúdo que você lê, assiste
ou interage na web pode ser consumido de outra forma em outro
meio. O visitante pode imprimir esse conteúdo, pode ouvi-lo ou
mesmo acessá-lo de um aparelho menor, ou quem sabe maior
que o notebook, como uma TV.
Quero que você entenda que o CSS é muito mais abrangente do
que você imagina. Ele controla o conteúdo onde quer que esteja. E o
responsável por fazer com que esse conteúdo seja bem visualizado
nesses diversos meios de acesso é o desenvolvedor client-side.
Diego Eis
Sócio da Visie (www.visie.com.br), empresa especializada em
desenvolvimento e consultoria para web. Faz consultoria para empresas
como Globo.com e Nokia. É palestrante e criador do Tableless (www.
tableless.com.br), site que ajuda a promover o desenvolvimento e as
boas práticas com Padrões Web no Brasil.
E-mail: [email protected]
Twitter: @diegoeis
81 > TECNOLOGIA | WIDE |
91
Mercado de TI Paulino Michelazzo
FREELANCERS EM ALTA
Enquanto somente 18% da mão de obra em TI
é regularmente contratada, mais da metade das
empresas procuram profissionais freelancers
para execução de seus projetos ou de terceiros.
Canibalismo do emprego? Não, simplesmente um
novo modelo.
Não venho aqui crucificar a CLT ou coisa do tipo. Acredito que
existe espaço para os funcionários de carteira assinada em
qualquer segmento de nossa economia, e o governo está devagar,
cumprindo sua parte. Do outro lado, existe uma modalidade de
contratação que ainda é malvista em nosso país, mas que está
crescendo exponencialmente nos quatro cantos do globo. Falo dos
profissionais freelancers que prestam serviços não somente para
uma empresa, mas para várias e, muitas vezes, ao mesmo tempo.
Antes de continuar, cabe um esclarecimento. Freelancer é
diferente de consultor. O freelancer é um profissional que executa
uma tarefa predeterminada por um contratante, enquanto um
consultor é pago para prestar conselhos sobre as tarefas necessárias
para determinado projeto ou atividade. Posto isso, vamos ao que
interessa: o novo modelo (que não é tão novo assim).
Ao contrário do imaginável, não é vergonha nenhuma ser
freelancer. Para eles, as vantagens são bem visíveis: cheques melhores,
liberdade para escolha do que deseja realizar, ilimitado local de trabalho
(bastando um modem 3G) e flexibilidade de horários e dias, o que
permite até aquela escapada à praia para surfar em plena segundafeira. Esse conjunto de benesses faz com que a cada ano milhares de
profissionais deixem o mercado de trabalho “formal” para se dedicarem
a uma determinada atividade, seja por motivo de dispensa ou somente
por opção. Engrossam tais números inclusive aqueles que estão nas
faculdades ou saindo delas e que procuram uma primeira colocação
laboral, não sendo raro encontrar alguns que jamais tiveram uma
carteira assinada na vida, e nem por isso passam fome.
Mas este mundo não é somente colorido. Se não existir um bom
planejamento, a frustração é certa, e o retorno à estaca zero da
busca de uma nova colocação, costumeiro. Como não existem os
chamados benefícios da CLT, é necessário cuidar de tudo, desde
o fluxo de entradas, a poupança a ser realizada para momentos de
estiagem e até mesmo para uma parada repentina por motivos de
saúde. Preocupando-se com isso e mensurando prós e contras, a
balança na maioria das vezes pende para o lado dos freelancers.
E não é só o profissional que ganha. A empresa contratante
também se aproveita desse novo movimento da economia mundial,
seja na redução do pagamento de encargos, seja na utilização de
mão de obra mais qualificada para o desenvolvimento de seus
projetos. Sim, porque o freelancer que deseja se estabelecer, e mais
ainda aquele que já se estabeleceu, não pode parar de estudar e
92
| WIDE | 81 > TECNOLOGIA
conhecer novas técnicas e tecnologias. A concorrência é forte em
todos os segmentos.
E errado é aquele que chegou aqui pensando que o freelancer
prostitui o mercado; não, ele o auxilia para que mais oportunidades
sejam criadas para todos, e isso é facilmente explicado com
matemática. A partir do momento em que uma empresa não tem
a necessidade de pagar encargos estratosféricos (que no Brasil
chegam a 102% em alguns casos), sobra dinheiro para a execução
de projetos, principalmente os engavetados e já empoeirados.
No momento de executá-los, a empresa procura profissionais
freelancers, que certamente será mais barato que a contratação
de um profissional CLT. Observa-se, então, que a roda gira e todos
ganham; a empresa que tira da gaveta o projeto, o freelancer que
tira o mofo dos dedos e o cliente que obtém a solução pretendida.
Nem mesmo o governo perde, pois ainda existem impostos sobre os
serviços, mas com menor peso.
E por que, então, não é regra? Essa pergunta deve estar tanto
na cabeça do profissional quanto na do empresário, e algumas
respostas são fáceis de serem encontradas. A primeira delas é o
desejo ilimitado do empregador em ter seu rebanho por perto.
Quanto mais perto, mais o chicote assovia — acredita-se que
isso seja produtividade. De outro lado, o profissional que ainda
não está acostumado com esse modelo de trabalho, pouco tem
responsabilidade e normalmente atrasa ou faz malfeito (por conta
do atraso). Nessa equação, ao contrário da primeira, todos perdem;
a empresa com custos altos, o profissional com salários baixos (e as
costas ardendo) e o cliente que não vê o projeto.
Então, o que fazer para mudar? A dica vai principalmente para
os profissionais: responsabilidade. Enquanto escrevo este artigo,
meu pomodoro (www.pomodorotechnique.com) está contando
o tempo. Quantos fazem isso? Poucos das centenas que conheço.
Sem responsabilidade, o cliente, que inclusive pode ser seu
ex-empregador, não irá lhe confiar nada. Você terá que, em vez de
procurar jobs em sites especializados de freelancers, procurar vagas
em sites de agências para voltar ao antigo regime da carteira & chicote.
Responsabilize-se que o trabalho vem. A demanda está cada vez
maior e existe espaço para profissionais do mundo todo, em todo
o mundo. E de uma coisa esteja certo, cedo ou tarde seu emprego
será cortado para dar lugar a dois ou três freelancers. Esta é a regra
capitalista que não conseguimos mexer e, já que é assim, que tal ser
você um destes freelancers atendendo seu ex-chefe?
Pense a respeito.
Paulino Michelazzo
Possui quinze anos de experiência em internet e atua como consultor
web em todo o mundo. Palestrante costumeiro de eventos de tecnologia,
é coautor de três livros na área de internet e software livre, e escreve
regularmente sobre empreendedorismo e desenvolvimento em seu site:
www.michelazzo.com.br
81 > TECNOLOGIA | WIDE |
93
Sites de compras
coletivas
A mais nova febre da internet no Brasil
Eles viraram uma febre no país há poucos
meses e já são os destinos de muitos
internautas que buscam promoções e
descontos para aliviar o bolso. Eles são os
sites de compras coletivas, um modelo de
negócios baseado em ofertas online que
teve início em 2008 e consolidou-se nos
Estados Unidos.
Por Tiago Bosco
94
| WIDE | 81 > MARKETING
MARKETING
N
o Brasil, apenas no ano de 2010,
diversos sites com esse mesmo
modelo de negócios foram criados,
proporcionando aos brasileiros
que acessam a internet uma
economia significativa na aquisição de determinados produtos ou
serviços. “É um portal de compras coletivas, em que diariamente
oferecemos ofertas, com grandes descontos de produtos e
serviços de estabelecimentos, lojas e marcas. Temos presença nas
principais capitais e cidades no país”, explica Karl Johnsson, sócio
fundador do site OfertaX (www.ofertax.com.br) , que até o mês de
setembro contava com uma média de 20 mil visitas por dia. Julio
Vasconcelos, fundador do Peixe Urbano (www.peixeurbano.com.
br), também comenta as facilidades que o site proporciona, dando
descontos de até 98%. “O Peixe Urbano foi criado para ajudar as
pessoas a descobrirem os melhores serviços e atividades de suas
cidades, com descontos que vão de 50% a 98%. O site divulga
uma promoção de cada vez, que fica no ar por um breve período
de tempo (geralmente apenas 24 ou 48 horas) e são sempre dos
melhores lugares de cada cidade. Cada oferta começa a valer assim
que é atingido um número mínimo de compradores.”
Marcelo Macedo, diretor executivo do site ClickOn (www.clickon.
com.br) , que atualmente conta com mais de 600 mil usuários
cadastrados, explica como atrair novos clientes e alavancar vendas
a partir desse modelo de negócios. “É um modelo novo no país, mas
que vem dando muito certo pelo perfil de compra do brasileiro. Eles
gostam de ofertas e, por isso, buscamos sempre oferecer serviços
bacanas. Além disso, os sites de compras coletivas são ótimos canais
de vendas para os estabelecimentos, que têm a oportunidade de
oferecer seus serviços sem precisar investir grandes quantias
em publicidade e ter retorno efetivo sobre a ação, pois a compra
começa na internet, porém tira a pessoa da frente do computador
e a leva para o consumo no local.”
A INSPIRAÇÃO DOS SITES BRASILEIROS
Grande parte desse modelo de negócios instalado no país foi inspirado no site Groupon (www.groupon.com), lançado em novembro
de 2008, nos Estados Unidos. No início, o então empreendedor Eric
Lefkofsky aplicou 1 milhão de dólares para desenvolver a ideia.
No Brasil, desde junho, o Groupon, empresa presente em mais de
26 países, instalou sua operação através do portal Clube Urbano
(www.clubeurbano.com.br). O exemplo serviu de inspiração para
outros empreendedores e para a maioria dos sites que trabalha
com esse tipo de plataforma. “O modelo foi importado dos EUA,
onde o Groupon foi o pioneiro. Paulo Veras, Thiago Arruda e eu, os
três sócios fundadores, resolvemos trazer tal modelo para o Brasil
no final de março deste ano. O site foi lançado em 18 de maio”, conta
Pedro Guimarães, diretor geral do site Imperdível (www.imperdivel.
com.br), que não quis revelar números, como quantidade de acessos
e usuários cadastrados no portal.
Além do Imperdível, o modelo norte-americano de ofertas na
internet também serviu de exemplo para outros sites brasileiros.
“Nos inspiramos no Groupon, que foi o pioneiro nesse tipo de negócio nos EUA”, afirma Rubens Paiva, diretor geral do Click Cupom
(www.clickcupom.com.br) , portal criado recentemente, em agosto
deste ano, e que conta com 50 mil usuários cadastrados e recebe
uma média inicial de 2500 acessos por dia. Karl Johnsson também
relata a influência do site norte-americano no OfertaX. “A ideia do
nosso site partiu do Groupon, que foi noticiado na Business Week
(www.businessweek.com) em dezembro de 2009 como sendo um
case de sucesso. Sócios investidores e estratégicos entraram no
projeto em 2010”. No Brasil, o site de ofertas precursor foi o Peixe
Urbano, segundo Julio Vasconcellos, que conta como partiu a ideia
de criar o projeto e lançá-lo:
“Ele (Peixe Urbano) é o primeiro e maior site de compras
coletivas no Brasil. Morei na Califórnia, onde fiz um MBA na Stanford
e trabalhei com diversos start-ups no Vale do Silício. Buscava um
modelo de negócios que alavancasse o poder de mobilização da
internet para trazer benefícios reais à sociedade, e foi aí que comecei
a estudar os sites de compras coletivas, que já no ano passado
movimentavam mais de U$ 500 milhões nos Estados Unidos.
A ideia do Peixe Urbano nasceu juntando esse modelo ganhaganha (que coloca em contato os melhores prestadores de serviços
de cada cidade e um grande número de consumidores interessados
em conhecer novos estabelecimentos perto de suas casas) com as
características do consumidor brasileiro. Foi então que me juntei
a dois amigos, Emerson Andrade e Alex Tabor. Percebemos que o
brasileiro, em geral, adora e usa muito a internet, é bastante social e
não recusa uma boa promoção. Como já tinham o costume de usar
redes sociais e e-mail para compartilhar novidades com os amigos,
apostamos que o modelo daria muito certo no Brasil.
Em pouco tempo, o site estava no ar. Em janeiro, já estava aberto
para cadastros e a primeira promoção foi divulgada em março. Em
menos de cinco meses, o Peixe Urbano conta com mais de 1 milhão
de cadastrados e já realizou mais de 400 promoções, que geraram
para os consumidores brasileiros uma economia de mais de R$ 20
milhões”, comenta. Os números do Peixe Urbano confirmam que de
fato a “moda” dos sites de ofertas pegou no Brasil. Julio Vasconcellos
O modelo foi importado
dos EUA, onde o Groupon
foi o pioneiro
Pedro Guimarães
81 > MARKETING | WIDE |
95
MARKETING
AS BARREIRAS ENFRENTADAS NA ADOÇÃO DESSE MODELO DE
A consolidação do
fenômeno ‘redes sociais’
(Facebook, Twitter, Orkut
etc.) foi fundamental para
se criar o ecossistema
necessário para a
popularização dos sites de
compras coletivas
Karl Johnson
também explica que ações por meio do marketing viral — online
e boca a boca — foram e continuam sendo importantes para a
propagação da marca.
“Divulgamos todas as ofertas do dia por e-mail para a nossa base
de cadastrados e em redes sociais e outros sites. Dependemos muito
da divulgação que os nossos próprios usuários fazem para seus amigos e procuramos incentivá-los e recompensá-los o máximo possível por isso. Além de oferecer ao nosso assinante um crédito de R$
10 para cada amigo convidado que faz a primeira compra no site,
no mês de setembro o Peixe Urbano deu para o primeiro um milhão
de cadastrados cinco vales-presente de cinco reais cada, para que
possam dar para seus amigos e familiares que ainda não são cadastrados no site. Ou seja, foram 25 milhões de reais em crédito como
presente. Esse é o tipo de ação que gera o maior retorno porque
incentiva as pessoas a compartilharem a novidade e a aproveitarem as promoções com seus amigos. É isso que nós queremos.”
Assim como ocorre com o Peixe Urbano, o boca a boca também
pode ser considerado uma das principais ações de marketing
trabalhadas pelos sites de compras coletivas. Marcelo Macedo destaca
a importância das redes sociais: “Utilizamos o poder das redes sociais
e do boca a boca para divulgação das ofertas. Nosso maior foco, sem
dúvida, são os anúncios em redes sociais. Mas, não nos limitamos a elas,
recentemente iniciamos um campanha em canais de TV, anúncios
em mídia impressa e já estamos trabalhando no desenvolvimento
de uma ação para mobile, além de utilizar, ainda, a forma mais
comum de anúncio online, o Google”, explica. “Nosso crescimento
foi essencialmente orgânico, boca a boca mesmo”, conta Pedro
Guimarães. Karl Johnson também vai pela mesma linha e aponta as
redes sociais como uma das maiores responsáveis pela propagação
do OfertaX. “Trabalhamos com links patrocinados, ações no Twitter,
BooBox, Facebook e várias outras mídias online e offline”, relata.
96
| WIDE | 81 > MARKETING
NEGÓCIOS
Com a rapidez do mundo contemporâneo, analisando
especialmente a internet, que é caracterizada, sobretudo, pelo
seu fluxo de informação e divulgação de novidades, é no mínimo
questionador pensar porque só agora, no decorrer do ano de
2010, os sites de ofertas “apareceram” no Brasil — que se encontra
na quinta colocação no ranking dos países com mais usuários
com acesso à internet (migre.me/1eBuY) , segundo pesquisa
divulgada em junho de 2010 pelo site Internet World Stats (www.
internetworldstats.com). Os empresários brasileiros têm opiniões
diversas sobre o assunto. “Acho que a aceitação do e-commerce no
Brasil demorou mais tempo para chegar, e com isso modelos novos
também demoraram mais”, analisa Julio Vasconcellos. Já Rubens
Paiva culpa as operadoras de cartões de crédito:
“Achamos que isso se deveu à grande dificuldade imposta por elas.
Somente agora estão se abrindo um pouco mais para esse segmento
de mercado. Trabalhamos com internet há dez anos, sempre fomos
desenvolvedores de sites e sistemas, já produzimos mais de 1400
páginas, e sempre os cartões foram um grande dificultador nas
lojas virtuais. A entrada do Pag Seguro – UOL facilitou a entrada de
pequenas empresas no mercado. Mas ainda temos dificuldade, pois
o serviço é falho e as taxas, absurdas”, aponta. Para Karl Johnson, a
saturação dos modelos de comércio eletrônico foi determinante para
a propagação dos sites de compras coletivas. “A falta de inovação
desses modelos impulsionou o fenômeno das compras coletivas”.
Karl indica também a importância das redes sociais nesse processo:
“A consolidação do fenômeno ‘redes sociais’ (Facebook, Twitter,
Orkut etc.) foi fundamental para se criar o ecossistema necessário
para a popularização dos sites de compras coletivas”, afirma.
Agregar ofertas de vários sites de compras coletivas em um
mesmo lugar. Esse é o trabalho desenvolvido pelo Saveme (www.
saveme.com.br). “O Saveme é um portal que agrega todos os sites de
compras coletivas em um único lugar”, conta o diretor Guilherme
Wroclawski, que comenta o surgimento do projeto: “O site passou a
operar no dia 1º de julho de 2010 (com o nome de Zipme). Ele deriva
de uma consagrada lei do marketing: a de levar seu serviço ao foco
do cliente — traduzindo para o caso, é se colocar na perspectiva do
Percebemos que o
brasileiro, em geral, adora e
usa muito a internet, é
bastante social e não recusa
uma boa promoção
Julio Vasconcelos
Não pensamos em lucro
para essa ação, e sim em
experimentação para o
nosso produto
Isabel Arthou
internauta. Encontramos um crescente número de pessoas à procura de ofertas na web, que sentem certa frustração por não conseguirem olhar para todas as promoções existentes. O Saveme chegou
para facilitar a vida de todo mundo”, propaga.
As redes sociais, assim como os demais sites de ofertas, também acabaram sendo vitais no que se refere às ações de marketing.
“Lançamos o site com um esforço de comunicação pequeno em
redes sociais, por onde circula nosso target. No entanto, tivemos a
grata surpresa do boca a boca ter se tornado a maior ‘ferramenta’ de
divulgação. O usuário que entra no Saveme rapidamente percebe
sua facilidade e o benefício que lhe traz em sua busca por ofertas,
dessa maneira acaba espontaneamente fazendo propaganda do
site. Para nós, não existe melhor divulgação do que essa”, analisa.
Ilustração - Carolina Vigna-Marú
81 > MARKETING | WIDE |
97
O REAL OBJETIVO DOS ANUNCIANTES
Os sites de compras coletivas, em sua maioria, trabalham hoje
basicamente com três segmentos de anunciantes. São eles: bares
e restaurantes, bem-estar (clínicas de estética, salões de beleza,
massagens) e entretenimento (cinema e teatro). “Entre os setores
que mais vendem estão o de beleza e o de gastronomia. Entretanto,
cada cidade tem um perfil um pouco diferente, e nós procuramos
entender bem o perfil dos nossos assinantes em cada cidade para
trazer as promoções mais atrativas. No total, a base de cadastrados
no Peixe Urbano está divida entre aproximadamente 50% homens
e 50% mulheres, mas cerca de 70% das compras são efetuadas por
mulheres — o que explica, em parte, a preferência por serviços de
estética e beleza”, explica Julio Vasconcelos. No site Click Cupom,
Rubens Paiva afirma que os serviços de beleza são os mais anunciados, mas faz um alerta interessante: “Notamos que já existe uma
saturação nesse segmento.”
O bar e restaurante PJ Clarke’s, localizado em São Paulo, em uma
determinada oferta publicada no site Imperdível ofereceu 51% de
desconto na compra de um cheeseburguer. Maria Rita Pikielny,
sócia gerente do estabelecimento, comenta que esse tipo de ação
tem como finalidade atingir novos clientes que ainda não conhecem o bar. Anunciar nos sites de compras coletivas, no entanto,
não significa lucrar em um primeiro momento. “Não temos lucro,
temos até prejuízo nesse determinado produto, porém contamos
com o marketing e novas vendas, uma vez que o cliente esteja no
local”, explica. Isabel Arthou, gerente de marketing da rede de pizzaria Domino’s — que anunciou 59% de desconto na compra de uma
pizza média por meio do site Peixe Urbano —, revela que anunciar
nesse modelo de negócio gera um alto volume de experimentação
em curto espaço de tempo e também cita a mesma linha de raciocínio da Pikielny quando o assunto é lucro: “Não pensamos em lucro
para essa ação, e sim em degustação/experimentação para o nosso
produto”, aponta.
Tudo ainda é muito recente no Brasil quando o tema é modelo
de negócios de compras coletivas. Muitos sites desse segmento
estão sendo criados a cada momento. Se eles conseguirão se
consolidar no mercado (mesmo com muita concorrência) e se
vieram definitivamente para ficar, não se sabe, só o tempo dirá.
98
| WIDE | 81 > MARKETING
Por meio do Saveme,
selecionamos alguns sites
de compras coletivas
espalhados pelo Brasil.
Confira:
www.imperdivel.com.br
www.peixeurbano.com.br
www.clickcupom.com.br
www.ofertax.com.br
www.clickon.com.br
www.coletivar.com.br
www.bomproveito.com.br
www.ofertaunica.com.br
www.metadeoumenos.com.br
www.startnow.com.br
www.clubedodesconto.com.br
www.presentefacil.com.br
www.juntoucomprou.com
www.ofertadia.com.br
www.citybest.com.br
www.grupoligado.com.br
www.qpechincha.com.br
www.comprasclub.com.br
81 > MARKETING | WIDE |
99
MARKETING
Case LojaMelissa.com
A importância do e-mail marketing
Em decorrência da popularização do
e-commerce no Brasil, a Melissa passou
a investir em e-mail marketing visando
obter retorno para a sua loja virtual. Só
para se ter uma ideia sobre as visualizações e cliques na campanha, a Melissa
obteve resultados expressivos, com 21%
e 17% respectivamente maior em relação
às médias do mercado — 8% e 3%, segundo
pesquisas realizadas pela PMD Marketing
Group (Fonte: O Globo – 19/09/10).
Uma campanha bem-sucedida na internet
se dá, entre outras coisas, graças ao e-mail
marketing, ferramenta importante no
relacionamento com o cliente. A loja virtual
da Melissa (www.lojamelissa.com)
comprova o retorno.
Cristiano Rosa, diretor comercial da Grafia,
agência de internet que presta serviço
para o grupo Grandene, conta qual foi o
segredo e o diferencial para a campanha
ter atingido esses números. “Entendemos
que os resultados do e-mail marketing são
frutos também da qualificação do mailing
que vem sendo trabalhado ao longo dos
anos. Não temos a política de compra de
mailing, não enviamos e-mail marketing a
toda hora, fornecemos conteúdo que não
seja apenas comercial (somente para loja
temos profissionais que escrevem para
o site e para blog — contamos com uma
100
| WIDE | 81 > MARKETING
profissional ligada à moda e que mora em
Londres) e separamos, também, o mailing
do site com o da loja. Quem se cadastra no
site, recebe comunicações somente dele, e
da loja, idem. Além disso, ainda temos toda
a força da marca com seu desejo”, que também explica como se deu o planejamento
para a campanha.
“A loja começou como um projeto
totalmente inovador e foi-se experimentando muita coisa. Dessa forma, no início,
apenas utilizávamos o e-mail marketing
para divulgar o que tinha de novo na loja,
mas de forma muito tímida.
Com a explosão do e-commerce e com
o crescimento constante da Lojamelissa.
com, passou-se a investir mais. O e-mail
marketing tornou-se, então, uma das ações
fundamentais para as vendas da loja e o
utilizamos para quase tudo: comunicar
reposições, lançamentos e promoções.
Mas, claro, sempre cuidando para não
encher a caixa do consumidor.
Quando temos, por exemplo, uma
promoção e um lançamento na mesma
semana, avaliamos se podemos comunicar tudo em um único e-mail marketing
ou se devemos enviar um no início da
semana e outro no final da semana.
Portanto, temos um planejamento de
e-mail marketing atrelado ao de outras
ações maiores (lançamentos, promoções
etc.). E como qualquer planejamento, em
alguns momentos, precisamos reajustar
o conteúdo, as datas de envios e os destinatários (quem deve receber)”, explica,
mostrando a necessidade de se ter uma
equipe especializada e dedicada no gerenciamento de uma campanha desse porte.
“Hoje, fala-se muito em SM (Social
Media) para comunicar uma marca, mas
Temos que ficar atentos para não
errar o preço, a ortografia, uma
imagem, o link de destino etc
Cristiano Rosa
80
81 > MARKETING | WIDE |
101
MARKETING
Sempre apostamos no e-mail
marketing. Sabíamos que o
impacto seria grande
Cristiano Rosa
o e-mail marketing ainda é muito forte. Recentemente, saiu
uma matéria na mídia falando que nos Estados Unidos quase
50% das pessoas preferem receber informações de marcas
via e-mail marketing, enquanto apenas 3% preferem as redes
sociais. Assim, sendo ele uma ferramenta tão relevante, temos
que cuidar bem sobre o que, como e para quem comunicar.
Temos que ficar atentos para não errar o preço, a ortografia,
uma imagem, o link de destino etc. Além da equipe especializada em web da Grafia, temos auxílio de uma empresa
parceira (Dinamize).”
Em relação aos modelos de mensagem, newsletter, mala
direta eletrônica e pesquisa são utilizados na campanha.
Cristiano Rosa releva que todas as ferramentas têm o seu grau
de importância. “Dificilmente nos restringimos a uma única ferramenta. Utilizamos todas as possibilidades que achamos adequadas com o perfil da marca para alavancar as vendas”, destaca,
apontando a quantidade de endereços eletrônicos trabalhados
na campanha. “Temos um mailing da Melissa de 600 mil, mas,
dependendo da ação, usamos uma base menor/segmentada.”
Muitas pessoas devem se perguntar os cuidados que foram
tomados para a campanha de e-mail marketing da Lojamelissa.
com não ser confundida com spam. Cristiano Rosa comenta
o que foi realizado e cita um exemplo ocorrido recentemente.
“Montamos (fizemos HTML) da forma correta e ficamos sempre
antenados com o que está acontecendo. Em agosto de 2010,
identificamos que o assunto Dia dos Pais estava caindo como
spam, pois todo mundo estava usando. Com isso, mudamos
na hora. Além disso, antes de enviar qualquer e-mail, realizamos testes, mandamos para contas do Gmail, do Hotmail etc.”,
explica, afirmando que a empresa já esperava o retorno que
hoje se faz presente. “Sempre apostamos no e-mail marketing.
Sabíamos que o impacto seria grande”, finaliza.
102
| WIDE | 81 > MARKETING
80
81 > MARKETING | WIDE |
103
Marketing
de guerrilha
e as mídias
sociais
A Wide conversou com Darren Barefoot,
coautor do livro Manual de marketing em
mídias sociais e um dos fundadores da agência
Capulet Communications (www.capulet.
com), situada em Vancouver, no Canadá.
Neste rápido bate-papo, Darren fala sobre o
marketing de guerrilha na web e como ele
pode ser aplicado nas mídias sociais.
Por Tiago Bosco
104
| WIDE | 81 > MARKETING
MARKETING
ENTREVISTA
Darren Barefoot
Além de coautor do livro Manual de marketing em mídias sociais, Darren Barefoot, graduado em Escrita Criativa e Teatro,
é um dos fundadores da Capulet Communications (www.capulet.com) - agência canadense de marketing especializada na
interação das empresas com a web.
WIDE Como você define marketing de guerrilha?
DARREN Na minha opinião, marketing de guerrilha se refere aos
canais não tradicionais de marketing. Ou seja, ao invés de usar
os meios principais e convencionais de publicidade, você faz
campanhas online criativas ou uma campanha de propaganda leve.
WIDE Como se dá o planejamento de uma determinada campanha
realizada por meio do marketing de guerrilha nas mídias sociais? Por
onde começar?
DARREN Você começa com a sua audiência, ou seja, como o seu
público-alvo. Quem você quer alcançar? A partir daí, combina isso
com os objetivos de trabalho para a campanha. O que você quer que
as pessoas façam: comprem seus produtos, solicitem uma assinatura,
assinem um boletim informativo, ingressem num movimento e aí
por diante.
ironia. A rápida resposta na criação de web vídeos deles também era
um fator chave.
WIDE Por outro lado, existe alguma maneira de mensurar o fracasso
de uma campanha voltada para as mídias sociais?
DARREN É muito difícil. Nós não ouvimos com frequência sobre
aquelas que falham. Elas dão um jeito de desaparecer sem alarde,
sem chamar muita atenção.
WIDE Quais diferenças podemos encontrar entre as grandes e as
pequenas empresas, no que se refere à aplicabilidade do marketing
de guerrilha na internet?
DARREN As grandes empresas são avessas ao risco. Elas são grandes
aviões transportadores, e é difícil para elas mudar o curso. Pequenas
companhias têm muito menos a perder e muito menos inércia atrás
de qualquer estratégia de marketing, então é natural que novas formas de marketing surjam de pequenos negócios.
WIDE Você poderia apontar um exemplo de uma campanha bemsucedida de marketing de guerrilha dentro das mídias sociais? Quais
fatores determinaram seu sucesso?
DARREN O mais recente bom exemplo disso é a campanha do
Old Spice (www.youtube.com/watch?v=owGykVbfgUE). O anúncio
original era ótimo, mas a campanha online subsequente, em que
fizeram rápidos vídeos personalizados para os influenciadores online,
foi brilhante. A campanha original do anúncio era extremamente
profissional, e o ator principal, Isaiah Mustafa, acertou no tom de
WIDE No livro Manual de marketing em mídias sociais você diz: “produzir um vídeo de sucesso no YouTube não é tão diferente de criar
um ótimo programa ou comercial de TV”. Qual foi a importância dos
sites de compartilhamento de vídeos para o desenvolvimento do
marketing de guerrilha digital? O marketing de guerrilha envolve
vídeos diretamente?
DARREN O YouTube criou um gratuito e imensamente popular
canal de distribuição e compartilhamento de vídeos. Na verdade,
antes do YouTube, era muito difícil divulgar um vídeo online. Nos
primórdios da web, você, na verdade, pagava uma empresa de
streaming de vídeo baseado na velocidade de conexão que o vídeo
81 > MARKETING | WIDE |
105
usava. Então, havia uma certa dificuldade para chamar a atenção na
divulgação de um determinado trabalho. Sem dúvida, o YouTube e
seus concorrentes mudaram tudo isso, proporcionando aos usuários
uma facilidade para se divulgar qualquer tipo de vídeo e ideia.
WIDE Como você analisa a ética nas ações do marketing de guerrilha
nas mídias sociais? Qual o limite para a ousadia?
DARREN Não tem muita diferença. Eu diria que a ética é a mesma que
no marketing tradicional. Você pode ser ousado, mas precisa, sobretudo, respeitar e proteger o seu público-alvo.
WIDE Facebook, MySpace, Twitter etc. Dentre todas as redes sociais
presentes na internet, qual delas o marketing de guerrilha mais atua
e obtém resultados mais expressivos?
DARREN Nós tendemos a enfatizar o Facebook, porque ele tem uma
crescente e diversa base de usuários (500 milhões e está aumentando).
Tem mais gente jogando Farmville (www.facebook.com/FarmVille),
um jogo no Facebook, que gente no Twitter, por exemplo.
WIDE O que os marqueteiros devem fazer para não serem confundidos com spammers?
DARREN Para começar, apenas contate as pessoas que optaram. Isso
é, aquelas que deram permissão para você comercializar com elas.
Você deve focar nos crescentes grupos e tribos que estão interessados nos seus produtos e serviços e, dessa maneira, dispostos e ansiosos para lhe ouvir.
As grandes empresas
são avessas ao risco...
É natural que novas
formas de marketing
surjam de pequenos
negócios
1
106
| WIDE | 81 > MARKETING
MARKETING
2
WIDE “Ferramentas de marketing convencionais não devem ser
completamente ofuscadas pelos novos e brilhantes brinquedinhos de
mídia social. As ferramentas de marketing tradicionais trabalhando
em conjunto com as novas garantem um impacto muito maior do
que quando usadas isoladamente.” Você poderia citar algum exemplo dessa sua citação?
DARREN Aqui está um exemplo de uma campanha que acabou de
ser lançada e que utiliza uma nova tecnologia para conectar-se a
mundos online e offline (migre.me/1mfei). Ela usa um cartaz muito tradicional de conectar as pessoas aos pedidos online e a ferramentas
que podem espalhar a palavra sobre uma campanha de conservação
da floresta (Ver imagens 1 e 2).
80
81 > MARKETING | WIDE |
107
Marketing de conteúdo Bruno Rodrigues
2011, o Ano da Convivência de Mídias
Dia desses vi Fúria de titãs com meu
filho. Não a primeira versão, um clássico
da Sessão da Tarde de décadas atrás,
mas o remake. Para minha surpresa, o
filme é mil vezes melhor que o original;
é o “Fúria de titãs” que eu gostaria de ter
visto quando tinha 13 anos. Dessa vez,
contaram a história que, antes, apenas
tiveram a intenção de contar.
pensamento, o que devemos compreender daqui em diante é que há
lugar para tudo. Afinal, o que vale é a história que está sendo contada.
Seria simples eu dizer: “ah, nos anos 80 é que faziam bem filmes de
aventura!”. Ou, o contrário, dizer que, com os efeitos visuais de hoje,
é que se consegue produzir filmes de forma decente.
Porém, nenhum dos argumentos cabe nesta situação. A
refilmagem é boa porque a história é ótima — e para por aí.
À beira de 2011, não há mais espaço para admiradores de épocas
ou gerações ficarem se digladiando. É óbvio que cada uma delas
tem qualidades e, neste caso específico, um alcance tecnológico.
Contudo, uma história bem contada sempre será uma boa
história, independentemente da tecnologia ou da mídia.
Por isso, há algumas semanas, ao conversar com um gerente de
comunicação sobre a possibilidade de oferecer ao público interno
uma versão folheável do house-organ da empresa, fiz questão de
começar a explicação deixando claro que o maior receio nesse
caso não procedia: o de tornar a edição impressa obsoleta.
Acredito que a convivência de mídias seja o novo norte da
comunicação. Após anos de queda de braço entre velhas e novas
mídias, o bom senso venceu.
No caso de uma revista interna, até que se diminua a tiragem
por conta de uma versão folheável com mídia rica incluída — pois
não é todo mundo que gosta desse tipo de mídia —, ambas são
necessárias, e dentro desse raciocínio vale até criar uma opção em
pdf puro. Há quem goste.
Da mesma forma, precisei acalmar os ânimos de uma equipe
de webtv quando o diretor de outra empresa solicitou que fosse
oferecida, para cada vídeo, sua transcrição. Foi complicado
lembrar aos profissionais que o mais importante não era o formato
a que eles se dedicavam com tanto esmero, e sim a mensagem que
eles queriam transmitir. O objetivo não era que as informações
chegassem ao público interno? Então, que fossem oferecidas
transcrições, sim!
Não importa a mídia. O ‘x’ da questão é o conteúdo, o que se
deseja transmitir. Seja por meio de sinal de fumaça ou transmissão de
você pode estar enviando seu conteúdo em um ônibus espacial
enquanto, na verdade, ele é seu vizinho de andar. “Be simple”, sempre.
108
| WIDE | 81 > MARKETING
Por isso, é sempre bom lembrar:
TECNOLOGIA É “APENAS” UMA FERRAMENTA DE COMUNICAÇÃO.
Há diversas versões, e talvez nenhuma atenda. Não é tão incomum
assim — e por isso novas tecnologias de comunicação são criadas
a cada dia. Que fique claro que é a tecnologia que está à nossa
disposição, e não o inverso.
TECNOLOGIA É PONTE PARA O PÚBLICO. Dessa forma, entenda que
TECNOLOGIA NÃO É OBRIGAÇÃO. Antes que isso se esvaia nas
brumas do tempo, é sempre bom lembrar que papel é tecnologia,
ok? Ah: e nenhuma delas é obrigatória. Achar que criará uma
imagem negativa para seu cliente se você não oferecer qualquer
tecnologia digital é um engano e tanto. Ter isso em mente
demonstra amadurecimento.
Em suma, não caia no lugar comum de raciocínios rumo à
extinção, mas que ainda povoam nosso dia a dia, como “a melhor
mídia social é o sofá da minha casa, conversando com meus
amigos” ou que “você está fora do mercado se não está no Twitter
ou no Facebook”.
Fazemos parte do coletivo, mas somos, antes de tudo,
indivíduos, cada um com o seu conteúdo — e é isso que importa.
Bruno Rodrigues
Consultor de Informação e Comunicação Digital, autor do primeiro
livro brasileiro e terceiro no mundo sobre conteúdo online, Webwriting
- Pensando o texto para a mídia digital (2000), e de sua continuação,
Webwriting - Redação & informação para a web (2006). Já ministrou
treinamentos em Webwriting e Arquitetura da Informação para mais de
30 empresas do Brasil e do exterior. Seu trabalho é citado no verbete
“webwriting” do “Dicionário de Comunicação”, uma das principais referências
em Comunicação Social no país.
Site: www.bruno-rodrigues.blog.br
E-mail: [email protected]
Twitter: @brunorodrigues
80
81 > MARKETING | WIDE |
109
Web fora da caixa
René de Paula Jr.
Geração 18 X
Eu palestro bastante, adoro. Esteja eu na
empresa X ou Y (ou em nenhuma, como
agora), sempre que posso dou palestras e
toda vez é a mesma coisa:
— O senhor trouxe seu PPT?
— Não, eu não tenho PPT.
— Não???
— Não, vou falar no gogó.
E assim tenho feito por toda parte: no
ResultsON, na ESPM e, outro dia desses, na
Feira do Empreendedor 2010 do SEBRAE,
em Belo Horizonte. Subo no palco, pego
o microfone e faço o que eu acho que a
ocasião merece: converso. Conto histórias.
Compartilho com aquelas pessoas ali o que
me preocupa naquele momento. Eu acho
isso mais honesto e importante do que trazer
algo requentado debaixo do braço. Ou vocês
preferem palestrantes que vão ao SlideShare,
misturam 300 slides de ppts alheios e batem
tudo no liquidificador? Sorry, chega de
colorantes, conservantes e flavorizantes. Meu
papo é orgânico.
110
| WIDE | 81 > MARKETING
Claro que não saio por aí falando o
que me dá na telha. O mais legal sempre
é tentar perceber o que aquela plateia
tem de único, qual seu universo, qual seu
contexto. Não faria sentido eu falar de iPad
se ninguém na plateia contrabandeou
o seu e nem vai ter grana tão cedo pra
comprar um. Nem faria sentido eu ficar
exibindo expressões em inglês para
moçadas que mal escrevem português
direito. A graça é justamente descobrir o
que faz sentido naquele lugar e naquele
momento. Eu adoro.
FOI NUMA OCASIÃO DESSAS EM QUE
comecei a palestra saindo de qualquer
script:
— Vocês têm metade da minha idade, mas
somos da mesma geração. A geração BR.
Por que eu vim com o papo de
geração BR? Porque eu não aguentava
mais o papinho de geração X, Y ou Z, ou
baby boomers ou o que for. Meu pai não
desembarcou na Normandia no Dia D, eu
não fui para a Guerra do Vietnã e aquela
rapaziada toda não tem iPhone no bolso.
Nascemos todos muito longe dos EUA,
nascemos no Brasil.
EU NASCI EM 1964, pouco depois do golpe
militar. Eu cresci na ditadura, eu perdi aula
no primário por falsas ameaças de bomba.
Meu pai nasceu pouco antes da Revolução
de 32, quando muitos paulistas morreram.
Nossas histórias são outras, os dramas são
nossos. A história alheia não nos pertence,
mas nosso futuro, sim, só pertence a nós.
A história alheia não
nos pertence, mas
nosso futuro sim, só
pertence a nós
Já temos quinze anos de internet no
Brasil e os dilemas, dramas e problemas
continuam os mesmos, mesmo que
passemos o dia inteiro online (chavecando,
claro). Opa, fui injusto? Convenhamos: se
monitorarem toda a nossa efervescência
na social media o resultado não vai ser
muito diferente disso :)
Uma das muitas coisas boas da minha
carreira até agora (sobretudo minha
última função) foi ter conversado com
as maiores agências, empresas, veículos
e profissionais do país. Circulei muito.
Tive a honra também de participar de
projetos enormes, daqueles envolvendo
milhões, dezenas, centenas de milhões
de usuários. É da minha história que eu
tiro tanto para contar. E uma história que
conto bastante atualmente é a seguinte:
agências interativas envelheceram,
engessaram-se, ficaram presas em papéis
velhos. Os grandes clientes, por outro
lado, descobriram que não podem esperar
mais pelas agências e estão se virando
sozinhos, criando núcleos internos de
inovação aliados aos negócios.
CONTAR UMA HISTÓRIA DESSAS em um
evento de interactive é ser um estragafestas, porque todo evento só tem contos
de fadas. Minha história pode não ter final
feliz ainda, mas pelo menos tem uma
moral da história: enquanto os interativos
sonham com a Terra do Nunca (o Silicon
Valley), os clientes inovadores estão de
olho nas oportunidades fabulosas que só o
Brasil tem: parcelas enormes da população
comprando seus computadores pela
primeira vez, dando os primeiros passos
no consumo e no mundo digital, classes
C e D querendo educação, melhor padrão
de vida, querendo expressão. Interativos
deslumbrados sonham com iPad para
poucos, clientes pensam em negócios
para todos e, na hora de inovar, nem
olham mais para as agências que, segundo
eles, só trazem mais do mesmo.
Estou aqui sentado escrevendo este
artigo não num G-isso ou aquilo nem
num ai-qualquer coisa. Estou digitando
num laptop bem legal que comprei no
supermercado do bairro em 18 x R$ 50,00.
Vou repetir: 18 x 50 reais.
Desencane dessa história de Geração Y.
O negócio está na geração 18 x :)
René de Paula Jr.
É profissional de internet desde 1996, passou
pelas maiores agências e empresas do país:
Wunderman, AlmapBBDO, AgênciaClick,
Banco Real ABN AMRO, Microsoft Brasil. É
criador da “usina.com”, portal focado no
mundo online, e do “radinho de pilha” (www.
radinhodepilha.com), comunidade de
profissionais da área.
[email protected]
80
81 > MARKETING | WIDE |
111
Olá, é um prazer
atendê-lo!
A satisfação dos consumidores
é o ponto de partida para
a fidelização do cliente e o
sucesso da empresa
Por Flávia Freire
112
| WIDE | 81 > E-COMMERCE
E-COMMERCE
N
ão importa o problema nem o humor
com que o cliente esteja, atender plenamente, com paciência e vontade
de oferecer a solução para o que ele
deseja, são fatores primordiais para a
satisfação tanto dos consumidores quanto da própria empresa para
manter-se competitiva no mercado, já que um atendimento ruim
pode levar o cliente direto à concorrência.
Conforme os dados publicados no WebShoppers 2010 (www.
webshoppers.com.br), relatório anual desenvolvido pela e-bit
com o apoio do Movimento Internet Segura (MIS) e do comitê da
Câmara Brasileira de Comércio Eletrônico (Camara-e.net), o índice
de satisfação com as lojas virtuais brasileiras permaneceu na faixa
dos 85% e 86% no primeiro semestre deste ano, o que mostra a
confiança do e-consumidor em fazer compras via web.
atendente deve ter liberdade para buscar soluções para o cliente,
a fim de mantê-lo fiel à empresa. “Se a empresa não quer perder
nenhum cliente, deve atender à expectativa dele de qualquer
maneira. Se a empresa é transparente, deve falar claramente que
não tem o produto ou que ele foi o primeiro cliente a pedir por tal
produto, por exemplo. Então, se tudo o que a empresa quer é ser
reconhecida como diferenciada, deve deixar o cliente satisfeito de
todas as formas, como em um restaurante, onde, se você pedir um
vinho e lá não tiver, o garçom poderá atravessar a rua para buscar o
vinho”, ressalta Roberto Meir, presidente da ABRAREC (Associação
Brasileira das Relações Empresa-Cliente) e da AIAREC (Associação
Ibero-Americana das Relações Empresa-Cliente).
Com a internet, qualquer pessoa tem a imensa facilidade de
“colocar a boca no trombone” para demonstrar insatisfação. As
empresas devem, então, ficar atentas para não correrem o risco de
seus clientes recorrerem às redes sociais. “Se considerarmos que
pelo menos 12% dos clientes insatisfeitos com o atendimento de
algumas empresas vão direto para a web retransmitir a sensação
negativa junto a mais ‘68’ amigos, e considerando a importância das
redes sociais como meio de replicar a insatisfação dos consumidores,
podemos perceber a necessidade de dotar nossos colaboradores,
que mantêm contato direto com nossos clientes, de competências
(conhecimento, habilidades e comportamentos adequados e
aplicados à operação), afim de que tenham uma atitude mais proativa
na busca de soluções para o cliente”, alerta Márcio.
Evolução do índice de satisfação do e-consumidor
*patamar de excelência
Sim, o resultado é muito bom. Mas, o trabalho para se manter
entre as empresas que oferecem bom atendimento aos clientes
não pode ser deixado de lado. “Algumas características de um bom
atendimento, e que são alvo da avaliação do cliente, são: educação,
cortesia e simpatia, que englobam tratamento personalizado,
confiança, lealdade, respeito, empatia, interesse no atendimento
e disposição para resolver o problema do consumidor. Para tanto,
o atendente deve ouvir atentamente, saber formular perguntas,
utilizar técnicas de persuasão e, por fim, entender e resolver o
problema do cliente, demonstrando que realmente se interessa por
seus problemas e suas necessidades, conseguindo sua satisfação
plena”, declara Márcio Silva, autor do livro Clientes por todos os lados
e consultor chefe da Corporativa Brasil.
De acordo com o Dicionário Michaelis, satisfação não significa
apenas o ato ou efeito de satisfazer ou a sensação agradável que
sentimos quando as coisas correm à nossa vontade ou se cumprem
ao nosso contento. Satisfação também significa reparação de
uma ofensa, explicação, justificação, desculpa. É por isso que o
O marketing garante a
primeira venda. O pósvenda garante que o
cliente volte sempre.
Então, o setor que deve
receber o maior fluxo é o
pós-venda
Roberto Meir
81 > E-COMMERCE | WIDE |
113
E-COMMERCE
AARON MAGNESS
DIRETOR DE BRAND MARKETING E DESENVOLVIMENTO DE NEGÓCIOS DA ZAPPOS
Fundada em 1999, a Zappos (www.zapos.com)
foi a pioneira em venda especializada de calçados
pela internet. Hoje, com outros tipos de produtos
disponíveis na loja, é famosa por seu estilo de
relacionamento com o cliente, por possuir um formato
de relacionamento ideal, tanto dos colaboradores com
os clientes como da empresa com os colaboradores.
Confira a entrevista exclusiva a seguir com o
norte-americano Aaron Magness, diretor de Brand
Marketing e desenvolvimento de negócios da Zappos,
para conhecer um pouco de como o atendimento
funciona entre as baias de uma das empresas mais
“alto-astral” do mundo, localizada na calma cidade de
Shepherdsville, no Estado americano de Kentucky.
WIDE Qual é o diferencial do departamento de atendimento ao
cliente da Zappos, chamado de Equipe de Fidelização de Clientes?
AARON Nossa Equipe de Fidelização de Clientes é o coração e a
alma do que somos. A equipe é medida por sua capacidade de
impressionar os clientes. Não existe horário para as chamadas
nem scripts para os colaboradores. Isso permite à equipe focar
em criar uma conexão pessoal com os clientes.
WIDE Por que a Zappos indica um site concorrente para uma
venda, no caso de faltar um produto na loja?
AARON Desde que a equipe esteja tentando construir uma
relação pessoal com o cliente, para ajudá-lo a encontrar qualquer
coisa que ele esteja procurando, nossa Equipe de Fidelização de
Clientes pode, inclusive, encaminhá-lo a um site concorrente.
WIDE A Zappos não oferece qualquer tipo de promoção ou
WIDE Na Zappos, o que significa um bom atendimento?
ção que leva à sua fidelização. Focando na fidelidade do cliente, não
temos que nos preocupar sobre como maximizar a venda a cada
dia. O foco de curto prazo nas vendas pode ser muito enganoso.
descontos. Não acha que dessa forma a loja pode perder clientes
para outras empresas que chamam a atenção por suas diversas
promoções-relâmpago?
AARON Não competimos no preço. Queremos que os clientes comprem conosco por causa da experiência e do alto nível do serviço.
WIDE Prestar um bom atendimento sempre foi o principal obje-
WIDE A equipe precisa estar sempre pronta para atender os
tivo da Zappos?
AARON No início, nosso objetivo era oferecer a maior variedade
de calçados disponível online. Quando começamos a crescer,
perguntamos a nós mesmos o que realmente queríamos ser, e
percebemos que queríamos ser algo bem maior do que éramos.
Decidimos que queríamos oferecer serviço, e isso tem sido nosso
principal guia desde então. Essa opção abrandou o nosso crescimento naquele momento, mas nos permitiu chegar ao patamar
em que estamos hoje.
clientes da melhor maneira possível. Como a Zappos faz para
manter os funcionários da Equipe de Fidelização de Clientes de
bom humor, trabalhando com excelência?
AARON Temos um grande foco em deixar os colaboradores
felizes. Funcionários felizes leva a clientes satisfeitos. Alguns
dos benefícios que incluímos são plano de saúde excelente,
alimentação gratuita 24 horas por dia, uma sala de descanso e
a todo tempo deixamos que os colaboradores se sintam confortáveis sendo eles mesmos.
AARON Tentamos causar um “UAU” nos clientes com toda intera-
Ambiente de trabalho da Equipe de Fidelização de Clientes (call center) da Zappos
114
| WIDE | 81 > E-COMMERCE
81 > E-COMMERCE | WIDE |
115
UM BOM EXEMPLO NO BRASIL
Em 2010, pelo terceiro ano consecutivo, a Drogaria Onofre
(www.onofre.com.br) foi uma das vencedoras do Prêmio
Consumidor Moderno de Excelência em Serviços ao Cliente na
categoria Farmácias (migre.me/1r2LJ). Segundo Lismeri Avila,
diretora do Onofre em Casa, a conquista do prêmio se deu pela
excelência do serviço na venda e, principalmente, no pós-venda.
“O cliente, quando opta por uma loja virtual, visa facilitar o seu
dia economizando tempo e dinheiro, e a loja deve entregar esse
pacote: atendimento, preço e tempo. Logo, o desafio começa no
primeiro atendimento, em que o atendente tem fácil acesso a todas
as informações dos produtos, como imagens, bulas e indicação. Se
necessário, o farmacêutico completa o atendimento orientando
o cliente quanto à posologia e à interação medicamentosa. O pósvenda se inicia na logística, em que cumprir o prazo de entrega é
fundamental para que o cliente fique satisfeito”, declara.
Em relação ao pós-venda, Roberto Meir diz que as empresas
deveriam investir mais no setor. “O marketing garante a primeira
venda. O pós-venda garante que o cliente volte sempre. Então, o
setor que deve receber o maior fluxo é o pós-venda. As empresas
que ultrapassam expectativas são as que têm o olho do dono. O
dono fica em cima e supera qualquer necessidade, pois ele sabe o
valor que os clientes têm”, diz.
A Drogaria Onofre também procura manter um bom relacionamento com seus clientes por meio das redes sociais. “Divulgamos
diariamente novidades aos nossos clientes e temos como principal
ferramenta o Twitter. No microblog, mostramos lançamentos em
cosméticos e medicamentos genéricos, damos dicas de beleza, lojas
especiais e promoções, entre outros”, diz Lismeri.
COMO PREPARAR OS COLABORADORES?
O bom atendimento é incentivado primeiramente pela empresa
aos seus colaboradores. “O mundo dos negócios mudou para o
mundo dos serviços. Atuamos no ramo dos relacionamentos.
Mesmo assim, o sucesso para esse setor depende, também, dos
serviços que prestamos. As empresas precisam estar muito bem
preparadas para servir o cliente, pois só assim irão obter algum
sucesso nesse novo mundo dos negócios web. Para tanto, é
necessária uma verdadeira mudança cultural, visto que os velhos
paradigmas, relacionados ao tratamento e ao atendimento ao
cliente, devem mudar. Os relacionamentos são fundamentais para
nossa vida. Imagine, agora, um mundo onde todos vivam esse real
conceito de servir. Exerceríamos uma melhor liderança, levando
os colaboradores a se sentirem felizes e motivados em nossas
empresas, e o clima organizacional seria melhor. O princípio é:
coloque seus colaboradores em primeiro lugar e veja como darão o
máximo por sua empresa. Conscientize seus líderes de atendimento
sobre a importância do pessoal da linha de frente, capacite-os, crie
campanhas motivacionais, valorize, respeite seus colaboradores
116
| WIDE | 81 > E-COMMERCE
Coloque seus
colaboradores em
primeiro lugar e veja como
darão o máximo por sua
empresa
Márcio Silva
e veja o sucesso de seu negócio. Lembre-se: a motivação é o
combustível da produtividade!”, ressalta Márcio.
O colaborador é a chave do bom atendimento. É nele que se
deve investir e valorizar para obter sucesso em seu trabalho como
atendente, segundo Lismeri Avila, da Onofre em Casa. “Todo o processo se inicia na contratação. No televendas, 60% da equipe são
estagiários de farmácia que estão cursando o terceiro ou quarto
ano e que têm como objetivo fazer carreira na Onofre ou ingressar
mais facilmente na indústria. Para os não estagiários, intensificamos
a carga de treinamento de produtos e também buscamos sempre
reter talentos, identificamos as oportunidades e muitos são promovidos para continuarem a trabalhar no call center ou em outras
áreas da empresa. Isso tudo gera satisfação ao funcionário, que atenderá bem o nosso cliente.”
Os atendentes devem receber constantes treinamentos para
ficarem inteirados sobre os produtos e as condições da empresa.
“Em se tratando de comércio eletrônico, um dos maiores problemas
é a segurança da transação. O consumidor tem dúvidas com relação
à segurança de suas informações; se o produto ou serviço comercializado remotamente atende a seus requisitos de qualidade, suas
expectativas e necessidades; e se o produto será entregue na data
e no horário combinados. A recomendação é que o colaborador
conheça bem os principais produtos/serviços (características, benefícios e vantagens do cliente), as políticas de preço e as condições de
pagamento, as políticas de segurança da organização com relação
aos dados do cliente e os principais tipos de clientes. Ainda assim,
dotar o colaborador de competências por meio de treinamentos,
monitorias e feedbacks, para que ele possa manter uma postura
proativa, demonstrando o interesse em ajudar o cliente e passando
segurança na relação”, ressalta Márcio Silva.
Muitos operadores de call center são treinados para seguir
E-COMMERCE
scripts e, assim, passam informações de uma forma muito impessoal
para os clientes. Márcio Silva declara sobre o erro nesse formato de
atendimento: “O relacionamento interpessoal com o cliente é fator
imprescindível para transmitir uma boa impressão sobre produtos,
serviços e marcas, assim como se beneficiar das informações dos
clientes para mantê-los e gerar mais negócios”.
Outra cultura utilizada em muitos setores de call center é
o tempo predeterminado para atender os clientes. No caso da
Drogaria Onofre, tais requisitos são eliminados para que os consumidores recebam um atendimento de qualidade. “Os atendentes
têm um roteiro como orientação, porém não temos limite de tempo,
pois cada cliente é único. Atendemos muitos idosos, que merecem
uma atenção especial, além de clientes com dificuldade em ler a
receita, e, nesse caso, solicitamos que nos enviem via fax ou e-mail.
Há ainda os casos de clientes que querem saber detalhes sobre um
produto, e não podemos dar um limite para ouvir o que ele necessita”, diz Lismeri.
No Brasil, se pensamos em ligar para um “0800” ou “4004”,
logo associamos isso a perder um bom tempo na espera pelo
atendimento. Segundo Roberto Meir, essa é uma estratégia dos
empresários que não sabem o valor do bom atendimento para a
empresa. “O menu eletrônico surgiu para direcionar a ligação para
o agente mais adequado para resolver o problema que o cliente
tem. Assim, empresários utilizaram isso para reter o fluxo na fila e
fazer com que vários clientes desistissem da ligação. Dessa forma,
a empresa atende menos pessoas e, mesmo deixando o cliente que
é atendido aborrecido pelo tempo de espera, resolve o problema
dele. Infelizmente, as empresas consideram o custo quando o
cliente que liga para o call center. Não é a atividade de atendimento
que é ruim, é o empresário ou a empresa que quer economizar e
não faz o correto.”
Segundo Denis H. Detzel e Robert L. Desatnick, autores do
livro Gerenciar bem é manter o cliente, os cincos segredos para
a superioridade em serviços estão fundamentados nas ações a
seguir, que contribuem para que a empresa alcance a qualidade no
ambiente interno, refletindo em qualidade no atendimento, o que
acarreta no aumento das vendas e na participação de mercado.
1. Criar um foco no cliente em toda a organização;
2. Estabelecer padrões de desempenho em serviços baseados nos funcionários;
3. Medir o desempenho em serviços em relação a marcos
de referência (benchmarcks) superiores;
4. Reconhecer e recompensar os comportamentos exemplares em serviços;
5. Manter o entusiasmo, a consistência e a previsibilidade para o cliente.
PESQUISAS DE SATISFAÇÃO
Em relação às pesquisas de satisfação, Roberto Meir as considera
como um fator importante para a empresa, contanto que elas atuem
decisivamente. “O problema é que as empresas fazem pesquisas
de satisfação para deixar o resultado armazenado. Ninguém age.
Cansei de responder a pesquisas de forma contrariada, falando
sobre a minha insatisfação, e a empresa não me deu feedback.
Em nenhum momento se mostrou preocupada em resolver o
problema da minha insatisfação. Todas as pesquisas do Brasil
divulgam um índice de 85% a 95% de satisfação dos clientes. É
mágico! Estou insatisfeito com pelo menos 975 das empresas que
fui atendido. Satisfação é o que cliente fala. Lealdade é o que ele
faz. Infelizmente, as pessoas são resignadas e têm medo, vergonha
de reclamar. Na minha posição de especialista internacional
em relações de consumo e atendimento ao cliente, analisando
empresas do mundo inteiro, percebo que elas procuram ludibriar
os clientes quando eles reclamam de algo, tentam mostrar
que foi um erro de fábrica etc.” Para Roberto, se a empresa quer
realmente melhorar com as críticas dos consumidores retratadas
nas pesquisas de satisfação, deve agir como uma auditoria. “Assim,
as pesquisas terão o poder de mexer em cima do erro para efetuar
mudanças, podendo até demitir o presidente, se necessário.”
Segundo dados da e-bit, somente nos seis primeiros meses de
2010 foram faturados cerca de R$ 6,7 bilhões em compras online,
um crescimento de 40% em relação ao mesmo período de 2009. O
e-commerce está superando expectativas. Só neste ano, 20 milhões
de brasileiros efetuaram pelo menos uma compra pela internet,
em um tíquete médio de R$ 379. A concorrência é grande, e os
lojistas estão cada vez mais recorrendo às empresas que garantem
segurança nos meios de pagamentos e de dados dos consumidores.
Então, “mexer os pauzinhos” para melhorar o formato de
atendimento já é uma ótima maneira de fidelizar clientes.
Satisfação é o que
cliente fala. Lealdade é
o que ele faz
Roberto Meir
81 > E-COMMERCE | WIDE |
117
118
| WIDE | 80
81 >>E-COMMERCE
E-COMMERCE
80
81 > E-COMMERCE | WIDE |
119
TACADA
DE MESTRE
Saiba como a Netshoes conquistou
a 4ª posição entre as lojas virtuais
mais acessadas do país
Desde 2001 na internet, quando o
varejo na rede ainda estava dando
os primeiros passos no Brasil, a
Netshoes vem se consolidando
como a loja de artigos esportivos
mais acessada do país. No ranking
do site Alexa.com, que aponta os
cem sites mais visitados do Brasil,
na categoria “shopping” a Netshoes
fica atrás apenas de Americanas,
Submarino e Saraiva.
E-COMMERCE
Não podíamos deixar, então, de ir atrás dos segredos e das
estratégias dessa loja virtual que se mantém em tão boa colocação
em número de visitantes únicos por dia. Roni Cunha Bueno, diretor
de marketing do setor de varejo da Netshoes, fala de toda a trajetória
da loja, desde a decisão de sair das lojas físicas e se consolidar
apenas na web até a conquista das categorias de esporte e tênis do
maior portal de e-commerce do país, a Americanas.com.
WIDE Desde quando a Netshoes está no ar? Ela foi a primeira loja
desenvolvida pelo Grupo NetShoes?
RONI BUENO A Netshoes existe há dez anos e hoje é líder em venda
de artigos esportivos online. A empresa começou como loja física
no ano 2000 e chegou a possuir oito unidades. Pioneira, também
criou sua loja virtual e, em 2007, fechou as lojas físicas para tornar-se
PurePlay, ou seja, totalmente online.
WIDE Segundo pesquisa realizada pela comScore, empresa líder
mundial na medição do mundo digital, a Netshoes é a terceira loja
virtual mais visitada do Brasil e cresceu, no último ano, em 49% o
número de visitantes únicos. A que se deve esse grande crescimento
em tão pouco tempo?
RONI BUENO O principal drive desse crescimento é o investimento
agressivo em mídia, parte essencial da estratégia da empresa. Além
disso, podemos considerá-lo fruto de muito trabalho, dedicação e
foco em serviços. A empresa investe cada dia mais nas melhores
práticas e busca os melhores profissionais do mercado, a fim de
garantir a qualidade da sua operação e consequente satisfação de
seus clientes. Vale lembrar que possuímos uma ferramenta em
nosso site com a qual o consumidor pode avaliar o artigo adquirido,
e isso é uma base para nós e outros consumidores mensurarmos a
qualidade de produtos. Então, artigos bem avaliados por consumidores dão mais segurança para outros comprarem. Para exemplificar, na época da Copa tivemos mais de mil avaliações da camisa
da Seleção, com consumidores comentando sobre a qualidade do
tecido, o caimento etc. Isso é extremamente importante, pois é o
nosso consumidor falando por nós, atraindo outros compradores.
WIDE A partir de quando a Netshoes passou a ser responsável
www.netshoes.com.br
pela administração das categorias de esportes e tênis do portal
Americanas.com?
RONI A parceria com Americanas.com surgiu no final de 2005 e
vem se consolidando ao longo do tempo. Ao estabelecer a parceria
com a maior loja de e-commerce do país, a Netshoes fortaleceu sua
posição no mercado.
WIDE Quais são as estratégias utilizadas pela Netshoes para se manter entre as lojas mais acessadas do Brasil?
RONI Foco no cliente, investimento em marketing e tecnologia e
busca pelo erro zero. Atualmente, contamos com uma central de
relacionamento disponível 24 horas por dia, visando atender às
necessidades dos clientes o mais breve possível, além contarmos
81 > E-COMMERCE | WIDE |
121
E-COMMERCE
A Netshoes produz mais de
seis mil banners por mês
em cerca de 200 sites
diferentes, desde os
grandes portais até blogs.
Anunciamos, ainda, nos
canais SporTV e Band,
além da rádio
Transamérica
com 100% de controle do nosso centro de distribuição para que as
entregas sejam realizadas em até dois dias úteis nas principais regiões do país.
A Netshoes produz mais de seis mil banners por mês em cerca
de 200 sites diferentes, desde os grandes portais até blogs. Como
somos uma loja virtual, buscamos estar presentes onde nosso
cliente está, então também investimos em redes sociais. Estamos
presentes em Twitter, Orkut, Facebook e YouTube, além de contar com blogs de todas as lojas administradas por nós. No total, são
mais de 50 mil clientes que interagem conosco constantemente
pelas redes sociais. Não deixamos, porém, de dar atenção às demais
mídias e anunciamos, ainda, nos canais SporTV e Band, além da
rádio Transamérica.
realizada internamente, com frequente troca de conhecimento
entre as partes, buscando sempre o melhor resultado.
WIDE Qual a última novidade da Netshoes?
RONI Recentemente, a Netshoes implantou um novo sistema de
atendimento online, em parceria com a NeoAssist. Com esse novo
método implantado, a Netshoes garantirá mais agilidade para responder às perguntas mais frequentes dos internautas. Em média,
90 mil atendimentos são solicitados por mês pelo e-consumidor
ao sistema inteligente, sendo 60% das respostas solucionadas de
maneira automatizada. O sistema inteligente de atendimento da
NeoAssist traz respostas imediatas a dúvidas comuns, sem intervenção humana, mostrando inúmeras informações que facilitam o
processo gerencial.
WIDE Como foi desenvolvido esse sistema?
RONI O atendimento automatizado é possível porque o sistema
inteligente de atendimento, instalado na loja virtual, é composto
por um banco de dados personalizado pela NeoAssist em parceria
com as principais perguntas e respostas definidas junto à Netshoes.
As plataformas emitem relatórios atualizados em tempo real, que
mostram a performance do atendimento, a quantidade de perguntas feitas, as respostas e todos os históricos. Os resultados permitem
à loja virtual traçar novas estratégias pensando constantemente na
melhoria do atendimento ao cliente.
WIDE Por que a Netshoes optou por esse novo sistema?
RONI Queríamos disponibilizar aos internautas que compram na
Netshoes um canal de autoatendimento com retornos rápidos em
relação ao que precisam, para que se sintam tão confortáveis como
se estivessem em uma loja física.
WIDE O Grupo Netshoes é composto por treze lojas virtuais. Quais os
diferenciais das lojas desenvolvidas pelo Grupo Netshoes?
RONI Todo o knowhow e o foco em serviços desenvolvidos e utilizados na Netshoes é replicado nas lojas parceiras. Compartilhando
recursos, conseguimos adotar práticas inovadoras e tecnologia de ponta em operações que não seriam viáveis de forma
independente.
WIDE Para atender a tantas lojas virtuais e administrar todo o conteúdo de seus sites, a equipe do Grupo NetShoes conta com quantos
profissionais e em quais funções?
RONI Atualmente, o quadro conta com mais de 650 colaboradores diretos distribuídos em atendimento, marketing, logística, operações, tecnologia e comercial. Toda a gestão das lojas do grupo é
122
| WIDE | 81 > E-COMMERCE
www.netshoes.com.br - página de produto
81 > E-COMMERCE | WIDE |
123
E-COMMERCE
O BOTÃO
“COMPRAR”
É SÓ O PRIMEIRO
PASSO
Por Flávia Freire
O cliente pode navegar pela loja virtual,
colocar os produtos que deseja no
carrinho de compras, calcular o frete, ver
o prazo de entrega... todo um trabalho de
pesquisa que pode ser abolido na hora “H”
devido a problemas com o cadastro no site
e o processo de pagamento. Saiba como
oferecer uma e-shop totalmente intuitiva
e agradável aos usuários com as dicas de
usabilidade de Amyris Fernandez.
124
| WIDE | 81 > E-COMMERCE
Amyris Fernandez
Sócia-diretora da Usability Expert e diretora do IxDA (Interaction Design Association) de São Paulo
Assim como temos um formato de arquitetura de informação
parecido em todos os provedores de e-mail e nos portais de notícia,
nas lojas virtuais funciona da mesma maneira. Quando a onda do
e-commerce chegou ao Brasil, poucos sites de vendas predominavam
na internet. Por meio deles, nos acostumamos com o modelo básico
de e-shops, que traz os departamentos no menu horizontal no
topo da página e as definições dos produtos desse departamento
organizadas no menu vertical da esquerda, para uma busca facilitada.
Mas, não basta seguir um padrão visual para agradar os clientes e
direcioná-los à página de compra. Para saber sobre todos os detalhes
que devem ser levados em consideração em relação à usabilidade
de uma loja virtual, conversamos com a sócia-diretora da Usability
Expert e pesquisadora sobre usabilidade e experiência do usuário
em meios digitais, Amyris Fernandez. Diretora do IxDA (Interaction
Design Association) de São Paulo. Amyris fez mestrado em Comércio
Eletrônico pela University of Rochester, nos Estados Unidos, e
publicou dois livros no exterior sobre interatividade e usabilidade.
WIDE Como diz o ditado, a primeira impressão é a que fica. Então,
com o que os desenvolvedores e designers devem se preocupar para
que a página principal da loja virtual transmita confiança ao usuário,
para que ele se sinta à vontade para continuar navegando pelo site
e efetuar compras?
AMYRIS “Você nunca tem uma segunda chance de causar a primeira
impressão.” A primeira página não é sobre confiança em fazer a
transação somente, mas deve refletir a imagem da marca. Sites pobres
graficamente transmitem a impressão de falta de profissionalismo,
assim como sites muito cheios de tecnologias podem assustar o usuário comum. É preciso saber qual é a percepção da marca que se deseja
no consumidor, para poder fazer boas escolhas em termos de página.
AMYRIS A melhor é aquela que seu público pede. Por essa razão,
conversar com os usuários na fase de concepção do projeto e fazer os
testes de usabilidade é tão importante. São testes qualitativos, feitos
com no mínimo cinco a oito pessoas por segmento de público-alvo do
produto, em sala de espelho dupla face. Faz-se o registro sincronizado
de expressões faciais e movimentos de mouse.
WIDE Segundo dados do WebShoppers Brasil 2010, 86% dos entrevis-
tas disseram que apenas olharam alguns itens e saíram da loja e 14%
deram início ao processo de compra, mas acabaram não concluindo
o procedimento. Qual você acha que é o maior erro de usabilidade
apresentado nas lojas virtuais brasileiras hoje que pode “expulsar” os
usuários da loja virtual?
AMYRIS Há quatro grandes vertentes a se observar numa interface:
design, tecnologia, arquitetura de informação e conteúdo. Boa parte
das pessoas ligadas ao desenvolvimento de interfaces preocupa-se
tremendamente com as três primeiras e, quando chega na hora do
conteúdo, cansa (risos). Nessa hora, o sujeito recorta e cola o material
promocional do dono do produto e pronto. Nada poderia ser pior
para o processo de vendas online de um produto. Depois de achá-lo,
parte do que se quer é explorá-lo visualmente e tecnicamente. Todo o
lado técnico é texto. Na minha experiência, quase todas as lojas erram
na hora e no lugar de apresentar os densos textos técnicos, que só
interessam a uma meia dúzia de gente, e textos mais vendedores, que
não interessam nessa hora. O sujeito já comprou a ideia de ter uma TV
LED, não precisa ficar lendo textos que fazem apologia às maravilhas
do LED, por exemplo.
WIDE Em relação às fotos dos produtos, qual é a melhor maneira de
WIDE Há alguma estrutura de site para lojas virtuais que forneça
uma melhor usabilidade ao usuário, como o posicionamento do
menu, por exemplo?
AMYRIS Não existe uma regra, mas seguir o que é usual de se fazer
em cada cultura/país é aconselhável. As pessoas se acostumam
a certos modelos e em cada país é diferente. O brasileiro gosta
de páginas graficamente interessantes, mesmo que sejam mais
complicadas de navegar.
apresentá-las? A exibição em diferentes ângulos de um produto é
necessária? E a ferramenta de zoom? Que tipo de apresentação de
imagens agrada mais aos usuários?
AMYRIS A melhor maneira engloba três características:
1. Foto em todos os ângulos, principalmente os “mais sexys”, como as
diferentes entradas que ficam na parte de trás das TVs, por exemplo;
2. Zoom;
3. Slideshow e controle para ver as fotos.
O que mais agrada o usuário é a possibilidade de visualização em
diferentes tamanhos e fotos de alta qualidade de resolução.
WIDE Existe uma melhor maneira de organizar os produtos em
WIDE Quais fatores facilitam e quais prejudicam a compra online?
um menu?
AMYRIS A persuasão da compra está na foto, no texto e no preço, em
81 > E-COMMERCE | WIDE |
125
E-COMMERCE
última instância. O que facilita ou pode travar a venda é o cadastro.
Sempre o cadastro. Um cadastro longo pode fazê-lo desistir, assim
como um formulário que gera muitos erros. Quando as duas coisas
estão combinadas, pode ter certeza que o usuário vai para o seu
melhor concorrente ou para um site onde ele já tenha o cadastro,
mesmo que o produto seja mais caro nesse outro site.
WIDE Quais detalhes transmitem confiança ao consumidor sobre
seus dados pessoais informados?
AMYRIS Todos os símbolos com cara de cadeado aumentam a sensação de segurança. São coisas que os usuários já reconhecem como
símbolos de segurança.
WIDE Quantas etapas são ideais para um processo de compra?
AMYRIS O processo em quatro etapas é comprovadamente o melhor
e está disponível em sites como o Submarino, por exemplo. Os passos:
identificação (embrulho para presente ou outro endereço é opcional),
entrega, pagamento e confirmação. Lembrando que meios de
pagamento devem estar ao lado do produto, juntamente com o preço,
e o mesmo sobre prazo de entrega ao lado do “pagamento”.
WIDE Em relação à acessibilidade das lojas virtuais, a usabilidade
tem papel fundamental para tornar o site acessível para deficientes visuais?
AMYRIS Acessibilidade não é só uma questão de dar acesso ao
pessoal com deficiências visuais. Há outros problemas, como dificuldades motoras, incapacidade de distinguir certas cores, auditiva
(pensando que alguns feedbacks do site podem ser predominantemente sonoros) e a mais desconhecida de todas: a incapacidade de
compreender o que lê. Há mais gente dentro dessa última categoria
do que vocês imaginam! Para melhorar a acessibilidade das lojas virtuais para tais pessoas, deve-se tomar um cuidado redobrado com o tipo
e a quantidade de palavras. Não deve ultrapassar um vocabulário de
três a cinco mil palavras, o que é equivalente ao vocabulário de uma
criança de oito a dez anos de idade.
WIDE Você acha que uma usabilidade ruim, mesmo que o usuário
consiga finalizar a compra, faz com que ele não volte mais ao site e
faça um marketing negativo sobre a loja para outras pessoas?
AMYRIS Sem dúvida! Isso corresponde a ser maltratado pela vendedora de uma loja física ou ver um caminhão de entregas estacionado
em fila dupla na sua rua. É sua imagem de marca que fica desgastada.
126
| WIDE | 81 > E-COMMERCE
Quase todas as lojas erram
na hora e no lugar de
apresentar os densos
textos técnicos, que só
interessam a uma meia
dúzia de gente
81 > E-COMMERCE | WIDE |
127
E-commerce Mariano Gomide de Faria
Shop.org 2010
A vez da indústria do vestuário e da personalização
São 16:43 em Dallas, Texas. O pessoal da revista Wide desesperado
porque ainda não mandei a coluna. Anualmente venho ao
Shop.org, o maior evento de e-commerce do mundo, para me
atualizar. Como de costume, assisto a palestras, casos, escuto,
escuto, aprendo e abordo os profissionais mais interessantes
para conhecer detalhes das suas operações de e-commerce. Há
trinta minutos falei com Glen Senk, CEO da Urban Outfitters. Fora
a gravata borboleta azul, é um sujeito muito interessante. Para
os que não conhecem, a Urban vende 2,5 bilhões de dólares. Dos
quais 450 milhões de dólares pela internet. Algo em torno de
17% de sua venda total vem do canal e-commerce. Pelo volume
e pela competência de gerir tamanha operação, naturalmente
eu esperava que o Mr. Glen dedicasse apenas cinco minutos a
este brasileiro que vos escreve. Para meu espanto, Pati Freeman,
vice-presidente da Forester Research, o aguardava ansiosamente.
Após as introduções, para minha surpresa, fui questionado sobre
o mercado brasileiro. Deu início, então, a uma conversa em que
eu era o provedor de informações. Como assim?? Isso mesmo!
O mundo está definitivamente de olho no Brasil. Resumindo, a
conversa acabou, não consegui perguntar absolutamente nada
e, na despedida, o convidei para conhecer melhor o Brasil. Ele
aceitou prontamente. Meus amigos leitores, o mundo efetivamente
mudou. Os nossos ídolos passam a ser nossos parceiros comerciais.
Fora a comprovação do fato de que o Brasil é absolutamente
relevante, percebe-se claramente uma grande tendência das
empresas de vestuário. O mercado de varejo de roupas pela
internet tomou grande parte das palestras e apresentações. O Brasil
PERGUNTA DO LEITOR
Se você tem alguma dúvida sobre como melhorar a performance de
vendas de sua loja eletrônica, envie para [email protected].
Sua pergunta poderá ser selecionada e respondida na próxima edição.
128
| WIDE | 81 > E-COMMERCE
seguirá o mesmo caminho. As lojas de rua e os shopping centers
que conhecemos comercializarão pela internet de forma efetiva.
Sites como “The Art of the Trench”, “Fashionista”, “BackCountry” e
“Polyvore” trazem boas novidades.
OUTRO ASSUNTO MUITO PROMOVIDO FOI A QUESTÃO DA
personalização. Ofertar o produto correto para o cliente por
meio de ferramenta de recomendação é uma aposta certa.
Como exemplo, o Staples.com, segundo maior site dos EUA,
aumentou em 22,3% o seu ticket médio com uma ferramenta de
recomendação de cross selling.
Por fim, outro assunto que tomou conta da pauta foi o Cross
Channel. Unir os canais (loja, e-commerce, mobile, site, mídias
sociais, e-mail marketing etc.) é necessário. Muitas empresas
apresentaram casos interessantes de ganho de escala em esforços
nessa área.
Para finalizar, antes de receber mais um telefonema da editora
da Wide, vale indicar o site “Wet Seal”, que é uma boa forma de
atuação de social network aplicada a e-commerce. Temas como
mobile e-commerce e iPad e-commerce ganharam força.
De Dallas, Texas, para a edição da Wide.
Esta coluna tem o objetivo de trazer informações relevantes e discutir temas
polêmicos à sustentabilidade do crescimento do setor de comércio eletrônico,
como também trazer novidades e curiosidades dos seus bastidores.
Colabore com perguntas e informações.
Mariano Gomide de Faria
Diretor executivo da empresa de tecnologia Vtex, membro do conselho
de administração do E-commerce Summit e presidente do conselho da
Estação do Vinho. [email protected]