Todos os trabalhos
Acordo Certo2021–22Product Design Manager, liderando uma dupla de design

Acordo Certo: uma plataforma de negociação de dívidas segura o bastante para dar o primeiro passo

A Acordo Certo é uma plataforma de negociação de dívidas gratuita para quem está devendo, e a home dela não passava segurança. Num time de design de duas pessoas, liderei a estratégia, a pesquisa, um workshop de visão com a empresa toda e a direção geral, com a Carolina Miguel, product designer júnior do meu time, dando forma ao visual do começo ao fim. O redesign, construído sobre o nosso design system Atlas, aumentou a conversão em 15%.

+15%De conversão na home e nas landing pages
3Arquétipos que a empresa adotou para falar dos clientes
AtlasDesign system construído pelo time (sem relação com a Atlas Technologies)
  • Liderança de design
  • Pesquisa JTBD
  • Design system
Empresa
Acordo Certo, plataforma brasileira de negociação de dívidas online
Meu papel
Product Design Manager, à frente de um time de design de duas pessoas
Time
Eu e a Carolina, product designer júnior, com Marketing, CRO, Atendimento e líderes de tribo
Período
2021–22
Resultado
+15% de conversão, o design system Atlas e novas vagas de design abertas

01 · O problema

A home de uma plataforma de negociação de dívidas não passava segurança.

A Acordo Certo ajuda brasileiros a negociar dívidas pela internet, sem passar horas no telefone. Para quem está devendo, é de graça: a empresa ganha uma porcentagem sobre cada acordo fechado na plataforma. A home e as landing pages eram o primeiro contato com o produto, e carregavam quatro problemas de uma vez.

01

A gente não conhecia nossos clientes

Sabíamos que havia clientes satisfeitos e insatisfeitos, mas não por que chegavam, ficavam ou desistiam.

02

Sem visão de produto

Sem conhecer o cliente, não havia uma imagem comum do que o produto deveria se tornar.

03

Sem design system

Componentes inconsistentes por todo lado, num produto em que as pessoas digitam CPF e dados financeiros.

04

Um problema de confiança

As avaliações online mostravam medo de golpe, experiências ruins no passado e um site que parecia confuso e suspeito.

Antes
Depois

02 · O time

Dupla de design: eu dava a direção, a Carolina dava forma.

Na Acordo Certo, o time de design era eu e a Carolina. Eu liderava a estratégia, a pesquisa, o workshop de visão e a direção geral: o que aprender primeiro, como aprender, quem chamar para a sala e como as peças iam se encaixar. A Carolina, product designer júnior do meu time, ajudou do começo ao fim, dando forma ao visual na UI. O discovery a gente fez lado a lado.

Matheus Serafim · Liderança de design

Liderei estratégia, pesquisa, o workshop de visão e a direção

  • Enquadrei o problema e o plano: clientes → visão → layout
  • Adaptei o Jobs-to-be-Done e conduzi as entrevistas
  • Planejei e facilitei o workshop de visão e o brainstorm
  • Dei a direção do design system Atlas
  • Fui mentor da Carolina no primeiro emprego dela em design
Juntos

Discovery, lado a lado

  • Entrevistas com clientes
  • Síntese e arquétipos
  • Matriz CSD, desk research, benchmark
  • Testes de usabilidade
Carolina · Product Designer Júnior

Deu forma ao visual, do começo ao fim

  • Wireframes e UI em alta fidelidade
  • Linguagem visual: tipografia, cor, formas, ilustração
  • Novos componentes do Atlas para a home
  • Páginas Sobre, Parceiros e landing pages de parceiros

A Carolina contou o projeto do ponto de vista dela no Medium (em inglês).

Redesenhar a página primeiro seria chutar. Então defini a ordem do trabalho: entender o cliente, construir uma visão de produto com a empresa e só depois desenhar o layout.

A ordem do trabalho · quem estava na sala Clientes primeiro, a empresa depois, pixels por último.
01Entrevistas Roteiro de Jobs-to-be-Done, conduzido lado a lado Promotores e detratores que tinham fechado acordo O trabalho: nome limpo e crédito de volta
02Arquétipos Síntese em três arquétipos e um storyboard Uma língua comum para falar do cliente Emergente, Aprendiz, Sobrevivente
03Visão Workshop planejado e facilitado Pessoas-chave leem “a matéria de amanhã” Pessoas, todos os dias, mais perto dos sonhos
04Brainstorm Double Diamond para a home Marketing, Atendimento, CRO, líderes de tribo Quatro pilares para a página
05Teste Protótipo de baixa fidelidade, mobile e desktop Uma rodada com usuários Três decisões que mudaram a página
06Construção Alta fidelidade no Atlas: a Carolina dá forma, eu dou a direção Home, Sobre, Parceiros, páginas de parceiros

