Skip to main content

Captivating audiences through an intelligent website

When we started working with Preemptive Love Coalition, they had already been up and running on NationBuilder for some time. Frustrated by the lack of usability of their current website, they came to us looking to improve their digital strategy and toolset to better engage their supporters, and allow them to manage the day-to-day operations of their online presence more independently.

This case study is brought to you by Van City Studios - a certified Agency based in Vancouver, Canada. Be sure to visit their website and see their previous NationBuilder work.


Assessing the situation

An important part of the project involved assessing their needs, skills, and available resources to ensure we were crafting strategies and providing tools that played to their strengths and helped accomplish their goals.

One of the key factors driving the project was a lack of usability and functionality of their old website. They felt limited by the tools they had at their disposal. With some basic knowledge of HTML and CSS they were able to implement some workarounds to accomplish their goals with the tools they had, but in many cases these solutions were hacked together and did not provide optimal results. They needed a website that was easier to manage, with a far more comprehensive set of built-in tools.

On top of the usability issues, they felt that their current website was flat and uninspiring. They wanted a more dynamic website that did a better job of driving donations, engaging their supporters, and capitalizing on more of NationBuilder’s features. They also wanted to make sure that their new website reflected their well-established visual identity, remained on-point in communicating their key messages, and reflected their well-developed organizational brand.

The evolution of a "smart" website

To help drive the development of a dynamic, engaging website, one of our primary goals was to craft a digital strategy aimed at increasing supporter engagement. We worked with Preemptive Love Coalition to define a digital ladder of engagement, set clear benchmarks for measuring each supporter’s engagement, and lay out a clear path to take a supporter’s engagement to the next level.

With a solid digital strategy in place, we were able to design and develop a dynamic, “smart” website that recognizes where each supporter sits on their ladder of engagement and targets each user with personalized messaging and calls-to-action aimed at ramping up support. This means that as a user becomes more involved with Preemptive Love, their user experience evolves as well. For example, a supporter who has just signed up and joined Preemptive Love’s network is welcomed back by the website with a personalized greeting, and targeted with calls-to-action to take the next step on becoming a donor. One-time donors are encouraged to become monthly sponsors, monthly sponsors are encouraged to start a personal fundraising campaign, and so on.

1_-_personalized_CTAs.jpg

We were also able to build in custom calls-to-action aimed at retaining current supporter engagement. For example, if a donor comes back to the website and it’s been over a year since their last donation, the website will recognize the lapse in their giving history and ask that supporter to renew their commitment to waging peace and saving lives by making another donation.

The personalized user experience and targeted calls-to-action we built into Preemptive Love’s custom website not only gives each of their supporters a clear path to ramp up their engagement to the next level, it also automates a lot of the heavy lifting in terms of targeting key segments of their community, communicating with those segments, and building relationships with each supporter.

Optimizing for donations

Donations are a key component of Preemptive Love’s operations. Donations from their supporter base allow them to continue to provide lifesaving heart surgeries for children, food and shelter for those persecuted by extremists, education for at-risk children, and small-business empowerment grants so people can put their own lives back together. Naturally, one of our goals was to optimize their website for donations -- here are a few ways we accomplished that: 

Crowd-sourced donations, done right

NationBuilder’s built-in personal fundraising feature allows supporters to start their very own personal fundraising campaign to crowdsource donations from their friends and family. In our experience, it’s one of NationBuilder’s most underused features -- it’s rarely capitalized on, promoted, or even fully understood by a number of NationBuilder users.

With fundraising being one of the main goals for Preemptive Love’s digital strategy, we wanted to push the envelope with NationBuilder’s personal fundraising feature to make it more user-friendly and intuitive. We added a call-to-action to start a fundraising campaign as one of the key rungs of their digital ladder of engagement, set up a custom signup process that walks supporters through setting up their campaign, and designed an engaging user profile page aimed at capitalizing on donations.

2_-_Fundraising.jpg

The results paid off. Summer Downs, one of Preemptive Love’s supporters, took it upon herself to raise more than $5,900 to help women who’ve been kidnapped and exploited by ISIS using the digital tools we helped craft. This only scratches the surface in terms of what’s possible with NationBuilder’s personal fundraising tools, and we’re continuing to push the envelope in terms of what’s achievable with this feature.

Streamlined donation options

