plavio Uganda

UX/UI Design

Figma Prototyping

Visual Identity

Project Year

2024
Duration 2 weeks
(Design, Research, Owner Feedback)

Client

HoneOkello Augustine Kezzy-Founder

Industry

NGO Uganda Africa

About PLAVIO Uganda

Plavio Uganda is a Christian NGO based in Lira City, Uganda, dedicated to transforming lives through spiritual growth, education, economic empowerment, gender equality, climate resilience, and community development. With programs that span everything from vocational training for women to psychosocial support for the elderly and discipleship projects grounded in storytelling, Plavio’s work impacts thousands across Northern Uganda.

As a volunteer UX/UI designer, I redesigned their website using Figma with a clear mission: to build a platform that reflects the heart of the organization while making their work accessible to donors, partners, volunteers, and local beneficiaries.

UX/UI Designer & Developer

This was a self-initiated volunteer project, and my responsibilities covered the full scope of the design process:

  • UX/UI Design: I restructured the website to be intuitive and mobile-friendly, ensuring it worked even in low-bandwidth areas.
  • Content Architecture: Organized vast information about programs, leadership, and impact into digestible sections with clear navigation.
  • Visual Identity: I created custom visuals with Leonardo AI to reflect Ugandan culture, community life, and dignity.
  • Web Strategy: Advised on how to position Plavio’s impact for donors and potential partners, emphasizing transparency and human-centered narratives.

I collaborated remotely with the NGO’s leadership, making design choices that honor both the organization’s faith-driven mission and its diverse audience.

Why I Volunteered

As a designer passionate about social impact and storytelling, I saw in Plavio Uganda a powerful mission rooted in compassion, dignity, and resilience. I chose to volunteer because:

  • I wanted to use design for good — amplifying voices often underrepresented online.
  • Their work in menstrual hygiene, rural education, and gender equity strongly aligned with my values.
  • The original site had critical usability issues, and I knew I could help elevate it through thoughtful UI/UX strategy.

UX/UI Designer & Developer

This was a self-initiated volunteer project, and my responsibilities covered the full scope of the design process:

  • UX/UI Design: I restructured the website to be intuitive and mobile-friendly, ensuring it worked even in low-bandwidth areas.
  • Content Architecture: Organized vast information about programs, leadership, and impact into digestible sections with clear navigation.
  • Visual Identity: I created custom visuals with Leonardo AI to reflect Ugandan culture, community life, and dignity.
  • Web Strategy: Advised on how to position Plavio’s impact for donors and potential partners, emphasizing transparency and human-centered narratives.

I collaborated remotely with the NGO’s leadership, making design choices that honor both the organization’s faith-driven mission and its diverse audience.

Why I Volunteered

As a designer passionate about social impact and storytelling, I saw in Plavio Uganda a powerful mission rooted in compassion, dignity, and resilience. I chose to volunteer because:

  • I wanted to use design for good — amplifying voices often underrepresented online.
  • Their work in menstrual hygiene, rural education, and gender equity strongly aligned with my values.
  • The original site had critical usability issues, and I knew I could help elevate it through thoughtful UI/UX strategy.

The Challenge

Plavio’s old website had valuable information but lacked coherence, structure, and modern appeal. Key challenges included:

  • Overwhelming text-heavy content: With no clear hierarchy, users struggled to understand the organization’s impact.
  • Lack of visual storytelling: The site had few emotional cues to help users connect to the mission or feel compelled to support.
  • Unclear call-to-actions: Visitors weren’t guided toward donating, volunteering, or contacting the team.
  • Limited usability: The design was not optimized for mobile, a major limitation considering many users in Uganda access the internet via phones.

My challenge was to create a visual language and user journey that felt both professional and approachable, deeply rooted in African identity and spiritual purpose.

Visual Storytelling

As part of the visual revitalization, I recognized that Plavio Uganda’s existing photo assets didn’t fully capture the spiritual and cultural vibrance of their mission. To enhance the emotional tone of the site and bridge visual gaps where photography was limited, I generated a suite of bespoke illustrations using Leonardo AI.

The Challenge

Plavio’s old website had valuable information but lacked coherence, structure, and modern appeal. Key challenges included:

  • Overwhelming text-heavy content: With no clear hierarchy, users struggled to understand the organization’s impact.
  • Lack of visual storytelling: The site had few emotional cues to help users connect to the mission or feel compelled to support.
  • Unclear call-to-actions: Visitors weren’t guided toward donating, volunteering, or contacting the team.
  • Limited usability: The design was not optimized for mobile, a major limitation considering many users in Uganda access the internet via phones.

