Action Against Hunger (Spain)

Can a website inspire the world to take action against hunger? When Acción Contra el Hambre (Action Against Hunger) sought to redesign its corporate website, the organization aimed to expand its impact. With a global presence in 56 countries, serving over 28 million people, they needed a platform that could not only handle a complex, multilingual digital presence but also empower donors, members, and supporters to take action quickly and securely. The answer to this challenge was found in Drupal.

A New Era for Acción Contra el Hambre's Digital Presence

Acción Contra el Hambre, a global humanitarian organization founded in 1979, is committed to eradicating hunger by tackling its root causes: malnutrition, access to clean water, and food insecurity. In 2022, the organization supported 28 million people with the help of over 8,990 employees worldwide. To better engage this audience, raise donations, and manage its global operations, the organization sought a new corporate website that offered not just an enhanced user experience but also improved site architecture, security, and scalability.

The website redesign project required a robust platform that could handle multiple functionalities, from content management to integration with external systems like Salesforce and Google Analytics, while being secure, multilingual, and highly customizable.

Why Drupal Was the Ideal Choice for Acción Contra el Hambre

The choice of Drupal for this project was a natural fit due to several factors:

• Flexibility and Customization: Drupal’s modular structure allowed for customizable page composition, critical for building landing pages, donation forms, and membership dashboards tailored to user needs.

• Content Management: Drupal’s robust content management system (CMS) provided the flexibility to create, manage, and categorize content across Acción Contra el Hambre's many programs.

• Scalability: The platform’s ability to handle large volumes of data and users without compromising performance was crucial for a global organization.

• Security: Given the sensitive nature of donor and member data, Drupal’s granular user permissions, robust security features, and secure coding practices made it a reliable option.

• Multilingual Capabilities: With operations in 56 countries, Drupal’s native multilingual support allowed the site to deliver content in multiple languages.

• SEO-Friendly: The platform’s SEO optimization tools ensured that Acción Contra el Hambre’s initiatives reached a broader audience.

• Integration Capabilities: Drupal offered seamless integration with third-party systems such as Salesforce, Google Analytics, and various payment gateways.

• Cost-Effectiveness: As an open-source platform, Drupal minimized licensing costs, allowing the budget to focus on custom development and design enhancements.

Donations: Empowering Global Support to End Hunger

For an organization like Acción Contra el Hambre, donations are the lifeblood that enables them to pursue their humanitarian mission. The donation functionality was designed to simplify the process for donors, maximize the reach of campaigns, and provide a seamless, secure experience for supporters across the globe. By leveraging Drupal’s powerful ecosystem, Acción Contra el Hambre was able to implement a robust and flexible donation system that is intuitive, secure, and adaptable to donors’ needs.

1. Customizable and User-Friendly Donation Forms: To ensure a smooth donation process, Acción Contra el Hambre's website features custom donation forms built with Drupal’s Webform and Commerce suites and styled with Visual Layout suite. These forms offer a variety of donation options to cater to different user preferences, for example:
   1. One-Time and Recurring Donations: Donors can choose between making a one-time contribution or setting up a recurring donation. Recurring donations are crucial for providing sustained support to the organization’s long-term efforts. 
   2. Flexible Donation Amounts: The donation forms allow users to select preset amounts (e.g., $60, $80, $120) or input a custom amount, giving them full control over their contribution.
2. Secure Payment Gateway Integration: The donation system supports a wide variety of secure payment methods, ensuring that donors from around the world can contribute with ease. The integration of payment gateways was handled via Drupal's Commerce Suite, providing secure and flexible transactions. 
   1. Payment Methods: The platform integrates globally trusted payment options, including PayPal, credit cards, Google Pay, Apple Pay, and Bizum. This broad selection ensures accessibility for donors across multiple regions, offering convenience and security.
   2. PCI Compliance: All payment processing adheres to PCI DSS (Payment Card Industry Data Security Standard) compliance, ensuring that donor data and transactions are secure and meet international security standards.
   3. Tax Deduction Calculator: A standout feature is the tax deduction calculator, which offers donors an immediate estimate of how their contribution may impact their tax return. This transparency encourages higher donations by showing donors the financial benefits of their generosity.