Another challenge working with NationBuilder has always been that each donation page on a NationBuilder website can only accept one-time or monthly donations, but not both. We crafted a custom, streamlined solution which -- at least from a user experience perspective -- makes it appear as if both one-time and monthly donation options are accessible via a single donation page, and are a streamlined part of the donation form itself.

Preemptive Love’s primary donation pages are connected to a payment processor that allows supporters to enter their credit card information and complete their transactions directly on the website, which is great for optimizing conversion rates. However, Preemptive Love got a lot of feedback from supporters who also wanted options to give via cheque, or from funds they held in their PayPal accounts. We helped Preemptive Love add an informative “Paying by cheque?” pop-up to their donation page templates, and connect additional payment processors to their Nation allowing their supporters to give directly from their PayPal accounts. These custom solutions helped provide donors many ways in which to give.

3_-_Donation_Page.jpg

Donation templates aplenty

Part of Preemptive Love’s fundraising strategy is to run many micro-fundraising campaigns throughout the year. We didn’t want their supporters to always end up on the same style of donation page, so we designed and developed multiple donation page layouts for them to use.

Each layout is built directly into their custom theme, and we set up a system that allows them to easily activate any of the built-in donation page layouts with the click of a button.

4_-_Donation_templates.jpg

Effective storytelling

Part of why Preemptive Love is such an effective organization is that they tell amazing stories about those who are affected by war and violence. Another one of our goals was to design their new website in a way that allowed them to capitalize on this strength even further. Great storytelling is evident throughout their website, but here are a few key ways we helped them optimize their website for effective storytelling:

Donation forms that lock as you scroll

When you have a great story to tell, sometimes you need some space to tell it. One of the challenges we encountered was balancing the need for space to tell a great story on donation pages -- in particular for fundraising campaigns tied to a specific story or goal -- with featuring the donation form prominently near the top of the page to make it easy for people to give. We came up with a custom solution that allowed donation forms to lock in place as you scroll down the page. This means that on donation pages that have longer stories which extend below the fold, the donation form will always be visible to the user as they read through the page content. This makes it easy for supporters to give as they reach the most compelling part of the story. 

Video pop-ups with autoplay feature

Preemptive Love does some amazing videography work, and video is a key medium for their storytelling. When they share pages that feature some of their incredible footage, they wanted to ensure that the video is the first thing their audience sees when visiting the page. We helped PLC craft a video pop-up feature that would auto-play as soon as a user visits the site, ensuring their audience was engaged and hooked by the video upon visiting the page.

5_-_video_popup.jpg

Mapbox integration

Preemptive Love also wanted to focus on communicating the breadth of the impact their work has had in war-torn regions around the world. We worked with them to develop a custom interactive map with data points that highlight the scope and geographic distribution of their work. Each data point on the map links to a collection of stories about their impact from that region.

6_-_Map.jpg

Mobile & tablet friendly

The use of mobile devices to access the internet exceeded that of desktops long ago (back in 2014 as a matter of fact), and Preemptive Love’s audience is a prime example of this trend. With over 70% of Preemptive Love’s supporters accessing the website on a mobile device, having a website that is optimized for mobile viewing is key to their success. We designed their website as a responsive website, meaning that the website’s layout is fluid. As the the screen size being used to view the site changes, the website’s layout adapts accordingly.

7-_responsive_design.jpg

This means that no matter what device is being used to access the website, the user experience will be optimized for that device. Responsive sites are key to not only a great user experience, they also help optimize conversion rates, improve your Search Engine Optimization, and future-proof your website for future devices with different screen sizes.

The independence factor

One of the primary goals of the project was to ensure that we empowered the team at Preemptive Love Coalition with the tools and knowledge they need to manage the day-to-day operations of their website. Throughout the course of the project, we made sure that the tools and strategies we developed for them played to their strengths, skills, and available resources. We also held interactive training sessions where we showed them how to use the tools and strategies we developed for them, and provided an extensive set of custom documentation to refer back to which walks them through all of their website’s custom features.

An ongoing relationship

Another factor in Preemptive Love’s success as an organization is their commitment to continually improving their digital strategy. Websites are dynamic tools in a continually evolving medium, and organizations that recognize and plan for this are more successful in the long run. We love building long-term relationships with our clients, and we’ve had the pleasure of continuing to work with PLC in an ongoing capacity to optimize their website, add new features, and continue to push the envelop in terms of what’s possible with NationBuilder.