E D I T O R A

JULHO/AGOSTO 2011

R$ 11,90

A revista dos prossionais de internet

Criao
Conhea ferramentas que oferecem
variadas maneiras de testar a
usabilidade do seu site

Tecnologia
Crie aplicativos para as plataformas
iPhone OS, Android, BlackBerry e
Windows Phone 7

Marketing
Como planejar campanhas inteligentes
e eficazes nas mdias sociais para
propagar sua marca

E-commerce
Saiba como se manter entre os sites
de compras coletivas mais
acessados do Brasil

REDES SOCIAIS
SEGMENTADAS
Umas das principais tendncias de 2011

a
d
Prepare-se para se envolver nesse poderoso
en
r
canal de comunicao de forma significativa
ap
:
l
e conhea as estratgias bem-sucedidas
a
ci
e
de 12 cases interessantes do Brasil.
p
em
g
a
rt
o
p
Re

es

I
R

R
A

P
A

85 > FRONT | WIDE |

S
P
1

| WIDE | 85 > FRONT

85 > FRONT | WIDE |

EDITORIAL

Pinguins...
Minha filha de seis anos quer ser um pinguim virtual. No, ela
no est passando por uma crise de identidade precoce, quer
apenas acompanhar o mais novo passatempo dos coleguinhas
da escola. Trata-se de uma rede social da Disney, voltada para o
pblico infantil: Club Penguin. Disponvel em portugus, ingls,
francs e espanhol, a rede multinacional caiu no gosto do pblico mirim.
Se prestarmos ateno, veremos que vrias redes de nicho, como
essa, esto surgindo em ritmo acelerado no mercado digital.
A propagao das redes sociais segmentadas foi umas das
dez principais tendncias para 2011 apontadas pelos estudos da MillwardBrown. Mesmo antes do surgimento do Twitter ou do Facebook, a internet j possibilitava a formao de grupos com interesses especficos. E a popularizao das grandes
redes sociais serviu, ento, para impulsionar e fomentar as redes
de nicho j existentes, alm de inspirar novos empreendedores.
Vocs iro conferir na matria principal como anda esse mercado promissor. Fiquem de olho, grandes oportunidades surgiro
a partir da.
E os aplicativos para smartphones? No poderiam ficar de
fora da Wide. Michel Lent, em sua coluna (pgina 45), descreveu muito bem o cenrio onde os aplicativos j aparecem na mdia como o ganha-po do momento, o novo bico na internet,
ou seja, est despertando o maior interesse do mercado. No
deixe de ler. E nossa jornalista Flvia Freire caprichou na produo de uma matria sobre o assunto, cobrindo as principais
plataformas utilizadas nos dispositivos. Enfim, uma reportagem
completa para que voc mergulhe no mundo dos aplicativos
mveis e inicie suas criaes. Quem sabe daqui dos leitores da
Wide no surjam os futuros grandes players desse mercado?
Design Thinking. Outra novidade? Digamos que o mercado finalmente se atentou para a importncia do design como estratgia de negcios. O que muito bom para o nosso segmento! Essa
foi uma pauta sugerida pelo leitor e amigo Cayo Medeiros,
que sempre interage bastante com a redao da revista,
trazendo ideias superbacanas. Quem foi convidado e tambm participou dessa ltima reunio de pauta foi o Henrique Bastos. Seu entusiasmo na rea de desenvolvimento
web to contagiante que acabamos elegendo o prprio
como entrevistado do ms da editoria Tecnologia.

85
Direo Geral
Adriana Melo
Direo de Redao
Flvia Freire
Jornalismo
Tiago Bosco
Reviso
Rodrigo Gerdulli
Projeto Grfico
Tabaruba Design
Direo de Criao e Ilustrao
Camila Oliveira
Ilustrao (colaborao)
Carolina Vigna-Mar

Publicidade
Luanna Chacon
Atendimento
Michelle Ferraz
Tecnologia
Neilton Silva
Financeiro
Cristiane Dalmati

Revista Wide
www.revistawide.com.br
Verso para eReaders
www.revistawide.com.br/ereader
Arteccom
Eventos, editora e treinamento
www.arteccom.com.br

www.twitter.com/arteccom

www.facebook.com/arteccom

www.flickr.com/arteccom

Desejo uma tima leitura para voc!

Adriana Melo

Fale conosco
Atendimento: atendimento@arteccom.com.br
Redao: redacao@revistawide.com.br
Publicidade: publicidade@arteccom.com.br

www.youtube.com/arteccom

Produo grfica
www.ediouro.com.br
Produo digital
www.kahek.com.br
Distribuio
www.chinaglia.com.br

| WIDE | 85 > FRONT

85 > FRONT | WIDE |

CAPA

Redes sociais
segmentadas
Contribua de forma
significativa para
esse poderoso canal
de comunicao
e conhea cases
brasileiros de
sucesso

E-MAILS E TWEETS > 06

48

FIQUE POR DENTRO > 08

Notcias, Blogs, Mtricas,
Agenda, Livros, Direito
na web, Internacional,
Empreendedorismo

Criao
> p. 14

Tecnologia
> p. 60

Marketing
> p.94

E-Commerce
> p. 110

PORTFLIOS > 14
Agncia: Fri.to / Freelancer:
Thiago Andrade / Ilustrao:
Flavio Pessoa / Lente Digital:
Luiz Mascarenhas / Fontes de
Inspirao: Gustavo Soares

REPORTAGEM > 60
Crie aplicativos para as
plataformas mveis iPhone OS,
Android, Windows Phone 7 e
BlackBerry OS

REPORTAGEM > 94
Estratgias de marketing para
as mdias sociais: acompanhe
um passo-a-passo para
propagar sua marca nesse
poderoso universo

REPORTAGEM > 110

Social Commerce: conhea
tudo sobre esse conceito
que estimula uma maior
aproximao entre os clientes
e as marcas

CAMPANHA > 98
Banda Jota Quest aposta na
interatividade por meio da
troca de informaes com
os fs em sua campanha de
marketing na web

ENTREVISTA > 118

ndres Oliveira e Marcos Silva,
da Flexer, e o especialista
de direito eletrnico Renato
Opice Blum falam sobre como
se destacar entre os sites de
compras coletivas

REPORTAGEM > 24
Conhea dez opes de
ferramentas para testar e
melhorar a usabilidade de
seu site
ENTREVISTA > 28
O talentoso artista Mateu
Velasco apresenta um estilo
prprio de ilustrao e grafite
REPORTAGEM > 34
Cobertura do maior festival de
publicidade realizado no pas:
Wave Festival 2011
ESTUDO DE CASO > 38
Rede social Mundo do Stio
rene os mais modernos
recursos de interatividade
COLUNAS > 42
Ilustrao: Carolina Vigna-Mar
/ Design de interao: Amyris
Fernandez / Internacional:
Julius Wiedemann / Aqui, ali,
em qualquer lugar: Michel Lent

| WIDE | 85 > FRONT

ENTREVISTA > 68
O revolucionrio desenvolvedor
carioca Henrique Bastos
fala sobre o conceito de
comunidade, suas iniciativas
com Python e Django, Software
Livre e muito mais
OPINIO > 72
Desenvolvedores experientes
fazem uma anlise sobre o uso
de Programao Orientada a
Objetos e a estrutura Model
View Controller
ENTREVISTA > 76
Os ingleses Gavin Ambrose e
Paul Harris, autores do livro
Basic design: Design Thinking,
explicam a metodologia
COLUNAS > 84
PHP: Gustavo Guanabara /
Ciberespao: Ricardo Murer /
Segurana: Ivo Machado / Cloud
Computing: Lenildo Morais /
Tableless: Diego Eis / Mercado
de TI: Paulino Michelazzo

ENTREVISTA > 102

Consultor, palestrante e autor
do livro Google marketing,
Conrado Adolpho fala sobre
as novidades e mudanas
na rea de marketing digital,
tendncias e muito mais
COLUNAS > 106
Webwriting: Bruno Rodrigues /
Marketing: Ren de Paula

ESTUDO DE CASO > 122

O projeto Mundo Verde
Experience apresenta uma
nova maneira de vender
experincias em forma de
vale-presente
COLUNAS > 126
Search & Social Media: Tiago Luz
/ E-commerce: Mariano Faria

Os links citados nesta edio esto reunidos na pgina principal do site da

revista. Acesse www.revistawide.com.br.
A Arteccom no se responsabiliza por informaes e opinies contidas nos
artigos assinados, bem como pelo teor dos anncios publicitrios.
No permitida a reproduo de textos ou imagens sem autorizao da Editora.

85 > FRONT | WIDE |

E-MA IL S

E-mails e
Tweets

[redacao@revistawide.com.br]

Ol, pessoal da redao da

Wide. Escrevo para sugerir a
vocs uma pauta que considero
interessante para muitos leitores
da revista: aspectos legais,
tanto para quem quer montar
uma loja virtual, quanto para
quem quer abrir uma empresa
de design. Exemplo: O que o
empresrio obrigado a fazer
para estar com sua loja virtual
totalmente legalizada? O que
considerado cpia em relao
a imagem e tipologia? Quais so
as ferramentas gratuitas para
uso comercial? Obrigado!
FRANCIS VIEIRA
FRANCISVIEIRA@YAHOO.COM.BR

timas sugestes, Francis! So

todas realmente interessantes
e j esto na nossa lista de
pauta para serem discutidas na
prxima reunio. Obrigada!