Os clientes estavam na sala no começo e antes da construção. A empresa entrou no meio, onde se decidiu o produto.

03 · Discovery

Entrevistas sobre por que as pessoas negociam uma dívida, e o que vem depois.

Adaptei a entrevista de Jobs-to-be-Done ao nosso contexto, em cinco etapas que acompanham o cliente desde o primeiro pensamento sobre a dívida até a vida depois de quitá-la. Entrevistamos dois grupos que tinham fechado acordo: clientes satisfeitos e insatisfeitos.

Entrevistas de Jobs-to-be-Done · promotores (NPS > 8) e detratores (NPS < 6) Toda pergunta buscava entender o que a pessoa estava tentando resolver.
1Primeiro pensamentoQual foi a primeira coisa que passou pela sua cabeça quando você percebeu que tinha dívidas no seu nome?
2Busca passivaAconteceu alguma mudança na sua vida que fez você decidir negociar sua dívida?
3Busca ativaAlém da Acordo Certo, que outras opções você tinha para negociar a dívida?
4Fechamento do acordoComplete a frase: a Acordo Certo me ajudou a… para que eu pudesse…
5Depois do acordoAgora que a dívida está quitada, você conseguiu fazer algo que não conseguia antes?

As etapas antes e depois do acordo foram as que mais pesaram. Antes dele, perguntamos quando as pessoas começaram a notar as opções que tinham para limpar o nome. Depois, do que mais gostaram, do que menos gostaram e se agora conseguiam fazer algo que antes não conseguiam. As respostas quase nunca eram sobre a dívida em si.

O que a gente ouviu, de novo e de novo

“Ter o nome limpo é liberdade.”

O que as pessoas queriam era o crédito de volta: um cartão, uma casa, uma viagem. A dívida ficava entre elas e esses planos.

Quero tirar um cartão de crédito pra comprar minhas coisas, mas não consigo. Tenho que pagar tudo à vista.

Entrevista com cliente

Não usa palavra difícil, a gente não é especialista.

Entrevista com cliente

Eu achava que tinha que pagar tudo pra limpar o nome. Não sabia que a primeira parcela já tirava a restrição.

Entrevista com cliente
Gatilhos e motivadores
  • Contato constante dos credores
  • Precisar de crédito para realizar objetivos pessoais
  • Vergonha, e o peso de carregar uma dívida
  • Tentar controlar o dinheiro com planilhas
Obstáculos
  • Não conseguir acordo com o credor original
  • Pouca educação financeira, e muito jargão
  • Juros vistos como um muro
  • Dívidas maiores ficam para depois
  • Medo de golpe, e de passar dados por telefone
Como escolhem
  • Comparam plataformas atrás da melhor proposta
  • Checam se a empresa é confiável
  • Depois de fechar o acordo, não querem quebrar

Depois, distribuí os achados ao longo da jornada do cliente. Cada etapa carregava um medo próprio, e a página precisava responder a ele antes que o próximo passo parecesse seguro.

Os achados, ao longo da jornada De “dívidas no meu nome” a “crédito de novo”, cada etapa tem um peso próprio a tirar.
  1. 1 Primeiro pensamento O que a pessoa carrega

    Vergonha, o peso de carregar a dívida, credores ligando sem parar.

    O que precisa de nósAcolhimento antes de qualquer número.
  2. 2 Busca passiva O que a pessoa carrega

    Algo muda: a pessoa precisa de crédito para realizar um objetivo.

    Quero tirar um cartão de crédito pra comprar minhas coisas, mas não consigo. O que precisa de nósUm motivo para começar: os próprios planos.
  3. 3 Busca ativa O que a pessoa carrega

    Compara plataformas e checa quem é confiável. Medo de golpe, e de passar dados por telefone.

    O que precisa de nósProva de que é sério, sem ligação.
  4. 4 Fechamento do acordo O que a pessoa carrega

    Jargão, pouca educação financeira, juros vistos como um muro.

    Não usa palavra difícil, a gente não é especialista. O que precisa de nósPalavras simples e um processo à vista.
  5. 5 Depois do acordo O que a pessoa carrega

    Depois de fechar o acordo, não quer quebrar.

    Ter o nome limpo é liberdade. O que precisa de nósSaber o que vem depois, e que o nome vai ficar limpo.

