
SolarSPELL x ASU Website Redesign
Redesigned SolarSPELL website to deliver a more intuitive and accessible user experience for remote communities accessing localized educational, health, and agricultural resources.
Organisation: SolarSPELL
Role: UI/UX Designer
Year: 2024
Status: Shipped
Overview
SolarSPELL is a solar-powered offline digital library that delivers localized educational, health, and agricultural resources to remote communities around the world.
When I joined the team, the website had significant usability and accessibility gaps, making it difficult for global users to explore the initiative, navigate content, or understand its impact.
Background
SolarSPELL is a solar-powered offline digital library that provides educational content to communities with limited internet access.
While the website plays a critical role in bridging the digital divide, its website was falling short in usability and efficiency, making it harder for users to find and access content.
Business Challenge: Why was a redesign needed ?
SolarSPELL’s mission to deliver offline educational content to remote communities was not reflected in its digital presence.
Despite its global impact, the website suffered from usability and accessibility issues, making it difficult for users to understand the initiative, explore resources, or engage with the content.

The Redesign: A User-First Approach
1 / Clear Navigation
Restructured the menu into clear, predictable categories (About, Libraries, Get Involved, Resources), and prioritized user flows based on analytics.

2/ Clarified Value Proposition on Homepage
Rewrote and repositioned the homepage hero section to immediately communicate SolarSPELL’s mission, impact, and how it works. Added quick access to “How It Works” and “Where We Work.”

3 / Decluttered Page Layouts
Consolidated scattered information into focused sections using consistent spacing, card-based layouts, and digestible content blocks.

4 / Established Visual Hierarchy
Used type scale, contrast, and consistent component styles to make key actions (like Donate, Learn More, or Partner With Us) stand out and easily scannable.

5 / Improved Accessibility Across Devices
Ensured all designs followed WCAG 2.1 AA guidelines, improved contrast ratios, designed for mobile-first, and added alt-text guidelines for content.

Research : Behind the Scenes
When I joined the SolarSPELL web team, there was growing recognition of the platform’s usability challenges, but no structured path toward solving them. I initiated and led the discovery phase by aligning stakeholders and grounding our decisions in both qualitative and quantitative data.
1 / How was the current site performing?
To understand the landscape, I began with a Heuristic Evaluation using Nielsen’s 10 usability principles.
This revealed significant gaps in navigation structure, content organization, and accessibility, directly impacting user engagement.

I also deployed a System Usability Scale (SUS) survey to quantify how users perceived the site’s ease of use.
The results fell below the industry benchmark, confirming the need for a redesign.

2 / User Research (Wants ≠ Needs)
A successful redesign isn’t built on assumptions it must align with real user behaviors and needs.
To gain a deeper understanding of how educators, students, and field volunteers interacted with SolarSPELL, I conducted a multi-method user research study.
Conducted 12 in-depth 1:1 interviews with a diverse group of educators, students & volunteers to uncover pain points and expectations.

Distributed an online survey to 30 users, gathering quantitative insights on navigation challenges, search behavior, & site usability ratings .

Used heatmaps, session recordings, & click tracking to analyze how users interacted with the content, identifying drop-off points & friction areas.

3 / Usability Testing
To further validate the heuristic evaluation and user research findings, I conducted usability testing with users from diverse backgrounds, including educators, students, and volunteers.
The goal was to observe how users interacted with the existing website and identify key usability pain points.



4 / What this told us?
While users expressed a desire for more content, the core issue lay in how that content was structured and surfaced.
The product vision focused on closing this gap by redefining the way information was presented and accessed.

Design & Iterations
1 / Refreshed Structure
Created a new site IA and navigation model based on user mental models.

2 / Modular Wireframes
Explored multiple low to mid fi - wireframe versions to test how users scanned the page and discovered content. Prioritized:

3 / Refined UI for Accessibility & Clarity
I made sure that the we used consistent branding aligned with SolarSPELL’s educational mission.
I increased contrast, typography scale, and spacing for readability. I also designed with WCAG 2.1 AA standards in mind.

4 / Real-World Testing to Inform Final Adjustments
Before launch, I conducted usability testing with real users, including educators and volunteers across different regions. Their feedback directly shaped:
I increased contrast, typography scale, and spacing for readability. I also designed with WCAG 2.1 AA standards in mind.

We measured

Challenges
While the redesign and handoff process were largely successful, we encountered several challenges that provided valuable lessons for future projects:
1 / Small Team & Limited Resources
I streamlined priorities by focusing on high-impact tasks first and maintained close collaboration with the developer to support quick, iterative implementation.
2 / Finding the Right Users for Research
I leveraged SolarSPELL’s existing partner networks, internal outreach efforts, and educator connections to gather meaningful insights.
3 / Maintaining Design Consistency
I created a scalable UI kit with reusable components, helping maintain visual alignment without adding complexity.
Impact & Retrospective
Throughout this project, I led end-to-end UX from research and IA restructuring to wireframes, prototypes, and testing.
1 / Improved Content Discoverability
+42% Increase in Homepage Engagement
After launch, heatmaps and scroll data showed a significant uptick in interaction with mission-driven content and CTAs on the homepage.
2 / Increased User Engagement
30% Faster Task Completion
Usability testing revealed that users were able to locate key information (e.g., library locations, how-to guides) 30% faster due to the improved navigation structure and content grouping.
3 / Improved User Clarity
80% of test participants
Were able to accurately explain SolarSPELL’s mission and functionality after viewing the new homepage, compared to 45% before the redesign (via SUS + qualitative survey responses).
4 / Reduction in Navigation Errors
58% drop in misclicks and backtracking
Misclicks and backtracking, indicating that the restructured IA and clearer menu labeling helped users stay oriented throughout their journey.
Design Systems
Design, Develop, Deliver: DSL’s Journey to a scalable Design System
