N'Kenge Foundation: A Headless Website Remodel

The problem

The N'Kenge Foundation is a BIPOC-led performing arts nonprofit in New Jersey with a real track record: a scholarship fund, a gala, coverage in BroadwayWorld and on WBGO, and at least eight distinct youth programs. Its website told almost none of that clearly.

The site was a Wix build from August 2024, and it had drifted away from its own brand. The foundation's identity is black, white, and metallic gold, set in Bodoni and Montserrat. The homepage ran maroon panels, a marigold gradient, slate-teal cards, and lavender buttons across several unrelated typefaces. Structurally it buried the mission. A first-time visitor could not tell whether this was a talent competition, a scholarship fund, a performance venue, or an advocacy group. Eight programs, from the Legacy Icon Challenge and the Dorothy Dandridge Scholarship Fund to Mental Mindfulness workshops and an MLK oratory program, sat in a flat list with no throughline.

The management side was worse than the design. When I audited the site's CMS, the Impact collection, the one meant to prove the foundation's results, held five rows of template filler about tree planting and a food drive. The Testimonials, Auction Items, and Events collections were empty. Programs had not been updated in nearly two months. The account held two Wix sites both named "N'Kenge Foundation." DNS lived at GoDaddy rather than Wix, so a careless switch would have taken down the founder's Google Workspace email. And the foundation's best asset, years of performance photos and video, sat in a Google Drive of roughly 4,000 unlabeled files that nobody could search.

The engagement was scoped in April 2026 as a four-week Wix redesign. What the foundation actually needed was a site that told one story, looked like the brand, and could be kept current by a non-technical founder without calling a developer.

How I worked it

1. Discovery before design

I started with the voice, not the layout. I went through the founder's video voiceovers, physical banners, program guides, participant testimonials, and social posts, and wrote a brand voice discovery report. The finding: the voice was already there and it was authentic. What was missing was hierarchy. The report set one organizing idea for the whole site, empowering young artists to discover, develop, and share their gifts, and recast the programs as steps on one journey instead of a list. It anchored the copy in the founder's own words about growing up at PS 95 in the Bronx with access to the arts.

2. Mining the media archive

A premium site lives or dies on its photography, and the good photos were lost in that Drive. Instead of scrolling through thousands of files, I built a media enrichment pipeline. Gemini, and later Amazon Bedrock with Rekognition and Transcribe, described every image and video and scored it for usability, and the results landed in a BigQuery catalog. Choosing a hero image became a query (highest usability, mentions mentorship) instead of an afternoon of guessing.

3. A brand kit turned into a design system

I translated the brand kit into a coded design system: Libre Bodoni for display type, Montserrat for everything else, a black and off-white canvas, and a three-stop gold gradient reserved for headlines and calls to action. Wave dividers carry the eye between dark and light sections, and photos move from black and white to color on hover. To keep the team on-brand without design software, I built a browser tool that converts any logo to the foundation's gold gradient, and a Figma plugin that migrated every mockup layer from the first token set to the second automatically.

4. An architecture the client could live with

Rebuilding inside the Wix editor would have reproduced the original problem: anyone can move anything, and the brand drifts again within a year. So I separated the two jobs. The founder keeps Wix, the dashboard she already knew, as a headless content backend. The public site is a Next.js 16 and React 19 application in TypeScript on Netlify that reads that content through the Wix SDK. Content and presentation can no longer break each other.

Pages revalidate every 60 seconds, so when the founder edits a board bio, adds an event, or swaps a hero photo in Wix, it is live in about a minute with no deploy. I modeled the content the way she thinks about it: Board Members, Programs, Press Coverage, Gallery, Media Logos, Sponsors and Partners, and a Page Heroes collection that puts the headline, highlight word, body copy, and background image of every page in one editable table. Blog, Events, and Forms run on Wix's native apps. Donations and tickets run through sandboxed, URL-validated Zeffy embeds. The admin API key never leaves the server, a boundary documented and enforced in code.

5. Production standards on a nonprofit budget

I held the build to the same bar as paid commercial work. In May I ran a full accessibility audit against WCAG 2.1 AA and wrote up every failure: 3 critical and 9 serious, including a gallery you could not open from a keyboard, modals without dialog semantics, and an unlabeled newsletter field. Then I fixed them with skip links, visible focus states, real buttons, ARIA dialogs with Escape and focus return, and corrected contrast. Playwright with axe-core now runs in CI so they stay fixed.

An image audit found 162 MB of unoptimized camera masters shipping with the site. The local asset folder is now 2.2 MB, and every photo is served from the Wix CDN at the size the layout needs. Structured data, a sitemap, Open Graph share images, and consent-mode Google Analytics went in before launch, not after.

6. A cutover with nothing left to chance

Because DNS sat at GoDaddy and email ran through Google Workspace, I wrote the cutover runbook before touching anything: snapshot every record, repoint only the web records to Netlify, and leave the mail, SPF, and verification records alone. The new site went live in mid-May 2026, about three weeks ahead of the June 4 target.

The outcome

nkengefoundation.org now opens on the foundation's own tagline, "Changing Lives, One Legacy at a Time," in its own black and gold, over a real photo of its students on stage. Fourteen pages, plus a detail page for every program, event, and post, tell one story: who the foundation serves, how, and how to help.

The founder runs it herself. She updates page heroes, board members, programs, press, the gallery, the blog, and events from the Wix dashboard, and the site reflects it in about a minute. I wrote 19 step-by-step owner guides illustrated with screenshots of her own dashboard, a maintenance manual, a GoDaddy DNS walkthrough, and a 650-line technical handover so any future developer can pick it up cold. I set up Google Workspace seats on the foundation's domain, transferred the Netlify and Wix accounts to the foundation, and trained her live before stepping back.

Behind it: 392 commits, unit tests, end-to-end and accessibility tests in CI, and a webhook that rebuilds the site when the CMS changes. The foundation went from a site of clashing colors and empty collections to one I would put in front of any donor, and it no longer needs me to stay that way.

The engagement also produced two tools that are still in use: the gold gradient logo converter, and a QR audience-voting app that ran live voting for 17 contestants at the "Are You The Next Showstopper?" showcase.