Case Study
What is AdventureMinds?
AdventureMinds is a nonprofit organization focused on social-emotional learning (SEL) through movement-based experiences. It helps children build confidence, resilience, and emotional awareness through physical activities, immersive programs, and community-driven initiatives.
The Nonprofit Challenge
Beyond aesthetics, the organization faced critical business challenges: low donation conversion rates and difficult navigation for primary audiences parents seeking programs and educators looking for SEL resources.
<2%
Donation Conversion
68%
Bounce Rate
The Challenge
Problem Statement
AdventureMinds' previous website suffered from fundamental UX issues that hindered its ability to connect with parents, educators, and donors. The platform needed a complete overhaul to effectively communicate its mission and drive conversions.
Weak Visual Hierarchy
Content lacked clear structure, making it
difficult for users to identify key information
and navigate effectively.
Content Overload
Dense blocks of text and competing elements
overwhelmed visitors, reducing engagement
and comprehension.
Inconsistent Spacing &
Typography
Mixed font styles and irregular spacing
created a disjointed, unprofessional
appearance.
Low CTA Visibility
Donation buttons and key actions were buried,
resulting in poor conversion rates.
Poor Mobile Readability
The site was not optimized for mobile devices,
creating friction for on-the-go users.
Limited Emotional Storytelling
The mission and impact were not
communicated through compelling visuals or
narratives.
RESEARCH
Research & Insights
Combining heuristic evaluation, behavioral psychology, and funnel analysis to
identify actionable opportunities.
Funnel Drop-Off Analysis
Landing Page
100%
Scrolled to CTA
42%
Clicked Donate
18%
Completed Payment
8%
Major friction between amount selection → payment completion
Impact Drives Action
Users donate faster when impact is quantified.
Showing "$50 funds one session" increased intent by
34%.
Friction Kills Generosity
Long forms reduce impulse generosity. Mobile donors
abandon 3x faster when forms exceed 4 steps.
Trust Completes Payments
Trust signals (SSL badges, testimonials) near payment
increase completion rates by up to 28%.
Core Hypothesis
If we simplify the donation flow, elevate CTA visibility, improve content hierarchy, and strengthen
trust signals, then conversion rate will increase by reducing cognitive load and increasing
perceived trust.
Objectives
Goals & Objectives
The redesign focused on six key areas to transform the user experience and drive
meaningful results for the organization.
Improve Readability
Enhance content scannability with clear
typography hierarchy and strategic
whitespace.
01
Increase Conversions
Boost donation and contact form submissions
through optimized CTAs and reduced friction.
02
Strengthen Brand Identity
Create a cohesive visual language that reflects
AdventureMinds' mission and values.
03
Improve Accessibility
Ensure WCAG compliance with proper
contrast ratios, larger text sizes, and keyboard
navigation.
04
Simplify Navigation
Restructure information architecture for
intuitive wayfinding across all user journeys.
05
Emotional Connection
Use imagery and storytelling to create
meaningful connections with visitors.
06
The Transformation
Before vs After
A side-by-side comparison showing the dramatic improvements across key pages
and user flows.
BEFORE
Problem:
Generic headline with weak messaging hierarchy and unclear primary action reduced clarity of purpose.
AFTER
Improvement:
Clear, human-centered headline, stronger content hierarchy and defined CTAs guide users toward key actions quickly.
BEFORE
Problem:
Donation flow was hidden behind a separate page, making the process feel disconnected and adding friction to taking action.
AFTER
Improvement:
Added a donation funnel below the hero section with simplified options, clearer hierarchy and impact-driven messaging to encourage quick action.
BEFORE
Problem:
Generic headline and weak storytelling made the SEL page feel unclear and less engaging.
AFTER
Improvement:
Introduced clearer messaging, stronger narrative framing and improved visual hierarchy to better communicate the purpose of SEL.
BEFORE
Problem:
Text-heavy layout with vague messaging made the content hard to scan and reduced clarity of key benefits.
AFTER
Improvement:
Structured content into clear sections with visual hierarchy, concise messaging and highlight cards to improve readability and understanding.
Approach
Design Strategy
Four strategic pillars guided the redesign, ensuring every decision served both user
needs and business goals.
Visual Hierarchy
Clear Information Architecture
Clear heading scale (H1–H6)
Strong CTA emphasis with lime accent
Section separation using whitespace
F-pattern reading flow optimization
Accessibility Improvements
WCAG 2.1 AA Compliance
Higher contrast ratios (4.5:1 minimum)
Larger text sizes (16px base)
Improved button visibility
Keyboard navigation support
Conversion Optimization
Data-Driven Design Decisions
Sticky donate button on scroll
Clear donation tiers with impact
Simplified contact form (3 fields)
Social proof and trust signals
Brand Consistency
Unified Design Language
Unified color palette (lime + forest)
Consistent component styling
Reusable card systems
Iconography guidelines
Design System
UI System Highlights
A comprehensive design system ensuring consistency and scalability across all
touchpoints.
Button Styles
Primary CTA
Secondary
Card Components
After-School Clubs
Engaging activities for ages 5-12
$50
Funds one session
Typography Scale
H1 Heading
Satoshi Bold, 48-64px
H2 Heading
Satoshi Bold, 32-40px
H3 Subheading
Satoshi SemiBold, 20-24px
Body text using Inter Regular for optimal readability across all devices.
Color Palette
Lime Accent
#C8FF2E
Forest Dark
#0B1C1C
Off-White
#F6F7F6
Text Primary
#111C1C
Icon Usage
Donation
Community
Programs
Events
All icons use a 2px stroke width with rounded caps, maintaining consistency across
the interface.
Deliverables
Key Screens Showcase
A complete redesign of all major pages, each optimized for its specific purpose and
user journey.
Hero Section
Purpose: Clear, impact-driven entry point with strong messaging and action-focused CTAs.
UX Improvements:
Human-centered headline that communicates mission quickly
Strong visual hierarchy for better readability
Prominent primary and secondary CTAs for guided actions
User Flow
Donation Flow Breakdown
A streamlined 4-step donation process designed to minimize friction and maximize
conversion.
Donation Type
Choose between one-time or monthly
recurring donation
One-time gift option
Monthly sustainer program
Annual membership
01
Amount Selection
Select from preset tiers or enter a
custom amount
$25, $50, $100, $250, $500 tiers
Custom amount input
Suggested default
02
Impact Preview
See exactly how your donation makes
a difference
Real-time impact calculator
Specific program funding
Transparency metrics
03
Secure Payment
Complete donation with trusted
payment processors
Credit card / PayPal
SSL encryption
Tax receipt auto-send
04
Reduced Friction
Streamlined from 9 steps to 4, removing unnecessary
form fields and decisions.
Visual Trust Signals
Security badges, transparency metrics, and impact
previews build donor confidence.
Clear Hierarchy
Visual emphasis on recommended donation amounts
guides users to optimal choices.
OUTCOMES
Results & Expected Impact
Projected improvements based on usability testing, heuristic evaluation, and
industry benchmarks for nonprofit websites.
Readability Score
Before
62/100
After
94/100
+52%
Flesch Reading Ease improvement
CTA Visibility
Before
23%
After
89%
+287%
First-fold CTA detection rate
Bounce Risk
Before
High
After
Low
-45%
Projected bounce rate reduction
Trust Perception
Before
3.2/5
After
4.7/5
+47%
User trust survey score
Emotional Engagement
Before
4.1/5
After
4.8/5
+17%
Storytelling effectiveness rating
Accessibility Score
Before
71/100
After
96/100
+35%
WCAG 2.1 AA compliance score
Projected Business Impact
Based on industry benchmarks for nonprofit website redesigns, AdventureMinds can expect significant
improvements in donor engagement and conversion rates.
2.5x – 4x
Donation Increase
40–60%
Inquiry Uplift
85%
Overall
Improvement
Reflection
Learnings & Reflection
Key insights gained throughout the redesign process that will inform future projects.
Content Hierarchy is Critical
In nonprofit platforms, clear information architecture directly
impacts trust and conversion. Users need to quickly understand
the mission, impact, and how to engage.
Emotion Drives Engagement
Storytelling through imagery and personal narratives creates
deeper connections than statistics alone. Emotional engagement
leads to higher donation rates.
Conversion-Focused Layouts Matter
Every design decision should serve the conversion goal.
Strategic CTA placement, reduced form fields, and clear value
propositions significantly improve outcomes.
Accessibility is Universal Design
Accessibility improvements benefit all users, not just those with
disabilities. Better contrast, larger text, and clear navigation
improve everyone's experience.
Visual hierarchy, interaction design, and clear content work together to help users quickly understand purpose and take action.
AK
Aazam Khan
UI/UX Designer
Thank You
Designing with purpose to
support education, movement,
and community growth.
This case study represents my commitment to creating meaningful digital
experiences that drive real-world impact for organizations making a
difference.