Team Members
Project Team
This project was completed by the Amazee Labs team in Austin, Texas.
Project Manager: Stephanie El-Hajj
Design Lead: Andrew McClintock
Tech Lead: Brandon Williams
Developer: Kristy Moon
Developer: Kathryn McClintock
Developer: Maria Comas
Developer: Seth Silesky
Rotary International
April Jensen
Jamie Revord
Debbie Torgan
Maria Liccardo
Alex Daych
Gabe Jacobson
Rotary is 1.2 million inspired business and professional leaders, in 35,000 Rotary clubs and more than 200 geographical areas united daily across cultures and occupations addressing illiteracy, disease, hunger, poverty, and lack of clean water. Rotary International manages the online presence and back-office systems supporting The Rotary Foundation's donation collection and processing.
Previously, making online donations to The Rotary Foundation took place through a frustratingly slow and inefficient multi-page system. When donors visited a Rotary project page, they were redirected to a different website, which was not the best user experience. Donors also struggled to select the appropriate fund among Rotary’s many possible options, even when directed there from a campaign-specific site.
Amazee Labs worked together with Rotary International to create a custom donation app that could live on any of Rotary’s many web properties and make the donation process simple, straightforward, and elegant.
About the project
Technical Goals / Requirements
The widget needed to integrate with Rotary’s many internal processes (finance, membership, fundraising) which would dynamically feed the widget data (exchange rates, member access, and fund IDs) based on the user’s access level or selections and then return that donation information to the different systems.
The donation app also needed to be easily customizable by Rotary’s content editors, allowing editors and campaign managers to spin up and publish new, custom donation widgets.
Creating a custom Drupal module would allow users to sign into the donation page, but syncing that login across many sites would create caching problems. Although there could be a solution in building the tool in an iframe, it would be far from ideal. And so, an alternate solution was suggested: React.
The advantages of progressive decoupling for this project were clear. React could provide the functionality needed to integrate all the different API endpoints and the frontend functionality needed for the interactive styling. Meanwhile the existing Drupal backend could work quietly away beneath the surface.
By pairing these two Amazee Labs built a donation app that can live on any Drupal site without redirecting users. It’s currently being used on the main page as well as on the page heading up donations for the End Polio campaign.
Rotary teams can add and customize this React donation app without calling in a dev team. This means individual administrators can select the parts of the app that make it relevant, uncluttered, and easy for their users and customized for different pages.
Outcome
Rotary’s new online donation platform provides a robust, customizable donation experience that is elegant, dynamic, responsive, and most importantly, easy to use. Online donations and donor satisfaction have never been higher.
Our UX/Design team designed and user-tested new workflows that were simpler for Rotary’s older demographic to easily navigate. The design itself is light and simple, hiding a complex workflow of interactive and feature-filled donation flows.
Editors can create new, custom donation widgets on different Rotary web properties. Donors can guide their own donation experience by selecting different options along the donation flow and see only features and functionality related to the donor path they’ve chosen.
Select a Fund
One of the first features that needed to be included was the ability to select the fund to donate to. Previously, users saw a list of all possible funds on every donate page. So even if they had navigated to End Polio they still had to choose that from a long list in a clunky application. Now, as part of the customization of this application in Drupal, each page can list only one fund, or a couple options, to best suit the users on each particular site.
Dedication
When users donate to Rotary they can choose to make a donation in honor of, or in memory of, anyone you choose. They can then email or print a tasteful message to let someone know a donation has been made in their honor. Amazee Labs worked hard to make sure the users could easily navigate these options and that the message would look great both online and in print. The app now uses a pre-formatted layout that is populated by the name, a short message, and one of four different images.
Donate on behalf of club (or club members)
The Rotary Foundation is a big organization with many chapters and members that do fundraising for specific causes or for the general global fund. Not only did the donation app need to work for individual users wanting to donate online, it needed to be a portal where a club could donate their collected funds and attribute them to individuals or to their chapter. The user login system was already present in Drupal, so the app needed to preserve this information, keep it paired with a third-party transaction for the entire donation, and pair it with the individuals or club again once that transaction was cleared.
The donation app now identifies if a user is logged in and whether or not they are an officer of the club. It gives options to attribute all of a donation to that club or to break it up and attribute each individual member. This makes it easy for clubs to hold fundraisers and collect checks, as well as encourage people to make donations online, and ensure that everyone gets credit within their community and the money all goes where it was intended to go.
Preset amounts
The app pulls in real-time currency data from Rotary API allowing donors to give and receive credit with real-time exchange rates while the Drupal interface gives Rotary editors the flexibility of setting preset donation amounts.
Recurring donations
In our donation app users can give one time or choose to make a recurring donation, monthly quarterly, or yearly. They can choose the start date, and either a preset or a custom amount.
RaiseNow widget
In order to comply with PCI requirements, and to support their vast international membership, Rotary partnered with RaiseNow, a leading provider of online fundraising solutions for global nonprofits.
Review my donation
Before hitting submit users can see a summary of everything they’ve entered on the form so far. React makes this easy to build and it’s incredibly handy for users.
Confirmation Page
The confirmation page is a robust, dynamic page that changes to display only content relevant to the donation. Information about recurring donations or dedication messages appears on this page.
Self-service portal
When users login to their my.rotary.org account, they can view, edit, or change recurring donations without having to make a phone call or otherwise contact Rotary’s donation support team.
Why Drupal was chosen
The Rotary Foundation has a number of Drupal sites. Their development and content teams are familiar with the maintenance and upkeep of Drupal.
Technical Specifications
Drupal version:
Key modules/theme/distribution used:
Entity Module was used to support the Rotary editors being able to create new, customized, donate app instances that can be added to any page. TheI18N (Internationalization) Module was necessary to support translations for Rotary’s diverse international members. Features Module was used to facilitate the deployment of Drupal changes to the various development environments.
