NONPROFIT WEBSITE DESIGN - TRINITY YARD SCHOOL
Nonprofit website design with intuitive navigation, a donation portal, and a new revenue strategy.
Trinity Yard School, a Ghanaian non-profit, needed nonprofit website design that could match the ambition of their mission. Beyond academics, TYS teaches traditional drum, dance, and batik arts, and runs a 20-acre working farm as a hands-on model of sustainable agriculture — few families in the area grow up farming without ever learning sustainable methods, so the farm itself doubles as a teaching tool. Their old site was static and repetitive, undercutting a mission this rich.
The farm alone does a lot: orchards of papaya, mango, avocado, and citrus, annual gardens of tomatoes, peppers, and a dozen other crops, an oyster mushroom operation that’s been self-sustaining since 2018, a beekeeping initiative aiming for ten active hives, and a closed-loop system where kitchen scraps feed the laying hens, the hens’ eggs feed staff and students, and the hens’ manure feeds the gardens back again. This kind of sustainable agriculture website design needed to actually communicate that cycle clearly, not just list it.
I overhauled the site into a dynamic platform, anchored by a custom SVG website animation on the homepage — a hand-illustrated scene of a traditional weaver at work, three boys juggling soccer balls, and a girl painting, all brought to life in motion. Visitors now connect with the school’s story before they’ve read a single word.
Beyond the animation, the rebuild focused on function: intuitive navigation throughout, and a donation portal design that lets supporters give with flexible, recurring options. Recognizing the school needed additional income streams, I also designed a print-on-demand store featuring their branded merchandise, opening a new revenue channel to support their educational programs.
Much of the site’s copy needed a full rewrite alongside the redesign, so the writing does justice to the work happening on the ground. The relationship began with a full logo and brand identity for the school, and has continued since — I maintain and curate the site on an ongoing basis, and produce their annual newsletter.
Nonprofit website design like this is one example of the website design and development I offer. See the finished site at Trinity Yard School.
SHARE
client
trinity yard school
date
FEBRUARY 2020
categorie
Website Design and Development
review
"Will has used his branding expertise to build us a beautiful logo and to turn our outdated site into a piece of art that is full of life with his animations! This has given our NGO the public image we want. The new donation portal he created allows us to collect recurring donations! The new site is way beyond what our board had expected. We are grateful for this beautiful and functional site and for his continued maintenance and curating."
Questions About This Project
What's involved in nonprofit website design?
Making the mission itself the thing that pulls a visitor in — for Trinity Yard School, that meant leading with a custom animation and a clear story, with donation and engagement paths built in rather than bolted on.
What makes a homepage animation like this work?
It has to load fast and read clearly even before someone consciously registers what’s happening — the weaver, the boys with soccer balls, and the girl painting were built as a custom SVG website animation specifically so it stays lightweight while still feeling alive.
Can a nonprofit site generate revenue beyond donations?
Yes — alongside the donation portal, I designed a print-on-demand store for Trinity Yard School’s branded merchandise, giving them a second, ongoing revenue stream tied directly to the site.
Does a website project ever include writing the content itself?
Sometimes, yes — Trinity Yard School’s existing copy needed a full rewrite to actually do justice to what the school does, so this project included writing alongside the design and development.