What I’m up to: Donation Site Upgrades

Small changes with huge impact

Ashley Ann
Ashley Crutcher
5 min readJun 26, 2018

--

InterVarsity’s Donation Site has only seen bug-fixes for the past few years and hasn’t received any new features or updates. The development team I work with and myself found ourselves with about 8 weeks of space before new projects begin, and so it was decided that we would make some low-hanging fruit updates to the Donation Website.

The Scope

The Donation Services, Ministry Partner Development, Marketing, and Communications team several years ago had put together a long wish list. From that wish list, several stand-a-lone features that we could implement within the time frame were chosen.

Here are the more exciting ones!

  • Direct Links
  • Two-Column Page Layout & Footer
  • Primary Menu Bar Functionality
  • Cover Credit Card Fee

Direct Links

Generally, a donation page has an “ugly” URL like: https://donate.intervarsity.org/donate#21378.

Donate has a feature that allows staff and project leaders to give out a direct url straight to their donation page that is memorable, like: https://givetoiv.org/panda

The problem was, when someone landed on a direct URL, the search box was present and our donors would start typing in the staff’s name or other search terms, when they didn’t need to.

When someone types in a name and uses that one instead of the intended one, it creates a lot of work on our Donation Services team to straighten out the donation.

Solution

I made a prototype for this to show what the new functionality would like like: if a direct link is clicked on, no search box is present. If someone wants to give somewhere else, they can close the current donation box and type in a different one. So now if we land on Katie’s page, we can get straight to donating!

Success?

We monitored the new UI and saw several people who used a direct link give to the right accounts the first time without any confusion. Who knows how much time we saved our donors and Donation Services!

Two-Column Page Layout & Footer

The entire site used a three-column layout. For some pages, this worked ok, but for our informational pages, the pages were very tight looking and the sidebars which had important information were likely to be ignored.

Original three-column layout & footer

By moving to a two-column layout, more prominence is given to the main content which creates a much better reading experience.

But what to do with what was in the sidebar? Depending on the page, I either moved the sidebar content into the main content itself, increasing the likelihood it would be seen and interacted with, and for content that needed to be on every page, it got moved into the footer.

Sidebar information incorporated into main content or placed into the footer.

Did you just breathe a sign of relief? I know I did. As I monitored the new pages, I saw a few instances where people clicked the Donation Services phone number in the footer and got directly connected to someone — wohoo!

Primary Menu Bar Functionality

Currently, the Donate site operates slightly different from other donation websites that you might be familiar with. You may typically visit a special area of the website where donors manage their giving.

Prior to my work, when landing on the donate website, logged in or not, the menu bar looked like this:

Clicking on My Partnerships, Donation History, or Giving Methods would take the user to that page with a message inviting them to login.

This was extra clutter for someone who was an unregistered giver and created confusion for them because they would think that despite being unregistered, they could see their history or giving methods.

Solution

I prototyped out a new architecture — changing the primary menu bar to hide those donor specific pages behind a new menu link — “Manage My Giving” which on click took someone straight to logging in or creating an account.

This was a big help — as we monitored the changes, many donors interacted with ‘Manage My Giving’ over the small login link that they had used before. Big win!

Cover Credit Card Fee

This change is perhaps the biggest impact to our revenue, whereas the other changes were to increase donor satisfaction and to create a better experience.

You may not know that when you give to a non-profit by credit card, credit card vendors charge ~2.5% fee to process the transaction, which means some of your donation is going to the vendor, not to your organization.

You can avoid that by donating through your bank account or cash, but at the end of the day, many donors want to give by credit card.

What if you want 100% of your donation to go to the organization then? It’s simple — you can tack on an extra 2.5% yourself, but a lot of people a) don’t know the fees exist and b) aren’t going to do the math themselves.

Solution

Enter the new checkbox I prototyped out! Here’s an example of a $10 donation:

The good news is that between 30–40% of our donors are giving the extra 2.5% to cover the credit card fee so that 100% of their donation comes to InterVarsity. Since May 2018 to June 2018, we’ve had almost $5,000 of our credit card fees covered, which is a huge blessing to our staff. Projecting that out — we are expecting to save our staff at minimum $30,000 a year — and that was 3 people working for 3 days!

Imagine what we could do if we had more developers and designers!

Shoutouts

Staff

Big thanks to developers Nathan Lenz and Paul Utley, and our “clients”: Donation Services and Ministry Partnership Development.

Did this help you?

You can contribute to my book fund so that I can keep learning & writing!

Ashley Crutcher is now the Director of Experience Strategy at InterVarsity located in Madison, WI. She tweets at @ashleyspixels and enjoys cuddling with her furkiddos, crocheting/knitting, ringing handbells, and thinking too much about everything.

--

--