My challenge was to create a visual language and user journey that felt both professional and approachable, deeply rooted in African identity and spiritual purpose.

Visual Storytelling

As part of the visual revitalization, I recognized that Plavio Uganda’s existing photo assets didn’t fully capture the spiritual and cultural vibrance of their mission. To enhance the emotional tone of the site and bridge visual gaps where photography was limited, I generated a suite of bespoke illustrations using Leonardo AI.

Mood Board

User Research & Personas

I began by analyzing the intended audience—adult readers drawn to dark fantasy and themes of resilience. A competitive audit of successful book websites revealed what works: strong brand identity, emotional resonance, and intuitive navigation.

Design Process

1. Discovery & Content Audit
I began by analyzing the original site, identifying pages with redundant content, gaps in storytelling, and unclear navigation. I also studied the NGO’s mission and values to ensure I translated their voice into design.

2. Information Architecture
I mapped out a new sitemap, grouping content under streamlined categories:

  • About Us
  • Our Focus
  • Programs
  • Get Involved
  • Donate
  • Contact

Each focus area was paired with icons and descriptive summaries to help users quickly find what interests them.

3. Wireframing
I created low-fidelity wireframes in Figma for all core pages. This phase helped align the structure with user needs and stakeholder goals before visual details were added.

4. Visual Design
Using a palette inspired by Ugandan earth tones and traditional prints, I built a system of cards, headings, and photo frames that feel warm and culturally rooted. Every section included visual content made in Leonardo AI to capture scenes of rural life, women-led workshops, and village resilience.

5. Collaboration & Feedback
I stayed in touch with the organization to validate layout decisions, and adapt the tone where necessary to reflect their Christian mission, especially on the Discipleship page.

6. Prototyping & Delivery
A clickable Figma prototype was delivered, along with image assets, typography guidelines, and suggestions for how to migrate the layout into WordPress or another CMS.

Design Process

1. Discovery & Content Audit
I began by analyzing the original site, identifying pages with redundant content, gaps in storytelling, and unclear navigation. I also studied the NGO’s mission and values to ensure I translated their voice into design.

2. Information Architecture
I mapped out a new sitemap, grouping content under streamlined categories:

  • About Us
  • Our Focus
  • Programs
  • Get Involved
  • Donate
  • Contact

Each focus area was paired with icons and descriptive summaries to help users quickly find what interests them.

3. Wireframing
I created low-fidelity wireframes in Figma for all core pages. This phase helped align the structure with user needs and stakeholder goals before visual details were added.

4. Visual Design
Using a palette inspired by Ugandan earth tones and traditional prints, I built a system of cards, headings, and photo frames that feel warm and culturally rooted. Every section included visual content made in Leonardo AI to capture scenes of rural life, women-led workshops, and village resilience.

5. Collaboration & Feedback
I stayed in touch with the organization to validate layout decisions, and adapt the tone where necessary to reflect their Christian mission, especially on the Discipleship page.

6. Prototyping & Delivery
A clickable Figma prototype was delivered, along with image assets, typography guidelines, and suggestions for how to migrate the layout into WordPress or another CMS.

Tools Used

  • Figma – UX/UI design, prototyping, layout structure
  • Leonardo AI – Custom imagery generation (local women, agriculture scenes, youth mentorship)
  • Photoshop – Image editing, optimization for web
  • Google Docs – Collaborating on content with the NGO team
  • Google Fonts – For accessible typography
  • Trello – Task tracking and feedback cycles

High-Fidelity Wireframes

The Design That Delivered

What made this redesign stand out was its alignment with the spirit of the NGO while delivering a modern, scalable, and emotionally resonant experience. Key reasons for its success:

  • Volunteer-Driven Authenticity: As a designer volunteering time and skill, I brought passion and respect to the work—ensuring the redesign was grounded in empathy, not just efficiency.
  • Cultural Sensitivity: The content and visuals reflect the real lives of Ugandan women, youth, and leaders—not generic NGO tropes.
  • Strategic Clarity: Every design choice, from typography to navigation, aimed to make Plavio’s powerful work more visible and actionable.
  • Scalability: The modular design allows the NGO to update content or expand its program pages easily as new initiatives emerge.