UI/UX Case Study, Freelance, 2022–2024

A family's memory, made legible to strangers.

Brand identity through full site build for a nonprofit that started with nothing: no name recognition, no visual identity, and no way for anyone outside the founders' own circle to give with confidence.

Scroll to begin ↓
Role Sole Designer, Brand, UX & Build
Timeline Mar 2022 – Dec 2024
Tools Squarespace (custom code), Figma, Donorbox

"They had a mission worth funding and no way to make a stranger believe it. I built them one, from scratch."

The Problem

Albertina's Angels started with nothing. No name recognition, no visual identity, no website, no way for anyone outside the founders' immediate circle to give money with confidence. The founders, a mother and daughter, had a genuine mission: educating underprivileged children in El Ciruelito, Dominican Republic. What they didn't have was any way to make that mission legible to the people most likely to fund it, which was mostly their own friends, family, and community.

That's a quieter trust problem than most nonprofits face. They weren't trying to win over cold, skeptical strangers. The audience already had goodwill toward the founders going in. What was missing was a reason to believe the organization itself was real, organized, and capable of doing something with someone's money.

The brand and the site had to carry that legitimacy on their own. But there was something more personal underneath it too: the organization is named after the founders' own mother and grandmother, Albertina. Building the identity meant honoring a private family story while still reading as a credible, fundable nonprofit to people who'd never hear that story firsthand.

Research & Discovery

Honest framing

There was no formal user research here, no donor surveys, no analytics to study, because there was no existing donor base or site to study in the first place. What I had instead was direct, ongoing access to the two people who knew this audience better than any survey could tell me: the founders themselves.

We worked together closely over the full three years, and the conversations weren't a one-time intake. They were a running back-and-forth. I'd bring a direction or a decision, and they'd bring their read on how the people in their own circle, the friends, family, and community they were trying to reach, would respond to it. That's a real source of insight, but it's a specific kind: relayed impressions from people close to the donors, not the donors speaking for themselves. I treated it that way rather than mistaking it for harder evidence.

Define & Ideate

The defining tension of this project wasn't a disagreement between me and a stakeholder. It was internal to the brief itself: build something personal and specific enough to be true to the founders' own story, while reading as a legitimate, professional nonprofit to people who'd never hear that story directly.

The Personal Mandate

An identity true enough to the founders' story that it doesn't feel hollow to them, true to a real memory and a real name.

+
The Public Mandate

Legible enough to a stranger that it still reads as a real, organized nonprofit worth trusting with money.

Every brand decision after that got measured against both halves of that sentence.

Where the identity comes from

Albertina is the founders' own mother and grandmother. The logo's dragonfly motif grew out of a specific memory: dragonflies appearing while the founders were visiting a loved one. That's not the kind of brand concept you'd get from a typical discovery exercise. It came from lived experience, and my job was to translate it into something that could function as a nonprofit's visual identity rather than stay a private family symbol.

The colors weren't mine to choose. These were Albertina's own favorite colors, and the founders wanted them in. The same person who inspired the mission also shaped what it looks like.

Color palette
Deep Violet #622FDB
Sky Blue #0096DB
Soft Lavender #B590DB
Gold #DBBA00

Design Decisions

Brand identity

The logo had to carry a real story without turning into something too literal or too precious to function as a working nonprofit mark. The goal wasn't to illustrate the memory itself, it was to extract something usable from it: a recurring visual element that could sit on a homepage, a donation page, or printed material without needing the backstory explained every time. The story gives the mark meaning for people who know it. The mark still has to work for people who don't.

Information architecture and bilingual structure

The bilingual English/Spanish structure wasn't part of the original scope. It came later, once it was clear the audience reached beyond English-speaking friends and family into Spanish-speaking community and family connections tied to the founders and the mission in the Dominican Republic.

The obvious first move was Squarespace's built-in auto-translate. The founders rejected it, the translation read too literal, not how they'd say it. They translated the copy themselves, by hand, which meant I needed a way to get their Spanish copy onto the site without fighting the platform's default behavior.

I ended up building the Spanish pages separately, as their own dedicated pages, then went into Squarespace's code settings to write logic that shows or hides pages depending on which language a visitor has selected. That's not a feature Squarespace gives you out of the box, it's something I had to construct myself.

The donation platform pivot

This is the clearest messy-middle moment of the whole project, and I don't want to smooth it over.

Started with

Designing around Squarespace's native donation tooling, building the layout and flow assuming that's what we'd ship with.

Switched to

Donorbox, after the founders asked for more control over donor data, more control over how the donation box itself looked, and a wider range of payment methods than Squarespace's native option supported.

led to a real integration problem

Donorbox wasn't built to live inside Squarespace, and the embed didn't sit well by default. I used custom CSS injection to restyle it so it didn't look like a foreign widget dropped onto the page, and worked through iframe sizing and responsiveness issues so it held up across screen sizes instead of breaking the layout.

A lot of designers would have flagged that limitation and waited on a developer. The front-end background let me just go fix it.

Albertina's Angels homepage showing the Our Mission hero with a group photo of community members, and the Donorbox donation widget embedded beside the mission statement
Homepage
Albertina's Angels Make a Difference donate page, showing the appeal copy on the left and the Donorbox amount selector with preset donation buttons on the right
Donation page
Albertina's Angels Nuevas Noticias Spanish updates page, showing year-by-year program summaries and photo galleries from 2020 through 2023
EN/ES updates feed

Results & Reflection

Honest framing

There's no donation total, no traffic numbers, no conversion data tracked over the three years of this project. What I do have is this: the site has been live and in active use for three years, carrying real fundraising weight for an organization that started with nothing. After it launched, the founders relayed that friends and family found the donation flow intuitive and easy to use. That's secondhand and informal, but it's real signal from people in the target audience, and it's the closest thing to validation this project has.

What I'd do differently: push for donor-facing feedback sooner, something as simple as a one-question post-donation prompt asking what almost stopped someone from giving. Three years is a long time to run on founder-relayed impressions alone. That single change would turn an opinion I still believe in into something I could actually prove.