Ed76 by Luis Rocha

abril 2010 ano 7 nº 76

www.revistawebdesign.com.br E D I T O R A

Mídias Sociais

quais serão HTML 5 os próximos passos? Eleições 2010 Descubra sua influência no design de interfaces

Perspectivas sobre o uso de ações digitais pelos políticos brasileiros

Semiótica Saiba como a ciência dos signos pode contribuir na criação de interfaces web

Uma análise sobre o perfil do profissional, métricas e relevância de projetos na área R$ 11,90

| webdesign | 76 > 04/10

76 > 04/10 | webdesign |

EDITORIAL

Minha fonte de inspiração Acabo de chegar ao hotel depois de um workshop que realizamos em São Paulo. Ao final do evento, fiquei conversando com o Vander, de Volta Redonda, interior do Rio de Janeiro. Ele me contou que lê a Webdesign desde 2004 e conversamos à beça! É tão bom saber o que acontece do outro lado, depois que a revista vai para a casa do leitor. Melhor ainda é descobrir como inspiramos grandes profissionais. Então, Vander, queria te agradecer por ter me inspirado hoje também, cheguei aqui querendo conversar ainda mais com vocês e contar uma grande novidade... Depois de quase sete anos de vida, a Webdesign ganhou de presente um novo projeto gráfico e editorial! E foi com a ajuda de mais de dois mil leitores, que preencheram, em dois dias, uma enorme pesquisa de opinião, que chegamos a este resultado (veja detalhes nas páginas 24 e 25). Obrigada pela participação de todos! Só não deixamos a pesquisa mais tempo no ar para podermos analisar todas as sugestões cuidadosamente. Foram todas integralmente lidas e discutidas. Não deu tempo ainda de implementar todas as ideias, teremos as seções "Análise de interfaces" e "Coluna do leitor" em breve. Ou seja, mais novidades virão por aí. Queria também fazer um agradecimento mais que especial para Luciana Junqueira e Bruno Lemgruber, da Tabaruba Design. Com experiência internacional no segmento editorial, eles acolheram o projeto com todo o carinho e, em apenas um mês, capricharam muito no projeto gráfico. A revista ficou mais leve, confortável e dinâmica para receber bem toda a arte de nossa diretora de criação, Camila Oliveira. Enfim, estão TODOS (leitores da Webdesign, Tabaruba Design e equipe Arteccom) de parabéns: foi um excelente trabalho em equipe! Exigiu muito esforço, dedicação, humildade e troca, o que nos rendeu muito aprendizado e um resultado surpreendente! Espero que vocês, nossas fontes diárias de inspiração, gostem também. Enfim, estou super curiosa para saber o que acharam. Me escrevam, ok? Abraços e uma ótima leitura! Adriana Melo adriana@arteccom.com.br

76 Direção Geral Adriana Melo Direção de Redação Luis Rocha Direção de Criação Camila Oliveira Projeto Gráfico Tabaruba Design Publicidade Luanna Chacon Thiago Nabuco Atendimento Rebeca Emerick Tecnologia Neilton Silva Rafael Zuma Financeiro Eduardo Costa Eventos Cristiane Dalmati

Revista Webdesign www.revistawebdesign.com.br Revista TIdigital www.revistatidigital.com.br Encontro de Design e Tecnologia Digital www.edted.com.br Fórum Internacional de Design e Tecnologia Digital www.foruminternacional.com.br Concurso Peixe Grande www.peixegrande.com.br Curso Web para Designers www.webparadesigners.com.br

Fale conosco Atendimento: atendimento@arteccom.com.br Redação: redacao@revistawebdesign.com.br Publicidade: publicidade@arteccom.com.br

ONLINE

Informações também na web Acesse www.revistawebdesign.com.br e confira materiais extras sobre os assuntos abordados nesta edição. Consulte também a seção Downloads e baixe tutoriais sobre Google Analytics e Joomla!, além de modelos de: apresentação de propostas, briefing e contrato de prestação de serviços.

Curso Design de Interfaces www.designdeinterfaces.com.br

Produção gráfica www.ediouro.com.br Distribuição www.chinaglia.com.br

A Arteccom não se responsabiliza por informações e opiniões contidas nos artigos assinados, bem como pelo teor dos anúncios publicitários. Não é permitida a reprodução de textos ou imagens sem autorização da Editora.

E-mail etc.

E-mails, Twitter, Direito na web

Fique por dentro

Notícias, Blog do mês, Métricas, Internacional, Agenda, Livros PORTFÓLIOS

Portfólio Agência

Aldeia

Portfólio Freelancer

Mariana Lucchesi

ENTREVISTA

Semiótica

Portfólio Ilustrador

O artista plástico e designer Ronaldo Gazel analisa a aplicação da ciência dos signos no design de interfaces

Carol Rivello

Portfólio Lente Digital

Isa Ribeiro

Portfólio Fontes de Inspiração

Eduilson Coan CAPA

Mídias sociais, próximos passos

Relatório da empresa de consultoria Gartner aponta que, até 2012, o Facebook se tornará um hub para integração de redes sociais. Profissionais brasileiros analisam esta e outras questões sobre o futuro destes ambientes na web OPINIÃO

Colhendo os frutos profissionais

Como conciliar o trabalho em agência e de projetos frilas, sem prejudicar a qualidade do processo de criação? REPORTAGEM

Yes we can

Será que veremos efeitos semelhantes da bem-sucedida campanha digital do presidente americano Barack Obama nas próximas eleições brasileiras? ESTUDO DE CASO

Os desejos dos webdesigners

Conheça os detalhes da criação e do desenvolvimento do game on-line Webdesigners Wishes, lançado pela Mkt Virtual

Tecnologia em foco CONCEITUAL

Influências do HTML 5 no design de interfaces TUTORIAL

Papervision 3D no Flash Parte 2/3

COLUNAS

Ilustração

Carolina Vigna-Marú

Marketing

René de Paula Jr.

Internacional

Julius Wiedemann

Webdesign

Luli Radfahrer Os links citados nesta edição estão reunidos na página principal do site da revista. Acesse www.revistawebdesign.com.br.

E-M A I L S

E-mail etc.

Minha pergunta pode parecer boba, mas como participar de editais e concorrências? Isso existe para contas on-line? Existe algum serviço que informe quais processos estão em andamento? Pequenas empresas podem participar desses processos? Já tentei encontrar essa informação e não obtive muito sucesso. Se tiver uma resposta, agradeço! [RICARDO ZACHO - RICARDO.ZACHO@ MZCLICK.COM.BR]

