Todos os projetos

Telecom E-commerce B2C UX Research Arquitetura da Informação Acessibilidade WCAG

Vivo Fixa

Todo serviço residencial da Vivo — internet, TV e telefone — passa antes por uma consulta de disponibilidade. Era o funil inteiro entrando por uma porta que respondia apenas sim ou não. O redesenho transformou o não em quatro respostas diferentes, cada uma com saída própria: 80% de melhora percebida na navegação e 31% menos tempo de execução.

80%
relataram melhora na clareza e fluidez da navegação
67%
concluíram a contratação sem voltar telas
−31%
no tempo médio de execução das tarefas testadas
3
produtos integrados numa jornada só: internet, TV e telefone

Contexto

A Vivo operava internet, TV por assinatura e telefone fixo como três produtos em silos, com jornadas de compra fragmentadas. O projeto, na Accenture Song, era unificar os três numa jornada só — e toda essa jornada começa no mesmo lugar: a consulta de disponibilidade, que descobre quais pacotes existem para aquele endereço.

É a porta de entrada do funil inteiro. Se a consulta falha, nenhum dos três produtos chega a ser oferecido — não importa quão boa seja a página de planos depois dela.

Desafio

O problema central era que a consulta só sabia dizer sim ou não. E o "não" concentrava situações completamente diferentes entre si — algumas definitivas, outras a semanas de distância de virarem "sim".

  • Infraestrutura legada e regras de negócio complexas, com cada um dos três produtos carregando seus próprios requisitos obrigatórios.
  • Endereços que o sistema não resolvia, especialmente em condomínios, onde número e complemento têm significados diferentes dos de uma casa.
  • Coleta de dados sensíveis sem justificativa visível para o usuário, num momento em que ele ainda não recebeu nada em troca.
  • Público amplo e diverso, com níveis muito diferentes de letramento digital — o que tornou a conformidade WCAG um requisito de funcionamento, não de polimento.

Meu papel

Atuei como Product Designer dentro de uma operação de consultoria, liderando a frente de UX Research e Arquitetura da Informação e construindo a interface web para desktop e mobile:

  • Entrevistas com usuários e com stakeholders
  • Análise de clickstream e analytics da jornada atual
  • Inventário e auditoria de conteúdo
  • Sitemap e arquitetura da informação
  • Wireframe, interface e protótipo navegável
  • Review, handoff e entrega para desenvolvimento

Pesquisa

Cruzei três fontes: entrevistas com usuários, entrevistas com stakeholders — incluindo desenvolvedores e o departamento de infraestrutura — e clickstream e analytics da jornada em produção. As entrevistas técnicas foram decisivas: elas explicaram por que um endereço atendido ainda assim podia não receber o serviço.

Três oportunidades saíram desse cruzamento:

01

Conclusão do tempo de jornada

02

Tratamento do número de endereço

03

Tratamento de dados sensíveis

Quatro telas da consulta antiga: lista de cidades, formulário longo com nome, telefone, CEP e número, e a tela de indisponibilidade com o título Não fique triste
A jornada antiga: escolher a cidade, preencher tudo antes de saber se havia oferta e terminar num "não fique triste" sem saída.

Arquitetura da informação

O sitemap foi construído depois das entrevistas com desenvolvedores e infraestrutura, e não antes. Essa ordem é o ponto: a estrutura precisava espelhar como a disponibilidade é realmente apurada, senão a interface prometeria caminhos que o sistema não conseguiria cumprir.

A ramificação principal separa casa de condomínio logo após o endereço — porque condomínio exige complemento e tem uma cadeia de dependências própria (obra, contrato, capacidade de rede) que uma casa não tem. Da disponibilidade saem dois destinos: pacotes, quando há oferta, e prospecção, quando não há.

Sitemap da consulta: endereço, condomínio, complemento, disponibilidade, pacotes, indisponível e prospecção
O sitemap da consulta, construído a partir das regras reais de apuração de disponibilidade.

Consulta de endereço

O tratamento do número de endereço foi uma das três oportunidades levantadas — e um dos pontos onde a jornada mais quebrava. A solução combinou autocompletar, para reduzir a digitação e os erros de grafia, com dicas contextuais em cada campo, explicando o que preencher quando o endereço não segue o padrão.

