About Me

LinkedIn

LinkedIn

Responsive Website

Responsive Website

South Sudan YouThrive (SSYT) • 2025 • 4 minute read

South Sudan YouThrive (SSYT) • 2025 4 minute read

A scalable, user-friendly website to improve accessibility, streamline navigation, and enhance community engagement for a local nonprofit.

A scalable, user-friendly website to improve accessibility, streamline navigation, and enhance community engagement for a local nonprofit.

Freelance

Freelance

Freelance

0 to 1

0 to 1

0 to 1

Web Development

Web Development

Web Development

Visit Website

Visit Website

Role

Product Designer, Web Developer

Duration

14 weeks

Tools

Figma, Webflow, Procreate, Google Workspace

Anticipated Impact

  • +30-50% increase in youth engagement through programming

  • 30+ more community members and volunteers trained in mental health first aid

Final Webpages

Problem

A local non-profit, faced limitations in outreach due to not having a website.

A local non-profit, faced limitations in outreach due to not having a website.

SSYT relied on manual outreach without a central digital hub, making it hard for supporters to stay updated, engaged, or donate.

SSYT relied on manual outreach without a central digital hub, making it hard for supporters to stay updated, engaged, or donate.

Solution

Built an easy-to-navigate site with flexible templates that gives SSYT a central home to engage supporters, share resources, highlight impact, and collect both direct and merch-based donations.

Built an easy-to-navigate site with flexible templates that gives SSYT a central home to engage supporters, share resources, highlight impact, and collect both direct and merch-based donations.

Final Prototype

Research & Discovery

Goals: Highlight community values, drive engagement, enable self-sustainability
Research: Conversations with SSYT team, audits of similar youth orgs
Key Insights:
- Need for clarity & simplicity
- Audience prefers mobile-first access
- Importance of representing cultural identity in visuals

Goals: Highlight community values, drive engagement, enable self-sustainability
Research: Conversations with SSYT team, audits of similar youth orgs
Key Insights:
- Need for clarity & simplicity
- Audience prefers mobile-first access
- Importance of representing cultural identity in visuals

Design Process

Interview Insights

SSYT Youth Participant

SSYT Leadership

Information Architecture

home

resources

Programs

about

donate

contact

store

events

Get involved

youth

Mission

Team

Impact

Mental Health

First aid

Community

Information Architecture

home

resources

Programs

about

donate

contact

store

events

Get involved

youth

Mission

Team

Impact

Mental Health

First aid

Community

User Personas

Design Process

Design Process #1: Landing Page

The homepage was designed to be a celebration of the existing work being done by SSYT and an invitation for visitors to participate, with clear navigation, community photography, and key calls to action. After many iterations, I landed on highlighting events, testimonials, and a quick biographical statement as the main anchoring elements.

Preliminary Sketches

Hifi Mockup

Lofi Mockups

Design Process #2: About Page

What began as a single, content-heavy page was refined into multiple focused subpages (Mission, Team, Impact), improving clarity and user flow.

What began as a single, content-heavy page was refined into multiple focused subpages (Mission, Team, Impact), improving clarity and user flow.

Preliminary Sketches, About Page

Lofi Mockups, About Page

Hifi Tablet Mockups, Mission, Impact & Team

Design Challenge #1

The client was still finalizing content and branding, so I created flexible templates and placeholder components to adapt as assets became available. Hi-fi mockups contained final written content and layout only.

The client was still finalizing content and branding, so I created flexible templates and placeholder components to adapt as assets became available. Hi-fi mockups contained final written content and layout only.

Placeholder Components & Flexible Templates

Hifi Mockups, Tablet

Final Pages, Tablet

Design Challenge #2

The client needed a nontechnical solution with full ownership, so I built most content using Content Management System Collections and designed controls to toggle visibility as items were ready to publish.

Collection Name

Fields Included

Events

Event Title, Event Order, Date, Time & Location, Image, Alt Text,

Category

Products

Product Name, Product Description (Rich Text), Price, Colors, Sizes, Visible (Switch), Photo Gallery (Multi-image), Notes/Extra Notes (Rich Text), Alt Text

Team Members

Full Name, Profile Picture, Job Title, Email, Bio (Rich Text)

Hero Slides

Image, Slide Page Number

Collection Name

Fields Included

Events

Event Title, Event Order, Date, Time & Location, Image, Alt Text,

Category

Products

Product Name, Product Description (Rich Text), Price, Colors, Sizes, Visible (Switch), Photo Gallery (Multi-image), Notes/Extra Notes (Rich Text), Alt Text

Team Members

Full Name, Profile Picture, Job Title, Email, Bio (Rich Text)

Hero Slides

Image, Slide Page Number

Hero Sliders

Merchandise Product Cards

Events Components

Team Member Cards

reflection

I’m proud of how this site reflects SSYT’s voice and allows them to grow. I loved being able to support a mission I care about while solving real-world constraints. This project reminded me that good design empowers others—and that’s what I want to keep doing.

I’m proud of how this site reflects SSYT’s voice and allows them to grow. I loved being able to support a mission I care about while solving real-world constraints. This project reminded me that good design empowers others—and that’s what I want to keep doing.

I’m proud of how this site reflects SSYT’s voice and allows them to grow. I loved being able to support a mission I care about while solving real-world constraints. This project reminded me that good design empowers others—and that’s what I want to keep doing.

Next Time:

  • Conduct usability testing earlier with more youth users

  • Incorporate a Search component for nontechnical, older users

  • Incorporate micro interactions sooner in iterative process so it was more refined

Potential Search Feature Mockup

<< Back to

Product Design Projects

Let’s Connect Get in Touch

See

Biasly Internship >>

Let’s connect.
 Get in Touch

<< Back to

Product Design Projects

See

Biasly Internship >>

<< Back to

Product Design Projects

Let’s Connect Get in Touch

See

Biasly Internship >>

Copyright © 2026 Lilian Juma

Copyright © 2026 Lilian Juma