Product UX Review: Famintoo.com

Erros que você também pode estar cometendo

Tive a oportunidade de participar do Hack2B em Londrina, organizado pelo GBG-Londrina, e fiquei impressionada com a quantidade de projetos bacanas que andam rolando por lá. Além de um workshop de Design Sprint, conversei com algumas startups sobre algumas oportunidades de melhoria que encontrei em seus produtos, e que são mais comuns do que imaginamos. Selecionei alguns dos pontos principais do Famintoo para compartilhar por aqui :)

“O Famintoo é o maior guia coletivo de cardápios do Brasil. Os próprios usuários que cadastram cardápios, editam informações e dão suas opiniões. Tudo de graça, por isso é coletivo/colaborativo. É possível ver informações dos restaurantes (endereço, telefone, horário de atendimento, entre outras), cardápio com preços, opinião dos usuários, fotos e muito mais.”

1) Tenha um Call-To-Action (CTA) claro

Um CTA é geralmente um botão em seu produto que direciona seu potencial consumidor para que ele se transforme em um lead (Lead, para Marketing Digital, é um potencial consumidor de uma marca que demonstrou interesse em consumir o seu produto ou serviço.) Ele é a transição de um conteúdo comum que o visitante pode estar interessado, para um conteúdo de maior valor, mais relevante e interessante o suficiente para convence-lo a preencher um formulário.

O CTA deve ser:

• Visualmente atrativo — a ponto de você não conseguir deixar de clicar nele;
• Curto — não mais do que 5 palavras (mas por favor, tente 3 ;) );
• Orientado à ação — Comece com um verbo;
• Dê uma cor contrastante — mas que ainda siga a paleta de cores do produto;
• Grande o suficiente pra ser visto à distância — mas não tão grande que distraia a atenção do restante do conteúdo;
• Localizado de forma que siga o fluxo de informações da interface e que não tenha elementos próximos que distraiam a sua atenção (como o leãozinho ali) ;
• Informe exatamente o que o consumidor vai encontrar ao dar seu valioso clique.

Quer um bom exemplo de CTA? Taí ó:

2) Facilite as decisões do usuário

Quanto menos ações você exigir do usuário, mais fluída será a navegação, e portanto, a experiência. Quanto mais opções você oferecer, maior será o tempo dele na utilização — o que, dependendo do cenário, não é nada nada bom.

Ok, sabemos que para determinar a localização do usuário automaticamente na web não é tão assertivo (especialmente comparando com mobile), mas por que não sugerir e permitir que o seu cliente altere? Já pensou que lindeza seria para aquele grande % que você acertar? :)

3) Pense bem: qual o valor do seu pixel ?

Depois de acessar seu site, clicar no CTA, escolher a cidade, a primeira tela disponível não mostra informação que o usuário estava buscando, exigindo rolagem. Além disto, segmenta as informações relacionadas (por que vou querer re-ordenar sem sequer ter visto minhas opções ainda?), e exibe funcionalidades pouco relevantes (por que vou querer visualizar mais publicidade?). Publicidade é necessária em alguns modelos de negócios, mas deve ser planejada com carinho para não ferir a experiência do usuário como um todo.

Considere também que uma interface clean não é uma interface com espaço em branco mal aproveitado. Uma interface clean é uma interface assertiva: pouca informação, mas exatamente o suficiente para que o usuário alcance seus objetivos.

Seu pixel é importante. Faça bom uso dele :)

4) Conheça seu usuário

A disponibilização e organização de seu conteúdo deve ser feita de acordo com os interesses de seu usuário. Além disto, todo rótulo deve ter algum significado.

Não tem como a gente falar de experiência do usuário sem falar de pesquisas com usuários. Afinal, não há como projetarmos para ele sem conhece-lo.

Vale uma revisão geral considerando alguns pontos:

• Quais informações são importantes para seus usuários?
• O que deve ser destacado aqui?
• Qual ordenação faz mais sentido? Mesmo que você permita diferentes visualizações, a mais relevante deve ser a default.
• Quais informações a respeito do restaurante ou do cardápio são utilizadas para a tomada de decisão, e devem ser exibidas na listagem?
• O seu usuário busca ou explora mais? A busca está com o destaque necessário?
• A identificação de aberto e fechado está clara? Os restaurantes abertos estão com destaque adequado com relação aos fechados?
• Que informação o rótulo “Obs.” está querendo transmitir?

Além de entrevistas com usuários e testes de usabilidade, faça um exercício com cenários para visualizar como sua solução está respondendo a eles. Por exemplo: “Ana é vegetariana e está buscando um restaurante em um domingo a noite que faça a entrega em até 30min em sua casa. Gostaria de pagar com Vale Refeição”. Como a Ana navegaria no seu site? Quais são suas necessidades e como você irá soluciona-las? É claro, faça isso após as entrevistas pra que seja o mais realista possível de acordo com seus usuários e suas necessidades.

Desconstruindo…

Tendo dito tudo isto, que tal facilitarmos mais ainda a vida do usuário trazendo pra ele logo ‘de cara’ aquilo que ele quer? :)

Este é só um exercício em wireframe de uma de inúmeras opções que podem ser exploradas. Ainda são necessárias pesquisas para validar as informações que devem estar na listagem; mas já pode ser um ponto de partida.

Reparem que foi inserido a informação da cidade identificada no canto superior direito, e que pode ser alterada a qualquer momento. Além disto, trouxe um “teaser” antes da rolagem, para estimular a curiosidade e consequentemente a navegação pelo restante da página.

Na listagem de estabelecimentos, acrescentei a distância do usuário, retirei os labels para aproveitar melhor o espaço e agrupei as informações relacionadas. Dei destaque para o favoritar — pensando em um cenário que o usuário vai fazer uma lista de estabelecimentos para decidir com outra pessoa. Também acrescentei uma área para informações comuns aos restaurantes, e que podem ser relevantes para a tomada de decisão (se tem estacionamento, qual a faixa de preço, etc.).

Reforçando que são sugestões sem conhecimento do público-alvo e suas necessidades — portanto passível de ser alterado.

O que você achou? Comenta aí :)

Análise feita no macOS Sierra 10.12.2, Chrome Version 55.0.2883.95, 1440X900; em 20/01/2016.

“Giving it away” é um princípio de que podemos nos desapegar de muitas coisas para ajudar as pessoas. Pode ser comida, dinheiro, idéias, conhecimento, etc. De alguma forma, todos crescemos juntos assim. Esta é minha forma de “Give it away”. Se você também acredita nisto, e quer ver a avaliação de seu produto aqui, fala aí.