3. Automated Receipts and Certificates for Donors: Once a donation is completed, the system automatically generates an email receipt, ensuring donors receive immediate confirmation of their contribution by a tax-compliant donation certificate, which provides detailed information about the donation amount, date, and any applicable tax deductions.This automated process significantly reduces the administrative burden for the organization while enhancing the donor experience by providing instant documentation for their records.
4. Enhanced Donation Experience for Donors: To ensure the donation process is simple and effective, the entire user experience was designed to minimize friction and encourage contributions. Some of the key user-focused elements include:
   1. Leak-free donation pages: Donation-specific pages are presented without superfluous menus or links that can mislead donors and with a design that is as comprehensible as possible.
   2. Responsive and Mobile-Optimized Design: The donation forms are fully responsive, ensuring that users can easily donate from any device, whether they are using a desktop, tablet, or smartphone. This is particularly important in reaching mobile users, a growing segment of the online donor base.
   3. Streamlined Donation Process: The forms are designed to reduce the number of steps required to complete a donation, making the process quick and easy. From selecting a donation amount to entering payment details, the streamlined experience encourages more conversions by reducing any potential barriers to donation.
5. Advanced Analytics and Reporting: On the backend, the donation system is fully integrated with Google Analytics and Salesforce, providing the organization with valuable insights into donor behavior and campaign performance.
   1. Donation Analytics: By tracking donation metrics such as the number of contributions, average donation size, etc. Acción Contra el Hambre can optimize their fundraising strategies and target high-performing channels.
   2. Salesforce Integration: Every donation is seamlessly synchronized with Salesforce CRM, ensuring that the organization has up-to-date records of donor data, allowing for better donor relationship management and personalized follow-ups.
6.  Security and Compliance: Given the sensitivity of handling financial transactions, the donation system includes multiple layers of security and compliance to protect both the organization and its donors.

Other key features and goals achieved

The website redesign project aimed to achieve several strategic goals:

1. Website Architecture and Content Migration:  To ensure a seamless user experience, Acción Contra el Hambre required a complete overhaul of its site structure. The team developed a comprehensive sitemap and wireframe for the corporate website, including a well-organized menu system (top, main, and footer) to make navigation intuitive. 

   The responsive user interface was optimized for a variety of devices, ensuring accessibility regardless of the user’s platform. As part of the migration from the old Drupal 7 platform to Drupal 10, a total of 81 nodes and 269 multimedia assets were successfully transferred. This laid the foundation for a modern, user-friendly, and scalable digital experience.

2. Content Development and Management Powered by VLSuite:  Content management for Acción Contra el Hambre was elevated thanks to VLSuite, a powerful and versatile tool created and maintained by Metadrop. 

   VLSuite's flexibility provided an intuitive, efficient way to manage and create content across the site. This seamless content creation and management system allowed Acción Contra el Hambre to manage static content like "What We Do" and dynamic sections like blog posts and mission updates more effectively than ever before.

3. User Roles and Permissions: For a large organization with a global reach, managing internal roles is crucial. Drupal’s role management system was implemented to create distinct user roles for content editors, administrators, and members, each with specific permissions. A content approval workflow ensured that all published content maintained the organization's high standards.
4. SEO Optimization. Ensuring the website ranked well on search engines was critical to reaching more donors and supporters. SEO best practices were implemented using modules like Metatag, Simple Sitemap, and YoastSEO. Schema.org markup, mobile optimization, and structured metadata were integrated to enhance visibility across search engines.

5. Multimedia and Gamification: To create a more engaging experience, multimedia elements such as videos and interactive elements were embedded throughout the site. An interactive hunger game was developed and externally hosted, providing users with real-time hunger statistics and mission maps. This gamification element fostered deeper engagement and awareness of the global hunger crisis.
6. Social Media Integration: The website was further enhanced with embedded social media feeds and easy-to-use sharing functionality. Visitors could stay updated on the latest news and stories from Acción Contra el Hambre’s social media accounts, with share buttons available on blog posts and articles.
7. Analytics and Reporting: Acción Contra el Hambre needed insights into how users interacted with the website. Google Analytics was integrated to track site traffic, donation metrics, and user behavior. Custom reports provided actionable insights to help optimize future campaigns and user engagement strategies.
8. Accessibility and Performance Optimization: The website adhered to WCAG 2.1 standards, ensuring accessibility for all users, regardless of their abilities. Additionally, performance optimization techniques, including JavaScript and CSS minimization and a content delivery network (CDN), were employed to enhance global performance and ensure quick load times.