Cada estado de erro ganhou mensagem própria por campo — nome, e-mail, telefone e complemento — em vez de um alerta genérico no topo do formulário. E o timeout, que antes deixava a pessoa sem resposta, passou a ter tela e caminho de saída.

  • Tela de consulta de endereço no desktop, com o campo de CEP preenchido e a lista de sugestões do autocompletar aberta
  • Tela de confirmação de endereço com os campos de bloco e apartamento separados
  • Tela de quebra comercial: o endereço tem cobertura, mas falta contrato com a administração do condomínio
  • Tela de endereço sem cobertura, com o campo para deixar contato e ser avisado quando o serviço chegar
As telas da consulta de endereço reunidas: campo de busca, sugestões do autocompletar, confirmação no mapa e os campos de complemento

Estados de indisponibilidade

Esta é a decisão central do projeto. Um endereço sem oferta não é um caso só: as entrevistas com infraestrutura revelaram quatro motivos distintos, com prazos e responsáveis diferentes. Tratá-los como um único "não disponível" descartava usuários que estavam a semanas de poder contratar.

Sitemap da prospecção: a partir de um endereço indisponível, os quatro motivos — sem cobertura, rede saturada, quebra técnica e quebra comercial — e o caminho de saída de cada um
Os quatro motivos de indisponibilidade e o caminho de saída de cada um, mapeados a partir das regras de apuração.

Desenhei um estado para cada motivo, com linguagem e ação próprias:

  • Sem cobertura — a região ou o endereço não é atendido por internet de alta velocidade e TV. É o único caso realmente definitivo; a saída é deixar contato para prospecção.
  • Rede saturada — o endereço é atendido, mas não há pontos de acesso disponíveis para os apartamentos. A rede está em expansão, então a tela informa o prazo e oferece aviso quando liberar.
  • Quebra técnica — há obra de adaptação pendente no condomínio. A tela pergunta se a obra já foi concluída, transformando o usuário em fonte de informação que a Vivo ainda não tinha.
  • Quebra comercial — falta o contrato com a administração do condomínio. A tela pede os dados da administração para a Vivo destravar a negociação.

Nos quatro casos, o endereço consultado fica visível na tela e há sempre um "fazer nova consulta". Ninguém termina a jornada num beco sem saída.

Sem cobertura

As telas do estado sem cobertura: o aviso de que o endereço não é atendido, o formulário de contato e a confirmação de que a pessoa será avisada

Rede saturada

As telas do estado de rede saturada: o aviso de que não há porta livre, o prazo de expansão e a opção de ser avisado quando liberar

Quebra técnica

As telas do estado de quebra técnica: a pergunta sobre a obra do condomínio e o encaminhamento para a visita técnica

Quebra comercial

As telas do estado de quebra comercial: o aviso da pendência de contrato e o formulário com os dados da administração do condomínio

Dados sensíveis

A terceira oportunidade da pesquisa era o tratamento de dados sensíveis. No estado de quebra comercial, a Vivo precisa dos dados da administração do condomínio — um pedido que, sem contexto, soa invasivo e trava o preenchimento.

Em vez de só coletar, desenhei uma tela que explica por que aquele dado é necessário: o papel legal da administração, quem arca com os custos de adaptação, e o compromisso de devolver o local como estava. A informação que destrava o preenchimento é a mesma que reduz a dúvida — e ela fica a um toque de distância, não escondida nos termos de uso.

Resultados

Após o deploy e o teste de validação final da jornada unificada:

80%

relataram melhora significativa na clareza e fluidez da navegação entre os três produtos

67%

concluíram tarefas como a contratação de combos sem precisar voltar telas

−31%

no tempo médio de execução das tarefas testadas

O ganho que não aparece nessas três porcentagens é o de recuperação: endereços que antes saíam da jornada com um "não disponível" agora saem com um prazo, um aviso agendado ou um dado que a Vivo precisava para destravar a própria infraestrutura.

Stack e ferramentas

Pesquisa
Lookback · Google Meet · Clickstream e analytics
Design
Sketch · InVision · Miro · Octopus
Entrega
Review · Handoff · Documentação de fluxo
Método
Entrevistas com stakeholders · Arquitetura da Informação · WCAG
Próximo projeto Bellagio

Vamos conversar