Lebanese Spotlight

/ Overview

The challenge

A youth-led NGO running more than 300 volunteers across Lebanese schools and universities needed one place to handle intake, workshop places and programme records, end to end. Coordination done by hand grew with every new cohort, taking the team's time away from the work itself.

The solution

We designed the full UI/UX and built it as a Next.js front end on a Node.js backend, so the public site and the volunteer tooling are one system rather than two. A visitor reads the impact figures and signs up in the same place the team uses to run intake, fill workshops and keep records, with nothing to reconcile between them.

/ What we built

Inside the project.

Volunteer onboarding that carries an applicant from sign-up to placed and active without anyone re-keying their details
A workshops and programmes catalogue where places are filled from the page itself, so the sign-up and the roster are one record
An impact section that counts up the figures the NGO is actually measured on: 300+ active volunteers against a 10,000-youth goal
Community stories from named volunteers, giving an unfamiliar visitor the proof they need before committing their own time
Safeguarding and policy documents built into the site rather than attached to an email, so the obligations stay public and current

/ Specs

Type: NGO platform
Stack: Next.js + Node.js
Client: Youth-led NGO in Beirut, Lebanon
Scope: UI/UX + web app development

/ Results

The outcome.

60%Faster volunteer onboarding

2×Workflow efficiency

+35%Active volunteers

/ Measured

Numbers anyone can re-run.

Every figure below is a real reading from a standard tool anyone can re-run: Google Lighthouse for speed and quality, the W3C validators for the code itself. Each one says what it means for you in plain language.

Google Lighthouse scores out of 100

98PerformanceHow quickly the page becomes usable. Google scores it out of 100, and 90 or above counts as fast.

100Accessibility A11Y · WCAGHow well the page works for people using a screen reader, a keyboard, or high-contrast settings, checked against the WCAG standard.

100Best practices BPWhether the site follows the modern rules of the web: HTTPS everywhere, safe libraries, and a browser console with nothing thrown into it.

100SEOHow readable the page is to search engines: titles, descriptions, crawlable links and valid robots rules.

Loading & responsiveness Core Web Vitals

0.5 sFirst contentful paint FCPHow long before the visitor sees anything at all. Under 1.8 seconds is the target.

0.9 sLargest contentful paint LCPWhen the main image or headline has finished loading, which is the moment the page looks ready. Google wants this under 2.5 seconds.

0 msTotal blocking time TBTHow long the page ignores taps and clicks because it is still busy loading. Zero means it never freezes on the visitor.

0Cumulative layout shift CLSHow much the page jumps around while it loads. Zero means nothing moves under the reader's finger mid-tap.

0 msInteraction to next paint INPHow fast the page answers a tap. It is measured on real visitors over time; the lab stand-in shown here is total blocking time.

Code quality & weight standards, size, dependencies

66 KBHTML, compressed GZIP / BRThe weight of the page's own code as it actually travels over the network. Smaller is cheaper and faster on mobile data.

3 of 3Font preloadWhether the custom typefaces are requested up front, so text never flashes in a fallback font before settling.

0W3C HTML errorsErrors found by the W3C's official markup validator. Zero means the code is standards-clean, which is what keeps a site working through future browsers.

0W3C CSS errorsThe same official check applied to the stylesheets. Invalid CSS is where most cross-browser display bugs begin.

0Third-party originsHow many outside servers the page pulls from. Every one is another company that can slow the page down, break it, or track your visitors.

Measured on the live site at lbspotlight.org with Google Lighthouse 12.8.2 (desktop) and the W3C validators, August 2026.

/ More work