Gostaria de saber se vocs

recebem artigos para
publicao. Sou graduada em
desenho industrial e mestre em
Comunicao Social, e minhas
reas principais de pesquisa
so comunicao grfica digital,
era digital e identidade visual.
Agradeo desde j.
LEILA GISELE KRGER
LEILAGISELEKRUGER@GMAIL.COM

Ol, Leila. Agradecemos pelo

contato. Sinta-se vontade para
encaminhar os seus artigos para o
e-mail redacao@revistawide.com.
br. Assim, poderemos estudar a
possibilidade de public-los no
site da Wide ou aqui na revista.
Ol, comprei a edio de maio/
junho de 2011 e, antes de qualquer
coisa, gostaria de parabenizar
pelos assuntos. As reportagens
esto timas, principalmente
sobre e-commerce e Fan Page no
Facebook. Vi que h uma pgina
com indicaes de blogs e estou
aqui para indicar o Cutedrop
(www.cutedrop.com.br), que

um blog variado sobre design,

tech, moda e at culinria. Mas, o
foco est no design! Espero que
vocs gostem.
LETCIA MOTTA
LETICIAMRMOTTA@GMAIL.COM

Gostamos, sim, Letcia! Blog indicado. O Cutedrop realmente

muito legal. Voc e a Paula
Barone esto realizando um
timo trabalho, parabns!
No Facebook.com/arteccom:

No querendo fazer
propaganda no, mas sempre
me surpreendo com as
edies da revista Wide.
Matrias de grande valia. Sinal de
um excelente trabalho de vocs.
EVERTON MELO
(WWW.FACEBOOK.COM/EVERTONMELO)

Obrigada, Everton! Ficamos

felizes em saber que estamos
ajudando os profissionais da
rea a estarem cada vez mais
informados sobre as novidades.

