CASE STUDY 03 — SOCIAL IMPACT · ACADEMIA · 2023CASO DE ESTUDIO 03 — IMPACTO SOCIAL · ACADEMIA · 2023
WUF
Rediseño
Complete redesign of WUF's donation platform — an animal rescue association whose website made it impossible to understand how to help. Full Design Thinking process end to end.Rediseño completo de la plataforma de donaciones de WUF — una asociación de rescate animal cuya web hacía imposible entender cómo ayudar. Design Thinking de inicio a fin.
Social ImpactImpacto Social Design Thinking UX Research Donation UXUX de Donación
THE PROBLEMEL PROBLEMA
KEY INSIGHTHALLAZGO PRINCIPAL
Users arrived at WUF's website wanting to help — and left without donating. They couldn't find how to do it, or understand what plans existed. Good intentions were lost in design friction.Los usuarios llegaban a la web de WUF queriendo ayudar — y se iban sin donar. No encontraban cómo hacerlo, ni entendían qué planes existían. La buena intención se perdía en la fricción del diseño.
BEFOREANTES
No clear donation hierarchySin jerarquía clara de donación
Plans and prices buriedPlanes y precios enterrados
Generic CTA, no contextCTA genérico, sin contexto
No trust or urgencySin confianza ni urgencia
Confusing post-click flowFlujo confuso post-clic
User leaves · Doesn't know how to donateUsuario abandona · No sabe cómo donar
→
AFTERDESPUÉS
🐾 WUF — Donation Flow🐾 WUF — Flujo de donación
Visible plansPlanes visibles
Contextual CTACTA contextual
Visual trustConfianza visual
Clear processProceso claro
Impact shownImpacto mostrado
ConfirmationConfirmación
User donates · Understands the impactUsuario dona · Entiende el impacto
PROCESS — DESIGN THINKINGPROCESO — DESIGN THINKING
01
Empathize — User SurveysEmpatizar — Encuestas a usuarios
Designed and ran surveys with people who had visited animal donation platforms. Mapped what motivated them, what stopped them, and what information they needed before making a financial commitment to a cause.Diseñé y apliqué encuestas a personas que habían visitado plataformas de donación animal. Mapeé qué los motivaba, qué los frenaba y qué información necesitaban antes de comprometerse económicamente con una causa.
02
Define — Synthesis & Card SortingDefinir — Síntesis & Card Sorting
Synthesized findings into behavioral patterns. Conducted card sorting to understand how users mentally organize donation information — what they expect to see first, what they need to decide, and what generates distrust.Sinteticé los hallazgos en patrones de comportamiento. Realicé card sorting para entender cómo los usuarios organizan mentalmente la información de donación — qué esperan ver primero, qué necesitan para decidir y qué genera desconfianza.
03
Ideate — Benchmarking & FlowsIdear — Benchmarking & Flujos
Analyzed successful donation platforms (local and international) to identify patterns that work. Designed complete user flows: from first contact with the website to donation confirmation, covering all possible states.Analicé plataformas de donación exitosas (nacionales e internacionales) para identificar patrones que funcionan. Diseñé los flujos de usuario completos: desde el primer contacto con la web hasta la confirmación de donación, cubriendo todos los estados posibles.
04
Prototype — Wireframes → High fidelityPrototipar — Wireframes → Alta fidelidad
Built low-fidelity wireframes to validate the architecture before investing in UI. Once the flows were approved, I designed high-fidelity prototypes in Figma — with full visual system, components, and interactive states.Construí wireframes de baja fidelidad para validar la arquitectura antes de invertir en UI. Una vez aprobados los flujos, diseñé los prototipos en alta fidelidad en Figma — con sistema visual, componentes y estados interactivos completos.
05
Test — Prototype ValidationTestear — Validación del prototipo
Validated the prototype with users matching the same profile as the initial survey respondents. Measured whether the donation flow was now understandable, whether the plans were clear, and whether trust had increased compared to the original version.Validé el prototipo con usuarios del mismo perfil que los encuestados inicialmente. Medir si el flujo de donación era ahora comprensible, si los planes eran claros y si la confianza había aumentado respecto a la versión original.
RESEARCH METHODSMÉTODOS DE INVESTIGACIÓN
SurveysEncuestas
Structured questionnaires with potential donors to map motivations, barriers, and information needs before donating.Cuestionarios estructurados a potenciales donantes para mapear motivaciones, barreras y necesidades de información previas a la donación.
Card SortingCard Sorting
Mental organization exercise to understand how users structure donation plans and process information.Dinámica de organización mental para entender cómo los usuarios estructuran la información de planes y procesos de donación.
BenchmarkingBenchmarking
Competitive analysis of successful donation platforms to extract patterns of trust, conversion, and offer clarity.Análisis competitivo de plataformas de donación exitosas para extraer patrones de confianza, conversión y claridad de oferta.
User FlowsUser Flows
Complete mapping of the user journey from first contact to donation confirmation, including all error and success states.Mapeo completo del recorrido del usuario desde el primer contacto hasta la confirmación de donación, incluyendo todos los estados de error y éxito.
DELIVERABLESENTREGABLES
Research SynthesisSíntesis de Research
Information ArchitectureArquitectura de Información
User FlowsFlujos de Usuario
Wireframes (Lo-fi)Wireframes (Lo-fi)
High-Fidelity UIUI en Alta Fidelidad
Interactive PrototypePrototipo Interactivo
RESULTSRESULTADOS
5 fases
FULL DESIGN THINKINGDESIGN THINKING COMPLETO
End-to-end process from empathy to validation with real users.Proceso end-to-end desde empatía hasta validación con usuarios reales.
3+
RESEARCH METHODSMÉTODOS DE RESEARCH
Surveys, card sorting and benchmarking to back every design decision.Encuestas, card sorting y benchmarking para fundamentar cada decisión de diseño.
Flujo
claro
claro
CLEAR DONATION FLOWDONACIÓN COMPRENSIBLE
Users understand the plans and complete the donation process without friction.Usuarios entienden los planes y completan el proceso de donación sin fricción.
WHAT I LEARNEDLO QUE APRENDÍ
Emotion isn't enough — clarity closes the donationLa emoción no basta — la claridad cierra la donación
Users wanted to help — the barrier wasn't emotional but informational. People didn't donate because they couldn't find how or understand what they'd get. Removing that friction was more powerful than any emotional message.Los usuarios querían ayudar — la barrera no era emocional sino informacional. La gente no donaba porque no encontraba cómo ni entendía qué obtenía. Quitar esa fricción fue más poderoso que cualquier mensaje emotivo.
Card sorting reveals real mental modelsEl card sorting revela modelos mentales reales
I discovered my assumptions about what information was priority were wrong. Users organized donation plans in a radically different way from what I intuited — without card sorting, I would have designed for myself, not for them.Descubrí que mis suposiciones sobre qué información era prioritaria eran incorrectas. Los usuarios organizaban los planes de donación de forma radicalmente distinta a la que yo intuía — sin el card sorting, habría diseñado para mí, no para ellos.
Benchmarking isn't copying — it's understanding what works and whyBenchmarking no es copiar — es entender qué funciona y por qué
Analyzing successful platforms taught me trust patterns: testimonials, impact counters, specific CTAs. But I also learned to identify when those patterns weren't transferable to WUF's local context.Analizar plataformas exitosas me enseñó patrones de confianza: testimonios, contadores de impacto, CTAs específicos. Pero también aprendí a identificar cuándo esos patrones no eran transferibles al contexto local de WUF.
Design Thinking as a framework, not a recipeDesign Thinking como marco, no como receta
The process wasn't linear — I went back to empathize during prototyping when the flow wasn't working. I learned that the phases are a compass, not a rigid sequence, and that the quality of the outcome depends on how honestly you do each one.El proceso no fue lineal — volví a empatizar en la fase de prototipado cuando el flujo no funcionaba. Aprendí que las fases son una brújula, no una secuencia rígida, y que la calidad del resultado depende de la honestidad con que haces cada una.