Etapas do nosso roteiro de Jobs-to-be-Done; achados e falas das entrevistas. A curva é ilustrativa, não medida.

04 · Arquétipos

Três arquétipos, montados a partir do que as pessoas contaram.

Os rótulos que a gente tinha, promotor e detrator, devedor e pagador, não explicavam como as pessoas se comportavam. As entrevistas explicavam, então transformamos o que ouvimos em três arquétipos e num storyboard que a empresa toda podia usar para falar do cliente.

Arquétipo 1

O Emergente

Quer o nome limpo rápido para ter crédito, uma casa, uma viagem. Aceita um desconto menor em troca de prazo flexível, procura sinais de confiança e não volta depois de uma experiência ruim.

Arquétipo 2

O Aprendiz

Espera pelo maior desconto, mesmo que demore. Muitas vezes já caiu em golpe, tem vergonha da dívida e, quando fecha acordo, cumpre.

Arquétipo 3

O Sobrevivente

O básico vem primeiro. Menos digital, muitas vezes sem conta em banco, negocia na esperança de um emprego novo e tem mais chance de quebrar o acordo.

Storyboard para a empresa · de Sobrevivente a Emergente
  1. Perde o empregoMarcos se vira com bicos; as dívidas se acumulam.
  2. Um emprego melhorCom um salário melhor, ele volta a sonhar.
  3. Começa pelo pequenoChega um email da Acordo Certo. Ele quita primeiro as dívidas menores.
  4. VoltaMais estável, fecha as negociações que faltavam.
  5. Crédito de novoCartão de crédito e uma casa financiada para a família.

05 · Visão

Uma visão de produto escrita junto com a empresa.

Com os arquétipos em mãos, conduzi um workshop de visão de produto com pessoas-chave da empresa. O ponto de partida era uma máquina do tempo: ler a matéria de jornal de amanhã sobre o nosso produto e contar o que ela diz.

Workshop de visão · Máquina do tempo até 2022 Objetivo: ajudar as pessoas, todos os dias, a chegar mais perto dos seus sonhos por meio do bem-estar financeiro.

O ponto de partida: é fim de 2022 e você está lendo uma matéria sobre o nosso produto. O que ela diz?

“A gente ajuda e cuida de você para você conquistar seu bem-estar o quanto antes.”

“Somos como um abraço virtual e um suspiro de alívio no fim do dia.”

“Nada de palavras difíceis nem jargão complicado.”

06 · A home

Quatro pilares, decididos juntos.

Para a home, seguimos o Double Diamond e trouxemos Marketing, Atendimento, CRO e líderes de tribo para o brainstorm. Eles conheciam as dores da página antiga melhor que ninguém e, depois de ajudar a moldar a nova, saíram defendendo a página.

Double Diamond, para a home
01ImersãoDesk research · Matriz CSD · Benchmarking
02IdeaçãoBrainstorm com Marketing, Atendimento, CRO e líderes de tribo
03PrototipaçãoWireframes de baixa fidelidade no mobile e no desktop
04TesteProtótipo de baixa fidelidade testado com usuários
Textos ruinsLayout fracoFalta confiançaSem consistênciaBanner principalGenérico demaisVídeo fracoRodapé enormeBugsSuporte ao usuário

Agrupamentos que saíram do brainstorm com a empresa toda sobre a home antiga.

ConfortoUm assunto pesado, numa página leve.
ClarezaPalavras simples, uma ação principal, um processo à vista.
ConfiançaFotos do time, avaliações honestas, provas claras.
ConsistênciaUm sistema, os mesmos componentes em todo lugar.

07 · Testes

Poucos usuários, três decisões que mudaram a página.

Achado 01

Gente de verdade gera confiança

Fotos do time de verdade diminuíram o medo de golpe e fizeram a empresa parecer legítima. Elas foram para a home e a página Sobre.

Achado 02

Avaliação perfeita parece falsa

Escolhemos avaliações honestas, algumas com errinhos de digitação ou uma crítica, e linkamos para o Google para qualquer pessoa conferir.

Achado 03

Palavras simples, sempre

