The British Heart Foundation DECHOX campaign
Working alongside Killer Creative, Pebble Designs was asked to contribute and develop the microsite for the British Heart Foundation’s new campaign ‘DECHOX’ .
What were the requirements?
In order for the microsite to be a success the requirement included:
- JustGiving API integration
- Export facility for BHF’s database
- Easy to update and add content
- Hosting environment which can handle the traffic
- Fully responsive
- Social integration including Facebook Apps
What we did
Pebble Designs built a microsite with full JustGiving integration and a smooth, clear sign-up process. Pages are customisable using the administration section of the website and content can be changed hassle free with a few clicks. Each campaign member’s total is automatically updated and the “Top of the ‘Chox” leaderboard is populated on the DECHOX microsite and the Facebook App.
JustGiving Integration
JustGiving is the market leading online donation platform for generating donation pages. Since 2001 it has raised over $3.3 billion for good causes. A requirement of the project was to have a fully integrated sign-up process hosted on the DECHOX microsite.
JustGiving had recently launched an API system around the time of the campaign whereby a developer can integrate a variety of interactions such as generate user donation pages, create an account, calculate total donations to a charity, donations feed and more. What we required was the ability to create user accounts and custom donation pages.
We decided to split the sign-up process into two clear sections: 1. Sign up details, 2. Create your JustGiving page. The benefits of this was to keep the motion of creating a donations page with JustGiving separate from the sign-up form. We wanted to build trust for users who may never have used JustGiving before by adding JustGiving’s logo and a clear introduction as to what will happen.
Once all stages are completed the user is forwarded to the congratulations page. It is here, along with a welcome email and a further email from JustGiving that the user has the ability to share their new donation page.
What about social?
Pebble Designs also produced a suite of DECHOX Facebook apps which included a shop, video playlist, leaderboard and a sign-up facility.
How was the website built?
The website was built using the content management system WordPress. This particular CMS was already familiar with some of the team at the British Heart Foundation which enabled me to bring together a solution they were comfortable using. It was a system i’m very confident in developing and the WordPress system suited the project requirements aswell.
The main core build was the integration with the JustGiving API. Although very new and not widely used it enabled the user to use the sign up form on the website and automatically generating them a donations page. Once a user has created a donations page they are submitted to a database for export. At a particular time each day, each user is checked against JustGiving’s database and at this point information regarding donations and the user thumbnail is returned. From this collected information a figure of the total raised is emailed every day to staff followed by daily total signups and the “Top of the ‘Chox” leaderboard is updated.
The WordPress theme is scratch built with custom functions and plugins. The core stylesheet was built using Syntatically Awesome Style Sheets (SASS). The benefits of using SASS enabled me to rapidly build cross-browser elements and manage the build more easily. I have also used a responsive framework called ‘Skeleton‘ which i have been using for many years and find its very lean and exactly what I was looking for. I was able to add the necessary break points and controls needed for multiple devices.
The process was smooth from start to finish, with Dean managing all of our amendments and requests quickly and efficiently.
Dean is an excellent communicator, endlessly enthusiastic and easy to work with – we couldn’t recommend him highly enough.
Jordan, Account Manager @ Killer Creative