The site buried the man it was named for
The Kevin Popke Foundation turns First Sergeant Kevin “50” Popke’s memory into grants for Florida veteran organizations. The old site had been built to check a box. It led with the organization and buried the man it was named for, and every update, down to a single grant announcement, needed a developer.
Constraints: six weeks and a $2,000 fixed budget, for a site that told Kevin’s story and that the foundation could run themselves.
Five decisions behind the site
Person before organization
I studied memorial foundations that do this well, like the Murph and Tillman foundations, and they all follow the same order: who the person was, why it matters, and how donors or volunteers can help. That set the homepage structure: Kevin’s story first, then the foundation’s purpose, then programs and donations. The donate button moves further down the page, because a visitor who knows about Kevin has more reason to give.
Three concepts, one set of copy
I presented three visual concepts using the same copy and largely the same media, so the family was comparing design and nothing else. They chose the “modern community vibe,” which balances professionalism with heritage by incorporating the family tartan.
Featuring the marquee event
Most of the foundation’s donations come from one annual event, Songwriters 4 Vets. The Events page opens with it, followed by a partnership and fundraising inquiry, and only then the general events list. At the client’s request, smaller events get less prominence, so the page is organized around where most of their funding comes from.
Headless on a nonprofit budget
A headless build (WordPress → WPGraphQL → Faust.js) delivers speed, but it breaks many standard WordPress plugins, and the budget didn’t cover premium licenses. So I built two things: a trimmed, reorganized WordPress admin, and kpf-core, a single plugin that handles SEO, forms, image optimization, snippets, and back-end accessibility tooling, replacing up to 11 separate plugins. Both sit on top of WordPress, so the core stays untouched and still receives security updates.
A CMS shaped like the page
Every kpf-core field maps directly to a spot on the page: plain-text headings, paragraphs, and buttons, with nothing to style. Logging a new grant takes as little as one photo from the check presentation. The grantee, date, and amount go into three fields, the recipient’s logo gets uploaded, and the live donation total on the About page updates itself.
Results
| 98 / 100 / 100 / 100 | +24% | $2,000 |
|---|---|---|
| PageSpeed on desktop (95 on mobile) | Over target for Songwriters 4 Vets, a week after launch | Fixed fee, in six weeks |
| Measure | Result | Source |
|---|---|---|
| PageSpeed, desktop | 98 / 100 / 100 / 100 | PageSpeed Insights, Oct 16, 2026 |
| PageSpeed, mobile | 95 / 100 / 100 / 100 | PageSpeed Insights, Oct 16, 2026 |
| GTmetrix | Grade A (98% performance) | GTmetrix, Aug 27, 2026 |
| Budget | $2,000 | Fixed fee |
Songwriters 4 Vets took place a week after launch and beat its fundraising target by 24%. A new website doesn’t raise money on its own, and I don’t claim it did. But the event had a proper home online while it was being promoted.
What shipped: six responsive templates (Home, About, Events, Contact, Blog archive, and Blog post), the custom WordPress build, kpf-core, and a CSS manifest that maps every Figma component to its classes, with tokens layered primitive → semantic → component.