Todo termo financeiro que podia virar linguagem do dia a dia, virou.

08 · O resultado

Uma página mais leve, construída sobre o nosso design system.

A Carolina deu forma ao design em alta fidelidade, comigo na direção, em cima do Atlas, o design system que a gente vinha construindo. Layout limpo, formas arredondadas, uma tipografia mais amigável, uma paleta mais ampla para deixar leve um assunto pesado, ilustrações simples e o passo a passo da negociação na própria página.

Cada bloco da nova página veio de algo que ouvimos nas entrevistas ou vimos nos testes.

Anatomia da nova home · cada bloco ligado a uma evidência A nova home, bloco a bloco.
  1. 1
    Uma promessa, um campo, um botão“Não usa palavra difícil, a gente não é especialista.”
    Clareza
  2. 2
    Formas arredondadas, uma paleta mais ampla, ilustrações simplesVergonha, e o peso de carregar uma dívida
    Conforto
  3. 3
    Sem ligações, dito logo de caraMedo de golpe, e de passar dados por telefone
    Confiança
  4. 4
    O passo a passo da negociação, na própria página“Não sabia que a primeira parcela já tirava a restrição.”
    Clareza
  5. 5
    Fotos do time de verdadeTeste de usabilidade, achado 01
    Confiança
  6. 6
    Avaliações honestas, com link para o GoogleTeste de usabilidade, achado 02
    Confiança
  7. 7
    Todo bloco construído com o AtlasSem design system, num produto em que as pessoas digitam o CPF
    Consistência

Esboço em wireframe da nova home no desktop. As cores seguem os quatro pilares acima.

No celular, onde boa parte dessas negociações começa, a página abre com uma promessa só, o campo de CPF e um botão.

Atlas, o design system que construímos Um azul só e nenhuma regra viraram um sistema que trata com leveza um assunto pesado.
AzulCianoRoxoVerdeAmareloLaranja
Aa
MangueiraTítulos arredondados, já usados pelo MarketingSource SansTexto corrido fácil de ler
Formas arredondadas em cards, botões, formulários e fotos
Consultar CPF grátisVer parceirosDigite aqui o seu CPF

Tipografia e formas como definidas no redesign; paleta e componentes reconstruídos para este case.

09 · Impacto

Mais conversão e novas vagas de design.

Impacto

Um redesign “simples” que mexeu no principal número da empresa.

+15%De conversão na home e nas landing pages
3Arquétipos que a empresa adotou para falar dos clientes
1Design system, o Atlas, adotado no site inteiro
Novas vagasO design ficou visível o bastante para abrir novas vagas na área
Linguagem simples do começo ao fimConsistência entre as páginasEstrutura ainda no ar anos depois

Com o mesmo sistema, também redesenhamos as páginas Sobre e Parceiros e as landing pages de parceiros.

10 · Por que importa

O que este case diz sobre como eu lidero.

O que eu manteria
  • A ordem do trabalho: clientes, depois uma visão com a empresa, depois o layout. A página foi o último passo, e é por isso que ela se sustentou
  • Trazer Marketing, CRO e Atendimento para o brainstorm. Quem ajudou a moldar a página saiu defendendo a página
O que eu mudaria
  • Testar o protótipo de baixa fidelidade com mais gente e em mais de uma rodada, antes de partir para a alta fidelidade
  • Medir além da conversão: quantas primeiras parcelas foram pagas, e se os acordos se mantiveram
01Liderei ajudando uma designer júnior a crescerFui mentor de uma designer júnior enquanto ela dava forma à página mais importante da empresa, e eu segurava a direção.
02Pesquisa antes do layoutClientes primeiro, depois visão, depois pixels. A home veio por último.
03Trouxe a empresa para o discoveryMarketing, CRO, Atendimento e líderes de tribo ajudaram a moldar a solução, por isso também a defenderam.
04Construí o sistema por baixoO Atlas deixou esta página, e todas as que vieram depois, mais rápidas de fazer e mais consistentes.
05Desenhei para gerar confiança numa categoria sensívelGente de verdade, avaliações honestas e palavras simples, onde o medo de golpe é o maior obstáculo.
06Plantei cultura de designA visibilidade do trabalho abriu novas vagas de design na empresa.
Próximo case · Atlas Technologies Fatal Model: humanizando os anunciantes por trás da plataforma, das entrevistas em vídeo aos novos OKRs