Spotlight | Mobile Fundraising & Donor Management App UIs

Smartphone and tablet usage is surging: In 2014, 55 percent of U.S. Internet traffic occurred through such devices—surpassing PC-supported usage for the first time. Just as mobile device usage has risen, so has the number of fundraising and donor management mobile apps that help nonprofit staff members manage campaigns and contributors.

Effectively tracking progress and donor data from a mobile device requires superior user interface (UI) design and performance. But what UI elements should you look for when evaluating apps that will provide your staff with a good user experience?

Jakob Nielsen, Ph.D. (principal of Nielsen Norman Group, a user experience research agency) and Raluca Badiu, Ph.D. (user experience specialist for Nielsen Norman Group), are co-authors of “Mobile Usability”—a book in which they explain mobile usability design principles, discovered through extensive research and user testing.

We used the following five criteria1 described by Nielsen and Badiu to analyze mobile fundraising apps. This report highlights examples of especially well-designed mobile UIs.

* "Chrome" refers to the screen space that contains elements that let users manipulate the content


Allegiance Software

Allegiance Software’s Major Gifts app allows users to retrieve donor contact information and giving history, take notes, send emails and more while working outside the office. This app was selected for its simple UI and smart use of chrome functions in the header.

  • allegiance donor profile
  • allegiance giving history
  • allegiance task list

Each screen is laid out for easy reading and movement between pages, showing users only the most important donor information and action options with minimal scrolling required. In the task list, users can review items that need their attention—such as phone calls to make, appointments to attend and letters to send—and tap each for more details.

When approaching the app design, Dave Mathisen, software developer for Allegiance, says he carefully considered Android’s features and how people use smartphones. [Note that Allegiance also offers an iOS app; this spotlight focuses on the Android version.]

“I wanted to mimic the behavior of the Android phone system so that it felt natural to the person using the app, and made sure every feature was intuitive,” Mathisen says.

Indeed, this app takes advantage of the functionality directly built into Android smartphones. From a donor’s profile, users can tap the phone icon in the header to dial the number in one touch, or create a map with directions to the address.

Bloomerang

Bloomerang’s fundraising and donor management app is built using responsive design, which means it’s designed to work well on a wide range of devices, including smartphones and tablets. (A native app, on the other hand, is downloaded and installed directly on a device for which it was developed.)

We chose this app to highlight its vertical navigation structure that allows users to see all of their options in a single view, without having to scroll or swipe for more options.

  • bloomerang dashboard
  • bloomerang giving history
  • bloomerang timeline

Along with reviewing individual donor histories and timelines, users can create campaign pages and review progress reports while on the go.

The main navigation also uses relevant icons as action buttons: To review a report, tap the chart icon; to return home, tap the home icon; and so on. At the same time, other visual cues help users maintain their orientation while moving between screens, which is especially important for apps with many pages and levels. In this case, the icon that corresponds to the active screen is colorized and accentuated with an arrow, so users always know where they are.

Micah Weaver, director of software engineering for Bloomerang, says understanding how people will use an application is key to optimizing it for mobile.

“We expect users to view dashboard reports, search for constituents and view profiles and timelines to prepare for coffee or a lunch meeting—[not to] edit email and letter templates or perform data entry [as they would in the desktop version], because mobile devices just aren't built for that purpose,” Weaver says. “Once we knew what features were critical for mobile users, we [focused on optimizing] our design and testing around those areas to ensure the best experience for our customers.”

Finally, Bloomerang’s charts and other graphical elements display information in a straightforward manner. While the design is not exactly minimalist, its visual elements are clear and relevant, preserving the app’s usability.

DonorPerfect

DonorPerfect is a leading donor management software vendor, and its mobile app was selected as another prime example of a straightforward interface design.

  • donorperfect donor profile
  • donorperfect giving history
  • donorperfect location based search

Its iconography is limited to a small number of familiar images that are easy to understand at a glance, so users can quickly find the information they’re looking for or the action they want to complete. For example, a gift icon is used to identify an individual donor’s transactions, while the telephone icon labels phone numbers and the pushpin icon signifies mappable addresses.

Furthermore, donor profile actions feature large, tap-friendly buttons with text that clearly describes the action. By clicking on the “view gifts” button, users undoubtedly know that the next screen will list donations contributed by the donor whose information they’re reviewing.

DonorPerfect’s app also takes advantage of the GPS location features included in smartphones: Users can search for nearby donors based on their current location. From there, they can click the telephone icon to call the donor, or the pushpin icon to generate a map and directions to the listed address.

FrontStream

FrontStream—vendor of such notable nonprofit software brands as GiftWorks, Artez Interactive and FirstGiving—offers "white-labeled" mobile apps, meaning the design can be customized to match the brand identities of the organizations that use them. We selected this app for its use of navigational cues and touch-friendly targets.

  • frontstream campaign progress
  • frontstream large targets
  • frontstream edit photos

The header’s chrome displays the screen title and available actions. For example, on the campaign progress screen, users can click on the circular arrow to refresh the data and see the most up-to-date figures on how many donations were collected, and how many more are needed to achieve both personal and team fundraising goals.

The app’s main screens—campaign progress, event details and news—are included in the footer with large touch targets, so users can reach them with one hand if using a smartphone. Less important screens are available in a secondary level within the “more” button, but are still accessible through a couple of taps.

Conrad Lofto, senior director of product development for FrontStream, says that when his team first considered designing a mobile app, they knew it couldn’t simply be a sized-down version of the “big browser” application.

“We looked at how people use smartphones and tablets, and made sure that every function on the app took advantage of [mobile capabilities],” Lofto explains. “For instance, [the app allows users to] access their phone’s camera roll to personalize fundraising content, receive a push notification with important information and use their existing contact list.”

Fundly

Fundly provides online fundraising software that focuses on peer-to-peer and social fundraising campaigns. Within its mobile app, fundraisers can check campaign progress, share updates with supporters, communicate with donors and view task reminders (e.g., sending thank-yous to recent donors).

Fundly is a good example of an app that is optimized for mobile devices with large touch targets and copy that’s to-the-point, allowing users to quickly perform the most important campaign management tasks.

  • fundly checklist
  • fundly thank donors
  • fundly campaign progress

One crucial task is thanking campaign supporters for their involvement. To do this within the app, users can go into their “success checklist” to view a list of recent supporters, then scroll through the list and send each individual a personalized email by tapping the “thank” button. The process is fast, and ensures that every supporter receives one-on-one attention.

Crystal Yang, user experience designer for Fundly, says it’s important for mobile apps to focus on one or two core features, instead of trying to tackle everything that desktop versions of software can do.

“Ultimately, the goal is to help our fundraisers raise more money and stay engaged with their donors, so the primary focus of our app is campaign promotion," says Yang. "It allows fundraisers to spread the word about their campaign on social media while on the go, as well as instantly thank their donors when they’ve received new donations."

Finally, Fundly’s interface has a clean look, and its visual reports present campaign data in charts that are clear to interpret.

With the increasing number of mobile fundraising and donor management apps, it’s no longer necessary for fundraisers and gift officers to be tied to their desks. They can maintain access to vital donor data and campaign stats while on their way to events and in-person meetings. For nonprofit managers looking for an app to help fundraisers stay engaged with donors and supporters from any location, these apps may be a good fit.

Note 1: The list of criteria we use in this report is not comprehensive; Nielsen and Badiu’s book includes many more.


Janna Finch

Share This:

Twitter LinkedIn Google Plus Facebook