The org's most public touchpoints felt incidental, not intentional.
Generic nonprofit template. Eight type styles with no hierarchy. Navigation that asked visitors to guess where to click. A first-time visitor couldn't answer three questions in under a minute: who is this for, what do they do, how do I get involved.
I joined F.O.U.N.D. as Visual Designer in 2024. As scope expanded into a full brand system, website rebrand, and cross-platform template engine, I was promoted to Visual Design Lead. The role shifted from making artifacts to defining how artifacts get made.
Three problem layers. Each a product problem before a brand problem.
I walked through the site as three first-time visitors: a prospective participant, a potential volunteer, and a small donor. Each had a different goal. The existing site failed all three in different ways.
No visual hierarchy
Eight type styles, no consistent scale. Nothing tells visitors what to read first or where to go next.
No template logic
Each social post started from scratch. No visual continuity between posts or platforms.
No conversion path
All three visitor archetypes failed to reach a primary action within 30 seconds.
One decision, everywhere
Every color, type, spacing choice encoded once. No exceptions across web, social, or print.
Non-designer publishable
Templates must work without Figma open. Anyone on the team can publish on-brand at any time.
Convert attention into action
Every IA decision measured: can a first-time visitor reach a primary action in under 30 seconds?
Five colors. Clear roles. Nothing freelancing.
Each color has one job, and that job doesn't change across web, social, or print. Peach carries emotion. Navy carries weight. Teal and coral mark moments. Cream softens everything between.
A U meeting an F
Two figures at a connection point, the pause where someone finds someone else. Holds from favicon to billboard.
One typeface: Arial
On every device, free of licensing constraints for a nonprofit. Work done entirely by weight, size, and color.
11 sections. One argument from top to bottom.
The section order is an argument: orient the visitor, prove credibility, surface the work, invite participation, build trust, convert. Every sequence was a hypothesis about reader behavior.
Designed it. Coded it. Shipped it.
Hand-coded HTML, CSS, and vanilla JS, deployed on Netlify. The design is the build, and the build is the design. Every responsive decision made once, by the person who owned it.
Website, mobile-first, fully responsive. Primary action reachable in under 30 seconds.
Numbers and a promotion.
+50% followers
Instagram growth in two months after the social rebrand went live.
+20% engagement
Lift across posts on the new template system versus the prior cadence.
Designer → Lead
Promoted to Visual Design Lead while owning the rebrand end-to-end.
The templates are now the org's actual publishing tool. I am no longer in the file when most posts go out. That's the measure of a successful design system, it works without me.
Templates with logic, not just layouts.
10+ templates across Instagram, LinkedIn, and Threads. Every one inherits the same color logic, type hierarchy, and logo placement. The team posts directly from them, no designer in the file.
Instagram templates, built from brand tokens, publishable by anyone on the team.
Current Instagram page which shows the new design rebranding and content voice.