Preemptive Love Coalition
Captivating audiences with 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.

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.


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: 

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.

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.


Related Story: See how Preemptive Love is using NationBuilder's personal fundraising feature to empower supporters to start online fundraising campaigns of their own.


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.

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.

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.


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.

Interested in improving your digital strategy and expanding your digital toolbox? Get in touch with us!

James Firth
About James Firth
James is Van City Studios' founder & development guru.
Captivating audiences with an intelligent website
Captivating audiences with an intelligent website
Hi, it's nice to meet you.