Givelify

Fundraising and donation collection

Givelify is a platform used by nonprofits and places of worship to fundraise and collect donations. Their web app is used by more 47,000 organizations looking to modernize and streamline their donation experiences. On the B2C side, their mobile app has more than 300,000 monthly average users. Neuron works with Givelify as an embedded design team. With this agile, ongoing engagement we have worked to optimize the UX/UI of their mobile app and web app as well as elements of their product strategy.

MOBILE & WEB APP UX/UI:

Givelify-UX-UI-mobile app.png
Givelify-strategic-UX-partnership.png

Strategic partnership

When they originally reached out to us, Givelify was looking for a trusted team to update designs produced by an overseas vendor.

They had discovered after completing their previous engagement that the final designs were not high fidelity and could not be handed off to development as is. In addition to this, Givelify needed a partner to help them tackle the localization experience of their mobile app and design some new illustrations for the product.

Givelify-embedded-UX-team.png

Creating a design system

Having a robust, componentized design system was crucial for working concurrently with Givelify’s internal design team. This ensured the two teams could focus on different parts of the products without compromising cohesion.

The system’s consistency and comprehensiveness was also key in reducing engineering debt, and quickly scaling new feature improvements across all platforms.

A truly embedded UX team

The degree to which a vendor is embedded varies from one project to another. Givelify wanted a strategic partner that could participate in daily standup, contribute to their roadmapping, respond to changing priorities, and remain informed of everything happening within their product team.

 

Additionally, they wanted to work with designers who understood the needs and challenges that their audience faced. Givelify’s products—both consumer facing and B2Bon the back end portal—are used primarily by an older, less tech savvy audience. They were and remain invested in delivering an experience that is easy and intuitive for new and returning users.

Givelify-UX-UI-total-donors-graph-widget.png
Givelify-UX-UI-total-donations-widget.png
Givelify-user-personas.png
Givelify-UX-UI-giving-style-graph-widget.png
Givelify-UX-UI-donors-widget.png
Givelify-UX-UI-design-team-collaboration.png

Creativity and strategy, while distributed

As part of our partnership, the Neuron team works very closely with Givelify’s product team, attending daily standup virtually from San Francisco and Toronto to get updates and quality face time with their based team.

 

Communication is paramount in an embedded partnership, and we have had the opportunity to collaborate with nearly everybody across the organization through Slack. An additional benefit of the embedded model is the frequency and quality of communication.

This rapport facilitates collaboration. We are available for design QA, releases, and quick fixes when the Givelify team needs us.

 

Despite having a team in-house, Givelify continues to partner with us on complex design initiatives both to increase capacity and capabilities. As the Givelify team continues to grow, we have handed off some of the projects initiated by the Neuron team. Being embedded has contributed to smooth handoff as we are always available to answer questions as they arise.

Givelify-UX-UI-tasks.png
Givelify-UX-UI-priority-task-collaboration.png

Responding to changing priorities

One benefit of the embedded partnership is the flexibility it provides to both the Givelify team and the Neuron designers they work with. As priorities change and needs expand or contract, we are able to pivot and meet these needs.

 

Too often, companies bring vendors in on a fixed cost engagement. While in some ways this de-risks the project, it makes it very challenging for the teams to work in a truly agile way. The reality of most companies is that priorities inevitably shift. The benefit of an embedded team engagement is we can simply get to work. In a fixed cost project, scope needs to be updated and change orders have to be drawn up.

Givelify-UX-UI-event-design.png

Designing an interactive live experience

The embedded team engagement makes it possible to pivot or change scope as Givelify’s needs evolve.

 

In one instance we were tasked with designing an interactive “Giving Experience” intended for a live event. We created a design for a high-profile sports celebrity, which would invoke excitement and competition around the act of giving.

Sign up flow - before

Improving B2B user onboarding

One of our latest initiatives with Givelify was redesigning the B2B sign up experience. The benefit of our engagement model was that we could focus on small improvements that would make a big impact while working within the constraints of previous cycles. This meant we have iterated over time and focused our efforts on the most critical design challenges.

 

The model we started with was similar to Yelp and Google MyBusiness, organizations then had to “claim” their profiles. Over time have continued to iterate and the most recent version includes a wizard style flow.

Givelify-UX-UI-onboarding-3.png
Givelify-UX-UI-onboarding-2.png
Givelify-UX-UI-onboarding-1.png

Redesigned sign up flow

Givelify-UX-UI-onboarding-improved.png

Streamlining integrations

While many businesses around the world use tools like Quickbooks or other bookkeeping software to gain insights into their accounting, places of worship use software called a Church Management System (ChMS).

Givelify-UX-UI-integration-design.png
Givelify-UX-UI-integrations.png

A key goal of the Givelify B2B product is to provide a seamless flow of data from Givelify (which their parish uses to donate) and the ChMS that they use for management services.

 

That goal is achieved with the “Integrations” portion of the Analytics Studio web portal (B2B product). During our collaborative design of this section we had to take into account the desired flows and limitations for a number of disparate ChMS solutions.

Redesigning the Android and iOS apps

Givelify’s mobile apps have more than 300,000 monthly average users, with an even user split between Android and iOS, designing for Android was core to Givelify’s mission. We were cognizant of using UX patterns that would be expected by an Android user and created assets (e.g. AVD files) suitable for the Givelify development team.

 

We brought a similar approach to designing the iOS experience, the key consideration here was how to maintain a seamless experience between the iOS app and the device’s native web browser since transactions on iOS are completed outside the native app.

Givelify-UX-UI-mobile-app-locations-mockup.png
Givelify-UX-UI-mobile-app-mockup.png
Givelify-UX-UI-web-app-design.png

Web app improvements

​The Browser Giving App was a popular option for organizations looking for a seamless transition from their own website to a giving experience. Our job was to bring the app up to par with the design system we had established for the mobile products.​

Conclusion

Our unique multi-year partnership enabled Givelify to improve their products for their donees, donors and internal team, while making them more agile and responsive to the evolving needs of these groups.

We helped them to foster a user-centric design culture and product-driven approach.

Givelify_testimonial.png

Next up

WorkStep