The Gifted Equine
Donation-driven website for an equine rescue and sanctuary. Built to tell the horses’ stories, accept recurring and one-time donations through Donorbox, and let the team update content without touching code.
Custom design
Donations live
Self-serve content
Project Snapshot.
The essential facts. Sector, timeline, surface area, and where it lives in production.
Brief, Build, and Outcome.
The Challenge
The Gifted Equine needed a public home that did more than describe a rescue. It had to move people. Visitors arrive curious about the horses, and the site had to carry them from a story into a donation without friction, while letting a small, non-technical team keep stories, programs, and gallery content fresh on their own.
Our Approach
We designed and built the site around the horses’ stories first, then layered donations and content management on top so the team can run the site day to day without engineering help.
The Outcome
The Gifted Equine is live at thegiftedequine.com. Running recurring donations through Donorbox, with the team updating stories and programs themselves through the CMS.
What changed.
A side-by-side of what the client had before we engaged, and what we shipped.
- The sanctuary lived entirely on Facebook. If you didn't follow them, you didn't know they existed
- Donations happened through a Venmo handle posted in the comments of a Facebook update
- Each horse's story sat in a different post, on a different day, sometimes deleted by accident
- Updating anything meant texting the volunteer who originally set up the page
- Someone moved by a story had no obvious next step. They'd close the tab and forget
- Most visitors arrived from phones; nothing was sized for a phone
- Nobody knew which stories actually brought in support
- A site whose whole job is to take a moment of being moved by a horse and turn it into a recurring donation, gently
- Donorbox embedded inline with each story. No jarring redirect, no payment portal interstitial
- Each horse has a permanent page: photos, history, current needs, and a donate button that's already in the right context
- Volunteers update content from the CMS on their phone, in the barn, between feedings
- Mobile pages that load in under two seconds even on rural cellular
- WCAG AA typography and contrast. Supporters in their 60s and 70s can actually read it
- Analytics that tell the team which horse's story moved the most people to give this month
Achievements & deliverables.
The Gifted Equine asked us for a website. What they needed was a quiet, mobile-first place where the horses' stories could finish their own donation buttons. And where a volunteer could update a horse profile from a phone in a barn.
Donorbox donations integrated
One-time and recurring donation flows embedded directly into the site, placed where stories naturally lead to a call to give.
Self-serve content management
Non-technical team members can publish new horse profiles, programs, and updates without involving engineering.
Story-first design system
Custom Figma design built around the horses. Page templates pair narrative, imagery, and supporting calls to action.
Fast, mobile-first build
React + Vite stack tuned for quick first paint on mobile, where most donors discover the sanctuary.
Accessible by default
Typography, color contrast, and tap targets reviewed across breakpoints so supporters of all ages can navigate easily.
Live in production
Running today at thegiftedequine.com, supporting the rescue’s ongoing fundraising and outreach.
How We Built It, Phase by Phase.
Every project follows a deliberate sequence. Discovery, design, foundation, build, and launch. Here is exactly what happened, and what was delivered at each step.
Spending a Day With the Horses
We spent a day at the sanctuary before drawing anything. We met the horses, watched a volunteer post a Facebook update from her phone, and noticed she abandoned it halfway through because the wind picked up. That moment shaped the CMS: had to be phone-first, had to survive interruption, had to be forgiving.
- A content model with the horse as the unit
- Donor journey notes "moved → curious → giving" in three taps
- CMS shortlist filtered for "can a volunteer use this in a barn"
- A short roadmap the team could read at the kitchen table
Designing for Warmth
Most sanctuary sites use the same stock photography and the same blue gradient. We started over. Warm typography, lots of room around the horses, calls to support placed where the story naturally leads. Never bolted onto the side.
- Figma design system with the horse as visual anchor
- Horse profile and program-page templates
- Design tokens tuned warm. Never cold or corporate
- Mobile specs reviewed on a real phone in real light
React + Vite, Light Enough for Rural Cellular
Most of the sanctuary's audience reaches the site on a phone over slow cellular. We picked Vite for the tiny production bundles, inlined the critical CSS, and made sure the first paint was a real story. Not a spinner.
- Production deploy on a fast static host
- Headless CMS wired so editing a horse profile takes two taps
- Base UI built from the design system
- Story templates with inline image lazy loading
Donorbox, Embedded Where It Belongs
Donorbox usually drops people into a separate portal. We embedded it inline. The donor never leaves the horse's story to give. That single decision did more for conversion than any copy change we made.
- Donorbox inline on every story page
- Recurring donation as the gentle default
- Horse profile pages with care timeline + current needs
- Gallery and program pages
Handing It Over
Production deploy, CMS training for the volunteers (one hour, on a phone, in the barn. Fitting), and an accessibility audit because a chunk of the sanctuary's supporters are over 65.
- Live launch at thegiftedequine.com
- One-hour CMS training that stuck
- WCAG AA accessibility sign-off
- A four-page volunteer-facing runbook
Inside Each Feature We Built.
Not just what we shipped. How it works under the hood, and the engineering decisions behind each piece.
Donate Where You're Already Standing
Most charity sites send a donor to a separate portal to give. We embedded Donorbox inside the horse's story so the donor never has to leave. Recurring is the default. Supporters who want to do one-time have to opt out, gently.
- Donorbox embedded inline at the end of each story, not on a separate page
- Recurring presented as the gentle default, one-time as the alternative
- Confirmations route back into the CMS so thank-you messages can be tailored per horse
- Mobile-tuned because the majority of donations happen on phones
A CMS a Volunteer Can Use From a Barn
The actual selection criterion for the CMS was "can the lead volunteer use this on her phone, with wind blowing, between feedings?" We tested it with her before committing. She published a horse profile in seven minutes.
- Authoring surfaces simplified. No schema fields the team doesn't need
- Image uploads with automatic optimization (volunteers don't think about file sizes)
- Preview mode shows the change exactly as donors will see it
- Versioned content with rollback in case a draft gets published too early
Horse-first Design
We started with the horses as the visual anchor. Everything else. Typography, whitespace, color. Was tuned to keep the focus on them. The result is a site that feels like the sanctuary, not like a SaaS template.
- Templates for horse profiles, programs, and updates share one story rhythm
- Imagery treated as primary content, not decoration around text
- Calls to support placed where the story emotionally lands. Not in a sidebar
- Long-form typography tuned for the phone, where most reading happens
Fast Enough for Rural Cellular
Most donors arrive over a slow phone connection. We picked Vite for the small bundles, inlined critical CSS, and made every image lazy by default. First paint is the photo of the horse. Not a spinner.
- Production bundles aggressively code-split per route
- Critical CSS inlined into each page for instant first paint
- Responsive image variants with lazy loading and blur placeholders
- Sub-two-second load on typical 4G connections in the area
Accessible Because Donors Are Older
A meaningful share of the sanctuary's supporters are over 65. We took the accessibility audit seriously. Not as a checkbox, as a design constraint. Contrast, tap targets, and font sizes were tuned with that audience in mind.
- WCAG AA contrast verified across every page
- Tap targets sized for older fingers and assistive devices
- Full keyboard navigation across all flows
- Screen reader announcements tuned for story flow, not a wall of "link, link, link"
Live at thegiftedequine.com
Running today, run by the team, supporting the sanctuary's ongoing fundraising and outreach. We are not in the maintenance loop, which was the goal.
- Uptime monitoring with email alerts. The team gets pinged before donors notice anything
- Backups cover both CMS content and the static build
- Analytics tracking story engagement and donation conversion per horse
- The team operates the site independently; we hear from them only when they want to ship something new
Every Tool, and Why We Picked It.
A grouped breakdown of every technology in the build, with the reasoning behind each choice.
Frontend
- React
Templates for horses, programs, and updates all share the same components. Adding a new template type is half a day, not a week.
- Vite
Tiny production bundles matter when half the audience is on rural cellular. Vite gave us that without us thinking about it.
- TypeScript
The CMS content shape and the template props are typed against each other. A volunteer can't publish a horse profile that breaks the page.
Styling
- Tailwind CSS
We wanted a warm, restrained design. Tailwind tokens made it easy to keep that warmth consistent across every page.
Content
- Headless CMS
Picked specifically because a volunteer can use it on a phone in a barn. That was the actual selection criterion.
- Horse-as-unit model
Each horse is a first-class content type with a story, photos, care notes, and a current-needs field that updates the donate call to action.
Donations
- Donorbox
Embedded inline on the story page so the moment of being moved and the moment of giving aren't separated by a redirect.
