Caso de uso de Testes A/B para melhorias na experiência dos Portais Claro

Melhorando a experiência dos portais

Em 2017, a Bemobi se deparou com um desafio: os portais No Credit & No Data da operadora Claro, dos quais éramos responsáveis, já não correspondiam às expectativas de performance e a própria operadora sentiu a necessidade de fazer um upgrade na experiência.

Dentro desse desafio, começamos os estudos para identificar a melhor forma de alcançar bons resultados e fui responsável junto à equipe de trazer novas propostas para as questões que seriam levantadas.

 

Conceitos NoCredit & NoData

Os portais No Credit e No Data são direcionados para usuários que não possuem créditos ou dados suficientes para navegar. A ideia desses portais é servir como uma ponte para que o indivíduo faça uma recarga. Além dessa ação, contam também com uma área de vendas de produtos de entretenimento SVA (serviços de valor adicionado).

 

 

desafio

Identificar os problemas e resolvê-los

O principal objetivo desse projeto foi identificar quais eram os possíveis  problemas que impediam-nos de crescer no quesito engajamento e trazer uma forma mais amigável nesse ponto delicado e estressante que é o usuário se deparar com a falta de créditos ou dados, tornando a experiência menos desagradável.

Além disso, estávamos procurando uma forma de melhorar a experiência dentro da própria empresa na questão de desenvolvimento de promoções de produtos SVA nos portais. Com esse projeto, pudemos avaliar qual seria o melhor caminho de tornar nosso processo de criação de banners dos produtos o mais eficaz, produtivo e vendável possível.

Nosso ponto de partida se deu com as seguintes questões:

  1. Manter as páginas com carregamento leve e rápido
  2. Melhorar o engajamento do usuário na página, tornando a experiência de compra de créditos/dados ou SVA simples e, principalmente, clara.
  3. Melhorar, dentro da empresa, o processo de criação dos banners SVA permitindo um desenvolvimento de promoções de produtos mais rápido e dinâmico.

 

Meu papel no projeto

Junto com a UX Lead da equipe, Lais, fui responsável pela análise de testes de usabilidade de portais feitos anteriormente, levantamento de questões, design de experiência do usuário e o design de interface.

Além disso, trabalhei juntamente com o desenvolvedor front-end responsável pela implementação posterior para enxergar as limitações e desafios correspondentes e a equipe de marketing responsável pelos banners SVA para entender suas necessidades.

 

 

abordagem

Como avaliar e propor mudanças em um ambiente onde é imprescindível a confiança

Nos testes de usabilidade analisados anteriormente, nos deparamos com uma questão que pode parecer familiar: numa recarga, o maior medo dos usuários era não ter clareza nos passos fazendo com que, no fim, acabassem comprando algo que não desejavam a princípio.

Em transações que envolvem dinheiro, um sentimento normal de desconfiança – principalmente num ambiente online – nos acomete. Numa situação de recarga de créditos ou dados não seria diferente, ainda mais quando falamos de usuários com menos contato tecnológico.

Às vezes em um ambiente não amigável, um passo em falso pode nos fazer concluir uma compra ou assinar algo que não queremos gerando um transtorno ao usuário refletindo negativamente a imagem da empresa em questão, prejudicando o relacionamento entre ambos.

Pensando nessa questão levantada, analisamos como poderíamos fazer uma transição entre um portal antigo e um portal novo, sem gerar transtornos e melhorá-lo a ponto de sanar esse tipo de problema na relação usuário-interface.

Foi nesse ponto que chegamos na ideia de levantarmos hipóteses e prová-las (ou não) em testes A/B. Essa solução faria uma mudança gradual em nossos portais gerando menos desconforto que com uma mudança radical traria tanto para usuário quanto para a operadora, e dessa forma, conseguiríamos começar a entender melhor o nosso usuário.

 

 

Analisando o que tínhamos em mãos

Antes de começar, fizemos uma rápida análise sobre como era o nosso portal atual, afim de estruturarmos um plano de testes. Percebemos nesse ponto, a existência de três principais blocos na interface que impactam diretamente na experiência.

  1. A mensagem
  2. Call to action
  3. Banners VAS

 

home-sections

 

processo

 

Mensagem: o canal de comunicação

A primeira hipótese levantada foi que a mensagem a ser exibida no momento deveria parecer mais amigável e próxima da linguagem do usuário e além disso, deixar claro que o processo é simples e só possui um passo até o objetivo final. O processo de recarga é simples, e isso não ficava claro ao usuário, gerando uma ansiedade na hora de clicar sem saber o que viria depois.

Outro ponto é que em quanto menos palavras propormos o objetivo da ação, com mais facilidade o usuário percebe a vantagem de seguir. O momento de atenção dentro de um ambiente mobile é algo valioso e curto, que deveríamos aproveitar da melhor maneira.

Dessa forma, propomos duas frases que poderiam ser mais claras e objetivas para a realização do primeiro teste.

  1. Você está sem saldo.
    Faça uma recarga agora. É rápido e fácil, clique no botão abaixo.
  2. Seus créditos acabaram :[
    Você está a apenas um passo de continuar. Faça uma recarga agora.
  3. Você está sem saldo :[
    Recarregue agora. É fácil e rápido.

teste-01

 

 Área de Recarga

Já na segunda hipótese, a questão era explorar o layout da seção de recarga, tornando mais moderno e clean, já na tentativa de diminuir a sensação de página de spam mencionada por alguns usuários.

02

 

Call-to-action: a vida da página

Em uma página No Credit/No Data o principal objetivo é fazer com que o usuário efetue uma recarga sem transtornos para conseguir voltar a navegar. Nesse cenário o call-to-action se torna o protagonista da cena. É a partir dele que o fluxo se completa.

Dessa forma, queríamos fazer com que o mesmo sobressaísse na página sendo realmente um imã para os olhos.

Outro ponto importante que enxergamos, foi a questão de deixar as informações claras e objetivas ao usuário. Dessa forma, trouxemos já para a página do portal os principais valores de recarga afim de diminuir dúvidas e incertezas no ponto de decisão de seguir ou não para o próximo passo.

03

 

Banners SVA: o desafio interno

04

Nos testes dos banners VAS, o principal objetivo era, além de criar banners que fossem mais apelativos ao clique, de otimizar o processo de realização dos mesmos. No primeiro exemplo, o banner inteiro era constituído de uma única imagem incluindo textos e nome do produto.

Nos dois exemplos seguintes que foram propostos, as imagens maiores chamam maior atenção para o produto, as informações ficam claras e, ainda, poderiam ser facilmente alteradas, tanto imagem quanto textos, pela equipe de marketing via CMS. Essa otimização do processo tornava a realização de testes e promoção de produtos muito mais rápida e eficiente. Propomos então duas maneiras de apresentá-los para a execução de um teste.

 

Último e não menos importante: promoções

Fizemos um teste sobre como poderiam ser implementados banners de promoções exclusivas da Claro na interface caso chegássemos através dos testes realmente em um novo portal.

05

Dessa forma, estruturamos um plano de testes que levaria um certo tempo até a sua conclusão. Conforme os resultados fossem se mostrando, nós teríamos uma maior gama de informações sobre nossos usuários e estruturaríamos também a linguagem de outros portais similares.