Overview
The 21 Day Challenge campaign for Mercy For Animals was created to challenge users to commit to a 21 day plan to a healthier plant based diet. The project was initial launched in Brazil with plans to launch in Canada and Mexico. The site’s purpose is to educate the user on the effects of an animal based diet and the benefits of a plant based one. Throughout the site the user can fill out a form that adds them to a drip email series for 21 days providing recipes, steps, and answers common questions.
- Main Responsibilities: Front end development, data collection, API integration, back end development
- Technologies used: HTML5, CSS3, jQuery, Javascript, WordPress
- Notable features:
- Responsive design
- Signup number counter
- Customizable circle details
- Large hero form
- Developed for Internet Explorer 9+ as well as modern browsers
Counter
Previous projects requested signup numbers directly from the API which caused latency and massively invalid numbers. On this project I opted to store signup data as well as pass to the API. This allowed a faster, more accurate reading. It also insured the signup data would be save on the chance of an API failure.
Custom Circles
The admin could specify the the color and direct of the color with a few simple options. The colors are done in a way that uses percentage heights making them even regardless of their content. The admin also simply provide images and content without having to force the layout manually.
Ajax Signup Form
The large form in the hero is replicated throughout the site, though smaller. The user’s data is sent/stored through a simple ajax request to the site that connected to an API web services for additional storage in the email system. Once complete a thank you message was presented.