Desafio: A ONG dependia principalmente de redes sociais para promover adoções e doações. No entanto, os processos eram manuais e pouco eficientes, resultando em baixa arrecadação e dificuldades para conectar adotantes e animais.

Solução: Um site intuitivo para a ONG Proteção Animal, facilitando doações com um botão fixo e QR Code PIX, aumentando a transparência com uma seção detalhada sobre o impacto das doações e agilizando adoções com um catálogo filtrável de animais.

PESQUISA E DESCOBERTAS

PONTOS PROBLEMÁTICOS

Durante as entrevistas, anotei os principais pontos levantados pelos participantes e, depois, organizei os insights em temas como doação, adoção, voluntariado, confiança e experiência no site. Essa separação ajudou a visualizar melhor as necessidades dos usuários e direcionar as soluções de forma mais clara e estratégica.

Doações complicadas: O processo via redes sociais era confuso e demorado (dificuldade para copiar a chave PIX ou entender como doar).

Desorganização visual: Nas redes sociais, a chave PIX muitas vezes se perdia em meio a outras informações, dificultando sua localização.

Falta de informações claras: Poucos detalhes sobre o estado de saúde e o comportamento dos animais disponíveis para adoção.

Dependência de mensagens privadas: Algumas doações só aconteciam após interação com a ONG para esclarecer dúvidas ou confirmar dados, criando atrito no processo.

IDEAÇÃO E SOLUÇÕES

Com base nos insights da pesquisa e nos objetivos do projeto, iniciei a fase de ideação, focando em criar uma estrutura que facilitasse as ações principais dos usuários: doar, adotar e se voluntariar. Primeiro, esbocei ideias em papel para explorar diferentes possibilidades de layout e organização dos conteúdos.

Depois, transformei essas ideias em um wireframe digital, priorizando:

• • Navegação intuitiva e simples;
• • Botões de chamada para ação bem destacados;
• • Fluxos rápidos para doação, adoção e cadastro de voluntários;
• • Comunicação visual acolhedora e direta.

Wireframes digitais

SITEMAP

O sitemap serviu como base para validar a hierarquia da informação e garantir que o fluxo do usuário fosse claro antes de avançar para o protótipo de alta fidelidade.

PROTÓTIPO ALTA FIDELIDADE

Desenvolvi o protótipo de alta fidelidade focando em criar uma experiência digital acolhedora, intuitiva e que incentivasse as ações principais: doar, adotar e se tornar voluntário.

Principais características do protótipo:

• • Visual emocional e acessível: Uso de cores suaves, imagens de impacto e tipografia amigável.
• • Fluxo de doação facilitado: Botões de destaque, QR Code funcional e valores sugeridos acompanhados de informações sobre o impacto.
• • Perfil completo dos animais para adoção: Com detalhes como idade, porte, comportamento e saúde.
• • Área para voluntariado e parcerias: Com informações claras e formulário de contato direto.
• • Layout responsivo: Garantindo boa experiência em desktop e mobile.

TESTE DE USABILIDADE

Para avaliar a efetividade do design e identificar possíveis pontos de melhoria, realizei um teste de usabilidade com um grupo de participantes com perfis próximos ao público-alvo.

O teste foi feito de forma remota, utilizando uma versão navegável do protótipo, e teve como principal tarefa a simulação de uma doação. Os participantes foram orientados a pensar em voz alta enquanto navegavam, permitindo observar suas reações, dúvidas e dificuldades em tempo real.

Durante o teste, observei o tempo de execução, comportamentos inesperados, erros de navegação e comentários espontâneos. Também coletei feedbacks ao final da tarefa com perguntas abertas para entender a percepção geral sobre a experiência.

As informações obtidas foram essenciais para identificar oportunidades de melhoria e realizar ajustes no design.

Após a realização de testes de usabilidade com um grupo diverso de usuários, foram identificados pontos positivos e áreas que precisam de melhorias.

Com base nos pontos de erro, realizei iterações no protótipo.

Navegação pouco clara na barra superior

• • Problema: O botão “Quero Ajudar” gerava ambiguidade. Os usuários não sabiam se ele levava à página de doações, adoção ou voluntariado.
• • Solução: Renomeamos o botão para “Quero Doar”, deixando a ação mais direta e intuitiva, facilitando a navegação.

Falta de informações relevantes sobre os animais para adoção

• • Problema: Usuários expressaram o desejo de visualizar detalhes como temperamento, castração, estado de saúde e possíveis deficiências.
• • Solução: Foram criadas novas seções na página de cada animal: - Temperamento (ex: dócil, brincalhão, independente) - Situação (ex: castrado, vacinado, vermifugado) - História (breve relato da trajetória do animal) - Observações (para informações complementares)

Falta de filtros de busca na seção de adoção

• • Problema: A busca estava limitada ao nome do animal, dificultando a navegação para usuários que buscavam por características específicas.
• • Solução: Implementamos filtros por: - Espécie (cães ou gatos) - Sexo (macho ou fêmea) - Porte (pequeno, médio, grande) - Localização (cidade ou bairro onde o animal se encontra)

Ausência de feedback visual após ações importantes

• • Problema: Ao clicar em “Enviar” ou “Doar”, os usuários não recebiam confirmação de que a ação havia sido concluída.
• • Solução: Adicionamos uma modal de agradecimento, com uma mensagem clara e acolhedora, confirmando o sucesso da ação.

CONCLUSÃO

O projeto da ONG Proteção Animal proporcionou uma experiência enriquecedora ao aplicar o processo completo de UX, desde a pesquisa com usuários até a criação de um protótipo de alta fidelidade. As melhorias implementadas, baseadas em testes reais, tornaram a navegação mais clara, a experiência de adoção mais informativa e o processo de doação mais acessível. Além do site, também desenvolvemos um dashboard interno para a equipe da ONG. Ele permite acompanhar as doações recebidas, visualizar cadastros de animais e gerenciar pedidos de adoção, facilitando a organização e aumentando a eficiência do trabalho diário. Esse projeto reforçou a importância do design centrado no usuário para gerar impacto social real e positivo.

LINKS