Education Above All

Education Above All

Global Platform Redesign for Digital Transformation and Client-Centric Impact

Global Platform Redesign for Digital Transformation and Client-Centric Impact

UX/UI Design

UX/UI Design

UX/UI Design

Information Architecture

Information Architecture

Information Architecture

Prototyping

Prototyping

Prototyping

Cover Image
Cover Image
Cover Image

About the project

About the project

About the project

Problem

Fragmented digital presence across multiple initiatives

Education Above All (EAA) is a global initiative founded by Her Highness Sheikha Moza bint Nasser, focused on addressing educational disparities, especially in conflict zones. EAA faced the challenge of addressing educational disparities, while struggling with a disjointed digital ecosystem amidst a major organizational restructuring. EAA's operations spanned across 5 initiatives; Educate A Child (EAC), Al Fakhoora, Reach Out to Asia (ROTA), Protect Education in Insecurity and Conflict (PEIC), and Silatech, each operating on separate websites, with different content strategies and navigation systems, each with its own branding, structure, and audience, created confusion, weakened brand identity, and made it difficult to communicate EAA’s collective impact.

This fragmented approach that resulted in inconsistent messaging was born of inefficiencies within internal and network stakeholders engagement. The real challenge was not just a visible redesign, but the need for internal alignment and restructuring their digital presence to reflect a singular, cohesive brand.

Solution

A Unified, Scalable Platform enabling Global Impact

I led the design of a mobile-first platform that consolidated EAA’s five initiatives into one cohesive, accessible site. By streamlining content, optimizing bandwidth, and aligning internal processes, we created a scalable solution that supported EAA’s diverse programs while maintaining a strong, unified brand identity. Key features included program-specific sections, intuitive navigation, and a dynamic backend to accommodate future growth.

Client

Education Above All (EAA)

Client

Education Above All (EAA)

Client

Education Above All (EAA)

Stack

Adobe XD Sketch Figma WordPress (CMS)

Stack

Adobe XD Sketch Figma WordPress (CMS)

Stack

Adobe XD Sketch Figma WordPress (CMS)

Role

Design Strategist, Lead UX Designer

Role

Design Strategist, Lead UX Designer

Role

Design Strategist, Lead UX Designer

Year

2018-2019

Year

2018-2019

Year

2018-2019

Hero Section
Hero Section
Hero Section

Latest featured
Latest featured
Latest featured

Key themes submenu
Key themes submenu
Key themes submenu

Support EAA
Support EAA
Support EAA

Interactive impact map
Interactive impact map
Interactive impact map

Our research
Our research
Our research

CTA Footer
CTA Footer
CTA Footer

Stakeholder Mapping
Stakeholder Mapping
Stakeholder Mapping

Stakeholder management
Stakeholder management
Stakeholder management

Visuals

Visuals

Visuals

Key issues

EAA needed a unified approach to align its global initiatives and strengthen its collective voice without compromising the individuality of each program.

  • Global Operations Complexity: EAA’s operations needed to be aligned under one platform, where the collective impact of all initiatives could be clearly showcased, without losing the interests of the various stakeholders or diminishing the unique contributions to society for each of the programs.

  • Inconsistent Messaging: Each program had its own unique branding, structure and workflows, pursuant to their own audiences and business vision adapted to fit into the new collective EAA strategy. This fragmented approach resulted in inconsistent messaging, difficulty in presenting the collective impact of EAA.

  • Inefficient User Experience: Each initiative had its own unique mission and audience that directed the program’s digital presence. Despite these differences, there was a need for a unified platform that could effectively represent each initiative while maintaining a cohesive global brand for EAA.

    • EAC needed to address global education gaps and advocate for out-of-school children.

    • Al Fakhoora had to communicate the urgency of supporting education in conflict zones, requiring sensitive content and a compassionate narrative.

    • ROTA’s regional focus demanded a multilingual interface with region-specific information and interactive tools.

    • PEIC needed to highlight complex legal frameworks and the protection of education in conflict areas.

    • Silatech was focused on empowering youth through employment, requiring dynamic, youth-friendly content and interactive career tools.

Opportunities

