estudo de caso - edição 65
DESCRIPTION
Revista Webdesign - Seção Estudo de Caso - Mês de Maio/2009TRANSCRIPT
56 :: Webdesign
Sexta-feira chegando e vai batendo aquela
vontade de tomar uma cerveja estupidamente gelada,
acompanhada de uma porção generosa de bolinhos de
bacalhau. Agora, onde encontrar um lugar que forneça
boas dicas de estabelecimentos aptos a atender
tamanho anseio?
Talvez sua busca encontre tais respostas no
ComiAli.com (www.comiali.com), uma espécie de guia
on-line e rede social gastronômica, concebida através
dos princípios da web colaborativa e compartilhada.
O planejamento e o desenvolvimento tecnológico
do site ficaram a cargo da agência ZONAInternet.
com (www.zonainternet.com), e o designer Guilherme
Neumann (www.guilhermeneumann.com) pela
concepção do layout. Nesta entrevista, Paulo Klien
Veja, sócio do site, Daniel Maia e André Tenenbaum,
diretores da agência, explicam os desafios para tornar
funcional a dinâmica deste ambiente.
Wd :: Pesquisas recentes apontam que os usuários
brasileiros de internet são afeitos por mídias sociais
(http://migre.me/rvI). Como vocês procuraram
aperfeiçoar as boas práticas já aplicadas em outras
redes sociais populares pela web, como Orkut,
Facebook e Wikipédia, na construção deste projeto?
Paulo :: Gostamos de descrever o ComiAli.com
como uma mistura entre “Guia + Wikipédia + Orkut”.
Gastronomia em tempos digitais colaborativos
estudo de caso - ComiAli.com :: 57
Guia por conter todas as informações frias que se
espera desse tipo de publicação: endereço, telefone,
foto, mapa etc. Wikipédia porque qualquer usuário
pode cadastrar restaurantes novos ou editar as
informações ali disponíveis.
O fator rede social está nas páginas pessoais que
cada usuário tem no portal. Em seus perfis, os visitantes
do site falam um pouco sobre si, se comunicam com
outros usuários por mensagens e montam suas próprias
listas de restaurantes (“Já comi ali”, “Desejo comer
ali”, “Recomendo comer ali” e “Nunca mais como ali”).
Dessa forma, o ComiAli.com se torna uma espécie
de “Orkut gastronômico”, que reúne milhares de
pessoas em uma comunidade apaixonada por comida,
gerando discussões interessantes sobre o assunto.
Outro aspecto interessante que integramos ao
site foi o conceito “Twitter” de seguir as pessoas.
Quando você segue alguém no ComiAli, você pode ver
todas as atualizações e contribuições daquele usuário
na comunidade. A nossa proposta é que a opinião de
todos tem o mesmo peso. Não importa se você estudou
no “Le Cordon Bleu” ou se é um simples apaixonado
por comida sem formação acadêmica.
Wd :: O projeto foi lançado no final de fevereiro
com uma grande festa que contou com a participação
de algumas personalidades do mundo artístico
Google Maps ajuda a fornecer informações mais precisas sobre a localidade dos restaurantes pesquisados
O uso de ícones pela interface é um elemento que contribui para a navegação do usuário pelo site
(http://migre.me/rvK). Quais foram os investimentos
necessários para colocar o ComiAli.com no ar? E, até
o momento, que tipo de retorno este projeto trouxe?
Paulo :: Além do financeiro, o nosso maior
investimento foi tempo e dedicação. Criar um
portal com tanta interatividade necessita de muito
planejamento, inspiração e suor. Hoje, quase dois
meses depois do lançamento, já temos restaurantes
anunciantes, parcerias estratégicas (como, por
exemplo, o Outback) e estamos analisando a
possibilidade de formar uma parceria com algum
grande grupo de mídia.
Wd :: No artigo “Adeus, usuários” (http://migre.
me/rvM), René de Paula Jr. ressalta que “...Instant
messengers, webmails, blogs, sites de fotos...
Essas coisas são ocas, elas só têm estofo quando as
pessoas as recheiam com mensagens e conteúdo.
Essas coisas só têm vida porque as pessoas investem
ali parte das suas vidas”. Quais foram as estratégias
que vocês criaram para tornar o projeto atrativo e de
uso habitual no cotidiano do usuário?
Paulo :: Tivemos um carinho muito grande com a
parte visual do site. O designer responsável pelo site,
Guilherme Neumann, é muito competente e fez vários
testes até chegarmos ao layout atual. Focamos em um
layout simples, limpo e agradável. A home do portal é
completamente dinâmica. Portanto, todo dia que você
entrar no portal, você vai ver as novas atualizações,
deixando a home sempre com uma cara nova.
ZONAInternet :: A utilização de mashups, como
o Google Maps integrado, estimula a utilização do
site, concentrando todas as informações necessárias
em uma única interface.
Wd :: Na divisão dos elementos dispostos
pelas interfaces, vocês colocaram um campo de
buscas em lugar privilegiado no cabeçalho do site,
dividindo espaço com o logotipo do projeto e com
a área de login. Quais estudos vocês realizaram
para definir qual seria a arquitetura de informação
mais adequada para este projeto?
Paulo :: Tivemos um grande cuidado ao
desenhar as interfaces. Todas as telas tiveram um
estudo cuidadoso em wireframes, nas quais os
pesos de cada elemento foram minuciosamente
testados e melhorados.
Depois que fechamos um modelo satisfatório,
fizemos testes de usabilidade com grupos distintos
de usuários. Acertamos em alguns aspectos, mas em
outros tivemos que ajustar e realizar afinamentos.
Esse processo de melhorar a usabilidade é
contínuo e eterno. Quase que semanalmente estamos
adequando o layout para tornar a usabilidade mais
intuitiva para os nossos usuários.
ZONAInternet :: Como o Paulo já mencionou
acima, é necessário um constante acompanhamento
58 :: Webdesign
do projeto para melhorar a usabilidade. Analisando
os casos de uso conseguimos realizar os ajustes
necessários na navegação.
Conforme o projeto for crescendo, teremos
novos testes e ajustes para atender cada vez mais às
necessidades dos visitantes.
Wd :: Em termos gráficos, a paleta de cores
do site envolve o uso do preto e do laranja na
apresentação das fontes, com um contraste em
fundo branco. Quais fatores determinaram a escolha
da combinação cromática das interfaces?
Paulo :: O uso dos tons alaranjados foi decidido
principalmente por serem cores quentes e por
remeterem diretamente a comida/alimentação, o foco
do site. O usuário, através da cor, já percebe que o
tema principal é comida. É um conjunto cromático
quente, confortável e familiarizado com o tema
central do produto.
O fundo branco com letras escuras (cinza escuro),
além de facilitar a leitura do conteúdo, compõe o
padrão cromático do site, utilizado em toda linha
gráfica on-line e off-line.
Wd :: Outro detalhe é que a tipografia segue
uma família de fontes sem serifa e com tamanho que
facilita a leitura do conteúdo publicado pelo site.
Como vocês chegaram a tais definições e como elas
influenciam o período de experiência do usuário?
Paulo :: A escolha da tipografia foi motivada,
Comentários e sugestões dos usuários são um dos grandes atrativos para tornar o guia popular
Blog do ComiAli, concebido em WordPress, traz uma série de dicas e informações gastronômicas
principalmente, por ser uma fonte de fácil leitura em
todos os tamanhos, simples, elegante, jovem e versátil
- uma fonte padrão em todos os sistemas operacionais
e de fácil renderização nos browsers.
O usuário de internet já está acostumado com
Arial, não queríamos utilizar uma fonte que fosse
cansativa e exagerada. E é uma fonte semelhante
à utilizada no logo do site (Helvetica), compondo a
identidade visual.
ZONAInternet :: É um prazer trabalhar com um
cliente que conhece o valor da Helvetica! (risos)
Wd :: No processo de orientação visual do
ambiente, vocês utilizaram diversos ícones que
facilitam a navegação pelo projeto. Quais são os
cuidados na hora de incluir este elemento dentro
de um projeto interativo e digital? E, dentro de
um site, quando se nota a necessidade de criar
um ícone para que o usuário consiga realizar uma
determinada função?
Paulo :: O uso de ícones em um projeto gráfico
visa, além de facilitar navegação e entendimento dos
produtos, familiarizar o usuário com as ferramentas
que o ComiAli.com oferece.
Quando um visitante do site precisa encontrar
ou fazer um comentário sobre um restaurante, ele
sabe que o ícone “aspas” se refere a isso, agilizando e
aprimorando a experiência dele no website.
A escolha dos ícones foi definida após exaustiva
análise do uso de pictogramas na internet.
Precisávamos entender com o que o usuário estava
acostumado e familiarizado e, a partir disso,
desenharmos elementos que se adequassem com as
nossas necessidades e a identidade do portal.
ZONAInternet :: Não só os ícones, mas as
mensagens de alerta também foram pensadas
e planejadas para auxiliarem na navegação, não
deixando dúvidas sobre o uso das funcionalidades.
Wd :: O blog tem sido uma ferramenta
muito útil na produção de conteúdo pela web,
além de estimular a participação de usuários
em um ambiente. Neste projeto, vocês criaram
um blog (www.comialiblog.com), desenvolvido
em WordPress. Por que vocês escolheram
estudo de caso - ComiAli.com :: 59
esta ferramenta e quais foram os desafios na
personalização de seu template?
Paulo :: Queríamos ter uma separação muito
grande - e clara - entre o conteúdo colaborativo
gerado pelos usuários e conteúdo jornalístico e
informativo gerado pelos administradores do site.
A maneira mais simples e eficiente de disponibilizar
esse conteúdo jornalístico é um blog.
Escolhemos o WordPress porque é uma
ferramenta muito poderosa. Além de o módulo básico
ser gratuito, tem uma comunidade de apoio muito
ativa. Assim, podemos ter uma comunidade que
nos dá suporte e está sempre desenvolvendo novas
funcionalidades e widgets.
ZONAInternet :: O baixo custo e a flexibilidade
que o WordPress oferece são imbatíveis. As
possibilidades de customização são enormes e cada
vez mais oferecemos este tipo de solução para nossos
clientes. Outro ponto importante da utilização do
blog é que conseguimos ter mais controle sobre as
informações relevantes para as ferramentas de busca.
Wd :: Falando ainda sobre o blog, alguns
aspectos são essenciais para garantir sua evolução
qualitativa (tanto em termos da publicação de
posts, como a administração dos comentários por lá
postados) e evitar seu abandono meses após a sua
publicação. Como vocês procuraram trabalhar esta
questão no blog do projeto?
Paulo :: O relacionamento com leitores,
respondendo às suas perguntas, gerando
60 :: Webdesign
discussões e agradecendo por suas contribuições, é
de extrema importância.
Temos também algumas regras que aderimos: por
dia, nos comprometemos com o mínimo de dois posts
e, em relação aos comentários, temos uma regra de
aprovar ou recusar em, no máximo, quatro horas. É claro
que, se for de madrugada, fica para o dia seguinte.
ZONAInternet :: Este é um assunto recorrente
em nossas reuniões com clientes. De nada vai
adiantar um projeto bem realizado se as informações
e conteúdos necessários não estiverem atualizados
constantemente. Precisamos utilizar a agilidade da
internet a nosso favor.
Wd :: ASP.NET versão 3.5 e banco de dados
MySQL foram as tecnologias utilizadas para
construção do ComiAli.com. Quais parâmetros
a agência costuma avaliar na hora de definir as
plataformas de desenvolvimento de seus projetos?
ZONAInternet :: Em nossos projetos, sempre
sugerimos a utilização de plataformas seguras,
que possuem grande aceitação do mercado e com
boa relação custo vs. benefício. Muitas vezes, o
conhecimento que o cliente tem de uma plataforma é
determinante para a sua utilização. Assim, adotamos a
plataforma mais adequada ao projeto.
Wd :: Na visualização das características sobre
um estabelecimento cadastrado no site, o usuário
conta com uma funcionalidade do Google Maps
para localizá-lo geograficamente. Como surgiu
a ideia de utilizar este aplicativo e quais são os
cuidados na hora de implementar um serviço
disponibilizado por terceiros?
Paulo :: Já tínhamos visto esse aplicativo em sites
que frequentamos e achamos que seria muito prático
incluir essa função no site. O Google incentiva esse
tipo de mashup, portanto tivemos um suporte para
implementar essa funcionalidade.
Antes de instalar qualquer serviço de terceiros,
ele é analisado por nossa equipe que vistoria
cuidadosamente o script para checar se não há
nenhuma brecha de segurança. Além disso, é sempre
bom pesquisar sobre o aplicativo em fóruns, e
conversar com alguém que já o instalou.
ZONAInternet :: Sempre aconselhamos a
utilização de mashups, afinal, para que reinventar
algo que temos a nossa disposição pronto e
funcionando? Porém precisamos sempre avaliar se
este serviço é confiável, seguro e que impacto ele
pode ter na performance do projeto.
Wd :: Durante os contatos pré-entrevista,
vocês relataram que o desenvolvimento do projeto
foi baseado na metodologia MVC (http://migre.
me/rvN). Por que a escolha de tal metodologia
e quais são as suas principais vantagens na
concepção de projetos web?
ZONAInternet :: A metodologia MVC é utilizada
nos principais projetos desenvolvidos por nós. Essa
metodologia se mostra fundamental em projetos de
alta complexidade como o ComiAli. No nosso dia-a-
dia, a principal vantagem é a separação dos arquivos
usados pelos designers dos arquivos usados pelos
desenvolvedores, diminuindo bastante os “conflitos”
entre as equipes e agilizando todo o processo.
Wd :: Na edição de abril, publicamos uma
entrevista sobre a influência das metodologias
ágeis na área de design de interfaces, incluindo
uma análise sobre o manifesto web design ágil
(http://migre.me/rvO). Com a experiência na
construção do ComiAli.com, vocês poderiam
relatar as transformações que estes conceitos têm
trazido no modelo de produção e estruturação das
equipes das agências digitais?
ZONAInternet :: Empresas como a nossa, que
começaram como empresas de criação e com o
tempo passaram a oferecer soluções complexas, são
naturalmente avessas a longos processos de análise
“Baixo custo e a flexibilidade que o WordPress oferece são imbatíveis” (ZONAInternet)
estudo de caso - ComiAli.com :: 61
e documentação.
Nossa equipe, hoje com 11 pessoas, trabalha
com total integração, comunicação direta
em todos os níveis e todos possuem grandes
responsabilidades, e poder de decisão, nos projetos
que participam.
O ComiAli foi todo desenvolvido em torno de
sua interface e a documentação inicial do projeto era
composta pelo layout das telas, o wireframe e um
protótipo HTML. A documentação de TI foi feita só
depois da aprovação desses documentos iniciais.
Wd :: No artigo “Regras de uso e de
privacidade em sites e em portais”, o advogado
Gilberto Martins de Almeida destaca que
“à medida que websites e portais procuram
cativar visitantes e fidelizar clientela, formando
comunidades em ambientes tão autossuficientes
quanto seja possível, a atratividade e a segurança
do universo que visam formar dependem de certas
regras”. No formulário de cadastro de usuário
no ComiAli.com, o Termo de Uso e a Política de
Privacidade do site estão disponíveis de forma
bem clara. De que maneira esta etapa foi planejada
dentro do desenvolvimento do projeto?
Paulo :: Acho que a palavra mais importante é
“transparência”, afinal temos acesso às informações
pessoais dos usuários. Nossa obrigação é tratar
todos os visitantes do site com respeito e
sinceridade. É por isso que tanto nosso termo de
uso quanto a nossa política de privacidade estão
presentes (de forma visível e clara) no cadastro e no
rodapé do site. Os nossos usuários podem acessar
esses documentos sempre que lhes for conveniente.
“O ComiAli.com se torna uma espécie de ‘Orkut gastronômico’, que reúne milhares de pessoas em uma comunidade apaixonada por comida” (Paulo Klien)