T W E E T S [@arteccom, #revistawide]

@tuzk
J estou com a minha nova
@revistawide em mos,
imperdvel esse ms, com
muitas dicas sobre Ecommerce, precisam ler!

@fredecs
timo artigo de @kauelinden
na @revistawide #84 sobre a
imagem de uma empresa na
web. Vale a pena a leitura!

@elyanoveras
A Revista Wide est show
de bola! Assunto de capa
Venda pela Internet
http://bit.ly/db079E
@arteccom #RECOMENDO

@_TVieira
O Mariano Faria fala das novas
experincias de consumo nos
EUA, unindo online e offline;
na @RevistaWIDE desse ms.
Recomendo.

@semitom
Vou ler e compartilhar informaes sobre a revista aqui no
Twitter, mas recomendo a todos
os profissionais da rea a
@RevistaWIDE. Muito boa

@luizwarner
Hoje comprei uma #revistawide
para profissionais da internet,
muito boa hein, dicas de
marketing, toques para quem
vende na web!!! Recomendo

@aretadobem
Finalmente lendo minha
#RevistaWide desse bimestre,
mt legal a reportagem sobre
Advergames e olha qm est
aqui... @gazozzo! Amei

@vieiralessandro
Estou lendo a #revistawide
desse ms sobre e-commerce.
Gostei da indicao do
#Prestashop

ERRATAS

Sugestes dadas atravs dos e-mails enviados revista passam a

ser de propriedade da Arteccom.

| WIDE | 85 > FRONT

- O TTULO DO ARTIGO DO IVO MACHADO NO ESCALABILIDADE DO CDIGO CLIENT-SIDE,

COMO FOI PUBLICADO NA PGINA 86 DA EDIO 84 (MAIO/JUNHO), E SIM XSS-ME: ADDON
PARA FIREFOX DE ANLISE DE XSS.
- O NOME DO DIRETOR DE MARKETING DA NETSHOES RONI CUNHA BUENO, E NO RUI CUNHA
BUENO, COMO FOI PUBLICADO NA REPORTAGEM MARKETING PARA E-COMMERCE, NAS
PGINAS 94 E 95 DA EDIO 84 (MAIO/JUNHO).

85 > FRONT | WIDE |

N OT C I A S

Magento + eBay =
X.Commerce

Fique
por dentro
FIFA 12 nos dispositivos da Apple

Extras no eReader
Se voc estiver lendo a Wide
pelo seu eReader, clique aqui
e assista ao vdeo de
demonstrao do
motor fsico, que
promete resultados
nicos para cada
coliso em campo no
game FIFA 12.

A EA Sports j anunciou o lanamento da nova verso do game

FIFA 12 para o ltimo trimestre de 2011, e dessa vez sero 500 times
licenciados e mais de 15 mil jogadores. Novidades como drible com
preciso, defesa ttica, inteligncia para o player e o novo modo de
carreira estaro disponveis no game, que ganhar verses para os
consoles PlayStation3, Xbox 360, Wii, PC, PlayStation 2, Nintendo
3DS e PSP. Os mais desejados gadgets da Apple iPhone, iPad e iPod
tambm entraram literalmente na jogada. Para Playstation 3 e
Xbox 360, o novo motor fsico Player Impact Engine, que estava h
dois anos em desenvolvimento, promete trazer a fsica do mundo
real a cada interao no gramado virtual. Ele processa decises de
forma contnua e em tempo real a cada ponto de contato no corpo
do jogador, gerando, assim, resultados nicos a cada coliso. No
ano passado, a franquia de jogos de esportes FIFA bateu recorde
de vendas mais rpidas para um game de esporte com o FIFA 11,
que traz o jogador brasileiro Kak na capa: foram vendidas 2,6
milhes de cpias em apenas uma semana na Europa e na Amrica
do Norte. A nova verso ser oficialmente vendida pela Warner
Bros. e distribuda pela Videolar no Brasil, aguarde! Enquanto isso,
acompanhe as novidades no site www.ea.com/intl/football.

Fala, que o Google busca

Em entrevista coletiva, a Google anunciou mais
uma novidade: Google Voice, uma ferramenta
de reconhecimento por voz para facilitar as
pesquisas feitas principalmente pelos usurios de
smartphones, que perdem tempo ao ter que digitar

Vem a uma nova plataforma

open source de comrcio eletrnico, e o que ainda melhor, ser
produzida pelo core do Magento.
O eBay, que j havia comprado
49% das aes da empresa no ano
passado por US$ 22,5 milhes,
acaba de adquiri-la integralmente, e o acordo resultar no desenvolvimento do X.Commerce, um
sistema gerenciador de contedo global para comrcio eletrnico que promete oferecer uma
ampla gama de servios para comerciantes de todos os portes.
Mas isso no significa o fim da
plataforma Magento. O pacote de
softwares da empresa Magento
Community, Enterprise, Mobile
Editions, Magento Go e Magento
Go Platform continuar tendo
suporte e sendo aprimorado. A
empresa, fundada e dirigida por
Roy Rubin e Yoav Kutner, tambm permanecer oferecendo
treinamentos, cursos e servios
de consultoria, s que agora com
muito mais recursos devido ao
apoio financeiro do eBay.

os termos de suas pesquisas pelo pequeno teclado

que os aparelhos oferecem. Basta clicar no cone de
microfone localizado direita da barra de buscas e
falar em ingls! Nos PCs, por enquanto a tecnologia
est disponvel apenas para a ltima verso do
Google Chrome. Assista ao vdeo de demonstrao:
www.google.com/insidesearch.

MTRICAS

427,8 milhes

Vendas de unidades de dispositivos mveis no primeiro trimestre de 2011, o que

US$

1,4 trilho

Estimativa que o e-commerce deve atingir no mundo em 2015, com um

representa um aumento de 19% em comparao com o mesmo perodo do ano

crescimento de 13,5% ao ano. Estados Unidos, Reino Unido e Japo podem chegar

passado. Os smartphones correspondem a 23,6% das vendas totais de celulares,

a uma parcela do mercado global de 53% das vendas em 2015, e pases como

um avano de 85% em relao ao ltimo ano. Fonte: Gartner (www.gartner.com)

Espanha, Brasil, China, Rssia e Mxico devem crescer a mdias anuais de 26% ao
ano at essa data. Fonte: Cisco (www.cisco.com)

| WIDE | 85 > FRONT

BLO GS DO M S

Os coletivos
Matrias e artigos jornalsticos sobre o
fascinante mundo das compras coletivas
podem ser encontrados no blog Os Coletivos
(www.oscoletivos.com.br), que tem como
objetivo ajudar os consumidores desse
modelo de compra a tirar todas as suas
dvidas e manter os empreendedores
informados sobre as mais importantes
novidades sobre o mercado. Dicas
fundamentais de como conquistar usurios e
captar anunciantes, e ranking com os sites de
compras coletivas mais acessados do Brasil,
fazem parte do rico contedo do blog.
Os Coletivos no Twitter: @oscoletivos

Simplssimo
Os autores, Eduardo e Fernando, so
amantes de e-books e desenvolvem um
trabalho inovador na ONG Editora Plus, que
publica e-books desde 2008 e desenvolve
projetos sociais e educacionais. Com o blog
Simplssimo (www.simplissimo.com.br/
blog), buscam incentivar os produtores de
livros digitais a criarem e-books bem escritos,
diagramados cuidadosamente, prticos e
funcionais. As postagens do dicas sobre a
nova profisso de designer de e-books, sobre
diagramao, cursos e eventos sobre o tema e
notcias em geral sobre o assunto.
Simplssimo no Twitter: @SimplissimoLivr

Conhece algum blog interessante focado em

criao, tecnologia, marketing ou e-commerce?
Envie sua dica para redacao@revistawide.com.br

300milhes 27%
Quantidade mensal de pessoas que utilizam botes para compartilhar algum

Percentual relacionado ao crescimento do nmero de usurios dos sites de

contedo online no mundo. O Facebook lidera, com 38%. O e-mail e o Twitter

vdeos, chegando a 30,7 milhes de usurios nicos em abril deste ano. O

empatam em segundo lugar, com 17%. Estima-se que o compartilhamento de

nmero de usurios ativos no trabalho e em domiclios foi de 42,8 milhes, o que

contedo produza 10% de todo o trfego da internet e 31% do trfego em sites

significou um crescimento de 16,8% sobre os 36,6 milhes de abril de 2010. Fonte:

sociais e de busca. Fonte: ShareThis (www.sharethis.com)

Ibope Nielsen (www.ibope.com.br)

85 > FRONT | WIDE |

LIVRO S
Gesto estratgica
do design
ROBERT BRUNNER E
STEWART EMERY

AGEN DA

02/07 e 23/07
FRUM NACIONAL
DE E-COMMERCE

Locais: Rio de Janeiro e So Paulo

www.fnec.com.br
Encontro entre profissionais
de internet e empresrios/
lojistas que tem como objetivo
transmitir estratgias e
diferenciais para alavancar as
vendas online. Grandes cases
de sucesso sero apresentados
e renomados profissionais da
rea daro dicas fundamentais
para a divulgao mais
adequada de sua loja.
Ingressos: de R$ 82 a R$ 110

07 e 14/07 e 04/08
AGIS EXPEDITION

Editora M.Books
www.mbooks.com.br
aplicao do padro MVVM na
plataforma.
Ingressos: R$ 60

16/07 e 27/08
EDTED 2011

Locais: Belo Horizonte e Braslia

www.edted.com.br
Com o tema central Criao,
e-commerce e mobile, a 16
edio do EDTED (Encontro
de Design e Tecnologia
Digital) passa por dez capitais
brasileiras em 2011 e tem
palestras sobre criao, HTML 5
e CSS3, desenvolvimento para
iPhone e iPad, como divulgar
uma loja virtual e muito mais.
Ingressos: de R$ 29 a R$ 79

27/07

SEMINRIO DE
CLOUD COMPUTING

Tremendamente inovadora, a obra mexe

com a cabea de executivos e profissionais
de marketing, produo, design, vendas e
estratgia. O livro mostra como e por que as
empresas devem colocar o design no topo e
ter foco estratgico de seus negcios.

Rails 3 Bsico
CLOVES CARNEIRO JR. E
RIDA AL BARAZI
Editora Novatec
www.novatec.com.br
O livro destina-se aos interessados no aprendizado de como desenvolver aplicaes web
utilizando o framework Ruby on Rails. Com
uma introduo completa sobre o panorama
do Rails 3, a publicao aborda tudo o que
envolve o processo de criao de aplicaes
funcionais, da instalao at a implantao.

HTML5

Locais: Belo Horizonte, Vitria e

Ribeiro Preto
www.agisexpedition.com.br
A stima edio do roadshow
passa este ano por setes
cidades brasileiras e debate o
mercado de revendas de TI e
informtica, as oportunidades
para o mercado de canais na
Copa 2014 e Olimpadas 2016
e a recm-chegada ABRADISTI
(Associao Brasileira dos
Distribuidores de TI).
Ingressos: no informado

Local: So Paulo
www.ideti.com.br/cloud
Frum de debates e discusses
sobre o conceito Cloud
Computing, que tem como
objetivo informar os benefcios
e os pontos crticos do
armazenamento de dados e a
virtualizao dos servidores,
bem como a utilizao de
software como servios (SaaS).
Ingressos: de R$ 490 a R$ 1.220

16/07

10/08

ROBERTO DUAILIBI E
HARRY SIMONSEN JR.

Local: Florianpolis
www.dotnetfloripa.com/
windows-phone-7-developer-day
O evento traz palestras que iro
auxiliar os desenvolvedores
na criao de aplicativos
para o Windows Phone 7, no
desenvolvimento de interfaces
com METRO, no acesso a servios
WCF e Azure no WP7 e na

Local: So Paulo
www.javaday.com.br
A 4 edio do evento visa
disseminar a plataforma Java,
fundamentando o conhecimento
na tecnologia, gerando
oportunidades, inovao e uma
rede de contatos profissionais
com palestras tcnicas,
discusses e minicursos prticos.
Ingressos: no informado

Editora M.Books
www.mbooks.com.br

WINDOWS PHONE 7
DEVELOPER DAY

10

| WIDE | 85 > FRONT

JAVA DAY 2011

MAURCIO SAMY SILVA

Editora Novatec
www.novatec.com.br
O autor, mais conhecido como Maujor,
aborda de forma clara e em linguagem didtica as funcionalidades da nova verso da linguagem de marcao HTML, que ampliou de
forma surpreendente suas funcionalidades
e possibilita ao desenvolvedor criar cdigo
totalmente semntico, inserir mdia, usar o
elemento canvas e muito mais.

Criatividade &
Marketing

Totalmente revisado e atualizado incluindo

a nova Rgua Heurstica, esta edio ensina
como a criatividade aplicada ao marketing
pode ser utilizada como ferramenta
indispensvel para o sucesso das aes nas
reas de comunicao.

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. ExGerente Jurdico da IBM, onde trabalhou por 11 anos, no Brasil e nos EUA. Scio de Martins
de Almeida Advogados, escritrio especializado.

PROPRIEDADE SOBRE SISTEMAS DESENVOLVIDOS

COM METODOLOGIA GIL
Sou contratado para desenvolver um
sistema web com metodologia gil.
medida que vai sendo desenvolvido, o cliente j tem direito a uso, no
tendo que esperar que fique pronto
para utiliz-lo. Enquanto o sistema
no finalizado, quem tem direito
comercial sobre o cdigo fonte, o cliente ou eu?
PABLO LIMA
pablobslima@gmail.com

Metodologias geis (XP, Scrum e outras)

tornam-se mais e mais populares proporo que o ritmo da evoluo tecnolgica acelera o surgimento de novos
requisitos de desenvolvimento, deixando obsoletos os planejamentos tradicionais. Vrias questes legais surgem
em decorrncia: a quem pertencem os
direitos enquanto o sistema no totalmente entregue? Qual a linha de corte
para considerar que um sistema est
concludo? Onde termina o desenvolvimento e comea a manuteno evolutiva? Qual a relao entre a aceitao de
cada fase de desenvolvimento, seja ela
sequencial ou simultnea?
Esse leque de questes j tem algumas
respostas preliminares em nosso modo
de ver. Em primeiro lugar, normalmente
os direitos sobre as etapas anteriores pertencem ao mesmo contratante que tenha
sido definido como futuro proprietrio
do trabalho final. Se o cliente negociou
que ele, como encomendante, ser o
proprietrio, ele o ser tanto dos desenvolvimentos parciais quanto da verso
completa e definitiva. E vice-versa (se o
desenvolvedor for o proprietrio do parcial, ser tambm do total, a menos que
uma clusula especialssima, e rara, estabelea o contrrio).
Como h muita mudana de tarefas ao
longo do desenvolvimento, importante
que o contrato seja bastante flexvel por
um lado e muito preciso por outro lado.

Na prtica, isso significa, por exemplo,

substituir a nfase em listagem de funcionalidades a serem desenvolvidas por
relao de procedimentos a serem adotados na implementao da metodologia
(como sero compostas as equipes, como
ser o processo de deciso e comunicao dos novos requisitos e metas, qual o
prazo estimado para a concluso, como
ser a formalizao por mais simples
que seja de cada passo etc.).
Essa descrio de procedimento (cuja
possibilidade de variao assegurada
pelo prprio estilo da metodologia escolhida) dever determinar tambm o
momento ou a etapa em que o sistema
ser dado por terminado, bem como qual
ser o escopo, a periodicidade e o preo
da manuteno evolutiva.
Com relao aos critrios de teste e aceitao, convm que seja adotada uma
metodologia aberta, homologada pelo
mercado. Isso poder facilitar bastante
no caso de discusso sobre dar continuidade ou no ao projeto. Se o trabalho foi realizado a contento, e se est
completo ou no, so perguntas melhor
respondidas se os critrios estiverem
claros desde o incio e forem reconhecidamente razoveis.
Inclusive porque os times de desenvolvimento que fazem uso de metodologias
geis so, muitas vezes, compostos por
representao tanto da empresa cliente
quanto da empresa desenvolvedora.
Essa composio mista tende a criar discusses mais frequentes (e mais democrticas). Processo de escalada executiva em caso de divergncia na equipe
de desenvolvimento um dos itens que
merecem uma clusula especfica no
novo padro de contrato que o uso das
metodologias geis torna recomendvel. Para metodologias geis, contratos
geis e propriedade uniforme ao longo
do tempo. o que se tem mostrado mais
indicado na experincia de negcios
envolvendo esse tipo de metodologia.

Google: Muy amigo

da criao?
NOVA IORQUE
Enviado por Lino Ribolla
www.acsysinteractive.com
Martin Sorrell foi quem primeiro chamou o
Google de Frenemy, amigo e inimigo das
agncias, referindo-se sua relao com
a mdia. Mas, ultimamente, parece que a
etiqueta vale tambm para a criao: nos
ltimos festivais, o Google Creative Labs
como cliente de vrias agncias ganhou
um nmero considervel de prmios. Ate
a, tudo bem. No entanto, o Google tambm
entrou e ganhou como Agncia em vrias
categorias. No ltimo One Show Interactive, o Google Agncia levou 10 trofus e o
Google Cliente, 26 dos 94 distribudos.
A a competio fica desigual: o Google
Labs cria seus prprios briefs, com toda a
liberdade de execuo e com a magnitude
dos recursos tcnicos e financeiros de que
dispe. Fica a pergunta: O gigante da Busca
dominar tambm a criao? Vamos todos
trabalhar para o Google, direta ou indiretamente? O Google vai se tornar, na traduo
tupiniquim, nosso muy amigo?

Google: o maior
canal de publicidade
da Inglaterra
LONDRES
Enviado por Gustavo Burnier
www.motherlondon.com
A maioria das pessoas se surpreende
quando digo que a Google o maior canal
publicitrio da Inglaterra. Mas, repassando
rapidamente os nmeros da empresa, vemos a verdadeira magnitude. Ela reportou
2.2 bilhes de ingressos em 2010 para a
Inglaterra, o que representa aproximadamente 12% do mercado total. Agora, comparemos com os maiores canais de TV: a ITV
reportou 718 milhes em publicidade, e a
SKY reportou 319 milhes (a SKY tem um
grande ingresso via assinaturas). Ou seja, a
Google no s o maior canal de publicidade da Inglaterra, mas ela quase trs vezes
maior que o segundo canal. Hoje, isso uma
exceo mundial. Mas, mesmo sendo uma
exceo, vale a pena seguir de perto.
85 > FRONT | WIDE |

11

E MP R E E N D E D O R IS MO
Kau Linden
Empresrio e publicitrio, fundou a Hostnet quando tinha apenas 17 anos. Em dez anos de
trabalho, alm das atribuies executivas, criou projetos como a Olmpiada 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 caladas de grandes cidades brasileiras.

MARKETING NA ERA DA
INTERNET
Ento, como num passe de
mgica, toda propaganda
se viu obrigada a rever
seus mtodos de trabalho
depois da internet. Tudo o que
foi ensinado pela academia
tornou-se obsoleto; o modelo
de propaganda em massa ao
longo de 30 segundos para
o povo ficou defasado. Os
profissionais renomados do
marketing comearam a ser
substitudos por especialistas,
ou geeks, com 20 anos de
idade que se intitulam os reis
da estratgia SEO e garantem seu produto em primeiro lugar nas pesquisas
do Google, claro.
Blogueiros super-cool produzem contedo vendido e garantem os melhores
comentrios em seus posts. O programador de gambiarra substituiu o planejamento com scripts malandros de Twitter
e Facebook que prometem fazer seu produto bombar nas redes sociais.
Determinou-se a morte da mdia tradicional, o fim do escritrio fsico, a chegada da era do home-office. Tudo o que
voc precisa um bom site. O impresso
j era, a TV tradicional est condenada
falncia. Quem ter pacincia de ficar
esperando a hora exata de um programa comear?
O diploma de jornalista torna-se
completamente desnecessrio e o
e-mail est com os dias contados, dizem
os mais adiantados. Todos estaremos
interligados pelas maravilhosas redes
sociais garantidos que a experincia de

12

| WIDE | 85 > FRONT

seus consumidores seja a melhor e talvez nica forma de ter qualidade promocional de seus produtos.
A gerao Y puxa o tapete da gerao
X sem piedade. Caiam fora daqui, no
alimentem os jornalistas, prega a nova
era da propaganda.
Qualquer relao ruim com empresas
se resolve xingando muito no Twitter.
O consumidor agora dita as regras e ns,
a nova gerao, mais inteligente, mais
bonita, mais sagaz e muito mais estpida, acabaremos com todos os grupos
de propaganda e mdia que manipulavam informao e nos transformavam
em alienados. #Todoscomemora a falta
de concordncia?
Doce iluso. A internet chega sua
fase adulta, mas ainda tem muito profissional e muita empresa com sndrome
de adolescente revolucionrio. A revoluo digital chegou, inegvel, mas
nada que tenha abalado a credibilidade
dos mais velhos. Pelo contrrio, as grandes agncias continuam existindo e o
comercial de 30 segundos na novela
das oito ainda a forma mais eficaz de
chamar a ateno. Existe, sim, espao
no mercado, mas, para fazer sucesso
de verdade, uma mxima nunca vai
mudar: comporte-se como adulto.
um erro colocar a internet acima
da comunicao, como muitos tentam
acreditar. A rede ferramenta da comunicao, assim como a televiso, o rdio
e a mdia impressa. Tudo precisa ser
muito bem integrado, e o jovem sempre ter a aprender com o mais velho.
mais que comprovado pela histria
que uma mdia no mata a outra e que a
experincia continua a ser o maior diferencial em qualquer profissional. Afinal,
o marketing na era da internet continua a ter o mesmo objetivo de sempre:
convencer e vender. E, para isso, no
necessrio sacrificar ningum.

85 > FRONT | WIDE |

13

Agncia

PORTFLIO

Fri.to: criao e tecnologia com foco

em interatividade
Uma agncia especializada em desenvolver aes para
social media e mobile e que se destaca pelo seu jeito de ser:
vanguardista com um fim criativo e de negcio, sem usar a
tecnologia pela tecnologia. Essa a Fri.to!
Em 2009, os scios Gustavo Pehrsson (criao),
Marcel Matsuda (negcios) e Eduardo Taniguchi
(tecnologia), todos com passagens por grandes
agncias,comoNeogama,CarilloPastore,Euro RSCG,
Hello Interactive, A1 e Multi Solution, decidiram
montar uma prpria com foco em interatividade,
unindo criao, boas ideias e tecnologia. Nascia ali a
Fri.to, que tem como caracterstica criar e promover
a interatividade em todos os formatos: estratgia
e presena digital, planejamento e execuo em
social media, desenvolvimento de plataformas
mobile, campanha, dentre outras aes.
Sobre a viso que a Fri.to tem sobre o mercado
digital, Pehrsson comenta que o atual cenrio

FRI.TO
ANO DE FUNDAO: 2009
NMERO DE FUNCIONRIOS: 25
CIDADE SEDE: So Paulo, SP
SITE: www.fri.to
E-MAIL: contato@fri.to

14

| WIDE | 85 > CRIAO

favorvel, diferentemente de trs anos atrs,

quando eles tinham que vender a categoria
internet. Hoje, o momento outro. O cliente nos
procura pedindo ousadia, ao de vanguarda. Tem
muito trabalho bom acontecendo nos mercados
nacional e, especialmente, internacional, e isso nos
desafia a ser ainda melhores. Temos pessoas na
equipe, por exemplo, focadas em farejar tendncias
e abastecer a equipe com aes incrveis que
acontecem por a, no meio web e fora dele. A
internet revolucionou, obviamente, a propaganda
tradicional e tambm os meios artsticos e culturais
como um todo, sobretudo o cinema mercados
que tambm so alvo de inspirao para ns.
Os clientes esto com vontade de se relacionar
profundamente com o meio digital e, com isso,
muita gente est entendendo melhor o business.
Sobre os projetos, ao contrrio de alguns anos
atrs, no podemos mais pensar em formato. Se h
dez anos a soluo era o kit filme + anncio + spot,
hoje cada job um desafio diferente, afirma.
Ser a maior e melhor agncia interativa do Brasil.
Para concretizar essa ousada meta, a Fri.to tem
trabalhando para buscar sempre a melhor ideia e a
melhor execuo, investindo em seus profissionais.
Acreditamos que teremos uma qualidade de
servio diferenciada com uma equipe motivada.
Investimos em tornar a nossa agncia um lugar
atraente para se trabalhar e temos sentido isso a
cada vaga que abrimos. Temos recebido em cada
oportunidade um volume grande de currculos de
candidatos s vagas. Buscamos dar o melhor para os
nossos colaboradores, e isso faz com que eles vistam
a nossa camisa, tanto que criamos uma bandeira que
brinca com o Twitter. o #tamojunto, diz Marcel.

OAKLEY
www.oakley.com.br
App: migre.me/4x47T

UM DOS CASES DESENVOLVIDOS PELA FRI.TO FOI

o aplicativo Oakley Report. Nele, os usurios tm acesso

a todas as informaes necessrias para saber as condies exatas nas praias: previso do tempo, direo
e fora do vento, tbua de mars, altura das ondas etc.
J tnhamos trabalhado em alguns projetos para
o cliente e decidimos ir a campo para conversar com
surfistas para entender melhor nosso consumidor.
Verificamos que o pblico do surf consultava sempre
sites de condies de ondas, na verso desktop. A
ideia foi disponibilizar essa funcionalidade tambm
na verso mobile, oferecendo um benefcio muito
claro e direto ao consumidor e colocando o produto
no contexto. O app foi produzido em 2009, perodo
em que existiam poucas empresas olhando para o
mercado mobile, conta Gustavo.
Seguido do aplicativo, a Fri.to construiu o site institucional da marca (www.oakley.com.br), que no possua uma presena digital forte no Brasil. O site todo
integrado s redes sociais, contando ainda com benefcios, como a previso de ondas verso desktop, teste
das lentes dos culos polarizados (produto exclusivo
Oakley) e notcias sobre atletas, alm de todos os produtos da marca, explica.

Sobre a tecnologia
PHP+MySQL+C/C+OBJECTIVE C foram utilizados no desenvolvimento do aplicativo.

ADIDAS COPA DO MUNDO 2010

OUTRO TRABALHO DESENVOLVIDO PELA FRI.TO FOI

projetar a Adidas nas mdias sociais. O principal desafio era falar sobre a marca durante o evento mais
importante do mundo (Copa), em um pas/seleo em
que ela no fornece material esportivo.
Focando no Twitter e no Facebook, criamos uma
estratgia de dilogo full time, com contedo exclusivo, fotos e vdeos que o pblico s encontrava na
nossa fan page. Mostramos bastidores dos vestirios,
das comemoraes, atletas e muito mais. Alm disso,
durante todo o ms levamos a Copa para dentro do
Twitter: tivemos desafios dirios, jogos, passatempos,
maratonas, sempre interagindo e desafiando o pblico,
com premiaes (chuteiras, bola oficial da competio,
camisas etc.). O sucesso foi to grande que o pblico
interagiu bastante com o perfil: dava bom dia, perguntava sobre os jogos da rodada, discutia jogadas, enfim
todo tipo de interao de qualidade, conta Gustavo.

Sobre a tecnologia
Customizao do Linux e Apache+PHP/Zend Framework,+MySQL+JavaScript+Ajax+Flash/
Actionscript estiveram presentes na criao do site.

85 > CRIAO | WIDE |

15

Freelancer

PORTFLIO

Falar de internet multiplicar essa

paixo, trazer as pessoas para dentro
da histria e reescrev-la
Designer e diretor de arte, Thiago Andrade tem em seu currculo servios prestados para grandes empresas, como Google,
Vivo, Toyota, Philips, Cacau Show e Esso. Atualmente, trabalha
na agncia de publicidade Borghierh/Lowe.
Thiago Andrade comeou a entender o design a
partir dos seus 15 anos. Fez trabalhos para amigos,
familiares e pesquisou mais sobre o assunto, at
conseguir um emprego na rea, em um provedor
de internet. L, ajudei na construo do meu primeiro site, sem muitos recursos e com pouca noo
naquela poca (meio do ano 2000). Fico feliz que
ele no tenha ficado to ruim. Gostei bastante da
experincia e resolvi continuar os estudos, conta.
Em relao s suas referncias criativas e profissionais, Thiago sempre se interessou por artes com
conceito simples, de forma direta e com relevncia.
Acho que as coisas devem ter um porqu; sempre
admirei trabalhos de outros designers, como Victor
Sahate, Rod Louzada, Felipe Memoria, Raphael

THIAGO ANDRADE

Pontual e Caio Andreolli. Eles so exemplos de

como fazer layouts ou at arquiteturas funcionais,
vender o produto e, em alguns casos, entreter o
usurio o suficiente para permanecerem no site
por algum tempo e voltarem mais vezes, diz.
Sobre a viso que Thiago tem sobre o mercado
em que atua, as pessoas veem a rea da comunicao como algo grandioso e glamoroso, apaixonam-se por marcas, programas, celebridades e
experincias. Falar de internet multiplicar essa
paixo, trazer as pessoas para dentro da histria
e reescrev-la. Roteiros se perdem, marcas erram e
acertam, e as pessoas cada vez mais se envolvem
com o que produzimos. prazeroso, arriscado,
desafiador, mas vale muito a pena fazer parte da
vida dos outros. uma aventura, desde receber um
briefing estranho e com poucos detalhes at um
prazo humanamente impraticvel. Mas, dessas surpresas, acabam surgindo resultados interessantes
e aparecem os profissionais de verdade, esses que
mostram interesse e comprometimento, explica.

TOTEM GRUPO LIBRA CARNAVAL 2010

E-MAIL: eu@thiagoandrade.com
SITE: : www.thiagoandrade.com
TWITTER: @ttandrade

UM DOS TRABALHOS DESENVOLVIDOS POR THIAGO

FACEBOOK: facebook.com/ttandrade

ANDRADE foi um hotsite com acervo de todos os carnavais, incluindo imagens, vdeos, msicas e letras dos
sambas-enredos, mesclando com histrias do Grupo
Libra em parceria com a escola de samba Grande Rio.
Adequamos o material em totem digital que ficava
dentro da rea vip da empresa no carnaval de 2009, na
Sapuca. Uma ideia simples, mas que explorava muito
bem a evoluo artstica, entretinha e informava os
visitantes, conta.
O processo de criao desse job consistiu em muita
cor, movimento e informao. O foco era juntar tudo

16

| WIDE | 85 > CRIAO

sem virar uma baguna, embora a ideia de Carnaval

se confunda um pouco com isso. Criamos todas as
telas pensando nesse primeiro conceito e, tambm,
em no limitar as informaes da empresa que patrocinava o projeto, explica.

Sobre a tecnologia
FLASH+ACTIONSCRIPT3

Ns, da equipe onz Pensamento Digital, fizemos wireframes de como a aplicao

funcionaria, seguimos com o layout das telas, pesquisas de animao, captao de
contedo, programao e montagem efetiva do totem.

RIO360 NO CABOR
www.rio360nocabore.com.br

O PORTAL RIO 360 NO CABOR foi outro trabalho

desenvolvido por Thiago. A Rio360, agncia de comunicao tipicamente carioca e com foco em promoo
e eventos, precisava apresentar os cases e conquistar
votos para o Cabor (premiao que laureia profissionais que contribuem para o desenvolvimento da propaganda no Brasil).
Ns, da The Aubergine Panda, pensamos em apresentar #360Motivos espalhados pelo site, Twitter,
Facebook e YouTube. Indiretamente, mostrvamos
quem era a Rio360, o que fazia e o que j tinha feito.
Alm do hotsite e da fan page no Facebook, o canal do
YouTube mostrava a ao fora da internet, onde promotores contratados visitavam faculdades de comunicao e agncias de propaganda levando um kit
com Biscoito Globo e Ch Matte. Era apenas uma lembrana de duas coisas tipicamente cariocas, mas conseguimos aceitao e alguns minutos para apresentar
a Rio360 para esse pblico, conta Thiago.
Em relao s etapas de produo do site, Thiago
explica que foi montada uma arquitetura simples e
com fcil navegao, que favorecesse a movimentao 360 da foto e a apresentao do contedo. O
design foi pensado para ser mais sbrio e com poucas
cores, porm se relacionava bem ao contexto carioca.
O mais importante foi a escolha da foto, essa produzida pelo Ayrton360, diz.

Sobre a tecnologia
FLASH+FOTO360

Buscamos favorecer a navegao, ento algumas referncias adotadas foram

games e sites que privilegiavam o que geralmente fica em segundo plano.

85 > CRIAO | WIDE |

17

Ilustrao

PORTFLIO

Flavio Pessoa
Formado em Design Grfico, o carioca Flavio Pessoa dedica-se a
projetos ligados histria do Rio de Janeiro e cultura da cidade.
Desde 2008, tem seus trabalhos publicados no mercado editorial,
no qual se destacam ilustraes para um livro de crnicas de Paulo
Coelho da editora Agir, alm de capas para uma coleo de didticos para a editora FGV.
WIDE Como define seu estilo?
FLAVIO Tenho certa predileo por tcnicas mais

tradicionais (praticamente nada de digital, na execuo da ilustrao) e por temticas histricas, que
abordem o Brasil e a cultura brasileira.
WIDE Onde voc busca referncias para o seu trabalho?
FLAVIO Em todo tipo de produo visual com

que tenho contato. No procuro apenas por ilustraes, mas por livros tericos e prticos, revistas diversas, quadrinhos, teatro e cinema.

Flavio Pessoa
E-MAIL: flaviocariocapessoa@gmail.com
FLICKR: www.flickr.com/riohq

18

| WIDE | 85 > CRIAO

WIDE Cite trs ilustradores que admira e diga por

quais motivos.
FLAVIO Citar s trs dificlimo. Mas, de longa data
admiro e me guio muito pelos quadrinhos de Will
Eisner, no s pelo trao, mas pela diagramao de
suas pginas e pela revoluo que promoveu nas
histrias em quadrinhos. Outro ilustrador que sempre me chamou a ateno foi Norman Rockwell,
tanto pela tcnica quanto pela narrativa em torno do
cotidiano da sociedade norte-americana. E, para no
ficar s nos norte-americanos, aprecio bastante o trabalho do mineiro Llis, por desenvolver a aquarela
num trao caricato muito pessoal e expressivo.

1- mulher brasileira (2009)

Tcnicas: Lpis de cor e
nanquim sobre Canson MiTeintes

2- Capa para A cartomante

em quadrinhos (2008)
Tcnicas: Aquarela e nanquim
sobre fotografia de arquivo
3- A mulher de Preto (2009).
Tcnicas: Aquarela e nanquim
4- Onde Judas perdeu as
botas (2008)
Tcnica: Aquarela e nanquim

85 > CRIAO | WIDE |

19

Lente Digital

PORTFLIO

Luiz Mascarenhas
Nascido em 1946, na Bahia, o soteropolitano Luiz Mascarenhas
tem a fotografia como sua grande paixo. Administrador de
empresas por formao, especializou-se em foto documental e
de arquitetura. Atualmente, ministra aulas tericas e prticas no
Instituto Casa da Photographia, em Salvador.
WIDE ngulo, iluminao, textura, movimento,

corte O que mais se destaca no seu trabalho?

LUIZ Aos 16 anos, com uma cmera Kodak de filme
120, comecei a fotografar. Sem orientao ou qualquer conhecimento tcnico, abarrotei meus alfarrbios com fotografias que, alm de no fazerem
sentido, no encontravam adeptos ou admiradores.
Nem por isso desisti. Continuei fotografando lugares,
monumentos, coisas, detalhes e tudo o mais que me
impressionava ou me saltava aos olhos.
Como nunca fotografei pessoas, no tinha motivao para mostrar meu trabalho. Assim, as coisas
no evoluam, at que um dia verifiquei que era
grande a quantidade de fotos que possua e, em sua

Luiz Mascarenhas
E-MAIL: luiz@luizmascarenhas.com.br
SITE: www.luizmascarenhas.com.br
TWITTER: @LMasca
FACEBOOK: migre.me/4uvXE

20

| WIDE | 85 > CRIAO

maioria, registrava lugares, prdios e detalhes.

Como me interessei pelo que vi, decidi estudar
fotografia passando a priorizar a arquitetura documental. Hoje, registro preferencialmente arquitetura histrica e tenho, possivelmente, uma marca
registrada de enquadramento longe do olhar sistmico cartesiano.
Uso, na maioria das vezes, a iluminao natural,
pois acredito que a interao entre quem observa e o
objeto observado reveste-se de maior autenticidade
dessa forma, e gosto muito de enriquecer minha
fotografia com detalhes, ressaltando formas e texturas. Fao um trabalho essencialmente documental e
uso muito dele para ilustrar as aulas que ministro.

1-Altar da Virgem da
Conceio, na Ordem 3a, BA
Cmera Canon EOS 30D
Objetiva Canon EF17-40mm f/4L USM

2-Fachada do Museu dos

Inconfidentes, em Ouro
Preto, MG
Cmera Canon EOS 30D
Objetiva Canon EF 50mm f/1.4 USM

3-Janela, em Diamantina, MG
Cmera Canon EOS 30D
Objetiva Canon EF-S 18-55mm f/3.5-5.6

4-Janela da Casa dos

Contos, em Ouro Preto, MG
Cmera Canon EOS 30D
Objetiva Canon EF-S 18-55mm f/3.5-5.6

3
4

85 > CRIAO | WIDE |

21

PORTFLIO

Fontes de Inspirao

Gustavo Soares
Formado em Comunicao Social, Gustavo Soares mestre
em Information Design pela University of Reading, Inglaterra,
e mestre em Type and Media pela KABK, Holanda. Foi diretor
de arte da Bizz e desenvolveu trabalhos para Rio 2016, Oi,
Volkswagen e outras grandes marcas. Atualmente, designer snior na agncia Ttil e professor convidado no Instituto
de Educao Superior de Braslia.
WIDE Como surgiu a ideia de criar a Pocket?
GUSTAVO A Pocket foi o meu projeto de conclu-

so de curso no Type and Media (mestrado em

type design, em Haia, na Holanda). No comeo,
queria fazer algo com sinalizao, mas cheguei
concluso de que primeiro deveria aprender
o sistema tipogrfico, as relaes bsicas entre
letras, esttica, pesos e estilos s ento teria
condies de manipular essas variveis para trabalhar uma fonte adequada sinalizao. Optei,
dessa forma, por fazer uma fonte texto, especificamente para livros de bolso.

Gustavo Soares
E-MAIL: gr2s@uol.com.br
SITE: www.gr2s.com

22

| WIDE | 85 > CRIAO

Quando se comea a desenhar letras, fundamental entender a relao que existe entre os traos finos e grossos (contraste) e, sobretudo, como
esses contrastes se formam. Fiquei fascinado.
Queria produzir uma fonte para livro, levemente
condensada e que fosse mais escura na pgina
seguindo a formao de contraste da pena de
ponta larga (broad nib pen).
WIDE De que maneira o design de tipos influencia

na transmisso da mensagem?
GUSTAVO A capacidade do design de vestir men-

sagens muito clara. Fazemos algo muito parecido,

pois podemos manipular a primeira impresso que
uma pessoa tem de ns facilmente. Se eu for a uma
festa de blazer, sapato, cala, relgio de marca e afins
causarei uma impresso. Se eu for mesma festa de
all star, cala e camiseta descolada causarei outra
impresso. Se, vestindo blazer, eu comear a falar
um monte de palavro e grias, certamente algo parecer estranho. Talvez, a mesma postura vestindo all
star, camiseta e jeans no fique to estranha.
Designers fazem isso com a mensagem. Usam
cores, formas, materiais, interaes e, claro, fontes
para manipular as percepes dos consumidores
ou usurios. O lance que muitas vezes as escolhas
no so to assertivas, principalmente as tipogrficas. No nem tanto o caso de certo e errado, mas
sim de saber escolher a fonte mais adequada ao trabalho. Tipografia (uso das fontes) complexa precisa
de famlias preparadas. Existe ergonomia visual e
existem fontes dedicadas para livros, revistas, jornais, sinalizao, cartografia, visualizao digital etc.

85 > CRIAO | WIDE |

23

criao

AL, AL,

TESTANDO!
FERRAMENTAS PARA MELHORAR
A USABILIDADE DE SEU SITE
Por Tiago Bosco

VDEO, GRAVAO DE VOZ,

MOVIMENTO DO MOUSE,
MONITORAMENTO VRIAS
SO AS POSSIBILIDADES
E FERRAMENTAS QUE, SE
BEM UTILIZADAS, PODEM
FAZER A DIFERENA PARA O
DESENVOLVIMENTO DO SEU SITE.
CONFIRA NESTA REPORTAGEM
AS DEZ PRINCIPAIS, DENTRE
ELAS AS FAMOSAS CLICKTALE E
MORAE, GRANDES ALIADAS DOS
PROJETOS BEM-SUCEDIDOS.
24

| WIDE | 85 > CRIAO

CRIAO

conceito de teste, recorrente no

trabalho dos designers e dos desenvolvedores web, muitas vezes no
visto com a importncia que ele
realmente merece. Os profissionais
podem alegar que no executam testes devido correria do dia
a dia, aos prazos cada vez mais apertados etc. Tal justificativa
no pode ser desprezada. um fato real no cenrio em que vivemos. No entanto, o mundo contemporneo tambm tem as suas
vantagens. Uma delas, por exemplo, a propagao de novos
softwares que contribuem para o desenvolvimento e o aperfeioamento de um site.
Para Eduardo Loureiro, especialista em Design de Interao
pela PUC-Minas e cofundador da Vol (www.voel.in), existe uma
diferena fundamental entre as vrias ferramentas para estudos de usabilidade que surgiram nos ltimos anos. Os softwares
desktop tm como objetivo estabelecer parmetros e formalizar
e tornar mais precisos os testes presenciais. So ferramentas que
ajudam muito na anlise por terem recursos como gravao de
vdeo e de tela e contabilizao de tempo, erros e acertos de tarefas etc. J as ferramentas online, de maneira direta ou indireta
permitem que os testes de usabilidade sejam remotos. Todos
esses novos recursos tm duas vantagens principais: a reduo
de custos e a explorao de resultados inviveis em testes presenciais, explica.
Mas, afinal, existe algum software que seja simples de usar e
ao mesmo tempo eficaz para quem pretende lanar um site e
deseja realizar testes de usabilidade com o prottipo? Juliana
Gaiba, consultora de usabilidade e de design de interao e User
Experience Lead da Huge (www.hugeinc.com) , acredita que a
escolha da ferramenta depender muito do estgio de desenvolvimento do site. A experincia em conhecer os diversos mtodos disponveis e o entendimento de como aplic-los so muito
importantes para garantir resultados confiveis e satisfatrios.
Alm dessas variveis, temos outras questes, como prazos e
custos alocados para esses estudos no oramento de um projeto.
Vale lembrar que diversas ferramentas permitem a aplicao de
testes em fases que precedem a definio da interface e a confeco do prottipo interativo. So excelentes ferramentas para
aplicao de estudos de card sorting, em que possvel avaliar
como os usurios organizam o contedo do seu site, servio
muito vlido para construir uma arquitetura de informao mais
intuitiva. Tambm existem ferramentas que permitem testar e
validar a arquitetura de informao proposta, avaliando como
usurios localizam informaes a partir de uma rvore de contedo, esclarece Juliana, opinio compartilhada por Frederick
van Amstel, cofundador do Instituto Faber-Ludens de Design de
Interao (www.faberludens.com.br). Para ele, o uso de softwares
especiais em testes de usabilidade depende dos objetivos do

teste. Se o objetivo promover aprendizado sobre o comportamento do usurio para a equipe de design, no h a necessidade
nem mesmo de gravar as sesses. Basta transmitir a tela do usurio para uma sala separada e deixar o pessoal discutindo. Porm,
se o objetivo fazer uma avaliao comparativa utilizando critrios objetivos, os softwares de registro de tela e inputs facilitam
muito a anlise estatstica depois do teste, diz.
Antes da escolha das ferramentas, devem-se definir quais sero
os principais objetivos dos testes, pblico-alvo, dados que precisaro
ser coletados e quais sero as tcnicas utilizadas. o que diz Horcio
Soares, consultor e pesquisador da Acesso Digital (www.acessodigital.net) e especialista em design, acessibilidade e usabilidade.
Nem todos os testes de usabilidade possuem ferramentas
especficas, mas, na maioria dos casos, existe algum software
que poder, de alguma forma, auxiliar na coleta dos dados e na
posterior anlise. Um exemplo so os softwares que capturam
os movimentos do usurio com mouse e teclado, que podem ser
utilizados tanto nos testes tradicionais de usabilidade como nas
tcnicas de compreenso, que so indicadas para avaliar a usabilidade em contedos complexos, ou os testes do primeiro clique,
que validam se os links da home page esto com bom funcionamento. Na maioria dos casos existe mais de um software disponvel e, como quase todos possuem uma verso free ou trial, recomendado que sejam testados ao menos dois desses softwares. O
avaliador dever escolher aquele que melhor se adapte s suas
necessidades e gostos, orienta.
importante ressaltar que, alm dos dados qualitativos sobre
a experincia do usurio, tambm deve-se levar em considerao a anlise quantitativa. essencial, alm de fcil e grtis, monitorar os dados de acesso do seu site por meio de uma ferramenta
de web analytics, como o Google Analytics. Outra forma eficiente
de testar interfaces fazendo testes A/B com ferramentas como o
Google Website Optmizer. possvel comparar a performance de
diferentes verses da mesma tela e decidir pela que apresentou
maiores ndices de sucesso quando exposta aos usurios do site,
diz Juliana Gaiba.

TODOS ESSES NOVOS RECURSOS TM

DUAS VANTAGENS PRINCIPAIS: A
REDUO DE CUSTOS E A
EXPLORAO DE RESULTADOS
INVIVEIS EM TESTES PRESENCIAIS
Eduardo Loureiro
85 > CRIAO | WIDE |

25

PARA OS TESTES DE USABILIDADE, JULIANA

GAIBA ESCLARECE ALGUMAS QUESTES
QUE VO IMPACTAR DIRETAMENTE NA
ESCOLHA DO MTODO E DA FERRAMENTA.
CONFIRA.

PRINCIPAIS FERRAMENTAS (SOFTWARES)

CONFIRA, A SEGUIR, DEZ IMPORTANTES FERRAMENTAS
RESPONSVEIS POR AUXILIAR, DE MANEIRA EFICAZ, O DESENVOLVIMENTO E O APERFEIOAMENTO DE UM SITE.
CLICKTALE

ESTGIO DE DESENVOLVIMENTO: Em que fase do

projeto voc est? Vale a pena fazer um prottipo
em HTML ou no papel? Voc ainda no sabe como
estruturar seu contedo? Essas questes so
fundamentais para escolher qual mtodo empregar.
CUSTO: Quanto voc pode comprometer do seu
oramento nesse tipo de pesquisa? Uma dica: mais
vale investir em pequenos testes (com amostras
menores, por exemplo) ao longo do desenvolvimento
do que comprometer todo o oramento em apenas
um teste. Vale lembrar que testar sempre muito mais
eficiente: permite que a evoluo da sua interface
seja constante, aprimorada a cada etapa. Teste,
implemente e teste de novo. um ciclo e independe
de ferramentas para que ocorra com sucesso.
PRAZO: Quanto tempo voc pode dispor para
executar esses testes? Quantas pessoas da equipe
podem ser alocadas para isso? Existem empresas
que costumam investir em testes de usabilidade
que demoram para gerar resultados concretos por
dependerem da entrega de um relatrio formal
com resultados consolidados. Isso pode reduzir sua
agilidade para implementar as modificaes. Lembrese: voc est inserido em um ambiente dinmico
e seus concorrentes podem estar investindo em
diferenciais que podem deixar o seu site para trs.
Ficar parado sempre a pior estratgia.

www.clicktale.com

Permite rastrear o movimento do mouse e os cliques. O ClickTale

especialmente til por gravar vdeos de sesses nicas dos
usurios, permitindo ao desenvolvedor assistir forma como
um usurio especfico navegou pelo site, destacando o cursor
do mouse. Tambm possvel gerar relatrios que agregam
dados de vrias sesses, em formato de mapa de calor. O mapa
de calor mostra quais so as reas quentes e frias do seu site:
as regies em vermelho e laranja mostram onde os usurios
ficam mais tempo com o mouse; j as reas em azul ou cinza so
as que apresentam menor tempo de permanncia.
Alm disso, o ClickTale tambm permite avaliar o preenchimento de formulrios, mostrando o tempo de preenchimento
dos campos, quais campos levam ao maior ndice de abandono
do formulrio e quais apresentam maior ndice de erros. Tal
funcionalidade especialmente crtica quando uma das etapas
do fluxo de converso do seu site composta por um formulrio, permitindo otimizar o funil de converso.
Estgio de desenvolvimento:

muito poderoso para a fase de manuteno, pois permite

acompanhar a performance ao vivo, quando o site j est
implementado e no ar, e identificar pontos de melhora.
Custo:

Disponvel em trs planos, iniciando em U$ 99 at U$ 990

mensais.
Prs:

q
1FSNJUF
PCTFSWBS
B
OBWFHBP
EF
GPSNB
SFNPUB

q
"
QPTTJCJMJEBEF
EF
BOBMJTBS
EBEPT
FN
GPSNB
EF
NBQB
EF
DBMPS
q"
GFSSBNFOUB
EF
BOBMZUJDT
QBSB
GPSNVMSJPT

FTQFDJBMNFOUF

importante para sites de converso.
Contras:

FRONTEIRAS GEOGRFICAS OU LIMITAES DE

DESLOCAMENTO: Os seus usurios esto dispersos
geograficamente? Existe alguma outra limitao
para lev-los ao laboratrio de usabilidade ou para
deslocar sua equipe at esses usurios? Essa questo
importante para avaliar se o mais adequado
utilizar uma ferramenta que permita aplicar os testes
de forma remota.

q
1PS
OP
FYJTUJS
NPEFSBP
QSFTFODJBM
P
EFTFOWPMWFEPS
OP

recebe o feedback dos participantes sobre suas motivaes/
dvidas enquanto executam as tarefas;
q
&YJHF
BMHVN
DPOIFDJNFOUP
UDOJDP
QBSB
JNQMFNFOUBP
EF

cdigo nas pginas;
q
0
DVTUP
BJOEB

TBMHBEP
QBSB
BMHVNBT
FNQSFTBT

CHALKMARK
www.optimalworkshop.com/chalkmark

O Chalkmark permite o compartilhamento de uma imagem da

sua interface com os usurios. O teste funciona assim: os usurios so expostos a essa interface e devem indicar onde clicariam para resolver uma tarefa. Por exemplo, voc est projetando um site de e-commerce e quer saber se o boto Comprar
da pgina de produto est bem localizado. Nesse teste, os participantes recebem uma tarefa na qual devem indicar onde

26

| WIDE | 85 > CRIAO

clicariam para adicionar o produto ao carrinho de compras.

como se fosse um card sorting reverso, em que a navegao
avaliada para garantir que os usurios saibam por onde navegar para finalizar uma tarefa.
Recomenda-se acessar o site oficial do servio, que possibilita
ver a ferramenta em ao e us-la por um perodo trial pode-se
criar uma pesquisa demo com dez participantes e trs tarefas.

PLAIN FRAME
www.plainframe.com

O Plain Frame tambm similar ao YouEye, mas permite apenas a gravao de cliques e movimentos do mouse enquanto os
participantes realizam as tarefas.

MORAE
www.techsmith.com/morae

TREEJACK
www.optimalworkshop.com/treejack

O TreeJack, que da mesma empresa do Chalkmark, mais

especfico ainda e tem como objetivo testar a arquitetura de
informao enquanto em estgio de site map. uma ferramenta
interessante para se validar o entendimento sobre a organizao do contedo do futuro site.

CRAZYEGG

A grande vantagem do Morae poder realizar anotaes em

outro computador que ficaro sincronizadas com o vdeo aps
o teste. Isso agiliza muito a anlise posterior porque permite
encontrar os trechos de vdeo rapidamente.
Os arquivos sincronizam rosto, voz e movimentos do
mouse, bem como captura os tempos de execuo. O relatrio
resultante rico em informaes e valioso para convencer o
cliente sobre mudanas requeridas. A qualidade da ferramenta
proporcional ao seu alto custo, superior a mil dlares.

www.crazyegg.com

O CrazyEgg foi uma das primeiras ferramentas online de usabilidade. Ele gera um mapa de calor sobre o site, que mostra onde
os usurios esto clicando. uma ferramenta interessante, que
pode proporcionar insights sobre os pontos de maior interesse
dos usurios. No entanto, talvez seja preciso ter certo cuidado,
pois os cliques podem no corresponder ao real desejo dos usurios. Dessa forma, uma ferramenta complementar e deve ser
usada em paralelo com outras formas de registro do comportamento dos usurios.
Com o tempo, foram surgindo outras ferramentas similares
ao Crazy Egg, como o Click Density (www.clickdensity.com) e o
Mouse Flow (www.mouseflow.com), que fazem basicamente a
mesma coisa.

FIVE SECOND TEST

www.fivesecondtest.com

O Five Second Test tem uma lgica prpria, na qual os participantes tm que responder s perguntas estipuladas pelo pesquisador em cinco segundos, enquanto olham o site ou o seu
prottipo. uma variao da metodologia tradicional, que pode
se mostrar interessante com tarefas especficas para captao
da percepo macro das pessoas.

USERTESTING
www.usertesting.com

Ao usar essa ferramenta voc pode contar com um painel

de participantes. O recrutamento e a bonificao dos testadores inteiramente feita pela UserTesting, tornando o processo rpido e gil, porm esse aspecto da ferramenta no
to til para quem quer testar com usurios fora dos EUA ou
do Canad, onde h a maior concentrao dos participantes.
No entanto, possvel testar usando uma amostra prpria
quando se quer filtros mais especficos (a UserTesting faz uma
segmentao com foco mais demogrfico dos participantes)
ou participantes de outros pases, porm com a facilidade de
contar com o painel existente.
Cada sesso resulta em um arquivo de vdeo, assim possvel avaliar a interao dos participantes. Para conduzir o teste,
o analista deve definir os filtros para a amostra (sexo, idade,
renda e experincia com computador). Alm dessa definio, o
analista deve determinar quais so as tarefas que o participante
dever executar durante a navegao.
Fontes: Amyris Fernandez, Eduardo Loureiro, Frederick van Amstel, Horcio
Soares e Juliana Gaiba.

LOOP11
www.loop11.com

O Loop11 onde o desenvolvedor cadastra as tarefas para que

os participantes faam o teste sozinho em seus prprios computadores. Os resultados das tarefas so coletados pelas ferramentas e exibidos em um relatrio. um modelo de teste de usabilidade no moderado, pois no tem a presena do pesquisador.

YOUEYE
www.youeye.com

O YouEye tem a mesma lgica do Loop11, porm permite a gravao de movimentos do mouse, cliques em forma de vdeo e de
udio. Com isso, possvel coletar mais dados alm do resultado
da tarefa em si, o que tornam os resultados muito mais ricos.

NEM TODOS OS TESTES DE

USABILIDADE POSSUEM FERRAMENTAS
ESPECFICAS, MAS, NA MAIORIA DOS
CASOS, EXISTE ALGUM SOFTWARE QUE
PODER, DE ALGUMA FORMA,
AUXILIAR NA COLETA DOS DADOS E NA
POSTERIOR ANLISE
Horcio Soares
85 > CRIAO | WIDE |

27

Mateu Velasco

Por Tiago Bosco

Sreet art brasileira marcando presena mundo afora

Com trabalhos expostos em muros e galerias de Rio de Janeiro, So Paulo, Porto Alegre, Paris, Lisboa e
EUA, Mateu Velasco (www.mateuvelasco.com) tem como caracterstica um estilo prprio de ilustrao
e grafite, alm de unir em seus projetos a linguagem grfica da street art com o mundo da publicidade
comercial. A seguir, confira a conversa que tivemos com esse talentoso artista.
28

| WIDE | 85 > CRIAO

Nascido em Nova Iorque e vivendo desde a

infncia no Rio de Janeiro, Mateu Velasco formou-se em Desenho Industrial pelo Departamento de Artes & Design da PUC-Rio. Em seu
rico portflio, encontram-se projetos desenvolvidos para grandes empresas, como Nike,
Canto, Spoleto, Natan, Totem, Converse, editora Abril, editora Record, Brasil Telecom, Rede
Globo, W/Brasil, Claro, dentre outras.
WIDE Como foi o incio da sua relao com a arte? E em
que momento da sua vida voc resolveu se dedicar profissionalmente a criao?
MATEU Assim como a maioria dos ilustradores, comecei a
desenhar bem cedo, desde moleque. Em 1999, ingressei na
faculdade de Desenho Industrial na PUC-Rio. Aos 18 anos,
comecei a fazer os meus primeiros trabalhos profissionais.
Trabalhei algumas vezes como designer em estdios de
design grfico, porm o que eu queria mesmo era trabalhar
com desenho, pintura. Foi quando sa da faculdade, em
2003, e resolvi tentar a sorte trabalhando como freelancer
e viver apenas de desenho e pintura.
WIDE Em sua biografia apresentada em seu site consta que
voc desenvolveu um estilo prprio de ilustrao e grafite.
Como define esse estilo?
MATEU Na verdade, esse estilo prprio existe mais pela
linguagem que utilizo em meus projetos, porque acho
que todos que trabalham com criao, de um modo geral,
buscam estar sempre se desafiando, procurando novas
frentes de trabalho e novas reas para se explorar. Meu
trabalho consiste muito na utilizao das linhas dialogando com as cores e, apesar de ser extremamente figurativo e baseado no que vemos no nosso dia a dia, sempre procuro explorar as possibilidades que o desenho
proporciona, criando situaes inusitadas e impossveis,
quase surrealistas em alguns casos.
WIDE Quem so as suas principais referncias criativas?

E por qu?
MATEU As referncias so muitas; difcil list-las aqui.

Procuro sempre ir a exposies e pesquiso muitas imagens

no meu cotidiano: na internet, na rua, em revistas, em fotos
de jornais etc. Na verdade, esse foco varia de acordo com
a fase do trabalho que estou desenvolvendo; algo que se
apresenta em constante mutao. A busca por referncias e
a formao de um repertrio visual algo que todos os artistas devem ter, independentemente da sua rea de atuao.
WIDE Quais so as tcnicas mais utilizadas em seus

trabalhos?
MATEU Trabalho em trs segmentos distintos. Na
85 > CRIAO | WIDE |

29

Por mais que tenhamos o que

chamam de dom, este passa a
ser um desperdcio se no existir
a prtica contnua

ilustrao, uso basicamente lpis, papel, borracha e alguma caneta

preta nanquim. Ultimamente, devido praticidade e aos prazos cada
vez mais apertados, fao a colorao das imagens digitalmente no
Photoshop, apesar de sempre tentar utilizar texturas que venham
do mundo real, e no criadas artificialmente. No trabalho que desenvolvo em tela para galerias, uso tinta acrlica, spray e, em alguns casos,
colagem. E nos trabalhos de grafite e pintura em espaos grandes, utilizo tinta spray e tinta de parede.
WIDE No existe talento sem treinamento. Essa frase foi proferida

pelo ex-jogador de basquete Oscar Schmidt, partidrio de que a repetio do trabalho mais importante do que as habilidades adquiridas
naturalmente. Em relao arte, como voc enxerga a relao entre o
dom e a tcnica?
MATEU Se pegarmos o exemplo de grandes nomes da histria da
arte, veremos que boa parte de seu xito vem da repetio, do treinamento, da produo intensa. Picasso, para citar um exemplo famoso,
trabalhou em diversas frentes (pintura, escultura, colagem, desenho
etc.) exaustivamente, desde garoto at o final de sua vida. O resultado

30

| WIDE | 85 > CRIAO

85 > CRIAO | WIDE |

31

 uma produo artstica surpreendente, diversa e rica. Chuck Close,

outro artista que admiro, disse em uma entrevista que era indispensvel que se trabalhasse 365 dias por ano e que sabia que nem sempre sairia alguma coisa boa ao fim de uma jornada de trabalho, mas
que, certamente, em outros dias grandes trabalhos apareceriam. Por
mais que tenhamos o que chamam de dom, este passa a ser um desperdcio se no existir a prtica contnua.

MATEU Na verdade, ambas as linguagens se utilizam do mesmo

expediente para passar suas mensagens: a imagem. No mundo de

hoje, difcil separar ambas as coisas, uma vez que a publicidade
sempre teve como caractersticas se apropriar de diferentes linguagens e adapt-las para peas publicitrias. O maior desafio, talvez, seja
utilizar essas linguagens de forma harmnica e inteligente, nunca de
forma ftil e inconsequente, como a utilizada em tantas outras peas,
que tm como principal funo apenas vender e gerar lucro.

WIDE O que representa para voc a arte por meio do grafite?

MATEU Grafite , para mim, a possibilidade de se fazer algo fora das

WIDE De todas as suas criaes, quais voc mais gosta e por qu?

instncias legitimadoras tradicionais. O espao das ruas democrtico, livre, possibilita ao artista quebrar barreiras preestabelecidas pela
sociedade de controle, desmitificando a chamada vida de artista. Na
rua, o trabalho acontece na frente de todos, sem maquiagem, sem o
controle que temos dentro de um atelier. Alm disso, devido ao fato
de inmeros painis serem feitos de forma coletiva, a troca de informaes entre diferentes artistas intensa, propiciando um ambiente
rico em troca de conhecimentos e vivncias.

MATEU No tenho uma imagem que possa eleger como a de que mais

gosto. De um modo geral, cada uma delas tem a sua importncia, pois
o que realmente valorizo no trabalho que venho desenvolvendo o
processo criativo, o desenvolvimento da linguagem grfica e a busca
por novos desafios. Sendo assim, cada uma das centenas de imagens
que criei ao longo da minha vida teve o seu papel naquele momento,
e por um curto perodo foi merecedora de uma anlise mais detalhada. Geralmente, a imagem que de mais gosto a em que eu estou
trabalhando no momento.

WIDE Em seu portflio, muitas vezes voc une a linguagem grfica

da street art com o mundo da publicidade comercial. Quais os maiores desafios encontrados em conectar esses dois universos?

32

| WIDE | 85 > CRIAO

Todas as ilustraes presentes nessa entrevista fazem parte do

portflio de Mateu Velasco.

85 > CRIAO | WIDE |

33