The key challenge was shifting EAA’s digital presence from multiple fragmented websites to a cohesive digital ecosystem that could reflect their global mission while catering to the unique needs of each program. This was not just about redesigning websites, it was about realigning the organization’s digital identity and ensuring that all internal and external stakeholders had clarity on EAA’s global educational impact.

  • Unify the Brand: Bring together all five initiatives into one cohesive platform that communicates EAA's global mission and collective impact.

  • Create a Dynamic User Experience: Prioritize a user-centered experience that adapts to the needs of various audiences, from grassroots organizations to policymakers.

  • Elevate the Impact Narrative: Emphasize impact-driven storytelling to effectively communicate the urgency and success of EAA’s work, offsetting the retiring brands and their equities, reinforcing EAA’s role as a leader in global education development.

Key features

Our solution involved facilitating an update to their internal data and content creation processes and designing a dynamic, scalable platform that could support the unique needs of EAA’s multiple programs, while maintaining a cohesive brand identity.

  • Program-Specific Sections: After extracting the over-arching themes of EAAs initiatives, each of EAA’s five programs—Educate A Child, Al Fakhoora, Reach Out to Asia, Protect Education in Insecurity and Conflict, and Silatech—had dedicated sections that allowed for tailored messaging and program-specific content, maintaining their connection with their legacy audience and visitors to retain brand equity.

  • Responsive Design: A mobile-first, responsive design ensured accessibility for all users, especially in low-bandwidth environments, which was crucial for regions affected by conflict and poverty.

  • Multilingual Support: Multilingual content ensured that local communities and stakeholders could engage with the platform in their preferred languages.

  • Interactive Impact Dashboards: Real-time tracking of key metrics, such as the number of children educated or the number of youth employed, allowed users to see the direct impact of EAA’s work.

  • Collaborative Features for Partners: A section dedicated to partners, donors, and stakeholders, enabling easy access to information, resources, and collaboration opportunities.

Methodologies

To execute this project, we followed a human-centered design process that integrated strategic thinking, research, and iterative testing:

  • Facilitated 2 Co-creation Workshops

  • Conducted 9 in-depth Interviews

  • Engaged 30+ Leaders and Stakeholders Engaged

  • Stakeholder Workshops: Conducted discovery and co-creation workshops with cross-functional teams and key stakeholders to understand their goals, pain points, and vision for the new platform, ensuring alignment across the board.

  • User Research: Conducted extensive user research, creating personas to better understand the needs of EAA’s diverse audience, including policymakers, educators, and community leaders.

  • Information Architecture (IA): Developed a new IA that streamlined content across all five programs, enabling users to seamlessly navigate the site and find relevant information quickly.

  • Wireframing & Prototyping: Created wireframes and prototypes for key pages, tested iteratively with users, client teams and stakeholders to refine the user experience and interface.

  • Design & Development Collaboration: Worked closely with the client and development team to ensure that the design was scalable, flexible, and easy to maintain, integrating the CMS with the front-end for ease of content management.

Outcome

The new EAA website successfully brought together all five initiatives under one unified platform, achieving several key outcomes:

  • Increased Engagement: Stakeholders, including policymakers, donors, and grassroots organizations, now have a one-stop hub for accessing relevant resources, resulting in higher engagement and collaboration.

  • Improved Usability: The responsive design and low-bandwidth optimization ensured that users in conflict zones could easily access the platform, even with limited internet connectivity.

  • Stronger Brand Unity: The unified platform reinforced EAA’s position as a global leader in education, while still maintaining the individual identities of each initiative.

  • Impact Measurement: Interactive dashboards allowed users to track real-time progress, demonstrating the tangible effects of EAA’s programs on education and youth employment globally.

Reflections

  1. Global Impact with Local Relevance: Balancing global brand cohesion with localized content for diverse audiences was critical. Each initiative needed to resonate with local communities, while still contributing to EAA’s unified mission.

  2. Empathy in UX Design: The project highlighted the importance of designing with empathy, especially for users in crisis zones and marginalized communities. Accessibility and simplicity were prioritized to ensure an inclusive user experience.

  3. Collaboration is Essential: The success of this project was driven by strong internal collaboration. Aligning diverse stakeholders with different perspectives and objectives was essential in creating a unified platform that met the needs of all users.

  4. Data-Driven Storytelling: The integration of real-time impact metrics and visual storytelling elements allowed EAA to showcase their work and results in a way that was both engaging and measurable, empowering stakeholders to take informed action.

Create a free website with Framer, the website builder loved by startups, designers and agencies.