Olá, Ricardo. De forma alguma, sua pergunta é bem pertinente sim! Geralmente, empresas privadas de grande porte costumam recorrer ao RFP (http://tinyurl.com/emaillinks-1) na hora de selecionar um prestador de serviços. Já na área pública, os editais costumam ser publicados em Diário Oficial. Uma boa pedida é ficar atento nesses veículos e naqueles que costumam focar em notícias da área econômica e de negócios. Outra sugestão é dar uma lida no documento criado pela APADi, que explica um pouco o processo de concorrências no mercado de comunicação digital (www.concorrenciadigital.com. br). E, como sua dúvida é bem interessante, em breve vamos fazer uma reportagem sobre o assunto.

Participe! fale conosco pelo site www.revistawebdesign.com.br envie sua dúvida de Direito na Web para redacao@revistawebdesign.com.br

E aê, galera nerd! Comprei a edição de janeiro, que falava sobre usabilidade, e lendo as matérias fiquei intrigado com uma coisa: vocês acham que adicionar URLs encurtadas nas matérias faz sentido? Ao invés de www.dominioreal.com. br, vocês trocam por migre.me/ jJlL? Acredito que, para quem está lendo, é mais importante e mais fácil gravar um domínio verdadeiro do que uma URL menor, porém com caracteres que se alternam entre maiúsculas e minúsculas. [FABIO MASSA - FAB.MASSA@GMAIL.COM]

Salve, Fabio. Agradecemos a sinceridade da sua opinião! O que temos procurado fazer é encurtar algumas URLs que apresentam um número muito grande de caracteres, pois isso vinha dificultando a vida de alguns leitores e acabou sendo um pedido dos próprios o uso desse encurtadores. No entanto, com as URLs menores procuramos manter o endereço original. Não sei se você teve acesso, mas, no site da revista, embaixo da imagem de cada capa de edição, temos um espaço ("Links da edição") que reúne todos os links citados no respectivo mês, divididos pelas respectivas seções. Esperamos ouvir e trocar mais ideias com você, ok?

renderizadas nos browsers do Linux e do Windows, respectivamente. E uma tabela de equivalências, comparando quais fontes são mais parecidas que podem ser substituídas. Por exemplo: a “Arial” do Windows tem como equivalente a “Helvetica” do Linux porque elas são praticamente iguais. Seria legal comparar as fontes mais "famosinhas" que estão sendo usadas em layouts de sites atualmente (fontes web 2.0). E também uma matéria sobre renderizadores de browsers: as diferenças entre os que são feitos com WebKit e os que não são, quais os outros motores e um quadro comparativo entre eles. [LÍA SIQUEIRA - LIA.SIQUEIRA@ GMAIL.COM]

Ótimas sugestões, Lia! Para que você já possa ter algum material sobre o assunto, enquanto preparamos e definimos a data de publicação de reportagem, recomendamos a participação na lista de discussão “Tipografia” (http://tinyurl.com/emaillinks-2), que reúne profissionais experientes nesta área e que talvez possam indicar outras fontes de consulta sobre o assunto, e a leitura do blog “Tipos do Brasil”, que publicou um artigo que aborda um pouco deste tema (http://tinyurl.com/email-links-3).

Quero sugerir uma matéria sobre a diferença entre as fontes padrões que são

Os e-mails são apresentados resumidamente.

@ Carollfleur

@vitorbritto

Vocês conhecem a #revistawebdesign da editora @ arteccom? Foi um dos meus melhores investimentos em fevereiro: http://migre.me/lIwH

Quem ainda não leu a #revistawebdesign de fevereiro? Duas matérias sensacionais: “O cliente tem sempre razão” e “Pequenas empresas na Web”!

T W I T T E R [@arteccom, #revistawebdesign] @ profissaoweb Parece bem legal a edição deste mês da Revista Webdesign Catálogo Portfólio 2010: http:// www.revistawebdesign.com.br ... Vou comprar!

@ Andreza_Olivo Presentão da @arteccom! Artigos dos colunistas da Webdesign desse mês publicados on-line http://bit.ly/cyR6I :D

Sugestões dadas através dos e-mails enviados à revista passam a ser de propriedade da Arteccom.

| webdesign | 76 > 04/10

D I R E I TO N A W E B

CONTRATOS DE TRABALHO OU DE SERVIÇOS? Sou webdesigner freelancer e trabalho também registrado em uma empresa como operador de microcomputador. Faço a parte de, digamos assim, “gerência em TI”, mas registrado como operador. A dúvida é a seguinte: sou obrigado a fazer - fora o que o meu cargo exige - o que o meu patrão exigir que eu faça na área de informática? Ele acha que, como sou registrado como operador, tenho que ser o chefe dessa área e realizar tudo que eu não sou obrigado a fazer. Um desses serviços são os websites pessoais dele e da empresa, onde o mesmo acha que já está incluso tudo no pacote de operador de micro. Quais são os meus direitos, como devo proceder para eu não sair perdendo nessa parte, pois já falando com o mesmo, ele se recusa a pagar como prestação de serviços. Obrigado! TONY RODRIGUES - tonyrl@terra.com.br Como se sabe, não há ainda uma regulamentação profissional específica na área da informática, embora exista regulamentação oficial do ensino de, por exemplo, análise de sistemas. Se não há profissão, não pode haver contrato de trabalho, certo? Não, as coisas não são tão simples nesse setor. Por um lado, há conselhos de representação profissional, como o CREA e o CRA, que muitas vezes se dizem representantes de empresas e profissionais de informática (e com isto pretendem, inclusive, auferir a receita de anuidades respectivas). Por outro lado, há entidades que sustentam que criar uma “profissão” em informática é impossível (porque ela é muito variada e sempre mutante) e inconveniente (porque pretender “engessar” a informática, se é que viável, não deve interessar a qualquer um, em sã consciência).

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.

Assim, sem lei específica para proteger a atividade, sem conselho profissional para fiscalizá-la, e sem profissão definida para fixar o escopo, como se proteger num contrato de trabalho com o empregador? O primeiro ponto a considerar é que, em matéria trabalhista, não há necessidade de profissão regulamentada para que possa existir contrato de trabalho. A lei que regulamenta a profissão é uma proteção a mais, específica. Mas, em não havendo esta lei, se aplica a CLT sempre que a relação envolver subordinação hierárquica, econômica e técnica, as quais traduzem o chamado “poder diretivo” (poder disciplinar, de dar ordens e exigir seu cumprimento, e poder de fiscalização, de “monitorar” a execução). Portanto, a CLT garante certo nível de proteção a contratos de trabalho de atividades não regulamentadas por lei específica. Uma das proteções que a CLT oferece é de que, em contratos de trabalho, “vale o escrito”, sempre que seja mais favorável ao empregado. Portanto, se no contrato de trabalho está escrito que a atividade a ser desempenhada é uma, o empregador não pode exigir outra. Lógico, o empregador pode reagir dispensando (sem justa causa) o empregado que se recuse a aceitar atividade adicional, ou que exija novo pagamento, em troca. Ou pode aceitar rever o escopo do contrato de trabalho e pagar mais, quando se dê uma composição harmônica de interesses. Por isto, e para isto, o ideal é definir com precisão, e tão logo possível, o escopo de atividades de trabalho. Dessa forma, tanto empregador quanto empregado saberão qual é a expectativa de trabalho e de remuneração dali para frente. Quando não exista suficiente descrição na carteira de trabalho, qualquer outro documento pode ser considerado válido, desde que tenha sido aceito pelo empregado. Projetos de desenvolvimento de sistemas, programas de governança de TI, e quaisquer outros documentos que fixem responsabilidades individuais poderão ser considerados como integrantes do contrato de trabalho, mesmo sem referência a eles na carteira de trabalho. Outra vantagem do contrato de trabalho é que a CLT reconhece o poder normativo das convenções e acordos coletivos de trabalho. Ou seja, o piso salarial (e outras benesses) que o sindicato patronal e o sindicato dos empregados negociarem anualmente passam a valer com força de lei. Vale a pena consultar as atividades abrangidas no acordo ou convenção, e aquilo que tenha sido negociado a respeito. Como se vê, a opção de desenvolver atividades sob a figura de um contrato de trabalho tem as suas vantagens, pois pode assegurar certo nível de proteção legal, embora possa perder a liberdade existente em contratos de prestação de serviços, que se caracterizam justamente por falta de subordinação e dependência. Porém, como tudo mais na vida, é preciso pensar nas vantagens e desvantagens e então definir a escolha da forma mais clara possível, o quanto antes. 76 > 04/10 | webdesign |

N OT Í C I A S novidades da construtora por meio do Twitter integrado”. Esta não é a primeira vez que a empresa teve sucesso no uso de ferramentas digitais como canais de venda. Em 2008, quando começou a usar o Twitter para promover seus empreendimentos, a Tecnisa registrou a venda de um imóvel de R$ 500 mil.

Fique por dentro Medindo calorias pelo Twitter Depois de estimular os usuários a jogarem um autorama real via Twitter (www.tuitorama.com.br) , com direito a ranking remoto de pilotos, a agência DM9DDB lançou mais um projeto interessante envolvendo a ferramenta de microblogging. Desta vez, em ação para divulgar a marca da Cia Athletica, foi desenvolvido o aplicativo on-line “Tweet Calories” (www.tweetcalories.com) , onde é possível medir quantas calorias você já gastou com o Twitter. Os cálculos são feitos “por meio de uma média de tamanho das palavras, velocidade média de digitação, calorias que se perde por minuto e quanto se costuma gastar em uma tuitada”. Além da ferramenta, a agência criou ainda o perfil @ tweetcalories, onde são publicadas dicas de como gastar calorias.

Apto vendido via iPhone No início de março, a Tecnisa (www.tecnisa.com.br) anunciou a venda do primeiro imóvel que teve a negociação iniciada por aplicativo do iPhone. “Ela foi 100% originada pelo iPhone e mostra como o consumidor responde rapidamente às novidades”, diz Romeo Busarello, diretor de internet da Tecnisa.

Criado em junho de 2009, pela LBS Local em parceria com a agência Mídia Digital, o aplicativo “permite verificar quais são os imóveis mais próximos, mostra um mapa com as unidades demarcadas e traça rotas para chegar até elas. Além disso, é possível tirar dúvidas por e-mail, entrar em contato com corretores on-line da construtora, acompanhar a evolução das obras e ficar por dentro das

Design gráfico .br no exterior Criado ano passado pelo pernambucano Itamar Medeiros, User Experience Manager da Autodesk, e pelo carioca Bruno Porto, professor de design gráfico do Raffles Design Institute, o site www. BrazilianGraphicDesign.com faz o registro, em inglês, de exposições, prêmios e destaques do design brasileiro no exterior. Inicialmente pensado apenas para hospedar os eventos que a dupla vem montando na China há cerca de quatro anos - como a mostra de pôsteres Descubra o Cinema Brasileiro e a ida da 9ª Bienal Brasileira de Design Gráfico a Pequim e Xangai - o site incorporou também perfis dos pioneiros do nosso design. “Sentíamos falta de um referencial que os estrangeiros pudessem consultar”, conta Itamar, também coordenador em Xangai da Interaction Design Association (IxDA).

MÉTRICAS

73%

Percentual de crianças e jovens, entre 8 e 17 anos, que enviam e-mails dos seus

TELEFONES CELULARES. A pesquisa revela que 93% das crianças socializam com a família e os amigos on-line, aproximadamente, cinco horas por semana; 55% fazem amigos pela web; e têm - em média - 37 amigos on-line. Fonte: Norton Online Living Report (http://nortononlineliving.com/)

| webdesign | 76 > 04/10

16,8milhões

Montante de usuários que acessaram SITES DE VIAGENS durante o mês de janeiro de 2010. O estudo destaca ainda que, com um crescimento mensal de 9,3%, os sites de automóveis foram o outro destaque do mês, atingindo 8,4 milhões de usuários únicos. Fonte: IBOPE Nielsen Online (www.ibope.com.br)

B LO G D O M Ê S

I N T E R N AC I O N A L

Caligraffiti

Eventos UX

Criado a partir de uma ideia de um grupo de amigos de uma faculdade de design no Rio de Janeiro, o blog Caligraffiti (www. caligraffiti.com.br) é uma ótima pedida para quem gosta de pesquisar referências, trabalhos e concursos focados na área. Segundo a apresentação oficial, o espaço funciona “como o design gráfico: se comporta e se apresenta como a união entre o projeto e a arte, assim como a caligrafia e o graffiti”. Além das

LONDRES (E CINGAPURA)

postagens diárias, contendo análises sobre trabalhos tipográficos e de ilustração recentes e interessantes, por exemplo, o blog conta também com um fórum onde é possível acompanhar anúncios de vagas no segmento. Outro ponto a se destacar é a qualidade no design de interface do ambiente, que pode servir de inspiração para quem procura por bons exemplos.

Enviado por Rafael Schouchana www.rafaelschouchana.com Londres e Lisboa sediarão duas conferências importantes para a comunidade de designers e arquitetos de experiência do usuário. O primeiro é o UX Lx (www.ux-lx.com), que acontece em Lisboa, de 12 a 14/05, e contará com as presenças de Steve Krug, Luke W., Jared Spool e Dan Saffer. O segundo é o UX London (http://2010.uxlondon. com), realizado anualmente na Inglaterra. Dos dias 19 a 21/05, o encontro reunirá profissionais como Jesse James Garett e Peter Morville. Ambos os eventos promoverão, entre outros temas, discussões sobre design para smartphones e a adaptação do processo de design ao método ágil. Vale a pena conferir.

Camp Organic TORONTO Enviado por Ronaldo Jardim www.footsteps.com.br

Conhece algum blog interessante focado em criação, design, internet e tecnologia? Envie sua dica para redacao@revistawebdesign.com.br

404

Total de CAMPANHAS PUBLICITÁRIAS ON-LINE veiculadas na subcategoria “Informações Automotivas”, em janeiro de 2010, por meio de 1.089 peças criativas, segundo levantamento do serviço AdRelevance. Fonte: IBOPE Nielsen Online (www.ibope.com.br)

Uma das questões que mais me chama atenção nas agências internacionais é o investimento no profissional. Na Organic Inc, onde trabalho, por exemplo, temos o que chamamos de

Camp Organic. Algumas vezes ao ano, 40 profissionais dos diferentes escritórios da agência vão uma semana para Las Vegas trabalhar em grupos mistos em treinamentos que envolvem: como conhecer o seu target, criar um produto para esse target e apresentar este produto usando storytelling. Participar desse evento foi uma experiência incrível, posso dizer que ganhei muito como profissional. Saiba mais sobre o Camp Organic: http://tinyurl.com/camp-organic

Projeto acadêmico LONDRES Enviado por Kenzo Mayama www.kenzomk.com Em 2009, completei meu mestrado em design na London College of Communication. Uma das premissas foi utilizar o design como ferramenta para investigar outras áreas de conhecimento. O tema pesquisado foi felicidade e o trabalho do psicólogo inglês Daniel Nettle serviu como base teórica do projeto. Resolução visual, animações e vídeos foram projetados nas ruas de Londres, refletindo sobre os diferentes níveis semânticos de felicidade e abordando o público de uma forma inesperada. Para mais informações e vídeos das projeções, visite www.todayifeel.org

11milhões

Total de COMPUTADORES VENDIDOS no ano passado. Em 2010, a previsão é que o mercado de PCs deva crescer 16%, aproximadamente, atingindo cerca de 12,8 milhões de unidades comercializadas, com destaque para o aumento nas vendas de computadores portáteis, tanto notebooks, como netbooks. Fonte: IDC Brasil (www.idcbrasil.com.br) 76 > 04/10 | webdesign |

L I V RO S México), que juntos reúnem 59% da população na região.

Nada a dizer ELVIRA VIGNA

AG E N DA

Companhia das Letras www.companhiadasletras.com.br

08.04

14.04

12° ENCONTRO LOCAWEB

ABCDESIGN CONFERENCE

Local: Salvador www.encontrolocaweb.com.br

Local: São Paulo http://abcdesignconference. com.br

Os baianos serão os primeiros a receberam a 12ª. edição deste evento voltado para profissionais de internet. Além de Salvador, o encontro acontece em outras cinco cidades (BH, POA, Curitiba, RJ e SP). As inscrições custam R$ 50,00.

10.04

Anualmente, a revista abcDesign convidará um grande escritório ou designer estrangeiro na área do design, marketing, branding e comunicação para que ele divida sua experiência com os profissionais brasileiros. Em 2010, o tema será: “Pentagram: um modelo de design colaborativo, criativo e lucrativo.”

15° EDTED Local: São Paulo www.edted.com.br A cidade de São Paulo é a segunda parada do maior encontro de internet do país, que vai abordar temas como Django, Magento, Joomla!, Mobile Tagging, Design, Cores e Tendências. Conheça as últimas novidades e aproveite para fazer networking com os profissionais mais renomados da área. Inscrições antecipadas ganham desconto.

27 a 28.04 PROXXIMA 2010 Local: São Paulo www.proxxima.com.br O evento que traz experiências e projetos a gestores de marketing - e de marca - do Brasil. Serão apresentados projetos que lançaram mão de soluções do mundo digital para atingir metas e resultados concretos.

A Internet na América Latina

SUELY FRAGOSO E ALBERTO MALDONADO

História de um adultério, narrado do ponto de vista da mulher traída. Só por este resumo já dá para imaginar o quanto de estímulo à leitura traz esta mais recente obra da escritora Elvira Vigna. Um ponto interessante desta narrativa é o uso de meios atuais de comunicação (e-mails, mensagens de celular e chats) para ilustrar o desenrolar dos acontecimentos.

Editora Sulina www.editorasulina.com.br Nesta coletânea de artigos reunindo diversos pesquisadores latino-americanos, o leitor poderá conferir um retrato atual sobre as principais características e particularidades no uso da internet pela América Latina. Diante da abrangência, os autores procuraram focar suas abordagens em três importantes países (Argentina, Brasil e

Participe do Fique por dentro! Envie notícias, curiosidades, sugestões ou críticas para redacao@revistawebdesign.com.br.

MÉTRICAS

42%

Crescimento registrado pela Visa no pagamento das VENDAS ON-LINE na América Latina e Caribe, atingindo US$ 10 bilhões em 2009. Segundo a pesquisa, o volume de vendas de comércio eletrônico continua crescendo na região, resultado da inclusão de um maior número de compradores e vendedores envolvidos nesse canal de vendas. Fonte: Visa (www.visa.com.br)

| webdesign | 76 > 04/10

16,15%

Com este percentual, a área de Tecnologia é a que registra a menor PARTICI-

PAÇÃO DE MULHERES trabalhando no setor. A boa notícia é que as mulheres já representam 21,88% dos cargos mais elevados (presidentes e CEOs). Considerando o patamar alcançado há 13 anos, quando a participação feminina era de apenas 10,39%, o espaço ocupado pelas mulheres deu um salto significativo. Fonte: Catho On-line (www.catho.com.br)

76 > 04/10 | webdesign |

Agência

PORTFÓLIO

Criação de experiências digitais relevantes Histórias para contar é o que não falta na trajetória da Aldeia. Afinal, já são mais de dez anos acumulando experiências nos mais diversos tipos de projetos digitais e interativos. Para se ter uma ideia, a agência surgiu em 1996, época em que a internet comercial ainda dava seus primeiros passos no Brasil. “Éramos um estúdio de design, já atendendo algumas demandas digitais, principalmente do meio de pesquisa universitária. Os serviços digitais ganharam corpo e, em 2000, assumimos nosso chão de internet e nos reposicionamos como agência digital. Da formação original temos Gladimir Dutra, Tatiana Brugalli e Luiz Barros. O tempo foi generoso e nos presenteou com excelentes profissionais, hoje associados: Fabian Umpierre, Melissa Lesnovski, Mônica Zandavalli, Rafael Bennett e Ulisses Bragaglia”, explica Melissa Lesnovski, responsável atualmente pela gestão de planejamento. Outra característica marcante na estrutura da Aldeia é a diversidade de origens, formações e histórias de vida de seus profissionais. “Isso dá um caldo suculento de áreas como Arquitetura, Publicidade,

Aldeia Ano de fundação: 1996 Cidade-sede: Porto Alegre N° de funcionários: 25 Site: www.aldeia.biz E-mail: aldeia@aldeia.biz Twitter: @aldeiabiz

| webdesign | 76 > 04/10

Ciência da Computação, Análise de Sistemas, Design, Biologia, Administração, Psicologia e Jornalismo! A sinergia desta diversidade é uma grande troca de figurinhas e gente compartilhando sua bagagem, explorando e descobrindo coisas pertinentes para quem precisa de resultados: os clientes.” Localizada em Porto Alegre, a empresa absorve as características locais em seu cotidiano, mas sem fechar os olhos para outras regiões do país. “É uma ótima cidade para se viver, com boas condições de vida dentro da realidade brasileira. Há profissionais de ótimo nível em comunicação digital e um mercado que atrai gente de todo o país. Uma boa parte de nossa equipe veio de outras cidades e estados, o que consideramos excelente para um ambiente de trabalho rico e diversificado. Somos gaúchos, mas não bairristas! Outros mercados, como São Paulo, têm sido importantes para a nossa expansão. Não há uma fórmula mágica para sobreviver no mercado. Contudo, acreditamos que o que mantém uma empresa no jogo é o binário ‘pés no chão e cabeça nas nuvens’. Ser responsável, honesta, comprometida, assim como inovadora e empreendedora”, afirma Melissa. Para manter a sua aldeia em pleno funcionamento, a agência procura estimular a prática de estudo constante entre seus colaboradores. “Fomentamos a participação em workshops, cursos e palestras, tanto externos quanto internos, além de oferecermos horários flexíveis a quem faz faculdade ou pós-graduação. Alguns de nossos profissionais tiveram ou têm vivência em instrutoria de design e tecnologia, o que facilita a visão e operacionalização temática de estudos na Aldeia. Além da atualização ‘formal’, acreditamos muito no IVP: Índice de Viração Própria. O perfil que apreciamos é alguém que goste e tenha o hábito de atualizar/questionar/formular/interagir/entregar. Neste perfil, a atitude empreendedora, que alia boas ideias com capacidade de realização, é algo natural.”

CONSIDERADA UMA DAS PRINCIPAIS PERSONALIDADES do segmento da moda, a modelo gaúcha Gisele Bündchen surge também como uma das estrelas no portfólio da Aldeia. Para Melissa, além do portfólio e da capacitação técnica, o perfil pessoal da equipe da agência foi determinante na conquista desta conta. “Por mais que nos vistamos de executivos em nossos papéis diários, somos pessoas por baixo da camada corporativa. Capazes de criar empatia com o humano do outro lado do balcão, vestido de cliente. Numa época de hipervalorização do hype, é bom saber que os valores de sinceridade, responsabilidade, compromisso e confiança ainda estão muito na moda.” Na hora de meter a mão na massa, Melissa explica que um dos desafios foi se desapegar de conceitos pré-definidos do que viria a ser um site de modelo. “Expressar a Gisele em bits deveria ser muito mais do que soluções previsíveis. Lançamos mão de formas de pensar para outras mídias, desenvolvendo o site em torno das imagens em tamanho generoso da modelo. Além disso, partimos da resolução de tela mais utilizada à época, subdividindo-a em células estratégicas, que nos permitissem o maior número de combinações nas páginas em torno das imagens temáticas de cada seção.” Neste processo, uma questão importante envolvia o perfil de público que iria buscar informações sobre a modelo pelo ambiente digital. “As diferentes segmentações do público nos orientaram a criar ambiências diferenciadas para cada seção. Essencialmente, a arquitetura de informação é muito similar de uma seção para outra, mas o branding privilegia atributos diferentes da imagem de Gisele.” EM TERMOS DE CURIOSIDADE sobre este case, Melissa revela uma das perguntas mais frequentes quando as pessoas descobrem que eles trabalham com a modelo. “Vocês conhecem a Gisele? Sim,

WEBSITE OFICIAL GISELE BÜNDCHEN www.giselebundchen.com.br

conhecemos. Ela é uma fofa - e linda. Muita gente também fantasia sobre como teria sido o primeiro contato com ‘a’ Gisele, claro. Eram 19 horas de uma sexta-feira, idos de 2001. Boa parte de nós já havia ido para casa quando o telefone tocou. ‘Alô? Gostaria de conversar com vocês sobre um site. É para uma modelo, não sei se vocês a conhecem... a Gisele Bündchen!’. Não dissemos ao interlocutor, mas tínhamos certeza de que era trote. Obviamente, o caso faz parte do nosso folclore interno desde então.” Outro questionamento muito comum envolve o tratamento das fotos apresentadas no site. “As pessoas perguntam se pagamos profissionais para tratar fotos da Gisele. Afinal, o trabalho seria algo próximo de uma bênção, com candidatos fazendo fila para realizá-lo pro bono. Sim, pagamos! Embora grande parte do tratamento para readequação de proporções de imagem seja feita pela ImageNet, a empresa que gerencia o site oficial e a carreira da Gisele. E, sim, eles também pagam as pessoas para tratar imagens.”

Sobre a tecnologia ACTIONSCRIPT + AJAX + ASP + ASP.NET + FLASH + JAVASCRIPT + SQL SERVER

Segundo Melissa, a definição das tecnologias a serem utilizadas no projeto levaram em consideração fatores como desempenho, expansibilidade e flexibilidade, tanto funcional quanto visual. “Transformar essa estrutura visual em um ente tecnológico de alta performance foi um desafio à parte. Nessas horas é que se prova que codificadores e programadores são extremamente criativos. O que hoje vemos como produto final foi resultado da criação não apenas de um criativo, mas de uma equipe deles: arquitetos de informação, designers, codificadores e desenvolvedores.”

76 > 04/10 | webdesign |

PORTFÓLIO

Agência

O DESENVOLVIMENTO DO SITE INSTITUCIONAL de uma das principais empresas do segmento de saúde no país é outro projeto em destaque no portfólio da agência. Sobre a conquista deste trabalho, Melissa destaca os fatores fundamentais na escolha da Aldeia: capacidade de alinhamento com o negócio do cliente e de entendimento de suas demandas de comunicação e tecnologia; expertise no desenvolvimento de aplicativos integrados a aplicações externas; e portfólio forte em presenças institucionais na internet. “A etapa de planejamento da presença digital da Unimed Porto Alegre consumiu nada menos que a metade do tempo total de projeto. Exagero? Nem tanto. Para projetos de grande porte, com número elevado de decisores e avaliadores por parte do cliente, é necessário prever tempos generosos para detalhar todo o processo, entrevistar todos os envolvidos e validar toda a informação antes de partir para a execução. Um projeto bem planejado é executado em menos tempo”, afirma. SOBRE AS PARTICULARIDADES DE SUA PRODUÇÃO, a agência tinha o desafio de conceber um ambiente que atendesse a quatro segmentos principais de público: clientes, cooperados, credenciados e empresas. “Desde cedo, entendemos que falar a todos, da mesma forma, é falar para ninguém. Áreas especiais de conteúdo foram definidas desde os primeiros momentos do projeto. Cada público teve uma versão especial de lógica de navegação, de forma a contemplar suas características demográficas, culturais e funcionais dentro do universo Unimed.” Além disso, a disposição dos elementos pela interface procurou seguir uma divisão que privilegiasse o miolo de conteúdo. “Porém, sem comprimir demasiadamente os menus de navegação internos, verticais, que se mostraram imprescindíveis logo que alinhamos a quantidade de informação aninhada dentro de cada seção”, diz Melissa. Já o design de interfaces procurou seguir a identidade institucional da marca. “O esquema

| webdesign | 76 > 04/10

PORTAL UNIMED PORTO ALEGRE www.unimed-poa.com.br

cromático se baseou em um fundo branco e em uma paleta de cores já utilizada pela Unimed Porto Alegre em sua comunicação. É importante ressaltar que o portal se alinhou, visualmente, com a presença total da Unimed em termos de padrão cromático, fontes utilizadas e escolha de imagens conceituais. A usabilidade levou em consideração o processo de escolha natural de um plano de saúde, pela perspectiva do usuário. A criação de caixas de serviço, na página inicial do portal, auxiliou os usuários a resolverem as demandas mais frequentes: busca de médicos, rede credenciada e serviços orientados a públicos.

Sobre a tecnologia ACTIONSCRIPT + AJAX + ASP.NET + FLASH + SQL SERVER

Neste case, Melissa ressalta que foi fundamental trabalhar com uma plataforma tecnológica que propiciasse alta performance e conectividade com os aplicativos legados do cliente. “O principal desafio era resistir ao modelo tradicional de websites de planos de saúde, apostando em uma estrutura diferenciada que valorizasse tanto o produto quanto o mote de bem-estar que permeia toda a estratégia da Unimed.”

SANDÁLIA GISELE BÜNDCHEN www.sandaliagiselebundchen.com.br

O TRABALHO CONSISTENTE REALIZADO NO SITE oficial da modelo

Gisele Bündchen acabou convencendo a Grendene sobre a capacidade de a Aldeia ser a responsável pelo desenvolvimento deste hotsite. Por fazer parte de um esforço maior de promoção do produto, Melissa destaca que o trabalho procurou criar uma sintonia com todos os outros pontos de presença da marca: comercial de TV, anúncios de revista, embalagem e, até mesmo, o próprio produto. “A característica inovadora do produto, a transparência, logo nos chamou a atenção. Pensamos em recriar, na web, o ambiente de sonhos do fundo do mar no qual Gisele Bündchen passeia nos comerciais de TV, mas mostrar a transparência da sandália contra esse fundo também nos pareceu fundamental como argumento de venda. O padrão cromático se baseia em uma alegoria aquarelada do fundo do mar, com derramamentos fluidos de cores que se misturam. O efeito final é orgânico, macio e dinâmico.” JÁ O PRÉVIO CONHECIMENTO DO PERFIL DE PÚBLICO-ALVO, formado

por mulheres da classe C, em sua maioria, trouxe importantes subsídios ao processo criativo. “Este usuário utiliza a internet com frequência, embora não possamos classificá-lo como heavy user. É provável que boa parte dos acessos seja originário de lan houses, onde sabemos que a pessoa não dispõe de grande quantidade de tempo para explorar um site. Essas características descartaram imediatamente qualquer iniciativa de hotsite-conceito ou experimental. Nossa meta era oferecer ao usuário um equilíbrio ótimo entre experiência intensa e performance ágil.”

Sobre a tecnologia ACTIONSCRIPT 3 + FLASH + JAVASCRIPT + XML

Desempenho e experiência de uso foram os parâmetros determinantes na definição das soluções tecnológicas aplicadas neste case. “No planejamento, decidimos utilizar as movimentações em vídeo do comercial, onde os animais aquáticos realizavam um verdadeiro ballet aquarelado. No desenrolar do projeto, a utilização do vídeo não foi possível por questões operacionais. Resolvemos, então, criar e animar um a um os bichinhos e os derramamentos de tinta aquarelada.”

76 > 04/10 | webdesign |

PORTFÓLIO

Freelancer

O eterno aprendizado do design Estudar sempre e ampliar cada vez mais as fontes de referências. É com estas dicas que Mariana Lucchesi tem procurado aperfeiçoar seu trabalho na área do design. E tais escolhas refletem seu crescimento profissional ao longo dos anos. “O portfólio é só um reflexo do seu repertório visual. Faça uma faculdade boa, vá a exposições, museus, assista palestras, faça workshops, conheça outros designers, amplie seu vocabulário visual. Outra coisa legal é não procurar referências somente no campo do design, caminhe por outras vias também. Leia revistas, livros; é chato dizer isso, mas nem tudo está no Google. Aprender uma profissão leva tempo, todo dia aprendo algo e espero que seja para sempre assim. Então, tenha calma, vá passo a passo que você vai ver gradativamente seus trabalhos ficarem melhores, mais maduros e o mais importante: originais”, afirma. A visão madura sobre a importância destes aspectos talvez possa ser explicado pelo esforço de Mariana em conciliar os estudos no curso de Desenho Industrial/Programação Visual na UFRJ com o trabalho em diversas empresas. “Já trabalhei em estúdios pequenos, estagiei no JBOnline e na agência carioca Loja Comunicação. Tive experiências muito enriquecedoras em todos os lugares. Atualmente, sou webdesigner da Chemtech uma empresa do grupo Siemens - e meu foco é design de software. Durante a minha carreira também procurei participar de alguns concursos. Um dos principais foi um internacional de skins para notebook, o ‘MTV/ HP - Take Action Make Art’. Após saber que minha arte tinha ficado entre as cinco mais votadas da América Latina, fui convidada pela HP para representar

Mariana Lucchesi E-MAIL: falecom@ marianalucchesi.com SITE: www.marianalucchesi.com

| webdesign | 76 > 04/10

os participantes brasileiros em uma coletiva de impressa, no lançamento do produto em São Paulo. Foi uma experiência muito bacana.” Além do emprego em horário integral, Mariana ainda encontra tempo para realizar alguns projetos frilas. Na busca por uma sintonia perfeita entre os trabalhos, ela ressalta a importância de saber administrar e otimizar as tarefas. “Gosto de fazer meus frilas à noite, quando já estou em casa. Não tenho dias específicos para isso. Mas tenho um defeito que a maioria dos freelancers não tem: não viro noite e nem trabalho de madrugada. Não adianta, depois de certo horário não rendo mais. E ficar sem dormir é impossível para mim. É até uma questão de saúde mesmo: no dia seguinte de uma noite mal dormida, o resultado é sempre um ‘zumbi’ que não consegue se concentrar em nada. E não acho justo chegar ao trabalho cansada porque estava trabalhando em casa. Por isso que acho importante ter foco também. Planejar e executar. Cumprir seus próprios prazos. Além disso, não uso elementos que crio para clientes da Chemtech nos meus jobs frilas. E ainda tenho o cuidado de não fazer trabalhos para a concorrência, prefiro ter meus clientes individuais.” Sobre o futuro, ela revela o interesse por novos desafios na área. “Quero continuar trabalhando na área de mídia digital e pretendo enveredar pelo campo dos dispositivos móveis. Meu projeto de graduação foi sobre mobile games, inclusive desenvolvi um jogo, então quero botar esse projeto para frente. Além disso, quero cursar uma pós, criar um blog e fazer alguns cursos que tenho em vista. Pretendo ainda viajar, conhecer outras culturas, outros visuais. É muito interessante, por exemplo, como as pessoas que têm diferentes referências visuais refletem isso naturalmente no dia a dia delas. Citando um dos casos, acho lindo como na África os grafismos das tribos e cores estão presentes nos tecidos que o povo usa cotidianamente, presentes desde as roupas até as pinturas das casas. Acontece na Índia, nos países árabes também. Nestes locais, isso é bem marcante.”

SITE DO LEILOEIRO MARIO RICART TECNOLOGIAS: FLASH + HTML www.marioricart.lel.br

CRIAR UM SITE QUE FUGISSE AOS PADRÕES FORMAIS

LAYOUT PARA MYSPACE DA CANTORA JULLIE TECNOLOGIAS: FLASH + HTML www.myspace.com/jullie

O PERÍODO DE TRABALHO NA HOTSHOP CARIOCA

Loja Comunicação (www.lojacomunicacao.com) acabou rendendo boas oportunidades na carreira de Mariana. Dentre elas, destaque para este projeto desenvolvido quando ela ficava parte do seu tempo alocada na gravadora Deckdisc. “O interessante desse projeto é o fato de que estávamos criando algo sazonal, que tinha que ter um apelo imediato ao público-alvo, para que eles participassem de uma promoção”, explica. A campanha em questão promovia um concurso para instrumentistas (bateristas, baixistas e guitarristas). Os vencedores de cada categoria teriam a oportunidade de participar da banda da cantora teen Jullie. “Outra coisa nova para mim foi a experiência de trabalhar com o MySpace, que apoiou o projeto desde o início.” Além da concepção do layout para o espaço da cantora no MySpace, Mariana revela que o trabalho envolveu ainda a criação de banners de formatos variados para serem veiculados por toda a rede social. “Então, o cuidado para manter a identidade visual entre todas as peças também foi um desafio. Conseguimos ainda aumentar o número de visitas no site em mais de 40%, só na primeira semana da campanha.”

do segmento de leilões. Com este monte, Mariana acabou concebendo as interfaces do ambiente virtual do leiloeiro Mario Ricart. “Mas claro que não podia criar nada muito informal ou moderno demais, pois isso fugiria totalmente do escopo. O resultado foi uma mistura de elementos tridimensionais e elegantes que garantiram uma originalidade ao layout”, ressalta. Outra questão interessante envolveu um dilema na parte da criação: se por um lado, o processo criativo conseguiu atingir seus objetivos iniciais e ter ficado diferente dos concorrentes, ele podia representar também um obstáculo na hora de o cliente aprovar o trabalho. “O mais incrível foi a aceitação dele quando viu o layout. Ao contrário do ‘não’ que esperávamos, ele gostou muito. Claro que teve aquela resistência inicial, um receio natural, mas nada que bons argumentos não resolvessem.”

76 > 04/10 | webdesign |

Ilustração

PORTFÓLIO

Carol Rivello Graduada em Design Gráfico pela Universidade Federal de Santa Catarina (UFSC). Foi diretora de arte em estúdios e agências como MidiaEffects, J. Walter Thompson (Milão) e D/Araújo. Loducca. Atualmente, é freelancer em design gráfico e ilustração. WD Como define seu estilo?

WD Onde você busca referências para o seu trabalho?

CAROL Por não me considerar minimalista, e adorar

CAROL Para uma pessoa sensível até mesmo o dia a

composições detalhadas e decorativas, acredito que meu trabalho esteja conceitualmente próximo ao movimento art nouveau. Admiro e respeito designers que se preocupam basicamente com forma e função, mas não creio que seja meu caso. Gosto de explorar a emoção e a experiência do usuário através de ilustrações e interações em meus layouts. Percebo também a forte influência da natureza em minhas ilustrações, onde eu brinco com formas abstratas para compor estruturas orgânicas. Tenho preferência por paletas harmônicas e queda por layouts e ilustrações vintage, que tenham um aspecto envelhecido e texturizado.

dia mais banal está repleto de referências criativas: pode ser aquela estampa diferente do vestido da sua tia avó, uma frase engraçada que sua amiga falou ou um videoclipe dos anos 80. Eu me inspiro muito com músicas também, em particular suas letras, e meus trabalhos pessoais quase sempre nascem desta referência. Além disso, adoro uma boa livraria e gosto bastante de folhear livros de arte, ilustração, design e arquitetura.

Carol Rivello E-MAIL: hello@carolrivello.com SITE: www.carolrivello.com

| webdesign | 76 > 04/10

Paint Bucket (2009) Cliente Painel Tintas Técnicas Illustrator + Photoshop Chicago (2008) Cliente Projeto pessoal Técnicas Lápis + Nanquim + Photoshop Flor (2008) Cliente DLite Técnicas Illustrator + Photoshop

76 > 04/10 | webdesign |

PORTFÓLIO

Lente Digital

Isa Ribeiro “Comecei a me aventurar na fotografia por influência do meu pai logo cedo. Envolvi-me em algumas agências como modelo fotográfica, mas me encontrei na área de produção. Atualmente, curso rádio e TV, faço teatro, ainda poso para fotos e tenho procurado aprofundar-me na fotografia para editoriais, publicitárias e conceituais.” WD Ângulo, iluminação, textura, movimento, corte... O que mais se destaca no seu trabalho? ISA A composição é fundamental para trazer de maneira clara e artística o conceito principal da foto, abrindo espaço para interpretação de forma única e pessoal a quem as vê. Analiso bem a idéia inicial e o que pode ser completado com a utilização de objetos, cores, figurino e presença de luz do local. Cada movimento é essencial para completar a intensidade na foto, tirando a ideia estática do que os olhos veem e transmitindo a imagem de forma mais poética, expressivamente natural e dinâmica. Me atento muito para a posição e linhagem dos acessórios e tecidos para que a foto, por mais mecânica que seja, possa ser transmitida de forma viva.

Desdêmona (2009) Câmera Canon Sony A200 Lente 28-80mm f/3.5 Culpa (2010) Câmera Canon t1i Lente 50mm f/1.8

| webdesign | 76 > 04/10

Isa Ribeiro E-MAIL: isadora.c.lima@gmail.com SITE: www.flickr.com/photosinthetable

76 > 04/10 | webdesign |

Fontes de Inspiração

PORTFÓLIO

Eduilson Coan Formado em Design Gráfico pela PUC/PR, em 2005. Atua como designer gráfico e paralelamente trabalha na área de tipografia com criações próprias à venda pelo Myfonts, além de ministrar cursos em Curitiba ou pelo Brasil com o projeto Tipocracia. WD Como surgiu a ideia de criar esta fonte? EDUILSON A Ninfa surgiu como um estudo pessoal.

A partir de alguns desenhos no papel, iniciei o trabalho no FontLab. O foco principal era na qualidade dos desenhos dos caracteres. Ao longo de dois anos notei uma evolução no olhar, curvas já aprovadas como certas foram refeitas e o processo de aprendizagem também foi aplicado para metrics e kernings. Em 2008, finalizei três pesos (light, regular e bold) e lancei a venda pelo site Myfonts. Posteriormente, em 2009, a versão black se juntou a família. Nela, podemos ver melhor os inktraps (incisões) onde utilizei esta versão para aprender mais sobre este recurso. WD De que maneira a tipografia influencia na transmissão da mensagem? EDUILSON Recentemente, ministrando um curso sobre utilização de fontes, percebi uma lacuna no ensino em tipografia por parte de algumas universidades. Exemplificando: geralmente se trabalha com muitas referências, ótimos designers, ilustradores,

Eduilson Coan E-MAIL: eduilson@dootype.com.br SITE: www.dootype.com.br

| webdesign | 76 > 04/10

fotógrafos, mas quando chega a tipografia percebemos uma carência nessa área, sempre as mesmas fontes, sempre as mesmas foundries. Novos lançamentos a cada ano exemplificam o quanto a tipografia está evoluindo, encontram-se cada vez mais opções em desenhos de letras para transmitir a mesma mensagem. Cabe a quem trabalha com comunicação ficar antenado e como em design, com o tempo e boas referências vai se criando feeling para adequar boas tipografias a mensagem que se quer transmitir.

Ninfa Com uma visível referência caligráfica, a beleza dos seus caracteres se dá quando usados em corpos maiores que 40pt. O peso black tem ainda mais personalidade e se juntou a família fechando assim quatro pesos indicados para uso display.

76 > 04/10 | webdesign |

REDESIGN

redesign editorial = arquitetura de informação Em 2010, a Webdesign comemora o seu sétimo ano de existência. Diante do compromisso da Arteccom em manter a qualidade do produto, foi preparada uma reformulação gráfica e editorial. A primeira etapa consistiu em uma pesquisa de opinião, que contou com a participação de mais de dois mil leitores. Em seguida, a Tabaruba Design foi convidada a realizar o trabalho em parceria com a Equipe Editorial da Revista. Confira um resumo das principais mudanças efetuadas no projeto.

ORGANIZAÇÃO Focando na informação, o sumário ganhou uma hierarquia clara e direta.

TIPOGRAFIA As curvas contemporâneas da Fonte Stag tiveram um papel fundamental em redefinir a nova identidade da revista. Cheia de personalidade, ela funciona muito bem com os espaços em branco e ainda possibilita um alto contraste nas páginas.

| webdesign | 76 > 04/10

ESTRUTURA Trabalhamos num sistema de grid que permitiu as notícias mais curtas em colunas flexíveis e dinâmicas e os artigos dos colunistas em colunas largas e comportadas.

NAVEGAÇÃO As seções ganharam um sistema de unidade entre elas. Aqui, a unificação das páginas de notícia.

TEXTO Os textos agora contam com mais pontos de entrada, facilitando a leitura.

PORTFÓLIO Criamos um grid versátil que permitiu unificar páginas com muito texto e outras onde a arte é o foco principal.

RETRATOS Inserindo as fotos dentro dos boxes de contato foi possível unificar os diferentes tipos de autorretrato recebidos pela redação.

BOX Cada box ganhou um significado distinto. Este formato foi escolhido para os que contêm um canal de comunicação com a revista ou alguns de seus colaboradores.

CIAN O uso dessa cor pura na tipografia das seções contribuiu para a unificação das páginas.

OLHOS Foram bem marcados e trazem o leitor para dentro da história. LEGIBILIDADE Procuramos intensificar o relacionamento com o leitor, estabelecendo um compromisso com a legibilidade e a simplicidade.

ARTE Trabalhamos duro para privilegiar o conteúdo de toda a revista. Aqui, os espaços em branco e a organização tipográfica valorizam a arte da página. 76 > 04/10 | webdesign |

ENTREVISTA

SEMIÓTICA APLICADA NO DESIGN DE INTERFACES Em tempos modernos, nossos sentidos estão sendo constantemente bombardeados pelos mais diversos tipos de estímulos, principalmente quando falamos das estratégias de comunicação que visam à divulgação de produtos e serviços de marcas disponíveis pelo mercado.

| webdesign | 76 > 04/10

Ronaldo Gazel Artista plástico e designer. Atualmente, trabalha na Bhtec e:house (www.bhtec.com.br). Blog: http://gazozzo.blogspot.com Flickr: http://flickr.com/gazozzo Twitter: @gazozzo

Trazendo esta realidade para o cotidiano do profissional focado na criação de projetos para mídias interativas, a falta de justificativa conceitual no uso de determinados elementos e suas respectivas composições em interfaces pode representar a dispersão na hora de atrair a atenção do público-alvo e a ruptura na transmissão da mensagem que se pretende comunicar. Para evitar que isso aconteça, vamos conhecer algumas das principais características da semiótica, também conhecida como a ciência dos signos, e suas aplicações no design de interfaces, através de um bate-papo com o artista plástico e designer Ronaldo Gazel. Boa leitura! WD Ao longo de nossa história, a semiótica foi objeto de estudos de diversos pensadores, como Charles Peirce, Roland Barthes, Ferdinand de Saussure, Roman Jakobson, Lévi-Strauss, entre outros. Das primeiras observações feitas em séculos passados chegando à velocidade do mundo contemporâneo, de que maneira este conhecimento deve ser aplicado no trabalho de um designer de interfaces? GAZEL É fundamental, antes de qualquer coisa, compreender que os signos que nos acompanham são reflexos de um ser humano em constante mutação. A partir desse pensamento, existem duas frentes principais de ação quando o assunto é aprimorar a nossa sensibilidade e o nosso conhecimento em relação à semiótica. A primeira consiste em analisar o que já foi publicado, o que é discutido em fóruns, em grupos; enfim, situar-se dentro do que é a percepção semiótica global nos dias atuais. A segunda frente de ação está relacionada à nossa capacidade de, a partir desses estudos e da nossa intuição - sim, não é um processo totalmente lógico - “fractalizar” essa imagem inicial de forma a detectar grupos peculiares, que criam, respondem e desenvolvem relações com símbolos específicos, que vão da própria marca de um cliente até a cor que ele está usando no background do seu site. Se vamos falar para o público infantil, por exemplo, precisamos saber a faixa etária e qual o tipo de linguagem visual com o qual esse público já tem cumplicidade, evitando considerar estereótipos ultrapassados em relação à responsividade e seus significados. Conhecendo o público - ou o micropúblico - saberemos também sobre seu comportamento em relação aos signos, o que vai

ajudar a perceber as estruturas gráficas da sua interface sob a ótica desse público. WD Um dos pensamentos mais famosos de Charles Peirce é que “não

podemos pensar sem signos”. Além disso, ele define signo como “algo que, sob certo aspecto ou de algum modo, representa alguma coisa para alguém”. Em termos de mídias interativas, qual seria a melhor forma de definir os conceitos de significante e significado para que se possa atingir um nível adequado de representação gráfica de uma interface e sua respectiva interpretação por parte do usuário? GAZEL As duas “escolas” principais de estudo e utilização das interfaces possuem diferentes abordagens em relação aos seus objetivos, aos critérios de avaliação que determinarão se atingimos ou não um nível satisfatório de progresso na comunicação visual. A primeira delas é a escola compreendida pelo design e pela publicidade, que considera o conforto, a objetividade, a perspectiva de uso em relação ao tempo, a narrativa visual, as considerações mercadológicas, as relações cognitivas entre informação e estruturas gráficas. Para essa escola, a interface ideal segue critérios concretos, constantemente atualizados por pesquisas e análises dos mais diversos tipos para se chegar à identidade do usuário. A segunda, representada pelo enfoque artístico, ocupa-se de suprir uma lacuna menos objetiva - porém não menos importante - que é provocar a dialética em torno do próprio tema da comunicação visual. Para essa escola, os objetivos da interface podem ser, virtualmente, qualquer coisa, abrindo possibilidades de atingirmos mecanismos pouco explorados da Gestalt, ampliando as possibilidades de catarse, inclusive. O que frequentemente se deixa de pensar é que existe uma terceira via que considera a influência do universo imagético que essas duas escolas produzem. São responsáveis por quase tudo o que se vê, toca, usa, sente... É perceber, assim, que o processo não é unilateral, mas cíclico. WD Em exposição em aula sobre o tema “Semiótica vs. Design”

(http://tinyurl.com/76-ent-2), a professora Paula Rigo ressaltava que um projeto de design, “além das funções prática, estética e de uso, tem a função significativa. O produto difunde valores e características 76 > 04/10 | webdesign |

ENTREVISTA

culturais no âmbito que atinge”. Quando trazemos esta realidade para o mercado digital, quais são os meios de pesquisa e elementos necessários para que um designer possa conhecer os valores e as características culturais do público que se pretende atingir com o projeto em questão? GAZEL Um fenômeno interessante a respeito de características visuais sintetizando valores subjetivos de identificação é o estilo “Aqua” (http://tinyurl.com/76-ent-4) de estruturas gráficas. Ele nos mostra, claramente, a influência dos fatores culturais do consumidor na consolidação de uma estética - por sua vez transportada para outras esferas, para outras interfaces, tamanho o impacto dela em nossa capacidade de trabalhar modelos arquetípicos. O MacOSX inaugurou essa geração de elementos gráficos volumétricos com uma particular divisão de contrastes, simulando algo líquido. O iPhone deu prosseguimento e consolidou o padrão tridimensional, e assim, intuitivamente, temos a certeza de que utilizando essa estética, a nossa chance de errar no processo de identificação por parte do público será mínima, pois estamos nos impregnando de características consolidadas no consciente estético coletivo e que remetem à limpeza, concisão e neutralidade. Quando não conseguimos encontrar um modelo gráfico que sintetize a percepção - real ou idealizada - de um brand pelo público, buscamos em outras interfaces valores que NOS PAREÇAM SEMELHANTES ou que, por mais genéricos que sejam - como no “Aqua”, nas sombras espelhadas e no uso de Helvetica ou fontes sem “ruído” visual - nos dão a impressão de que remetem a um senso estético global, que será aceito e compreendido universalmente. WD No artigo “Uma proposta semiótica para a avaliação de estruturas de navegação” (http://tinyurl.com/76-ent-3), Frederick van Amstel destaca que “o modelo de interação básico da World Wide Web para encontrar informações é o apontar-e-clicar sobre links, representamens de outras páginas. Cada página leva a outra página, numa

“Um caso interessante de raciocínio abdutivo: os movimentos dos dedos nas interfaces de toque” (Ronaldo Gazel)

01/20 > 37 | ngisedbew |

| webdesign | 76 > 04/10

| webdesign | 73 > 02/10

76 > 04/10 | webdesign |

ENTREVISTA

autêntica semiose”. Segundo ele, essa lógica se baseia no raciocínio abdutivo (de tentativa e erro). Qual seria o limite para quebrar tal regra de maneira a criar uma nova sensação na interação do usuário com a interface, sem que ele fique confuso ao longo da experiência? GAZEL Vejamos um caso interessante de raciocínio abdutivo: os movimentos dos dedos nas interfaces de toque, mais especificamente, do iPhone. Costumo até chamá-las de “mudras”, numa referência às curiosas posturas de mão da cultura e da religião indiana. Ele representa bem um caso em que se inovou completamente em relação aos signos comportamentais sem deixar o usuário confuso, popularizando um novo padrão de linguagem. Quando penso sobre romper com os estereótipos, lembro-me sempre de que é mais cômodo darmos suporte a um modelo padrão de comportamento do que buscarmos a inovação, arriscando e investindo nosso tempo. É uma questão de escolhas e muitas vezes, reconheço, a escolha certa é justamente a mais ortodoxa. Mas o perigo está aí: essa ortodoxia nos tira a mobilidade para idealizar outros cenários e novos padrões responsivos. O site http://www.dontclick.it/ é antigo, mas demonstra claramente como estamos condicionados com o clique do mouse, e apresenta, de forma bem-humorada, alternativas interessantes que poderiam ser usadas ao invés do clique. Eu pergunto: os exemplos nos parecem tão interessantes e viáveis - por que não vemos a popularização desses modelos

Projeto on-line que estimula o usuário a navegar somente pela movimentação mouse, sem clicar nas opções disponíveis pela interface

| webdesign | 76 > 04/10

76 > 04/10 | webdesign |

ENTREVISTA

“Características da estética Aqua: volume, sombras suaves, brilho e fontes suavizadas com anti-alias.” (Ronaldo Gazel) Créditos da imagem: GUIdebook (www. guidebookgallery.org)

interativos? Eu diria que o paradoxo é justamente esse: se não promovemos novas experiências, o usuário não as conhecerá e, consequentemente, nunca vai apontar num teste de usabilidade a falta de um recurso oriundo dessas experiências. Não acho que haja limites. Como artista plástico, gosto de pensar assim. Mas como comunicador visual, compreendo que o design da interface visa resultados muito bem determinados, o que faz do processo de laboratório, de pesquisa, um termo quase irreal diante dos prazos. Muitas vezes queremos fazer diferente, mas vemos que o tempo não permite. E vamos, assim, lançando mão dos padrões mais universalizados, o que geralmente “pasteuriza” as interfaces. Isso também contribui para o conservadorismo dos padrões de comportamento.

Muitas vezes queremos fazer diferente, mas vemos que o tempo não permite

| webdesign | 76 > 04/10

76 > 04/10 | webdesign |

ENTREVISTA

Se vamos falar para o público infantil, por exemplo, precisamos saber a faixa etária e qual o tipo de linguagem visual com o qual esse público já tem cumplicidade

O site do Cartoon Network (www.cartoonnetwork.com.br) surge como exemplo no uso de signos adequados ao seu público-alvo

WD No artigo “O novo homem é meio máquina” (http://tinyurl. com/76-ent-0), Frederick van Amstel revela o teor de suas conversas com a professora Lucia Santaella, uma das principais especialistas em semióticas no Brasil. Segundo Fred, “um dos temas que me chamou a atenção foi a alfabetização semiótica. Segundo a professora, para que a internet se torne popular no Brasil, é preciso antes dotar o povo de conhecimento sobre os signos usados na interface”. Pela sua experiência na área, como os designers devem trabalhar esta questão em projetos digitais e interativos? GAZEL O “liberalismo” em relação ao estudo dos signos permite que ocorra a seleção natural da comunicação visual. Quero dizer que compreendo o ponto de vista da distinta professora, mas permito-me discordar de maneira saudável: não acho que seja necessário alfabetizar o “povo” em relação às interfaces; as interfaces, sim, é que devem aprender mais com o “povo”, suas características, seu olhar. Àquelas às quais o “povo” não se adaptar serão naturalmente descartadas. É inevitável que as pessoas que ainda estão, digamos, desconectadas, venham a se conectar - e não será a falta de catequismo para comandar uma interface digital que as impedirá. Tendo isso em mente, passemos pois ao processo contínuo de pesquisar antropologicamente, artisticamente, conhecendo as preferências estéticas, os hábitos de consumo, o universo sensorial desse público - que, aliás, numa segunda instância, desdobram-se em micro-públicos distintos tamanha as diferenças de perfil no mesmo grupo. Esse é o caminho fundamental.

| webdesign | 76 > 04/10

76 > 04/10 | webdesign |

CAPA

Mídias sociais: quais serão os próximos passos? Elas estiveram presentes e foram fundamentais nos rumos das últimas eleições presidenciais dos EUA. Estão sendo cada vez mais exploradas pela indústria do entretenimento, vide o sucesso da transmissão simultânea via TV e internet do Prêmio Multishow 2009 e que estimulava ainda a postagem de comentários sobre a premiação, em meios como Facebook, Orkut e Twitter (http://tinyurl.com/capa-76-1). 36

| webdesign | 76 > 04/10

ão podemos deixar de citar o papel essencial que essas ferramentas assumem também na aproximação das marcas com seus consumidores e na construção coletiva do conhecimento, como vemos ocorrer na dinâmica do site cultural Overmundo (www.overmundo.com.br) . Além disso, pesquisa recente da GfK Brasil (http://tinyurl.com/capa-76-5) , envolvendo mil brasileiros com mais de 18 anos de 12 capitais ou regiões metropolitanas, apontou o acesso às redes sociais como o principal hábito no uso da internet (ver box abaixo). Diante de todas essas informações, já não é nenhuma novidade para os profissionais especializados em internet que as mídias sociais trouxeram importantes lições para o planejamento estratégico de comunicação das empresas nos dias atuais, independente do porte que elas tenham, independente do segmento em que elas atuem. Para o pesquisador e estrategista de mídias sociais Tarcízio Silva (http://tarciziosilva.com.br/blog/), um dos principais ensinamentos envolve o reforço no poder do consumidor. “Se antes o cliente sempre tinha razão porque é quem compra o produto e mantém a empresa, hoje esse consumidor também tem seu papel na construção simbólica das marcas. Talvez um dos grandes cases a se observar nas mídias sociais é, por exemplo, o da Apple. A incensada marca é repetidamente apontada, por diferentes pesquisas com diferentes métodos, a marca com o melhor posicionamento. Mas um (nada) pequeno detalhe também é sempre lembrado: não possui presença ativa nestas mídias sociais. O que faz dela líder? Sua qualidade. O acesso livre e de qualidade à internet ainda é privilégio de poucos. Por isso, produtos das áreas da informática e comunicação, que geram posições mais passionais, estão muito presentes nos comentários dos experts que geralmente também são heavy users.” O pesquisador explica que esta peculiaridade no caso da Apple suscita, inclusive, outra questão. “É um exemplo de como a internet pode ser uma catalisadora e multiplicadora de sentimentos em relação a uma marca. Se esta marca é uma das mais admiradas do mundo, tal fato se desdobra na internet. Cada cliente, conhecedor, admirador ou detrator da marca tem a sua disposição uma miríade de oportunidades, espaços e ferramentas para falar bem ou mal de uma marca, produto ou serviço. Levando isso em conta, o principal ensinamento que as mídias sociais trouxeram para o planejamento estratégico de comunicação é: o consumidor não é mais apenas consumidor. É formador de opinião, é veículo de comunicação e mobilizador. Por isso, deve ser ouvido e levado em alta consideração no desenvolvimento de estratégias de comunicação e até mesmo no desenvolvimento e melhorias dos produtos.” “As redes sociais nos permitem categorizar, classificar e

compreender as intenções e desejos das pessoas praticamente em tempo real, algo sempre almejado, porém quase um sonho impossível para qualquer comunicador. Agora, isso é uma realidade e é relativamente fácil segmentar e conhecer seu público. O segredo é saber comunicar aquilo que o público quer ouvir e variar a estratégia e a abordagem de acordo com as características de cada grupo social. Mais do que nunca, o conceito de comunicação de massa e as mensagens sem direcionamento deixam de existir. Acredito muito no microtargeting, conjunto de técnicas que permite dividir grandes populações em microgrupos unidos por interesses comuns e, com isso, formatar e variar a mensagem da suas empresa de acordo com as características de cada unidade social”, argumenta Andre de Abreu (www.andredeabreu.com.br) , gestor da Máquina Web, unidade de mídias digitais e redes sociais da Máquina Public Relations (www.maquina.inf.br), e membro do COM+ (www.commais.info), grupo de pesquisa em Comunicação, Jornalismo e Mídias Digitais da ECA-USP. Outra mudança a se destacar, como descreve Hélio Basso, diretor de operações da Ideia s/a (www.ideiasa.com), é o caráter mais humanizado na relação entre marcas e consumidores. “Ou seja, como fazer meu produto ou serviço ser mais ‘humano’, criando interatividade, confiança, engajamento e consumo consciente do público-alvo. Sendo assim, ao pensar em planejamento, lembre-se de que o consumidor do passado é um ser em extinção. O poder passa da mão de quem produz para a mão de quem consome. Neste cenário, se aproximar do consumidor, tornar-se amigo e confidente é o melhor caminho para fidelizá-lo. E nada melhor que mídias sociais para chegar lá. Já podemos ver, haja vista a quantidade de estudiosos que batem na mesma tecla, que entre os ensinamentos está a ida

76 > 04/10 | webdesign |

CAPA

sem volta para a interatividade entre consumidor e marcas; o atendimento em tempo real para eliminação de dúvidas ou críticas; e a promoção de produtos e serviços de maneira inteligente e coletiva (micronichos). Nada disso tem sentido se o maior ensinamento não ficar claro: deve-se dar atenção ao comportamento do consumidor e não tentar ‘empurrar’ um produto ou serviço ‘via mídias sociais’. Ou seja, o meio por onde nos comunicamos com os outros mudou e trouxe com ele um novo tipo de relacionamento. Se o consumidor mudou seu comportamento, sua marca tem que mudar também. Ai de quem não entender isso.” Ou seja, compreender as lições relatadas acima é um passo fundamental para quem pretende atuar na área, mas não basta para garantir uma trajetória tranquila neste segmento. Pelo contrário, a velocidade com que o mercado digital vai se transformando exige que os profissionais estejam sempre atentos ao que poderá acontecer em cenários futuros. A seguir, vamos traçar e discutir alguns deles. POPULARIZAÇÃO DA INTERNET NO BRASIL

Um dos primeiros pontos a serem estudados é o número gradual de pessoas que começam a usufruir das vantagens oferecidas pelo mundo digital. Durante o evento Mídia Digital, realizado pela Associação Comercial de São Paulo (ACSP), destacou-se que o Brasil já possui cerca de 70 milhões de usuários de internet e que, deste total, 51% fariam parte das classes C, D e E e 48% das classes A e B. Além disso, existe uma otimista previsão que o país atinja 100 milhões de usuários até o final de 2010. Com a penetração cada vez maior da internet entre as classes mais populares da sociedade, a pergunta que fica é: quais mudanças este novo perfil de usuário poderá trazer para os projetos focados em mídias sociais? “Tsunami sócio-econômico-cultural. Apesar de a palavra parecer trágica, ela vale mais como um alerta. Em 2010, há a previsão de venda de 12 milhões de computadores. Esta onda gigante que chega à rede ano a ano, impulsionada pelo aumento do poder de consumo, associada à sede (de muito tempo) por informação

Mais do que nunca, o conceito de comunicação de massa e as mensagens sem direcionamento deixam de existir Andre de Abreu 38

| webdesign | 76 > 04/10

relevante, conhecimento geral, entretenimento, relacionamento, fará com que milhares de jovens e adultos entendam em pouco tempo que ter acesso à informação é ter o poder de decidir por si mesmo. Por conta disso, todos precisam estar alertas para um novo ser pensante, uma massa de consumidores, entre donas de casa, estudantes e trabalhadores, que agora vão interagir em busca ou de gente interessante ou de sua notoriedade. Vai sobrar elogio, reclamação, sugestão e críticas em um tsunami que trará um ‘caldo novo’, que provavelmente não voltará ao mesmo nível de antes. A onda vem para ficar e empresas, governos e governantes devem saber em quais botes subir para não morrerem afogados em modelos de relacionamento e diálogos do passado”, orienta Hélio. “Muito se diz que o Orkut é a porta de entrada dos brasileiros no mundo da internet. Representa o segundo endereço mais visitado no país e pode-se até dizer, com algum exagero, que o perfil no Orkut é uma espécie de RG on-line do brasileiro. Porém, com a penetração das classes C, D e E no Orkut, muitos dos autoproclamados ‘analistas de mídia social’ passaram a utilizar cada vez menos o Orkut. E, quando essa fatia da população começou a acessar o Twitter, criou-se um neologismo preconceituoso e rasteiro: ‘orkutização do Twitter’. No final do ano passado, uma pesquisa disseminada predominantemente através do Twitter chegou à conclusão altamente tendenciosa: ‘O Twitter já é mais utilizado que o Orkut’. Dezenas de grandes blogs e portais reproduziram este absurdo. Lamentavelmente, muitos dos profissionais já inseridos no mercado da comunicação digital olham apenas para o próprio umbigo, deixando oportunidades de lado por puro preconceito. As transformações que este novo perfil pode trazer são transformações em torno da diversidade. Os diferentes e múltiplos padrões de consumo, referências culturais e experiências locais, por exemplo, deverão ser conhecidos mais profundamente para se fazer uma comunicação nas mídias sociais mais assertiva e direcionada e, portanto, mais eficaz”, complementa Tarcízio. Já para a pesquisadora e professora Raquel Recuero (http:// pontomidia.com.br/raquel/) , autora do livro “Redes Sociais na Internet” (www.redessociais.net) , esta demanda de usuários vai criar novos usos, mas não exatamente transformações. “A finalidade dessas ferramentas é a sempre a mesma: aproximar pessoas, permitir que redes sociais sejam traduzidas no virtual e que novas formas de comunicação e interação possam emergir. Deste modo, o que muda são alguns usos particulares e interesses de público-alvo, mas não exatamente a finalidade. Por exemplo, se observarmos o Orkut, veremos que os usos e as apropriações são praticamente os mesmos de todos os públicos do Brasil, como, por exemplo, as apropriações para expressão de si, para sociabilidade... O que muda são as formas através das quais essas apropriações acontecem, seus signos e suas traduções, que fazem parte de universos culturais mais diferentes.”

O QUE VEM POR AÍ

Longe de querer exercer poderes mediúnicos para desvendar o que vai acontecer em um futuro próximo, a análise e o debate sobre o que vem por aí se torna fundamental para se traçar estratégias e se preparar da melhor forma quando essas mudanças já estiverem em curso. A primeira proposta surgiu na edição de janeiro de 2010 da Revista Webdesign, quando Roberto Cassano, diretor de estratégia da Agência Frog (www.agenciafrog.com.br), apontou duas possíveis tendências na área: “As redes ... serão fortes e impactarão profundamente a forma de consumo e de troca/manutenção de laços afetivos e de informação. Elas serão tão grandes que desaparecerão...” e “...travestir redes sociais como jogos para motivar a cocriação. Ou agregar redes sociais a jogos - XBOX 360 e sua Live -, impactando os games, os consoles e até a pirataria” (http://migre.me/m5Yf). “Em relação ao texto do Cassano, discordo da afirmação de que os jogos sociais do Facebook sejam ‘mambembes’. Os jogos produzidos por empresas como Zynga e Popcap, por exemplo, são bastante complexos e se integram de uma forma muito inteligente ao container Facebook. São jogos com aspectos gráficos e narrativos aparentemente mais ‘simples’ porque se propõem a entreter o jogador no seu cotidiano, através de ações que podem ser realizadas assincronicamente e, ainda assim, promover uma sociabilidade bem interessante entre as redes sociais destas pessoas no Facebook. Acredito que os aspectos que apresentarão mudanças no modo de trabalho sejam em torno da prestação de contas. É indispensável, para o crescimento do mercado, que agências e profissionais aprendam e desenvolvam mecanismos, métricas e indicadores para mostrar o que está funcionando e o que pode ser melhorado”, analisa Tarcízio. Para Andre, o conceito de relevância vai se tornar um parâmetro ainda mais essencial quando falamos de projetos na área. “O que me preocupa muito são ações de comunicação essencialmente calcadas em SEO ou tendo o SEO como linha guia, sendo que a linha guia final de qualquer trabalho de comunicação em redes sociais precisa ser a relevância. O SEO tem a sua importância, pois um site construído pensando nos mecanismos de busca fará com que usuários interessados na sua empresa e no que ela oferece cheguem mais fácil a ela. Entretanto, vejo que a maioria das empresas e agência usa essas técnicas como um atalho para ludibriar os sites de busca ao invés de pensar em como se tornar cada vez mais relevante para seus públicos - o que, realmente, dá muito mais trabalho. Por isso, à medida que o Google trabalha para evitar ‘cair’ nos truques do SEO mau caráter - segundo a Wired, pensando nisso, somente em 2010 serão mais de 500 alterações no sistema - penso que temos um campo aberto para explorar a relevância. Além disso, com o tempo de todos nós cada vez mais escasso, apesar do paradoxo

Redes em risco Os analistas da empresa de segurança Websense preveem que, em 2010, haverá um volume maior de spam e ataques na web social e aos mecanismos de pesquisa em tempo real (como Topsy.com, Google e Bing). No ano passado, foi observado um aumento do uso malicioso de redes sociais e ferramentas de colaboração, como Facebook, Twitter, MySpace e Google Wave, visando propagar as ameaças criadas por criminosos virtuais. O uso de sites da web 2.0 por crackers e spammers foram bem-sucedidos devido ao alto nível de confiança que os usuários têm nas plataformas e em outros usuários. Fonte: Websense (http://www.websense.com)

76 > 04/10 | webdesign |

CAPA

de estarmos cada vez mais conectados, relevância será essencial nessa briga pela atenção dos usuários.” Outra tendência envolve a mudança no cenário estratégico em que as mídias sociais estarão inseridas. “Entre as mudanças que conseguimos vislumbrar no horizonte, uma diz respeito à economia de escala com foco na oferta. Isso vai morrer: o foco se dará na economia de escala voltada para a demanda, que se baseará nas redes de relacionamento. Smartphones, games, ipads, netbooks, TVs e rádios digitais serão apenas os meios para consumirmos coletivamente. Um desafio nasce daí: toda a cadeia de valor envolvida com o desenvolvimento de um produto ou serviço terá que pensar a partir não de um cliente, mas para todo um grupo deles. As agências que se dizem especialistas em mídias sociais têm um dever de casa para pensar frente a esse cenário. Tudo vai estar relacionado e, por conta disso, clientes dessas agências discutirão com as mesmas maneiras de criar a sua própria rede, surgindo barreiras de entrada de concorrentes em seus nichos de atuação. Em outras palavras, nosso papel como profissionais de mídias sociais se dará na criação de soluções, independentemente do meio, que permitam que as marcas dominem seus segmentos de atuação, criando diferencial competitivo, atraindo micronichos para formar novas redes de interesse. Mal comparando, seria como um efeito Bombril: pensou em um produto ou serviço, temos na mente do internauta o link com uma rede X ou Y (de uma empresa)”, explica Hélio. O FUTURO PASSARÁ PELO FACEBOOK?

Neste debate sobre o futuro das mídias sociais, um estudo da empresa de consultoria Gartner chegou a afirmar que, “até 2012, o Facebook vai se tornar o hub para integração de redes sociais e socialização web” (http://tinyurl.com/capa-76-2). Verdade ou não, certamente só o tempo poderá nos revelar tal resposta. Mas antes de confrontarmos a análise do instituto americano com a experiência vivida por profissionais do mercado brasileiro, é importante buscar a contextualização das ações e campanhas

OpenSocial É uma API (Interface de Programação de Aplicativos) aberta que permite aos desenvolvedores criarem widgets para rodar dentro de redes sociais que aderirem à plantaforma OpenSocial. As redes sociais que já aderiram são: Orkut, MySpace, LinkedIn, Ning entre outros.” Fonte: Wikipédia (http://pt.wikipedia.org/wiki/OpenSocial)

| webdesign | 76 > 04/10

focadas nestes ambientes ao longo do tempo. Segundo Tarcízio, em geral as mídias sociais sempre sofreram com os problemas de monetização e controle dos modos de utilização pelos usuários. “Como monetizar o site (através de anúncios, mensalidades etc.) e ainda assim manter os usuários satisfeitos? Afinal, a oferta de mídias sociais é enorme. Se os usuários se aborrecerem com o excesso de publicidade ou regras, por exemplo, deixarão tal site no exato momento em que o aborrecimento for maior que o esforço que terá de reconstruir sua rede de conexões em outra mídia social. Esta é uma balança muito sensível, que o Friendster, por exemplo, não conseguiu calibrar.” Além disso, o pesquisador ressalta que, tal como eram há cinco anos, as mídias sociais davam conta de apenas uma parcela pequena das necessidades do internauta. “A partir de 2007, entretanto, com a iniciativa do Facebook de abrir seu site a aplicativos desenvolvidos por terceiros, isso vem mudando de figura. Um ano depois, o Google e outras empresas, como o MySpace, criaram o OpenSocial. Hoje, através destas plataformas, aplicativos no Facebook alcançam 80 milhões de usuários (Farmville) e no Orkut mais de 40 milhões (BuddyPoke). Através destas APIs, se construiu um enorme mercado de aplicativos sociais que interessam aos usuários, às mídias sociais e aos desenvolvedores: para os usuários, são novos modos de interação, produção e consumo de conteúdo; para as mídias sociais, significa que os usuários passarão mais tempo em seus sites; e, por fim, os desenvolvedores monetizam seus aplicativos através de publicidade, patrocínio ou bens virtuais. Some-se a isso, o Facebook Connect, o Google Friend Connect e a API também aberta do Twitter, e as oportunidades são enormes.” Sobre a previsão envolvendo o Facebook, apesar de considerar difícil e arriscado fazer “futurologia”, Tarcízio destaca o fato que, seja qual for a mídia social, os citados mecanismos de acesso a dados, redes de conexões e aos próprios usuários terão papel fundamental no desenvolvimento de estratégias e ações de comunicação daqui para frente. “Aplicativos sociais, por exemplo, são oportunidades fascinantes para a comunicação de marcas. É possível desde que feito de uma forma que ofereça uma ótima experiência ao usuário, tornando a marca o próprio material significativo de interação entre as pessoas.” Nesta discussão levantada pelo estudo do Gartner, Hélio enxerga ainda a cobiça de grandes empresas de internet em assumir o poder pela rede. “Haja vista o posicionamento do Facebook, de ser aberto em seu código, pode-se dizer que está falando a ‘língua do povo’. Não posso, porém, afirmar que ele será o integrador, o hub. Ao mesmo tempo, não tenho dúvidas de que esse objetivo de tomar conta da rede é um desejo do Facebook, da Microsoft, do Yahoo! e do Google. Ou seja, a briga é boa. Esse possível enfrentamento por uma liderança é o que chamamos de desafio para quem quer seu lugar ao sol em redes sociais. Acreditamos que ele acontecerá, seja

qual for o personagem principal. O que as empresas mais antenadas devem ter em mente agora é como se posicionar para se destacarem no futuro. Nossa aposta é a criação de sua própria rede para terem seus consumidores junto de si. A estratégia é construir esse quadro pincelada a pincelada: primeiro, entre nas redes existentes, se relacione e vire referência em seu segmento (efeito Bombril); e, logo em seguida, seja ousado: crie a sua rede.” O QUE VAI ESTIMULAR O USUÁRIO?

No livro Conectado (www.naozero.com.br/conectado) , Juliano Spyer cita um artigo do professor Peter Kollock, onde ele analisa os principais “estímulos que levam as pessoas a participarem de comunidades a curto ou longo prazo: reciprocidade, prestígio, incentivos social e moral”. Com as constantes transformações ocorridas no meio internet, a dúvida que surge é se esses estímulos citados por Kollock vão continuar a perpetuar o desejo dos usuários na utilização de ambientes colaborativos e quais possíveis motivações poderão surgir em novos cenários. “Esses estímulos são básicos do ser humano e antecedem a web. Eles fazem parte das redes sociais que sempre existiram, aquelas que nos unem à nossa família e amigos. Entretanto, com as redes sociais de grande escala com as quais lidamos hoje em dia, enxergo também a existência de outros estímulos, como segurança e cooperação. As pessoas tendem a buscar nas redes sociais um local seguro onde podem encontrar informações, pedir ajuda, enfim, encontrar uma resposta. O mesmo para a cooperação. As pessoas podem ir às redes sociais em busca de pessoas que não existem em seu círculo de conhecidos, porém necessárias para trabalhar de forma cooperada em busca de um objetivo comum. As únicas questões, como aponta Bauman, em seu livro ‘Comunidade’, é equilibrar segurança e liberdade / comunidade e individualidade. O convívio em rede pode afetar a balança de nossas vidas”, alerta Andre. “A minha percepção, a partir de minhas pesquisas, é que existe uma tendência em traduzir aquilo que existe no mundo off-line para o on-line. Assim, concordo com o Juliano, acho que esses estímulos permanecem presentes pelo simples fato de estarmos trabalhando com pessoas. Claro que, no universo do espaço virtual, também podem surgir novas formas de construir esses valores, novas percepções e novas formas de ‘usar’ esses interesses pelas pessoas. Penso muito em termos dos valores construídos coletivamente, que a rede facilita e permite que as pessoas apropriem e expressem de forma diferente. Essa é a parte mais interessante e pontual da estratégia em mídias sociais: aprender essas idiossincrasias da apropriação dessas ferramentas pelos diferentes grupos sociais. Os valores são quase sempre os mesmos, mas aparecem de formas diferentes nos diferentes ambientes”, acrescenta Raquel.

Não tenho dúvidas de que esse objetivo de tomar conta da rede é um desejo do Facebook, da Microsoft, do Yahoo! e do Google Hélio Basso MENSURANDO OS RESULTADOS

Em um dos capítulos do livro “Redes sociais na internet”, Raquel Recuero descreve os elementos contidos nestes ambientes pela web. Dentre eles, ela destaca o conceito de capital social, que pode ser entendido como “um valor constituído a partir das interações entre os atores sociais”, e que tem servido como um dado importante no uso das redes. Em maio de 2009, o IAB (Interactive Advertising Bureau) lançou um documento no qual indica parâmetros para quem precisa mensurar resultados de projetos em mídias sociais (http://tinyurl. com/capa-76-3). Pela importância desta prática no monitoramento de ações on-line e na elaboração de justificativas que apóiem os investimentos realizados, a busca por fatores confiáveis de medição serão cada vez mais requisitados. “O empirismo, ou seja, fazer as coisas no chute, está com seus dias contados. As métricas que temos hoje, como o número de seguidores no Twitter, não dizem nada em termos de comunicação. Precisamos criar métricas primeiro, ‘indisciplinares’, ou seja, não pensar apenas na questão tecnológica ou estatística. Medir as redes sociais envolve a integração de conhecimentos de áreas como biologia, psicologia, linguística, comunicação, sociologia, apenas para ficar nos principais. O estudo e a articulação das pesquisas dessas áreas nos farão chegar a indicadores que realmente mostrem o quanto e como uma marca está exposta nas redes sociais e o que se fala sobre ela. Além disso, é preciso integrar metodologias. O que vejo hoje são empresas que medem o mundo digital e outras que mudam o mundo off-line sendo que, o que interessa para uma empresa, é como a sua marca é exposta como um todo e como essa exposição trafega do digital para o analógico e de uma mídia para outra”, afirma Andre. Só para se ter uma ideia da necessidade de novos modelos de mensuração, Hélio cita alguns exemplos que já ocorrem atualmente. “Muitas das métricas aplicadas hoje às mídias tradicionais simplesmente não se aplicam quando falamos de mídias sociais. 76 > 04/10 | webdesign |

CAPA

Não existe page view nem bounce rate para Orkut. Ou melhor, até existe, mas o Google Analytics não consegue medir. Mesmo KPIs ‘tradicionais’ para o marketing digital já se confundem no ambiente das redes sociais. Cliques não são mais apenas um número absoluto. Este cenário impõe aos profissionais de mídias sociais muita atenção: ao montar um relatório, em um futuro próximo, teremos índices com buzz negativo, positivo, neutro ou mix; qualidade de alfas (formadores de opinião), penetração para engajamento e sentimento, entre outros dados que serão muito relevantes para a tomada de decisão em campanhas. Da mesma maneira, assim como temos Google Analytics, teremos outras ferramentas, bem mais completas, voltadas para mídias sociais, facilitando em muito a gestão de relacionamento e do monitoramente de marcas.” Já Tarcízio faz questão de trazer para o debate a dinâmica de avaliação existente no mercado de televisão. “Um anúncio X em um programa Y exibido em horário Z, em tese, alcançaria um número tal de pessoas. Mas televisão é um meio que, em boa parte dos domicílios, permanece ligada a maior parte do dia enquanto seus espectadores realizam outras ações. Aquele número tal não significa de fato quem vai prestar atenção ao anúncio, por exemplo. A avaliação do ROI um pouco depois ou de lembrança de marca pode avaliar o impacto do tal anúncio de uma forma mais elaborada. Hoje em dia, na internet, ao contrário do que muitos dizem, é possível avaliar ROI, lembrança de marca e outros dados mais interessantes. Mas não acho que as métricas na web devem ser padronizadas totalmente. Devem existir documentos, métodos e terminologias mais sólidas, mas como base para se construir avaliações mais direcionadas aos objetivos de cada comunicação. Por exemplo, em relação ao valor do capital social que Recuero identifica como potencializados pelos sites de redes sociais, temos: visibilidade, popularidade, reputação e autoridade. O que é mais importante para um perfil Twitter de uma loja varejo? Ou o que é mais importante para meu perfil, utilizado para gerar negócios para minha agência? A internet permite que um número muito maior de dados sejam coletados, mas, por outro lado, esse gigantismo de dados pode acabar por diluir a mensuração ou confundir. O que deve acontecer, idealmente, é uma avaliação mais qualitativa das pessoas que acessam, disseminam e interagem com as mensagens de uma comunicação.” O PERFIL DO PROFISSIONAL

No artigo “Cuidado com os especialistas em mídia sociais” (http:// tinyurl.com/capa-76-4), Andre de Abreu apresenta uma abordagem

crítica sobre o meio e ressalta que, “na esteira desse movimento, surgiram nos últimos meses dezenas de empresas e consultores ‘especialistas’ em redes sociais. Entretanto, o que se tem visto até o momento são ações e conselhos baseados no achismo ou no ‘feeling.”

| webdesign | 76 > 04/10

Pensando nisso, algumas características serão essenciais para que um profissional possa trabalhar em projetos envolvendo mídias sociais. “Penso que o essencial é um espírito crítico e um conhecimento profundo das práticas que emergem o tempo todo nesse campo. Cada ferramenta começa a ser utilizada de um modo, mas, com o tempo, a apropriação vai modificando um pouco essas práticas e novos métodos vão emergir. Essa vivência é que qualifica o pensar das estratégias para esse tipo de mídia. Claro, conhecimentos técnicos, do público e dos usos também ajudam”, diz Raquel. Sobre os perfis desejados, Andre aponta a existência de alguns mais propensos a trabalharem na área. “Aquilo que se aprende num curso de comunicação certamente irá ajudar mais nas tarefas diárias do que aquilo que se aprende num curso de física. De todo modo, até nisso as redes sociais são democráticas, pois vale mais o autodidatismo e a experiência. Por isso, vejo muita gente trabalhando de graça (ou quase isso) para conseguir montar seu portfólio de experiência, claro, não na proporção que o mercado exige. E também considero que ocorrerá esse movimento natural. Quem faz marketing hoje já pensa em como fazer marketing para as redes sociais. O mesmo vale para outras carreiras, que acabarão incorporando as redes sociais assim como elas capturaram as pessoas para si.” Diante dos fatos apresentados neste especial, nossa esperança é que eles possam ajudá-los na compreensão dos fatores que vão construir o futuro das mídias sociais pela internet. Aproveite os pensamentos por aqui expostos e comece a discuti-los com as pessoas que fazem parte de seu círculo social e profissional. Certamente, você estará contribuindo para a construção e o exercício do conhecimento coletivo e também para a evolução de sua carreira.

Atualize sua biblioteca Para quem procura por boas dicas de livros que ajudem a compreender melhor as transformações ocorridas, Andre de Abreu compartilha suas indicações: > Communication Power Autor: Manuel Castells “O livro mais recente do autor da trilogia ‘A Era da Informação’ é um estudo extenso e aprofundando de como se dão as relações de poder na atual sociedade conectada e qual o papel da comunicação neste fenômeno.”

Smartphones, games, ipads, netbooks, TVs e rádios digitais serão apenas os meios para consumirmos coletivamente Hélio Basso

> Cultura da Convergência Autor: Henry Jenkins “Uma leitura introdutória que contextualiza o momento pelo qual a sociedade está passando atualmente e como é possível fazer as pontes com o dia a dia da comunicação em rede sociais, observando como as pessoas e as relações humanas estão mudando.” > Evolution in Four Dimensions Autores: Eva Jablonka e Marion J. Lamb “É um livro de biologia, porém voltado para o público nãobiólogo. Nele, o leitor terá acesso às mais recentes teorias da evolução e do comportamento humano. Uma das dimensões a qual se refere o título do livro é a simbólica e a mais importante para quem estuda redes sociais. Nesta obra, é possível entender como modismos, como a questão do ‘meme’ e sua transmissão, não têm fundamento científico algum.” > Grown Up Digital Autor: Don Tapscott “Conheça um pouco dos clientes e público-alvo que iremos atender daqui a cinco ou dez anos.” > Here Comes Everybody Autor: Clay Shirky “Uma série de exemplos e cases que demonstram o poder que as redes sociais podem dar às pessoas de se organizarem sem precisarem de uma organização oficial e tradicional como o governo, a escola etc.”

76 > 04/10 | webdesign |

OPINIÃO

Colhendo os frutos profissionais No mercado digital brasileiro, é muito comum os profissionais criativos fazerem frilas. Os objetivos podem ser os mais diversos: complementar o orçamento mensal, desenvolver projetos empreendedores ou ainda experimentar e estudar novos conceitos e tecnologias. Em determinado ponto desta caminhada, surge a necessidade de se avaliar os rumos da carreira: o profissional almeja alcançar o topo da estrutura de sua agência, sendo promovido a diretor de criação; ou pretende acumular experiência em diversos locais para que possa lançar sua própria empresa? Diante destes questionamentos, convocamos alguns criativos brasileiros para analisarem as seguintes situações: como conciliar o trabalho em agência e de projetos frilas, sem prejudicar a qualidade do processo de criação? E quando o profissional deve avaliar se vale a pena ser um empreendedor dentro da própria agência em que se encontra ou lançar o seu próprio empreendimento? 44

| webdesign | 76 > 04/10

Caio Fernando Diretor de arte na Wunderman www.foka.art.br

“Não acredito que o frila atrapalhe o processo criativo dentro da agência. Pelo contrário. Quanto mais repertório, mais experiências; melhor interpretação de novos briefings, resultados mais consistentes.

Frilas aparecem como uma grana bacana e projetos que fazem a diferença no portfólio. Pode ser a chance de veicular algo diferente, colocar seu talento na rua. EXISTEM ALGUNS REQUISITOS QUE NÃO PODEM SER ESQUECIDOS AO ACEITAR UM FRILA:

• Nunca aceite um trabalho ‘por fora’ de um cliente da agência que você trabalha; • Estabeleça um deadline, considerando alterações e refações. Assim você não fica maluco com seu trabalho da agência; e o cliente do frila, desesperado; • Se o projeto for grande, divida a responsabilidade com redatores, programadores e arquitetos de informação; • Frila é em casa, no café, na faculdade. Nunca na agência que você trabalha. Nem aquela ‘alteraçãozinha’; • Fique atento ao seu contrato de trabalho. Não transforme o frila em uma demissão. Sobre a segunda pergunta: no mercado de hoje, as principais agências estão em grandes holdings que atendem clientes globais. Acredito que o ideal é investir em uma carreira dentro de um desses grupos. Existe possibilidade de migrar para outras agências do grupo, atender as mesmas contas em regiões e culturas diferentes. Já para quem quer ter o próprio negócio, acho que para ter um espacinho no meio das gigantes tem que ser despretensioso e oferecer um serviço diferente das agências. Trabalhei na ID\TBWA e agora estou na Wunderman. Ambas fazem parte de holdings e me proporcionaram trabalhar e atuar em projetos globais para Pedigree, Visa, Johnnie Walker e Microsoft, o que faz toda a diferença no histórico do profissional. Mas também é muito bacana trabalhar em um lugar pequeno, com pessoas talentosas, que amam e abraçam cada job que conquistam.” 76 > 04/10 | webdesign |

OPINIÃO

João Passini Diretor de criação on-line da Escritório Digital www.escritoriodigital.net

“Para conciliar a vida profissional com a de frilas, é necessário ter, além de maturidade profissional, muita transparência com seus clientes - avisá-los sobre sua disponibilidade de horários é uma das premissas. Sempre é bom se organizar, estipular prazos e certas regras, se autoeducando, seguindo uma disciplina para cumprir, com responsabilidade, as duas distintas jornadas.

Haverá dias em que entregas, bugs, reuniões ou, até mesmo, simples dúvidas de seus clientes vão tirar seu foco do trabalho diário. O jeito é contar com um bom plano B e, muitas vezes, até um plano C, para atender seu cliente e ao mesmo tempo não prejudicar o desempenho no trabalho. Geralmente, esses planos envolvem varar a noite e incluir camaradas confiáveis para desafogar os projetos. Se a agência em que você trabalha te der oportunidade de trazer jobs ou clientes de fora com participação negociada no lucro (afinal, ninguém entrega o ouro de graça!), considerar a possibilidade pode ser uma ótima ideia. Você acaba dividindo tarefas com os demais departamentos da empresa, podendo assumir até trabalhos mais ousados e aprendendo com o processo. Enfim, se você se sente preparado para dar voos mais altos, siga o seu sonho, se dedique e agarre as oportunidades que aparecerem. Mas lembre-se: quando se resolve abrir um negócio próprio, deve-se assumir que o sucesso depende única e exclusivamente de você e que o gerenciamento de crises agora está em suas mãos. Todo bônus tem seu ônus ou tudo seriam flores!”

| webdesign | 76 > 04/10

Fabiano Abreu Publicitário e diretor de planejamento da agência brasiliense fullDesign www.fulldesign.com.br

“Antes de fazer qualquer frila, o profissional deve estabelecer seus objetivos dentro da profissão. Os jobs devem ser aceitos sob um prisma técnico e criativo, focando sempre a evolução. O conhecimento adquirido deve ser integrado ao trabalho fixo. Se for realizar o frila apenas por dinheiro, profissionalmente pode custar muito caro no futuro. Para tornar-se um empreendedor, é preciso muito mais que conhecimento técnico. O profissional não pode ficar apenas na parte operacional do negócio. Tem que dedicar-se à parte estratégica e para isso precisa pesquisar o mercado de forma aprofundada e acompanhar a evolução do segmento. Como um bom profissional, um bom empreendedor sabe aonde quer chegar. Ele não pode se dar ao luxo de ficar à deriva, deixar o negócio ser levado pela corrente. Um bom plano de negócio é fundamental. Se o profissional tiver maturidade para compreender todas as premissas do plano, é sinal que é hora de começar o seu próprio negócio.”

Os jobs devem ser aceitos sob um prisma técnico e criativo, focando sempre a evolução

76 > 04/10 | webdesign |

OPINIÃO

Marcos Loureiro Coordenador do núcleo digital da Aliás Comunicação e designer gráfico freelancer www.marcosloureiro.com

“Conciliar bons trabalhos dentro das agências com projetos frilas exige do profissional flexibilidade extra nos horários de trabalho, desenvolvimento de uma identidade visual capaz de ser replicada e atenção redobrada aos prazos dos projetos, para não atravessar seus compromissos. No meu caso, ‘produtifico’ serviços e coordeno equipes de suporte para cada um deles, de forma a não gastar muito tempo no processo diretamente envolvido em questões como programação e corte HMTL, que não são minhas especialidades. Encontrei assim soluções compatíveis ao meu pouco espaço fora da agência e me diversifiquei, podendo atender a cada expectativa com eficiência. Algumas pessoas me perguntam se tenho interesse em montar um negócio próprio para ter mais tempo com meus clientes e me dedicar inteiramente a eles. Avaliar essa mudança profissional é sempre uma dificuldade porque gosto da segurança que o emprego ainda dá, mas também não digo que isso nunca acontecerá, depende muito do fluxo que meus trabalhos irão tomar daqui para frente. Já passei por propostas de sociedade com participação nos lucros em produtoras web, não me adaptei e nem por isso digo que nunca mais aceitarei outra proposta semelhante. Nesse caso, não encontro uma fórmula que eu possa indicar com precisão, mas gosto muito do meu modelo de negócio atual:

Trabalho em uma agência (www.alias.com. br) que confia no meu trabalho e me dá total liberdade criativa, assim como apoia o meu desenvolvimento como freelancer. A gestão de resultados me deu a possibilidade de explorar novos mercados, inclusive, em alguns momentos, trazendo novos projetos para a própria agência e assim somos até hoje.”

| webdesign | 76 > 04/10

76 > 04/10 | webdesign |

REPORTAGEM

ELEIÇÕES 2010

YES WE CAN Cinquenta anos em cinco. Esta foi a frase que marcou o período de governo do mineiro Juscelino Kubitschek como presidente da república. O objetivo era fazer com que o Brasil apresentasse altos índices de desenvolvimento em diversas áreas de infraestrutura e indústria, por exemplo, em um curto espaço de tempo. 50

| webdesign | 76 > 04/10

assados mais de 50 anos, outro político também deixaria seu nome gravado nas páginas da história. Só que desta vez o exemplo vem de terras norte-americanas e de ações focadas no mundo digital. Estamos falando de Barack Obama e os resultados positivos e inovadores de sua campanha presidencial, que contou com uma ótima estratégia digital. Para se ter uma ideia dos números obtidos, segundo dados exibidos pelo documentário “Obama Digital” (http:// vimeo.com/7870206) , preparado por alunos da Universidade Presbiteriana Mackenzie, a campanha conseguiu atrair mais de dois milhões de seguidores no Twitter - atualmente, já são mais de três -, a postagem de 1.800 vídeos no YouTube, que geraram mais de 200 milhões de visualizações, e mais de 500 grupos de discussão criados no Facebook. Além disso, 67% do montante arrecadado em contribuições vieram através da internet. Levando-se em consideração a realidade brasileira, o que podemos esperar para as próximas eleições, em termos de campanhas políticas digitais? “Acredito que a comunicação digital nas eleições estará em pauta como ‘nunca antes na história desse país’. O sucesso do case Obama abriu as portas para a apropriação da linguagem digital pelas campanhas políticas, como já aconteceu em outros momentos da história desse tipo de propaganda. O próprio conceito de ‘marqueteiro’, quando surgiu, carregava consigo a ideia de trazer para uma candidatura conceitos próprios da publicidade, da iniciativa privada, do marketing das grandes empresas, do branding. Acho que existem duas grandes revoluções no modo de fazer a divulgação política no Brasil a partir da redemocratização: primeiro, a massificação gerada pelos grandes veículos, pela propaganda em TV aberta, que ficou muito marcada nas eleições de 1989. É a era da ‘TV palanque’. As campanhas seguintes, de FHC e Lula, já traziam um DNA de marketing muito forte. É a fase do ‘candidato produto’. A partir de 2010, talvez possamos pensar já no ‘candidato web’, que será aquele que conseguir usar a web para ouvir. Internet não combina com monólogo. Então, acho que teremos muitos candidatos utilizando as ferramentas digitais, sim, mas de um jeito errado, fazendo do seu site um burocrático ‘santinho’ on-line, por exemplo”, analisa Gabriel Besnos, sócio-diretor da Bistrô (www.sitedabistro.com). Como reforça Daniel Diniz, diretor de negócios da Agência Nitrato (www.nitrato.com.br), tudo vai depender da forma como serão planejadas as estratégias de comunicação e marketing dos políticos. “As ferramentas digitais serão utilizadas em escala muito superior se compararmos aos últimos anos. Existe uma grande parcela de candidatos se manifestando via blog, Twitter e redes sociais. Contudo, eles não estão tirando proveito do meio virtual como

Um candidato é uma marca a ser vendida Gabriel Besnos

Obama fez, pois usam a internet como um meio de comunicação de via única, não abrindo muitas possibilidades de interação e participação popular. A internet é um veículo sem igual, mas derramar milhares de spams e comprar alguns canais não é suficiente para se posicionar de forma diferenciada com a internet. Você precisa convidar, dialogar com eleitor, pois dessa forma ele se torna um agente propulsor na captação de novos eleitores. Pode até haver um uso massivo, mas de forma demasiada e sem planejamento.” Outro ponto a ser analisado, como destaca Fernando Gustavo, sócio-diretor da I-Bizz Mídia e Tecnologia (www.i-bizz.com), são as particularidades que envolviam a campanha de Obama e como elas ajudaram a disseminar sua campanha. “Acredito que os candidatos façam uso intensivo das ferramentas digitais e sociais. No entanto, questiono o poder de articulação destes junto ao cenário digital. Obama representava uma chance de mudança, uma quebra de paradigmas, abriu um real (pelo menos assim percebido) canal de comunicação. Não sei se nossos principais candidatos (Serra e Dilma) têm este perfil, interesse e, muito menos, o carisma necessário. Basta fazer uma breve comparação entre os resultados obtidos no projeto do Lula candidato 2002 e 2006. Na campanha de 2002 (realizada pela minha empresa), apesar de não existir redes sociais e suas ferramentas, havia um movimento, uma corrente e a energia da mudança. Mais de dois milhões de usuários recebiam e participavam ativamente do site e da campanha (isto num universo menor de 10 milhões de usuários, sendo atualmente de mais de 60 milhões).” O QUE VAI (E PODE SER) UTILIZADO?

Ainda sobre a campanha de Obama, no livro “Eleições 2.0: a internet e as mídias sociais no processo eleitoral”, Antonio Graeff ressalta que, além de possuir um site de campanha adequado e eficaz, a estratégia digital foi além ao investir cerca de 16 milhões de dólares em publicidade on-line e criar e administrar perfis em mais de 15 redes sociais. Diante disso, abre-se um variado cardápio envolvendo formatos de campanhas e ferramentas digitais para ajudar na divulgação 76 > 04/10 | webdesign |

REPORTAGEM

dos candidatos brasileiros nas próximas eleições. Além delas, podemos esperar algum tipo de “e-novidades”? “Podemos notar que o Twitter e a rede NING têm sido amplamente utilizados pelos candidatos. Não acredito que teremos ‘e-novidades’. As campanhas este ano ainda seguirão um modelo muito apoiado nas mídias tradicionais, talvez com alguns diferenciais de vídeos se tornando virais, como ocorreu na campanha para prefeito em BH, com a participação do Tom Cavalcante, mas não vi nada que gerasse relacionamento muito coeso e troca de informações diretas entre candidato e eleitor. Além disso, o eleitorado brasileiro não tem o perfil participativo do eleitorado americano. Sinto que as campanhas políticas no Brasil são como aquelas propaganda de 30 segundos da TV: você levanta para ir ao banheiro e volta quando o programa começa de novo; não existe conexão entre todos os envolvidos. Talvez isso seja explicado pela imagem da política no Brasil”, afirma Daniel. “O ponto determinante para uma boa ação digital é motivar os usuários a interagirem com a mensagem, comentando e espalhando a informação. As redes sociais - Blog, Facebook, Twitter, Orkut, Flickr, Slide Share etc. - já são muito utilizadas pelos políticos no Brasil. Talvez as grandes novidades nas próximas eleições sejam as tentativas de marketing viral através do YouTube”, complementam Rodrigo Fontoura e Noelton Costa, gerente de projetos e assessor de comunicação, respectivamente da Ondaweb (www. ondaweb.com.br).

De todas as opções disponíveis, o Twitter deve se tornar um dos destaques (ver box ao lado). “É uma aposta válida, sobretudo pela possibilidade de recolher informações e percepções do público, e não apenas propagá-las. Participar de diferentes redes sociais só me parece interessante se o candidato tiver discurso para essas redes. Não adianta ter um perfil em uma comunidade on-line de ambientalistas e apresentar uma plataforma para produtores rurais. É preciso especializar e focalizar o discurso, ouvir e dar respostas ao que está sendo dito - o que é um trabalho minucioso, desgastante... e caro. Também não basta ter presença no mundo on-line, é preciso ter relevância. Diante disso, me parece que terão sucesso as iniciativas que propuserem relacionamento real, com pessoalidade, informalidade, escuta, diálogo. Ferramentas na web não faltam”, diz Gabriel.

| webdesign | 76 > 04/10

Políticos no Twitter Você sabia que, atualmente, 238 deputados federais, 65 vereadores, 32 senadores, 32 deputados estaduais, 11 prefeitos e três governadores estão utilizando o Twitter? As informações são do agregador de conteúdo Politweets (www.politweets.com. br), projeto criado recentemente pela empresa pernambucana EZTIVA (www.eztiva.com). É uma boa pedida para quem precisa analisar a atuação dos políticos brasileiros pela web. Outro ponto interessante é a funcionalidade Twitteleição, que estimula os usuários a escolherem o candidato preferido na corrida presidencial.

76 > 04/10 | webdesign |

REPORTAGEM

OS DOIS LADOS DA MOEDA

Mobilização e engajamento. Essas duas palavras expressam bem a importância do uso das mídias sociais na campanha de Obama. Em terras digitais brasileiras, por apresentar um mercado ainda em evolução, é preciso alertar os candidatos sobre as vantagens e os riscos de se investir na área. Segundo Gabriel, elas partem do mesmo ponto: a pulverização do discurso. “Ou seja, ao mesmo tempo em que é preciso pulverizar, especializar o discurso para se relacionar com os diferentes públicos, corre-se o risco de perder a unidade, que é um elemento importante em qualquer estratégia de branding. E um candidato é uma marca a ser vendida. A estratégia tem que ser bem feita, estar bem alinhada e, principalmente, tem que estar alicerçada no próprio candidato. O Twitter, por exemplo, tem que ser importante para o candidato para que ele seja importante na rede. Não acho que isso se construa artificialmente pelos estrategistas de uma campanha política.” “A grande vantagem é a rapidez de propagação da mensagem, além de uma audiência mensurável. Outro ponto é o conteúdo gerado pela internet, que tem uma persuasão maior do que as de outras mídias, já que é gerado pelo próprio usuário. Além disso, a multiplicação de conteúdo referente aos candidatos melhora sua posição nos motores de busca. Já o risco das redes sociais é causar uma má impressão aos eleitores. Agir nelas é como estar frente a frente com o usuário, que esperam conteúdo legítimo, autêntico e que expresse o sentimento do candidato. Textos com apelo de marketing comum não serão bem vistos pelos internautas. O usuário de internet é muito segmentado, o que exige um cuidado especial na comunicação, que deve ter diferentes linguagens, dependendo do meio. Uma saída é focar a ação nos formadores de opinião”, argumentam Rodrigo e Noelton. Uma questão fundamental que não podemos deixar de citar envolve a trajetória de alguns políticos. “Quem não tem um passado legal vai ter que se explicar muito. A rede social on-line é um canal de muito para muitos, por isso você se escancara para a sociedade. Outro risco é não possuir uma equipe profissional para gestão da campanha de relacionamento on-line, pois mesmo se o candidato seja uma pessoa idônea, o oponente pode usar as redes para propagar informações negativas. Nesse momento, é necessário um trabalho de esclarecimento e fortalecimento de imagem”, orienta Daniel.

| webdesign | 76 > 04/10

Não adianta ter um perfil em uma comunidade on-line de ambientalistas e apresentar uma plataforma para produtores rurais Gabriel Besnos

ESTEJA PREPARADO

Para quem está disposto a atender este nicho de mercado, Rodrigo e Noelton revelam uma boa notícia: agências de diferentes portes podem atuar nesse segmento. “O mais importante é ter um bom conhecimento de marketing político, para que as estratégias digitais funcionem, atendam o objetivo proposto e justifiquem o investimento aplicado. Investir na estrutura da agência sempre é positivo, não só para atender a demanda destas eleições, mas para elevar a qualidade dos projetos on-line no Brasil.” Outra dica é preparar estratégias para um tipo de cliente que ainda está formando seu conhecimento sobre o valor do investimento em projetos digitais. “As agências digitais e os profissionais precisam pensar que o seu cliente está em formação. Ou seja: não basta vender ação no formspring, é preciso dar um passinho atrás e vender o próprio formspring. É preciso conhecer o que está sendo produzido na área. É preciso entender que está se vendendo resultado em termos numéricos (audiência) e também conhecimento. Na hora de montar os portfólios para prospecção, é importante as agências e os freelancers se darem conta disso”, orienta Gabriel. “As campanhas são verdadeiros campos de batalhas. Uma agência ou um freelancer que decidir trabalhar com este segmento deve estar consciente de sua dedicação integral, de toda sua energia e tempo para este trabalho. Por isso, meça bem a relação custo versus benefício das mesmas”, acrescenta Fernando. E aí, pronto para o jogo? Aproveite e utilize os conhecimentos por aqui compartilhados para garantir a construção de boas estratégias.

YES WE CAN TO!

REPORTAGEM

Sérgio Rosa Formado em jornalismo e trabalha com pesquisas em internet na Mapa Digital (www.mapadigital.net) desde 2008. Atualmente integra o conselho editorial do Overmundo. O seu interesse pela internet e todos os impactos gerados por ela surgiu quando ouviu pela primeira vez o barulho de uma conexão dial up.

OS POLÍTICOS BRASILEIROS E AS REDES SOCIAIS “Seria impossível imaginar que você vai controlar a internet. A internet é uma coisa que fugiu ao controle de seu criador”. Foi assim que o presidente da república resumiu o debate recente sobre regras de campanha política na internet.

A PESQUISA

A pesquisa “Os políticos brasileiros e as redes sociais” (http://tinyurl. com/76-especial-artigo) buscou mapear e identificar a presença e

a estratégia adotada pelos principais nomes do cenário político nacional na web. O estudo complementar, realizado em seguida, focou na atuação dos partidos na web. PARA AVALIAR A QUALIDADE DESSA ATUAÇÃO, FORAM ESPECIFICADOS CINCO CRITÉRIOS DE ANÁLISE: PRESENÇA: Em quais redes está presente? ATUALIZAÇÃO: Com que frequência o canal é atualizado? INTERAÇÃO: Há comunicação direta com o público? CONECTIVIDADE: Há diálogo e relação entre os canais? PERSONALIZAÇÃO: O conteúdo é quente?

Essa “coisa”, a internet, ganha, com o acirramento do clima de campanha eleitoral para as eleições de 2010, um papel cada vez mais importante e decisivo na mediação de informações entre políticos e eleitores, entre a sociedade e o governo. A presença dos políticos nos meios de comunicação, em condição de pré-candidatos ou não, não apenas é cada vez maior como também é marcada pela busca de comunicação direta com o público. O papel da web no processo eleitoral brasileiro foi alvo de discussão recente na esfera política. Entre propostas cegas e distorcidas, salvou-se a constatação de que a internet veio, sem dúvida, para mudar positivamente o cenário da campanha política nacional. Alguns números traduzem o impacto desses canais de comunicação entre a classe política. Apenas entre os deputados federais, o uso do Twitter aumentou 142% entre junho e outubro de 2009. Atualmente, mais de 35% do total de deputados conta com perfil oficial na ferramenta. De acordo com a própria Agência Câmara, responsável pelo levantamento, esse é um resultado direto da aprovação das novas regras que liberaram o uso da internet para campanha política. Dessa forma, constata-se que entre bem-sucedidos blogs da Petrobras e fracassados #forasarneys, a web é - bem ou mal - uma nova arena de debate político.

| webdesign | 76 > 04/10

Esses critérios têm o objetivo de identificar usos realmente diferenciados das redes sociais. Eles foram definidos a partir das principais qualidades e características marcantes da web (valendo-se aqui sempre de que se essas caracteríticas não são inauguradas pela web, são por ela potencializadas). Os partidos e os políticos que melhor se posicionam na web são aqueles que atendem o maior número de critérios. Em ambos os estudos, o principal ponto identificado foi: políticos e partidos estão interessados em ocupar os espaços na rede, porém a atuação, na maior parte dos casos, acontece de forma descoordenada e dispersa. Acompanhando a expansão entre os usuários brasileiros, o Twitter é, de longe, o canal mais utilizado para o contato com o eleitorado. Em segundo lugar ficam os blogs e, ao contrário do que muitos podem esperar, o Orkut está entre as redes menos utilizadas pelos políticos e partidos. Esse é um primeiro reflexo a respeito do meio e características de público de cada rede. Embora diferentes e inúmeros estudos e pesquisas ainda busquem tatear o perfil dos usuários de cada uma das redes sociais, não há dúvidas que a média dos usuários do Twitter é mais engajada em assuntos políticos do que os milhões que acessam diariamente a rede mais popular do país.

A pergunta que fica é: o que ferramentas “2.0” podem fazer por políticos “1.0”? ONDE ESTÁ VOCÊ?

Para que servem os perfis fakes? Além de nos divertir, alguns deles carregam outro significado: queremos ver nossos representantes políticos nas redes. Queremos ver os seus comentários sobre política, sobre futebol, sobre o Brasil. Queremos ter a oportunidade de enviar mensagens diretas a ele, mesmo que em vão. A história tão recente, e ao mesmo tão intensa das mídias sociais, já nos mostrou que os espaços são sempre ocupados, de diferentes formas e objetivos, oficialmente ou não. E, sim, aqueles que chegam primeiro estão em vantagem. É VERDADE, O TWITTER NÃO SALVA NINGUÉM

Criar um perfil no Twitter pode servir para muitas coisas. Mas definitivamente ele não salvará a carreira de algum político e muito menos ganhará uma eleição. Ele pode, sim, tanto ajudar quanto prejudicar (e isso não é irrevogável). Porém, em uma era de avalanches diárias de informações e intermediários, ter um canal prático e direto com o seu público pode ser uma arma estratégica valiosa. Os descaminhos são diversos (e facilmente evitáveis): canais não atualizados, conteúdo frio e asséptico, redes desconexas, informações descontextualizadas. Mas o maior deles é, claro, o mais difícil de ser modificado: tentar aplicar a mentalidade e filosofia utilizada no relacionamento com as mídias tradicionais. A pergunta que fica é: o que ferramentas “2.0” podem fazer por políticos “1.0”? Por fim, o que a pesquisa mostrou é que poucos fazem isso de forma correta, enquanto outros estão aprendendo, e a maior parte não dá à mínima. Para além da fase inicial de deslumbramento com as mídias sociais, quais questões devem ser levantadas? Sugiro algumas: quais mudanças reais as mídias sociais engendram para a democracia? Todos os políticos estão preparados ou deveriam fazer parte delas? Como evitar que elas sejam utilizadas para repetir o enfadonho discurso do marketing político tradicional? Esses são levantamentos iniciais, mas fundamentais para quem leva o assunto a sério.

76 > 04/10 | webdesign |

ESTUDO DE CASO

Os desejos dos webdesigners Um divertido jogo on-line onde você deve atender os desejos de uma exigente equipe durante o ano inteiro. Sejam bemvindos ao Webdesigners Wishes (www.webdesignerswishes. com), projeto mais recente lançado pela agência Mkt Virtual (www.mktvirtual.com.br).

Tecnologias: Blender + CakePHP + Flash + jQuery + Unity3D

| webdesign | 76 > 04/10

Para conhecermos mais detalhes sobre sua criação e desenvolvimento, conversamos com parte da equipe envolvida neste trabalho: Ludmilla Rossi (diretora de criação), Gabriel Caires (desenvolvedor Flash) e André Reis (modelagem 3D). Confira, a seguir, o que eles têm a nos revelar. WD Como surgiu a ideia de lançar um trabalho envolvendo a própria

marca da agência? LUDMILLA Anualmente, entre novembro e dezembro, lançamos

algum projeto próprio, geralmente relacionado ao Natal ou Festas. Ano passado foi o “Papai Noel se fode, mas se diverte” (www. noelsefodemassediverte.com.br), ação baseada no YouTube. Este ano, a ideia nasceu por desejarmos experimentar a tecnologia Unity3D, unir isso ao desenvolvimento de algumas técnicas de jogo e contextualizar tudo isso com alguma mensagem positiva. O objetivo foi brincar com o cenário atual de recursos humanos do nosso mercado. As agências web estão cada vez mais atrás de profissionais talentosos e experientes, porém precisam avaliar constantemente se oferecem condições para a retenção destes profissionais, o que explica uma rotatividade imensa na nossa área, sendo muito prejudicial para a empresa/profissional em alguns momentos. Um exemplo simples em referência à pesquisa que fizemos destes desejos dos webdesigners: mais tempo, férias, mais prazos, tempo para estudar etc. É claro que a gente tentou colocar tudo como uma grande brincadeira, mas acho que o jogo tem uma mensagem bem positiva. Nosso mercado é “novo”, estamos fazendo parte da fundação dele. O que as agências web estão oferecendo para estes profissionais? Noites viradas ou qualidade de vida? Possibilidade de crescimento do conhecimento intelectual ou crescimento unicamente financeiro? Amor pelo trabalho ou emprego da moda? WD Além dos conhecimentos e dos profissionais habitualmente envolvidos na criação e no desenvolvimento de sites e ações on-line, houve a necessidade de se recorrer a algum perfil/conhecimento específico na hora de criar este game on-line? LUDMILLA A ideia do nosso projeto de final de ano sempre é uma discussão imensa. Este ano, um dos nossos desenvolvedores sugeriu que priorizássemos a utilização de uma tecnologia com a qual não tivéssemos trabalhado ainda, apesar de ter essa vontade. E então optamos por usar o Unity3D, aprendendo durante o desenvolvimento (isso explica termos adotado um projeto próprio para esse aprendizado). Neste caso, para produzir o jogo em Unity3D, foi alocado um profissional de Flash, que demonstrou muita vontade de estudar essa nova ferramenta. Em relação aos gráficos do jogo, internamente temos a área de 3D que já produz complementos para alguns trabalhos, e esta acabou

sendo uma primeira oportunidade de trabalhar algo pensado em 3D para jogos, por exigirem um formato de modelagem diferente, muito otimizado - para que cada objeto tenha o menor número de polígonos possível. Mesmo o Unity3D sendo uma plataforma com extrema performance com 3D, foi necessário que nossos programadores absorvessem conceitos como “normais”, shaders, transformações em objetos 3D, sem falar na linguagem C# (que já tínhamos familiaridade, porém a plataforma tem suas particularidades) e na engine Unity3D em si. WD Para que o jogo funcione, o usuário deve instalar previamente

o plugin Unity Web Player (http://unity3d.com/webplayer/). Por que vocês decidiram utilizar esta tecnologia? E quais são as vantagens que ela apresenta quando falamos do desenvolvimento de jogos on-line? GABRIEL Esta tecnologia apresenta uma grande vantagem em relação ao Flash na manipulação de elementos 3D. Mesmo com a presença de luzes e sombras calculadas em tempo real, não há grandes perdas de performance. Além disso, o Unity3D é totalmente desenvolvido para este tipo de aplicação, apresentando diversos “facilitadores” que reduzem o tempo de produção do projeto. Um exemplo: enquanto no Flash teríamos que programar para um objeto 3D aparecer na tela, no Unity3D basta salvar o arquivo na pasta do projeto que ele automaticamente converte para o formato exigido e utilizado. Além da alta compressão dos arquivos quando exportado para web (o jogo completo, com 3D, texturas e áudios, tem no total 4.7 mega), acrescentado o fato de que nossa equipe ainda está estudando formas de deixá-lo mais leve. Hoje, o Unity3D, em seu pouco tempo de criação, já é considerado uma das cinco melhores ferramentas de criação de jogos, perdendo somente para ferramentas que são feitas para o desenvolvimento de jogos para consoles como XBox360 e Playstation 3, (Unreal Engine, CryEngine, Gamebryo Lightspeed). Destas, ela é a única capaz de produzir conteúdo para web e tem apresentado grande crescimento ano após ano. Lembrando que a licença básica é gratuita, existindo algumas limitações, mas é suficiente para serem produzidos bons jogos, despertando bastante interesse dos desenvolvedores. WD Além do plugin 3D, o ambiente on-line do jogo foi desenvolvido através do uso do Flash e da aplicação de jQuery. Quais são os facilitadores que estas tecnologias trazem para o funcionamento adequado e eficaz dos elementos propostos na etapa de design de interfaces? GABRIEL Essas duas tecnologias tiverem papéis de suporte ao jogo. Por um lado, o jQuery juntamente com outras bibliotecas em JS tiveram o papel de detectar a versão correta do Flash e se o usuário tem o plugin Unity3D instalado. Enquanto isso, o Flash é responsável por exibir, de uma forma clara e simples, todo tipo de orientação aos jogadores, como, por 76 > 04/10 | webdesign |

ESTUDO DE CASO

O cenário foi inspirado na cidade de Santos, de forma bem figurada com diversos prédios tortos na avenida da praia e o mar Ludmilla Rossi

exemplo, o link para baixar o plug-in, regras e controles do jogo. Para isso foi necessária uma forte integração entre eles, pois tanto o Flash como o Unity3D permitem acesso a métodos internos através de JS e o Javascript se tornou uma ponte entre as duas tecnologias. WD A usabilidade é um fator muito importante na criação de jogos

on-line, pois o usuário precisa ter uma curva de aprendizado rápida e simples para que possa se interessar pelo aplicativo, utilizá-lo e divulgá-lo. Que tipo de testes de usabilidade vocês realizaram para avaliar o nível de jogabilidade deste projeto? LUDMILLA Sim, talvez o fator mais importante. Usamos o termo “jogabilidade” para usabilidade em jogos, realizando testes com a nossa equipe, pedindo para todos jogarem e captando todas as opiniões e implementando. Inclusive, após o game ser lançado, continuamos estudando com jogadores mais próximos e ouvindo suas sugestões. Como é nosso primeiro projeto inteiramente focado em game design, nós temos bastante a aprender sobre a área. WD Uma questão importante no desenvolvimento envolve o uso de recursos sonoros que funcionem como uma ferramenta de orientação sobre o andamento e o uso de elementos do jogo. No Webdesigners Wishes, conforme o tempo de jogo passa, o aceleramento do ritmo musical indica uma fase crítica do game. De que maneira vocês procuraram conceber esta etapa do jogo? LUDMILLA O objetivo principal é aumentar a sensação de “pressão” ou desafio em cima do jogador, aumentando a imersão e passando a sensação para ele que, se não correr na reta final, vai se dar mal (não vai conseguir boa pontuação). Não tínhamos muitos recursos para a aplicação de uma produção musical complexa. Optamos por comprar uma trilha royalty-free (algo em torno de R$ 150) e captar os sons dos personagens na própria Mkt Virtual (com a galera da produção) para dar vida aos personagens. Para o usuário ter a percepção de urgência, usamos a música acelerada. E apenas um comentário: às vezes, quando um deadline kamikaze de projeto está chegando, nos sentimos assim, não é mesmo? Além da música, outros elementos foram usados, como as setas que aparecem na tela quando existem novos pedidos fora da visão

Pelo Twitter, criativos revelam outros desejos através da tag #webdesignerswishes

| webdesign | 76 > 04/10

do jogador, fazendo o usuário perceber que enquanto ele está atendendo um pedido, mais personagens precisam dele, estimulando assim o jogador a querer ser mais rápido. WD No decorrer do jogo, o usuário dispõe de outro elemento de orientação visual. Isso porque cada desejo que vai aparecendo nos respectivos balões dos webdesigners é representado por ícone. Quais foram os cuidados tomados no processo de criação desses ícones para que as imagens fossem rapidamente reconhecidas pelo jogador? LUDMILLA Nós tivemos o cuidado de que cada ícone fosse reconhecido sem nenhum uso de texto, algo “universal”. Ainda existiu o cuidado de separá-los em cores, para que mesmo que a pessoa não associe a alguma categoria, seja associada a cor ao tipo de pedido. WD O cenário e os personagens do jogo foram modelados em 3D. Do desenvolvimento conceitual dos personagens e cenários até o seu processo de implementação tecnológica, quais foram as principais etapas envolvidas na aplicação das técnicas 3D neste projeto? ANDRÉ Através de brainstorms, o visual dos personagens e o cenário surgiram. A aparência final dos personagens foi pensada para simplificar as animações e remeter ao Toy Art. O software open source Blender3D (http://www.blender.org/) foi utilizado durante todo o processo de modelagem e animação. Primeiro foi criado um protótipo do cenário e do personagem para testar o funcionamento do jogo, que depois foram substituídos pelos modelos finais. Como o Unity3D pode importar diretamente os arquivos no formato nativo do Blender, o fluxo de trabalho torna-se muito ágil, evitando conversões de um formato 3D para outro e facilitando a atualização dos modelos dentro do próprio Unity para logo serem visualizados em sua forma final. WD Em termos da criação da identidade visual dos personagens do

jogo, vocês já citaram um pouco da influência do conceito de Toy Art (http://pt.wikipedia.org/wiki/Toy_art). Pensando nisso, quais foram as outras influências envolvidas durante a etapa de pesquisa do processo criativo? Os funcionários da agência serviram como modelos na modelagem dos personagens? LUDMILLA Duas referências foram usadas para conceber o estilo dos personagens. Uma delas, as proporções do Munny (adorado por designers do mundo inteiro) e alguns jogos de Wii. A outra foi caracterizar alguns elementos e pessoas da Mkt Virtual. Mas não todas, pois o objetivo não era ser uma representação da nossa equipe, mas sim de uma agência web qualquer. O cenário foi inspirado na cidade de Santos, de forma bem figurada com diversos prédios tortos na avenida da praia e o mar. Para desenvolver as roupinhas e características dos personagens, o designer criou o visual dos personagens, que depois foi adaptado nos modelos 3D para tornarem-se animáveis.

Já no jogo procuramos trabalhar um cenário colorido em tons claros, bem como os personagens e suas roupas dentro de uma paleta mais pastel para que os “desejos solicitados” e o “cursor dos desejos” se sobressaíssem. WD Na apresentação das mensagens textuais do jogo, vocês escolheram uma família tipográfica sem serifa. De que maneira ela se relaciona com o objetivo conceitual do jogo e dos outros elementos visuais utilizados pelo ambiente? LUDMILLA Por serem textos curtos e de leitura rápida, escolhemos fontes sem serifas, menos formais para ornar com o restante do design. A mesma fonte é trabalhada em espessuras diferentes. O logo “Webdesigners Wishes” foi trabalhado com uma fonte pixel customizada e em tamanho exagerado. WD Diante do aumento da concorrência na web, os pequenos detalhes podem ser fundamentais na hora de diferenciar um projeto de outro. Segundo definição do Wikipédia (http://pt.wikipedia.org/wiki/ Favicon), além da visualização na barra do navegador, os favicons apresentam “também um teor de acessibilidade, pois ajudam um usuário comum a identificar uma página quando ela está exibida em uma lista ou em uma barra de abas”. Pela experiência da agência em diversos tipos de projetos, vocês conseguem enxergar esta função no uso deste elemento? LUDMILLA É um detalhe que facilita bastante a identificação de um site quando você tem milhares de tabs abertas, ou adiciona nos favoritos da barra do navegador, por exemplo. É um detalhe muito simples de fazer e que agrega valor ao projeto. É o tipo de coisa que tem que se pensar sem o cliente pedir. WD E-mail marketing para o mailing da agência (http://tinyurl.com/

mkt-email-mkt) e Twitter (http://tinyurl.com/twitter-web-wish) foram as principais ferramentas utilizadas na divulgação do projeto. Que tipo de retorno vocês esperam alcançar com este projeto? LUDMILLA Estamos ainda bem no começo desta avaliação. Pretendemos versionar o site para inglês também. O principal objetivo foi permitir o aprendizado da nossa equipe com um projeto para valer e que tivesse uma veia bem-humorada. Não pretendemos trazer inúmeros clientes com ele, mas sim chamar a atenção de um nicho de clientes que são atraídos por novas tecnologias e querem produzir advergames ou social games. O nosso primeiro passo está sendo dado. Que venham bons projetos na área de entretenimento e jogos #webdesignerswishes.

Ficha Técnica Diretora de criação: Ludmilla

Rossi Rossi e

WD O uso de tonalidades de verde, laranja e vermelho acabou

Diretor de arte: Ludmilla

dando um aspecto bem vivo ao cenário do jogo. Que tipo de estudos vocês realizaram para chegar na combinação cromática aplicada no projeto? LUDMILLA Buscamos usar cores inusitadas, que dificilmente estariam presentes em algum projeto de cliente. A ideia era conceber um universo bem lúdico, com cores aproximadas das cores primárias no layout do site.

Renato Cunha Desenvolvimento: Gabriel Caires, André Reis e Danilo Costa Redator: Rodrigo Ferreira

76 > 04/10 | webdesign |

CONCEITUAL

Tecnologia em Foco

NÍVEL MÉDIO

INFLUÊNCIAS DO HTML 5 NO DESIGN DE INTERFACES

s discussões dos grupos de trabalho para o aperfeiçoamento da HyperText Markup Language (HTML) continuam em pleno funcionamento, mas a expectativa é que a recomendação final do World Wide Web Consortium (W3C) só saia daqui a alguns anos, conforme revelou Ian Hickson, editor do HTML 5, em junho de 2009, em entrevista exclusiva para a Revista TIdigital. “Porém, a boa notícia é que o suporte gradual das versões mais atuais dos browsers com as novas especificações deve acelerar o processo de aplicação do HTML 5 na criação e no desenvolvimento de projetos digitais e interativos. Dentre os benefícios apresentados, Leonardo Moreira, sócio e diretor de criação e planejamento da agência Le Cube (www.lecube.com.br), destaca a padronização da semântica. “Com a nova família de tags, vamos deixar de adotar maneiras alternativas para resolver os problemas de programação na web, criando orientações para que o navegador saiba como exibir corretamente uma informação e gerar uma segmentação melhor do conteúdo. Por exemplo, não conseguimos distinguir as informações do rodapé ou cabeçalho de um site de forma automática. O HTML 5 vai resolver esse problema.” “A utilização de tags específicas beneficia a semântica estrutural do documento HTML, facilitando a interpretação de robôs ou de softwares leitores de tela. Além disso, teremos a preparação para o uso de tecnologias de código aberto para a utilização de áudio e vídeo com controles nativos do navegador que der suporte a essas aplicações”, complementa Leonardo Maia, designer de interfaces e sócio da Stage3 (www.stage3.com.br). Mas os benefícios não param por aí. “Podemos citar ainda os recursos de acesso de dados off-line, que permite posteriormente a sincronização desses dados pela internet, gráficos 2D, áudio e, por fim, o vídeo, um dos principais destaques na linguagem, possibilitando a execução de vídeos de forma nativa e em seu formato original”, diz Leonardo Moreira.

SAIBA MAIS HTML Demos http://html5demos.com

HTML5 Doctor http://html5doctor.com

HTML5 Gallery http://html5gallery.com

HTML 5 Rocks www.html5rocks.com

Pinceladas da Web www.pinceladasdaweb. com.br/html5

VANTAGENS PARA O DESIGN DE INTERFACES

Engana-se quem pensa que apenas o trabalho dos programadores será beneficiado pela recomendação oficial do HTML 5. A nova versão da linguagem também trará vantagens na produção dos

| webdesign | 73 > 02/10

Working Draft www.w3.org/TR/html5/

designers de interfaces. “Os desenvolvedores de interface se tornaram reféns do Flash. Imagine você disponibilizar áudio e vídeo em seu site? A primeira opção plausível é a utilização de Flash. Com o HTML5 isso acaba, pois não iremos mais precisar de plugins de terceiros para disponibilizar esse tipo de conteúdo no site. A criação de gráficos, então, será possível através simplesmente da tag <canvas> do HTML5 com o auxílio de Javascript”, afirma o desenvolvedor front-end Pedro Rogério (www.pinceladasdaweb.com.br). “Criar interfaces ricas em interatividade, de forma ágil, acessível e com semântica. É isso o que podemos esperar com o HTML 5. Alguns recursos ainda não estão totalmente disponíveis, mas agora podemos criar ‘drag and drop’ em elementos, gráficos vetoriais, 3D, manipular imagens e muito mais, tudo com simplicidade e de forma nativa. O que antes precisaria de horas para fazer, vamos resolver em minutos. Por exemplo, vamos eliminar a necessidade de hacks para compatibilidade do seu projeto em diversos navegadores e deixar de criar imagens para fazer sombra em elementos. Podemos resolver isso combinando o HTML 5 com CSS 3. São só dois exemplos que vão tornar o dia a dia do profissional muito mais produtivo”, argumenta Leonardo Moreira. Para se ter uma ideia de como funciona na prática, Pedro Rogério conta alguns detalhes do desenvolvimento de seus dois blogs: www.pinceladasdaweb.com.br/blog e www.cssnolanche.com. br. “Eles foram criados com a nova especificação do HTML. Como ela conta com novas tags para definir seções do site, cabeçalho, rodapé e navegação, isso acabou facilitando a integração com o CSS. Outro benefício na utilização dessas novas tags é a padronização, que facilita a localização de conteúdo pelos buscadores e o reaproveitamento de código CSS.” FLASH VS. HTML 5?

Recentemente, o YouTube anunciou um projeto experimental de suporte do seu player de vídeo em HTML 5 (www.youtube.com/ html5) ao invés de utilizar o até então imbatível Flash player. Diante das mudanças e experimentos, alguns especialistas, como Remy Sharp fez em post recente em seu blog (http://tinyurl.com/remyhtml), analisam o que esperar para o futuro do Flash com a implementação do HTML 5. Em termos de criação de interfaces ricas, e levando-se em consideração a realidade brasileira, a dúvida que fica é: a nova versão do HTML poderá substituir de forma eficaz o Flash ou é possível combinar o uso destas duas “tecnologias” em um mesmo projeto? “O Flash não irá desaparecer da noite para o dia com a chegada do HTML 5. Isso é fato. O que acontecerá é que o Flash irá atender necessidades que o HTML 5 eventualmente não conseguirá atender”, diz Pedro Rogério. "Acredito que as duas tecnologias podem caminhar lado a lado. Cada linguagem mostra vantagens sobre a outra ao desempenhar tarefas. O HTML 5 permite maior performance e facilidade no desenvolvimento, mas não faz tudo que é possível com o poder

Criar interfaces ricas em interatividade, de forma ágil, acessível e com semântica. É isso o que podemos esperar com o HTML 5 LEONARDO MOREIRA

do Flash, poder esse que não era usado corretamente e que, trabalhando em conjunto com o HTML 5, deve gerar excelentes resultados. O mercado brasileiro ainda está recebendo o HTML 5, mas se a linguagem e as condições atuais dela são compatíveis com o seu projeto e o público que deseja atingir, não vejo problemas”, explica Leonardo Moreira. “Podemos criar essas interfaces sem o uso do Flash. O HTML5 irá possibilitar isso ainda mais, porém já podemos ver muita coisa boa por aí utilizando jQuery. Mas acho que mesclar as ferramentas também é uma boa saída, mas sempre dando aos usuários uma alternativa ao uso do Flash”, acrescenta Leonardo Maia. OBSTÁCULOS PARA DISSEMINAÇÃO

Como nem tudo são flores, alguns aspectos ainda representam obstáculos para tornar esta nova versão do HTML mais popular e comum na construção de ambientes digitais. Para Pedro Rogério, um dos principais desafios é que, na falta de uma especificação definitiva (que está prevista para 2012), os desenvolvedores de browsers adicionam suporte a conta-gotas. “O maior obstáculo para o desenvolvimento com HTML 5 é, com certeza, o suporte de navegadores para a interpretação da linguagem e suas marcações. Alguns estão dando esse suporte de forma parcial; outros ainda estão trabalhando em novas versões, com promessas de atender os padrões, porém isso não nos impede de começarmos a testar as novidades e colocar em prática, seja de forma experimental ou criando alternativas para funcionalidades que ainda não são suportadas em alguns navegadores”, finaliza Leonardo Moreira. 73 > 02/10 | webdesign |

T U TO R I A L

ANIMAÇÃO 3D: SAIBA COMO TRABALHAR COM PAPERVISION NO FLASH - PARTE 2/3 No tutorial anterior, aprendemos como criar primitivas geométricas e uma animação simples. O objeto usado foi um plano simples que, nessa segunda parte, será melhorado com o uso de materiais e texturas. Assim como acontece em softwares 3D, como o 3ds Max, Maya e Blender, o Papervision permite aplicar materiais e texturas em seus objetos 3D. Os materiais podem ser representados por cores sólidas, gradientes e texturas baseadas em imagem. O mais comum nos projetos envolvendo Papervision é a aplicação tanto de texturas como materiais com cores sólidas. Além de representar as superfícies dos modelos 3D, as sombras ainda servem para criar pequenos truques, como simular sombras projetadas por objetos. Isso evita o uso de recursos com o cálculo e projeção da sombra no Flash Player.

O CÓDIGO USADO NO ÚLTIMO TUTORIAL FICOU DESSA MANEIRA: 1. import org.papervision3d.view. Viewport3D; 2. import org.papervision3d.cameras.

Allan Brito Arquiteto especializado em design de informação, atuando no desenvolvimento de projetos usando computação gráfica 3D. Além dos projetos que desenvolve, atua como professor universitário e escritor de livros sobre computação gráfica. Para saber mais sobre o autor, visite http://www.allanbrito.com ou seu Twitter http://twitter.com/allan_brito.

| webdesign | 73 > 02/10

Camera3D; 3. import org.papervision3d.scenes.Scene3D; 4. import org.papervision3d.render. BasicRenderEngine; 5. var visao:Viewport3D = new Viewport3D(); 6. var cena:Scene3D = new Scene3D(); 7. var camera:Camera3D = new Camera3D(); 8. var render:BasicRenderEngine = new BasicRenderEngine() 9. addChild(visao); 10. var plano:Plane = new Plane(); 11. cena.addChild(plano); 12. addEventListener(Event.ENTER_FRAME, renderizar); 13. function renderizar(e:Event):void { 14. render.renderScene(cena, camera, visao); 15. } 16. plano.rotationY = plano.rotationZ = mouseX;

Para trabalhar com materiais de cores sólidas devemos adicionar logo abaixo da linha 4 o seguinte código: import org.papervision3d.materials. ColorMaterial; Essa linha importa o material que usa cores sólidas para o nosso projeto. Lembre de respeitar as letras maiúsculas e minúsculas do código. Depois de importar essa linha, devemos declarar o material e associar o mesmo com o objeto 3D que, nesse caso, é o plano. Abaixo da linha 8 declare uma nova instância do material: var corsolida:ColorMaterial = new ColorMaterial(0xFF0000, 100) Na declaração da cor, é necessário especificar dois valores dentro dos parênteses, que são a cor em formato hexadecimal e a opacidade do material. Nesse caso, a cor é a vermelha e a opacidade total (100%).

COMO ASSOCIAR ESSE MATERIAL AO PLANO? Quando declaramos o plano projeto, acabamos usando a forma mais simples de criar o objeto, sem nenhum parâmetro especificado que foi usando var plano:Plane = new Plane(). Dentro dos parênteses dessa declaração, é possível especificar algumas informações sobre o objeto, como as suas dimensões e o material usado no objeto. Altere a declaração e adicione entre os parênteses o nome do material e a largura e altura do plano. A linha fica assim:

nova janela irá aparecer. É necessário marcar a opção “Export for ActionScript” e determinar um nome no campo de texto chamado Class. Nesse caso, use a palavra texturaMadeira que será utilizada no Papervision para referenciar essa imagem.

var plano:Plane = new Plane(corsolida, 400, 300). O plano será criado usando o material chamado corsolida e com 400 unidades de largura e 300 de altura. Ao pressionar CTRL+Enter para testar o projeto, veremos um plano vermelho com formato retangular.

Com a imagem devidamente configura, é possível partir para o código do nosso projeto. Remova ou transforme as linhas que adicionamos para o material de cor sólida em comentários, para não atrapalhar a aplicação da textura. O primeiro passo é adicionar, no início do código, a linha que importa os materiais que usam texturas: import org.papervision3d.materials. BitmapAssetMaterial; Depois declarar o material da mesma maneira que fizemos com o usado para a cor sólida com a seguinte linha:

Um problema comum na criação de materiais e texturas com o Papervision é que os mesmos sempre são aplicados em apenas um dos lados do objeto. Para fazer com que os materiais sejam aplicados em todas as faces do plano, precisamos adicionar abaixo da declaração do material a seguinte linha: corsolida.doubleSided = true; A propriedade doubleSided é sempre configurada por padrão como falsa, fazendo com que em alguns momentos não possamos visualizar os objetos, quando as faces sem o material ficam voltadas para o observador ou câmera. Ao testar o projeto novamente e girar o plano, agora devemos visualizar o plano de todos os ângulos. COMO APLICAR TEXTURAS? A aplicação de texturas em modelos 3D do Papervision segue princípios bem parecidos com os materiais de cor sólida. Para usar texturas no Papervision será necessário importar um arquivo de imagem para o projeto. No nosso projeto, vamos usar uma imagem no formato JPG e importar a mesma para a Library do Flash. Assim que a imagem estiver na Library do Flash, clique com o botão direito do mouse sobre ela na Library e acesse a opção Linkage. Ao fazer esse procedimento, uma

var textura: BitmapAssetMaterial = new Bitma pAssetMaterial(“texturaMadeira”); Na declaração do material usamos o nome da textura que atribuímos à imagem na Library do Flash. Para aplicar a imagem no plano, apenas substitua o nome do material baseado em cor pela textura na declaração do plano var plano:Plane = new Plane(textura, 400, 300). Assim como acontece com os materiais de cor sólida, é necessário alterar o valor da propriedade doubleSided da textura para true, caso o objetivo seja visualizar a textura em ambas as faces do plano. Ao testar o projeto podemos visualizar a textura aplicada ao plano.

Na próxima parte desse tutorial, usaremos a classe Tweener para dar movimento aos objetos em 3D! 73 > 02/10 | webdesign |

Ilustração Carolina Vigna-Marú

O reconhecimento dos símbolos Dois dias já haviam passado da Páscoa quando, em um certo 22 de abril, ainda a 24 km da costa, as âncoras de Pedro mergulharam 34 metros mar abaixo, colocando fim a uma viagem chatíssima. Ou seja, não é de hoje que o Brasil começa depois do Carnaval. Os nativos brasileiros subiram a bordo da caravela de Cabral no dia seguinte ao desembarque, em 24 de abril de 1500. Cabral colocou sua melhor roupa e todos os adornos a que um capitão-mor tinha direito e, no entanto, os índios não conseguiram diferenciá-lo dos demais brancos a bordo, em uma das melhores comprovações que conheço de que a compreensão de um signo é sempre posterior à sua contextualização. Nós sempre reconhecemos um símbolo, nós nunca conhecemos um símbolo. Quando você vir um homem com uma coroa na cabeça e montado em um elefante é Manoel I, rei de Portugal na época. Muita gente acredita que esta representação é por causa do famoso caminho para a Índia, mas - na verdade - é por ele ter enviado ao Papa Leão X um elefante chamado Hanno de presente. Na época, as pessoas acharam tão exótico quanto você está achando agora e as charges políticas exploraram bem o estranho presente.

| webdesign | 76 > 04/10

Por falar em elefantes e caricaturas foi o cartunista norte-americano Thomas Nast, muitos anos depois, o responsável pelo burro e pelo elefante que acabaram se tornando símbolos dos partidos Democrata e Republicano norte-americanos, respectivamente. No melhor estilo do capitalismo, o que começou como uma crítica virou marketing. As naus que aqui chegaram eram o fino da alta tecnologia e, além das velas latinas (triangulares) para momentos de vento contra, tinham também a vela redonda (que era quadrada) para traduzir cada sopro em maior velocidade. Eram tipo um processador multi-core da época. Cada vela ostentava uma enorme Cruz de Malta. Você sabe qual, é aquela com serifas. A que nós vimos chegar as nossas praias já tinha sofrido um redesign, mas era bem parecida com a da Primeira Cruzada, em 1096, que por sua vez era idêntica à cruz da Ordem dos Templários. Sim, aqueles do Santo Graal. Sim, do Indiana Jones. Não encontrei bibliografia disso, mas nada me tira da cabeça que as atuais roupas de mergulho com tubarões são inspiradas no uniforme dos cavaleiros templários. Pedro Álvares Cabral e Vasco da Gama tinham em comum mais do que o idioma. Tinham também o mesmo piloto, Pero Escolar. A indicação de Cabral para a missão é um mistério até hoje. A armada era enorme, composta por 13 naus e 1.500 homens, representando quase 3% da

É sempre bom evitar símbolos religiosos e/ou políticos quando você estiver criando uma identidade visual

população de Lisboa. Seria mais ou menos como se um designer inexperiente assumisse o comando de uma megacorporação e, por ser inexperiente e não burro, contratasse o Luli Radfahrer para pilotar. ASSIM QUE COLOMBO botou os pés na América começou na Europa um debate sobre se os nativos teriam ou não alma. Este é, na verdade, um questionamento mais econômico do que filosófico: se tem alma não pode ser escravizado. E escravos eram bons para a economia daqueles tempos. A comprovação da nossa existência foi para o pensamento vigente da Época dos Descobrimentos o que o catolicismo foi para o Império Romano. Toda a percepção de mundo foi abalada. De repente, o mundo deixou de ser plano e a Europa deixou de ser o centro. Dando mais um passo anacrônico, é possível entender Linus Torvalds como um Colombo contemporâneo, alguém que muito mais coloca o pensamento tradicional em cheque do que como alguém que finca bandeira em novos territórios. Em tempo: Santa Maria, Pinta e Niña eram as embarcações de Colombo, tá gente? Assim como as de Cabral, elas também tinham uma cruz de Malta nas velas. O sotaque muda, mas a cruz é a mesma. Colombo viajava sob as ordens dos reis católicos de Espanha, Isabel I de Castela e Fernando II de Aragão, que usavam como símbolo um conjunto de flechas, conhecido como el yugo y las flechas, muito similar

ao feixe de varas do senado do Império Romano. O feixe - fascio, em italiano acabou sendo usado como símbolo do fascismo (fascio - fascismo). E não apenas na Itália de Mussolini. A bandeira do partido de extrema direita espanhol Falange Española de las JONS é até hoje um fascio, por exemplo. Então, preste atenção porque talvez um array de setas não seja um bom ícone para velocidade. De uma forma geral, é sempre bom evitar símbolos religiosos e/ou políticos quando você estiver criando uma identidade visual. A possibilidade de involuntariamente ofender alguém é enorme. Por isso, é tão importante ouvir a opinião de quem não sabe no que você está trabalhando. De preferência, inclusive, alguém de outra área profissional completamente diferente da sua. EM 1500, LEONARDO DA VINCI estava no auge da sua carreira. Em 1501, Michelangelo começou a esculpir o David. Entre 1499 e 1502, Rafael pintou Ressurreição de Cristo, que hoje é parte do acervo do MASP. O movimento renascentista ganhou este nome porque era uma tentativa de reviver a glória do Império Romano e considerava tudo que aconteceu entre estes períodos como medíocre (daí o termo Idade Média, inclusive). Este negócio de sair conquistando novos territórios não era tão novo assim. Não apenas a estratégia militar geopolítica

estava em alta, mas as artes também. Toda a compreensão europeia dos acontecimentos estava necessariamente mergulhada nos ideais renascentistas e, portanto, uma importante parte da formação da nossa própria identidade também. Nossa história é contada do ponto de vista de quem aqui chega. Deveríamos ter uma carta, ainda que escrita anacronicamente, do ponto de vista dos nativos: “A feição deles é serem brancos, maneira de amarelados, de rostos magros e narizes finos”. Ia ser divertido, pelo menos. O Brasil fascina os estrangeiros que aqui chegam desde que, bem, aqui chegam. Existem registros de que cinco portugueses desertaram a armada de Cabral e por aqui ficaram. E olha que isso foi bem antes do ar condicionado, do metrô e da wireless livre na praia.

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. vignamaru@gmail.com

76 > 04/10 | webdesign |

Marketing René de Paula Jr.

Alô velhinho Adoro o Pernalonga. Adoro. O cara que criou deveria ganhar o Prêmio Nobel. Não tem Nobel pra humor? Puxa, deveria. Quem sabe o da Química, então? Não é fácil transformar tinta colorida em algo tão vivo. Demorei pra ouvir o Pernalonga no original e descobrir que o “o que há, velhinho?” era outra sacada genial. Em inglês, o coelho pergunta, blasé, “what’s up, doc?”, o que um on-linetranslator-tabajara traduziria por “e aí, doutor?”, jogando no lixo o sarcasmo maravilhoso, fazendo o dândi pernalta falar como um flanelinha da Vila Madá. “O que há, velhinho?” mata a pau. Parabéns pro tradutor.

| webdesign | 76 > 04/10

Falar de um desenho da década de 50, feito pra ver no cinema, é coisa de velhinho mesmo. Quem aqui assistia com o tio à matinê do Tom e Jerry no Iguatemi? Ninguém? Você aí no fundo, não? Ok, ok. Na idade em que eu via os Três Patetas em preto e branco você já estava com o mouse na mão. Você mexe com web, não é? Tããão moderno isso. Well, não. Você também está ficando velhinho. Web era novidade há 15 anos. Motion? Dez anos. Aplicações pra mobile? Uns oito? Alô, velhinho, what’s up agora que web não é mais tão up? Eu sempre sonhei com o dia em que web se tornasse algo mainstream, algo popular mesmo. O que eu não podia sonhar, nem em pesadelo, é que o “povo de on-line” fosse acabar se comportando como o “povo de off-line” se comportava: resistente às mudanças, apegado ao tradicional, acomodado na zona de conforto. Na verdade, a geração anterior ainda foi mais corajosa, porque uniu o que já sabia (de varejo, de educação, de marketing, branding etc.) àquilo que era novo. Essa geração mais recente começou venerando o novo sem se dar ao trabalho de aprender marketing, branding, varejo etc. Piorou. Nem dá pra conversar direito, não tem assunto. Acho que é por isso que o Twitter faz sucesso: dá pra acompanhar mil ilustres desconhecidos tentando parecer interessantes sem o stress de parecer minimamente interessante. É como circular num black-tie ouvindo a conversa alheia usando, sem medo de ser feliz, pijama e chinelo.

Essa geração mais recente começou venerando o novo sem se dar ao trabalho de aprender marketing, branding, varejo etc.

Well, deixemos o Twitter pra lá :-) Meu tema aqui é outro: senilidade. Senectude. Velhice. Caduquice. Ou você continua se achando super inovador fazendo hotsites e banners ano após ano faz dez anos? Confesse: esse mercado de on-line não mudou quase nada. Claro que há hotsites criativos, mas continuam sendo hotsites. Claro que há ações especiais em rich media nos grandes portais, mas isso está tão consolidado quanto um anúncio de página dupla ou um comercial de 30s. Business as usual. Pausa. Vou mudar um pouco o assunto, já volto. Seguinte: num país absolutamente necessitado de inovações em política, educação, pesquisa, por que as mentes mais criativas correm todas pra publicidade? Com tanta coisa pra melhorar por aí, como o cara se orgulha de ganhar um prêmio numa campanha de xampu? Enquanto a garotada fica disputando a tapa uma vaga no glamoroso mundo das agências, ninguém se interessa por entrar pra política, serviço público, ciência, nada. Se publicidade mudasse alguma coisa o Brasil seria a Suécia. Mas não somos. FIM DA PAUSA. Voltemos pro tema a-webjá-não-é-mais-aquela. Seguinte: num país absolutamente necessitado de inovações em... Não, não dei um copy-paste errado repetindo uma frase. O problema é o mesmo: todo mundo só quer fazer o que já vem sendo feito. Enquanto isso, aqui fora, um mercado gigante (mercado de verdade, com grana e tudo) pra inovações de verdade e... Não tem quem faça.

É sério: por conta do meu trabalho converso bastante com as maiores empresas do país. Dentro dessas empresas tem muita gente antenada no futuro da interação, no futuro da tecnologia e no consumidor do futuro. Muitos deles têm no crachá o título: Gerente de Inovação. Adoro conversar com esses caras, pois eles têm algo em comum: uma noção dolorosamente clara de que não podem bobear e ficar pra trás. Esses caras têm outra coisa em comum: uma dificuldade igualmente dolorosa de encontrar quem “entregue” essa inovação. Super difícil achar. Quem é bom de tecnologia é ruim de criação. Quem é bom de criação boia em tecnologia mais pesada. Desses dois, nenhum entende de negócios e ninguém tem tempo de investigar, pesquisar, experimentar, aprender. Ninguém tem tempo pra isso. Em dez anos, o mercado de digital se consolidou em modelos engessados de pensamento. Modelos confortáveis e charmosos e previsíveis, mas... Engessados. Velhinhos. Não dão mais conta de entender um cliente antenado, não dão mais conta de surpreender, inspirar, orientar esses clientes que sabem mais do que eles, clientes que são mais curiosos, corajosos, arrojados do que eles. Já saem todos da faculdade velhinhos, preparados pra um mercado que está ficando caduco. Sorry, rapaziada de on-line, mas vocês viraram mídia tradicional. ESTOU EXAGERANDO, CLARO, pois se o

mercado fosse inteiro assim eu atearia fogo às vestes. Existem exceções, claro, honrosas

e maravilhosas exceções e que vão muito bem, obrigado. Hoje mesmo passei uma boa parte do dia com uma moçada empreendedora, inovadora e hiper-competente. Esses caras nem querem ser vistos como agência, pra eles isso está gasto. Nem querem saber de campanhas. Eles querem que as empresas os vejam como Os Caras que entendem de tecnologia, de UX e, sobretudo, de estratégia e que fazem tudo isso acontecer com primor, seja em mobile, seja em e-commerce, seja numa UX interativa no ponto de venda, seja onde for. Conheci seus clientes: adoram os caras e os consideram parceiros, não meros fornecedores. Eu daria um Prêmio Nobel pra quem conseguisse clonar uma empresa assim em mil outras. Well, pensando bem, melhor deixar isso pra seleção natural: esses caras já estão crescendo e evoluindo bem mais rápido que o resto. E se você acreditou naquele desenho em que a tartaruga lerda vence o coelho, well, está na hora de mudar de canal e sair do casco.

René de Paula Jr. User Experience Evangelist da Microsoft Brasil. É profissional de internet desde 1996, passou pelas maiores agências e empresas do país: Wunderman, AlmapBBDO, AgênciaClick, Banco Real ABN AMRO. É criador da “usina. com”, portal focado no mundo on-line, e do “radinho de pilha” (www.radinhodepilha.com), comunidade de profissionais da área. rene@usina.com

76 > 02/10 | webdesign |

Internacional Julius Wiedemann

Declarado o fim do manual de instruções Em fevereiro de 2007, numa palestra com John Maeda, então diretor do Media Lab do MIT (e hoje diretor da Rhode Island School of Design), fiquei impressionado com uma comparação que ele fez entre o tamanho do manual de instruções de um carro e um aparelho eletrônico, colocando-os em perspectiva com o tamanho dos respectivos produtos. A discrepância era enorme. O produto eletrônico vinha com um manual gigante e o carro vinha com um manual mínimo. Está certo que pode parecer uma comparação desleal, já que para dirigir um carro é preciso fazer um curso e tirar carteira. Mas faz sentido ao passo que hoje cada carro tem suas próprias características, além de uma parafernália eletrônica monstruosa. Escrevendo esse artigo, resolvi contar quantos programas tenho no desktop do meu computador. Cheguei a mais de 50. Curiosamente, eu nunca usei o manual de nenhum deles. O máximo que fiz (e posso contar nos dedos às vezes) foi usar o “help” do menu, que, em 90% dos casos, não me serviu de absolutamente nada. Declarei o fim dos manuais na minha vida e estou convicto de quem tem que fazer isso de uma vez por todas são as empresas. Para quem está on-line, a experiência de “converter” um usuário em menos de cinco ou dez segundos é moeda corrente e um desafio enorme. E fazer desse desafio

| webdesign | 76 > 04/10

uma evolução para o design de interatividade só é possível porque sabemos que a pessoa na frente da tela não tem à mão qualquer instrução. Meu amigo e designer Felipe Taborda coleciona, há mais de duas décadas, instruções de produtos como um verdadeiro aficionado. Para ele, esses desenhos e grafismos têm o poder de reduzir a necessidade de explicação. Os japoneses são mestres na arte, como comprova a coleção do Felipe. Ele possui desde instrução de como abrir uma embalagem de queijo até montar um brinquedo do Kinder Ovo. A particularidade da sua coleção está no fato de as instruções se concentrarem principalmente naquelas que a gente nunca lê, onde o uso ou proveito do produto se faz de maneira automática. Isso transportado para o mundo digital me parece a combinação perfeita. Não é que essas instruções não existam, mas se os produtos (programas, sites, gadgets, celulares, tocadores de MP3 etc.) forem bons e suficientemente intuitivos,

não precisaremos mais de instruções. De fato, muitos produtos que compramos atualmente vêm com uma quantidade mínima de informação. Se você quiser realmente saber mais sobre o produto, pode buscar e baixar tudo na internet. Já cheguei a fazer duas ou três vezes com câmeras digitais, para saber um detalhe ou outro, e como funciona. Claro que, quando chegamos a uma situação assim, pensamos imediatamente que todas as camadas da sociedade estão incluídas no mundo digital, o que pode não ser o caso. Mas, mesmo assim, a praticidade de ter acesso às informações de forma digital é, sem dúvida, uma evolução. Além disso, é um incentivo para levarmos acesso rápido de internet a todos os cantos do país. O DESIGN DE INTERFACES EVOLUIU rapidamente nos últimos anos. Da internet à telefonia celular, passando por eletrônicos e eletrodomésticos, todos convivemos diariamente com um número enorme de aparelhos. O iPhone foi, na minha opinião, a última grande revolução não só nos celulares, mas em interface em geral. É muito interessante perceber como certas tendências vão e voltam. Há cinco anos, Flash era o que havia de melhor em termos de imagem e dinamismo. Agora, por causa dos celulares, HTML voltou a ser a melhor solução, mais inclusiva. Até mesmo o tamanho dos celulares, que diminuía gradativamente, agora

Há cinco anos, Flash era o que havia de melhor em termos de imagem e dinamismo. Agora, por causa dos celulares, HTML voltou a ser a melhor solução, mais inclusiva volta a crescer porque precisamos de mais tela para navegar. A possibilidade de multi-touch mudou completamente a ideia de se poder interagir com uma tela. Com o surgimento do que está sendo chamado de “a quarta tela” (the forth screen, vindo depois da TV, do computador e do celular), vamos ter os leitores (Kindle, Nook, E-Reader, e iPad) como novas fronteiras de interface. Seguramente, elas só vão se incorporar às nossas vidas se fizerem parte do nosso dia a dia, sendo intuitivas, oferecendo programas que possamos aprender rapidamente e nos oferecendo soluções que antes não tínhamos. Uma das melhores maneiras que eu conheço para ver o quão fácil (ou complicada) é uma interface é se sentar ao lado de uma criança e observá-la usando o

computador, um celular etc. É fascinante. Não é à toa que máquinas de lavar têm trava de segurança para crianças. Elas experimentam e testam tudo de maneira dinâmica e intuitiva. Simplesmente não têm medo de errar. A ORDEM GERAL talvez tenha que ser essa

mesmo, a de produzir algo que qualquer criança de cinco anos consiga sozinha aprender a usar em um dia. Se atingirmos isso, ou algo semelhante (mais científico também, porque meus dados são empíricos), talvez encontremos maneiras de incluir cada vez mais usuários que usufruam dos avanços tecnológicos, incluindo pessoas de mais idade. O fim dos manuais de instrução são um indicador direto de quão “transparente” as

tecnologias digitais estão ficando. Quanto menos pensamos nelas, mais usufruímos e menos nos irritamos.

Julius Wiedemann Nasceu e cresceu no Brasil, onde estudou Design e Marketing (sem terminar) até que teve a oportunidade de ir para o Japão. Trabalhou como designer de revistas e jornais até se tornar editor de arte (e posteriormente editor) de uma editora japonesa. Em 2001, a editora alemã TASCHEN (www.taschen.com) o contratou para ser o editor responsável pelas áreas de design e pop culture. Por lá, desenvolve o programa de títulos nas áreas de propaganda, graphic design, web, animação etc. letschat@juliuswiedemann.com

76 > 02/10 | webdesign |

Webdesign Luli Radfahrer

Design e histórias A evolução tecnológica precisa ser acompanhada de perto por um desenvolvimento na capacidade de entender as novas invenções. Essa é a tal “curva de aprendizado” de que tanto se fala. Por mais que um novo produto ou serviço seja fantástico, ele só vai ser usado se for compreendido. Isso não quer dizer que ele seja fácil, mas que possa ser explicado dentro de parâmetros com que todo mundo esteja acostumado. Enviar uma mensagem de texto pelo celular é um bom exemplo. Quanto mais simples o aparelho, mais complicada a tarefa. Primeiro é preciso descobrir qual a sequência de teclas necessária para chegar até o serviço. Os fabricantes não parecem seguir nenhum padrão nem mesmo dentro de suas próprias marcas, já que cada vez que surge uma nova linha de produtos muda o caminho para se realizar as funções. Depois vem a escrita de texto em teclado numérico, inferno que não preciso entrar em detalhes. Para complementar, o mosaico de tarifas oferecidas pelas operadoras e suas interconexões seria o suficiente para fazer qualquer um abrir mão do serviço. E, no entanto, todo mundo o usa.

| webdesign | 76 > 04/10

Quando a internet surgiu, ninguém sabia direito o que fazer com ela. Hoje, praticamente ninguém sabe por onde começar - a trabalhar, a estudar, a se relacionar, a se divertir - sem um acesso conveniente a uma rede de comunicação. Não é exagero: você pode achar que não precisa de muito mais do que uma bola e dois gols para jogar futebol com seus amigos, mas como vai chamá-los para o campo? Onde vai encontrá-los? Silenciosamente, a vida social se torna a cada dia mais complicada. A confusão é tanta que começam a surgir dúvidas de comportamento inéditas. Qual é a mensagem, por exemplo, que alguém passa quando segue uma ex-namorada no Twitter? Ou quando busca no blog da concorrência a resposta para uma pergunta dos seus clientes? Ou quando tem uma personalidade completamente diferente em um jogo ou rede social? Ou quando se identifica com uma frase de efeito no Twitter ou MSN ou Skype e tem como foto um avatar de desenho animado? Nada? Tudo? Freud explica? Duvido. Por mais que o Sigmund tenha sido genial, a dinâmica na época dele era muito diferente. E, no entanto, não nos tornamos gênios. Longe disso. Bem longe disso. Mesmo com toda essa tecnologia em volta, as pessoas continuam iguais ao que sempre foram. Pelos teclados e telas de todo tamanho o que se discute são as mesmas questões de relacionamento, carreira, felicidade,

Arrisco-me a dizer que é muito mais fácil mudar depois de acompanhar uma história do que depois de tomar uma bronca

fofocas, qualidade de vida, saúde... física de partículas, neurociência ou filosofia pura continuam tão difíceis quanto sempre foram. É verdade que as pessoas leem menos, mas elas hoje têm acesso a muito mais conteúdo, em diversas mídias. Acredito que boa parte da dificuldade (ou facilidade) que se tem em aprender uma coisa está na forma com que ela é transmitida e na relação que tem com o universo conhecido. É fácil entender o celular como um telefone portátil, por isso a maioria das pessoas ainda o usa só para isso. Quem aprendeu a usar um computador que não falava com os outros ainda sofre para entender por que os filhos passam tanto tempo na frente dele. A melhor escola, sem dúvida, é a experiência direta. Não há nada melhor do que ela para explicar um prazer, dor, medo ou aquelas sensações que não cabem em palavras. Imagens e sons podem até tentar transmitilas, mas como dependem de um contexto, acabam dando muito trabalho. Mesmo assim, são limitadas. Quem já tomou um tombo de moto ou se cortou picando cebola sabe que certas coisas não se explicam. UMA DAS MELHORES FORMAS que existem

para se transmitir esses conceitos são as histórias. Na forma de lendas, religião, literatura, teatro, cinema, rádio, novelas ou séries, já faz milênios que a humanidade aprende a se aperfeiçoar por elas. Hoje, elas estão por toda parte: de autoajuda a ciência,

as histórias contadas em livros, palestras, vídeos ou documentários ajudam a transmitir informações complexas e abstratas para quem nunca se preocupou com o assunto. Sob esse aspecto, a postura profissional, a educação financeira, a forma de se vestir, de falar, de cuidar da saúde, de cozinhar e de atrair o outro são tão complexas quanto à astronomia. E ficam muito mais acessíveis quando contadas em histórias. A popularidade de autores como Shakespeare é um bom exemplo da sua força. Durante séculos, as variações de Macbeth explicaram o que era remorso, as de Otelo ensinaram ciúme, as de Romeu e Julieta compartilharam amores proibidos. Quem nunca mudou de atitude depois de ver um filme que conteste. Arrisco-me a dizer que é muito mais fácil mudar depois de acompanhar uma história do que depois de tomar uma bronca. Ao viver o personagem, o leitor “pega emprestado” partes de sua experiência. E sempre acaba ficando com uma sobra. DESIGN JÁ FOI O CENÁRIO das histórias.

Hoje é um ator muito importante, em alguns casos é o principal. Uma Ferrari ou um terno Armani contam histórias inteiras. Um Mac ou um PSP também. Uma rede social ou um site de e-commerce, acredite, também. As melhores dessas histórias visuais transformam um usuário de computador em personagem de uma descoberta. Daí é fácil entender porque

sejam tão populares. Design, todos sabemos, é muito mais do que fazer a “cara” do site: ele responde por boa parte da experiência que se vive por ali. Os cuidados gráficos e funcionais transmitem, de forma quase instintiva, os valores que os donos do serviço consideram fundamentais. A aparência é importante, mas ela é só a apresentação. Como uma boa roupa, não vai adiantar nada se seu portador falar um monte de bobagens ou obviedades. Ao construir seu próximo site, esqueça a decoração e pense no ambiente inteiro. Se ele fosse um ambiente físico, como seria? Que música, cheiro e temperatura teria? Imagine como você gostaria que se sentissem as pessoas que o visitassem se fosse um lugar de verdade. Ele é.

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, http://www.luli.com.br. webdesign@luli.com.br

76 > 04/10 | webdesign |

Patrocinadores:

| webdesign | 76 > 04/10

76 > 04/10 | webdesign |