Essential Drupal Modules Powering Acción Contra el Hambre’s Global Impact

Several critical modules helped bring this project to life:

• VLSuite: The Drupal Visual Layout suite is an open-source tool, contributed by Metadrop, that was essential in easy managing landing pages, content blocks, and custom templates, improving overall content production efficiency. 

   

  VLSuite enabled content editors to:

  • Create Landing Pages: The system allowed for the design and deployment of custom landing pages optimized for specific conversion goals, such as increasing donations or volunteer sign-ups.

  • Custom Template Creation: Maintaining design consistency across the website was made easy with reusable custom templates, reducing the time spent on creating new content pages.

  • Content Block Reuse: Content blocks like testimonials, calls to action, and banners could be saved, reused, and repurposed across the site, streamlining content production and improving consistency.

    This seamless content creation and management system allowed Acción Contra el Hambre to manage static content like "What We Do" and dynamic sections like blog posts and mission updates more effectively than ever before.

     

• Commerce suite:  Although it's primarily designed for eCommerce, the Drupal Commerce Suite can be easily adapted to create a donation flow thanks to its flexible product types, customisable checkout processes, payment options, donation amount flexibility, tax deductible receipts, recurring donation handling, etc. as happens in Acción Contra el Hambre.

• Salesforce suite:  The Drupal Salesforce Suite is a versatile and robust solution for organizations that need to bridge the gap between content management and CRM. It offers deep flexibility and real-time data syncing, making it ideal for nonprofits, educational institutions, membership-based organizations, and businesses focusing on lead generation. While it may require some technical expertise to set up and manage, it provides a powerful integration for organizations looking to synchronize their website with Salesforce.

• Search API Solr & Facets: These two combined modules offer a highly performant and flexible solution for implementing search on Drupal sites, especially those with large datasets or advanced search requirements. By leveraging Solr’s full-text search, faceted filtering, and customizable indexing capabilities, site administrators can offer a powerful and efficient search experience for their users. Allowed for advanced searching capabilities across the Accion Contra el Hambre's  website, including filters for events, publications, and press releases. 

• Webform: Drupal's Webform module is a comprehensive solution for building custom forms and surveys. Its flexibility, integration options, and ease of use make it suitable for various use cases, from simple contact forms to complex multi-step surveys. Used in Acción Contra el Hambre to Manage donation forms and user-generated content like applications and surveys.

• Leaflet and Geofield: These modules powered interactive maps, displaying Acción Contra el Hambre's work locations around the globe.

These modules and features combined to deliver a secure, scalable, and feature-rich digital experience for Acción Contra el Hambre’s global audience.

Community Contributions

Throughout the project, the team contributed several significant improvements back to the Drupal community, including:

• VLSuite Iterations: Added features like the “Preview section in the library” and “Reorder Layout Builder sections” functionality, improving content creation workflows.

• Support for Layout Builder: Contributed to Default Content module by adding a Normalizer and Denormalizer for Layout Builder compatibility.

• Domain Access Enhancements: Further improvements were shared for managing content across multiple domains.

We help your solidarity project to become relevant

The new Acción Contra el Hambre website is more than a platform; it’s a global hub for advocacy, education, and action. With a scalable, secure, and multilingual foundation, Drupal has enabled the organization to engage users worldwide, boost donations, and streamline operations.

By leveraging the power of open-source, flexible content management, and innovative integrations, Acción Contra el Hambre is now equipped to further its mission: to end world hunger.

Interested in creating a robust digital solution for your cause? Contact us today to start building a scalable, secure, and future-proof platform tailored to your organization's goals.