Adoopta — Pet adoption app

Criando um app de adoção de animais que conecta protetoras e adotantes por meio de um quiz de compatibilidade de estilo de vida.

Função UX/UI Designer
Ano 2023
Tipo Projeto acadêmico
Investigação
Typeform Notion Google NotebookLM Claude
Design
Figma
Stack técnico
React 18 Vite React Router v6 Framer Motion react-spring Tailwind CSS Radix UI Vercel
Ver protótipo
Adoopta hero
+286K animais recolhidos por protetoras na Espanha em 2023
45% taxa de adoção de cães — e cai a cada ano
15% dos abandonos são evitáveis com informação prévia

Fonte: Fundação Affinity, Estudio El Nunca Lo Haría 2024

Desafio

Dois públicos com necessidades opostas

Os protetores de animais precisavam de visibilidade e ferramentas para gerenciar solicitações. Os adotantes em potencial queriam orientação personalizada para não errar na escolha. Nenhum app no mercado conectava os dois de forma coerente.

43% dos entrevistados não se sentiam informados sobre os custos e responsabilidades de ter um animal de estimação. Muitos queriam ajudar, mas não podiam adotar.

Pesquisa

Método misto com dois públicos distintos

Conduzi pesquisa quantitativa e qualitativa em paralelo, com roteiros separados por perfil. O ponto-chave foi não misturar as sessões: cada público tinha suas próprias prioridades e sua própria linguagem.

81 participantes na pesquisa
43% sem informação sobre custos
10 usuários nos testes de usabilidade

Adotantes em potencial

36 enquetes · 6 entrevistas
Necessidade principal: orientação personalizada

Protetoras de animais

45 enquetes · 5 entrevistas
Necessidade principal: visibilidade e gestão

Solução

Um quiz que faz matches reais sem perder o usuário

O quiz de compatibilidade foi o desafio de design mais complexo. Precisava ser preciso — sem isso não há match real — mas também não podia ser exaustivo. Parti de 10 perguntas baseadas em estilo de vida, espaço disponível e personalidade.

Os testes de usabilidade mostraram uma taxa de abandono alta. Reduzi para 7 perguntas e o fluxo foi concluído sem fricção.

Fluxo completo do quiz de compatibilidade
Fluxo completo do quiz — as 7 perguntas e a tela de resultado do match
Quiz de compatibilidade
Quiz de compatibilidade — seleção de preferências de estilo de vida
Resultados do quiz
Tela de resultados — animais compatíveis ordenados por afinidade

Do match à adoção: um fluxo sem fricção

Com o quiz resolvido, o próximo desafio foi desenhar o fluxo completo em alta fidelidade: do match à confirmação de adoção. Oito telas que precisavam parecer naturais para alguém que nunca havia adotado.

O status da solicitação visível em todo momento foi a mudança mais valorizada nos testes: os adotantes precisavam saber exatamente em que etapa do processo estavam.

Fluxo completo em alta fidelidade — Home · Match · Solicitação · Status · Aprovação
Home · Match · Fluxo de adoção — 8 telas de alta fidelidade
Tela de match e perfil do animal
Match e perfil detalhado — 74% de compatibilidade junto à história do animal
Status da solicitação de adoção
Acompanhamento da solicitação — 4 etapas visíveis: Enviada · Em revisão · Entrevista · Aprovada

Para quem quer ajudar sem poder adotar

O apadrinhamento surgiu diretamente da pesquisa: muitos queriam contribuir financeiramente enquanto o animal espera por uma família. Desenhei duas modalidades — apadrinhamento econômico e acolhimento temporário — com um fluxo claro que mostra exatamente como cada euro doado é usado.

"Uma alternativa brilhante para quem quer ajudar sem poder adotar"

— Participante no teste de usabilidade
Fluxo completo de apadrinhamento — perfil, tipos, formulário, confirmação e estado ativo
Perfil · Já apadrinhado · Escolher tipo · Formulário · Confirmação · Estado ativo · Detalhamento de gastos

O detalhamento dos gastos mensais foi a decisão mais valorizada nos testes: ver que €20 cobrem 12% dos gastos reais de Senna gerou mais confiança do que qualquer texto motivacional.

Seleção do tipo de apadrinhamento e perfil já apadrinhado
Escolher tipo — econômico (aportação mensal) ou acolhimento temporário (o animal vai para sua casa). O perfil exibe o badge "Apadrinhado · €20/mês" com acesso direto para gerenciar.
Confirmação de apadrinhamento ativo e detalhamento de gastos
Apadrinhamento ativo — "Coco já conta com você" + detalhamento real dos gastos: alimentação €45, veterinário €32, medicação €18, higiene €10, enriquecimento €15, alojamento €48. Total €166/mês. Sua aportação de €20 cobre 12%.

Testing

10 usuários, 3 perfis, uma iteração-chave

Testes de usabilidade com 10 participantes: adotantes de primeira viagem, voluntários e funcionários de protetoras. O sistema de match foi avaliado como "útil e empático". O fluxo de doação precisou de uma revisão de copy e hierarquia visual para reduzir a fricção.

Iteração principal: simplificação do onboarding e redesign dos CTAs de contato com as protetoras.

Tela de exploração — Otto, 9 anos
Explorar animais perto de você — swipe com indicador de compatibilidade
É um match! — Coco quer te conhecer
Confirmação de match — Coco também quer te conhecer, 74% de compatibilidade
Perfil de Senna com apadrinhamento ativo
Perfil do animal — Senna, Border Collie, com apadrinhamento ativo visível

Resultado

Um sistema, não uma tela

A versão final incluía wireframes de baixa e média fidelidade, protótipo hi-fi no Figma e um design system básico com componentes-chave. A apresentação foi reconhecida pela profundidade da pesquisa e pela coerência entre os insights e as decisões de design.

Adoopta demonstra que um fluxo bem desenhado pode fechar a lacuna entre protetoras e adotantes — e que o apadrinhamento pode se tornar uma fonte de financiamento sustentável.

Reflexão

Adoopta foi meu primeiro projeto end-to-end com pesquisa real. Aprendi que desenhar para dois públicos com necessidades opostas exige sistemas, não telas. O quiz foi a solução mais difícil de validar — e também a que teve mais impacto nos testes com usuários.

Projeto concluído.

Você pode testá-lo agora mesmo.

Abrir protótipo

Outros projetos