Have you ever wanted to donate to charitable organizations but felt like you didn’t have the money for it? Ever thought of spending your spare cash on someone else rather than silly small things for yourself? We too have experience buying useless tech add-ons, playing too many video games, and participating in all the basic quarantine baking trends. We hope to replace this self-indulgent behavior with a more altruistic mindset. Enter Devil’s Advocate, the sarcastic website that pushes people to donate to impactful causes.

What it does

Our website lets users pick how much money they’re looking to spend using a slider. Once they’ve selected an amount, the shoulder devils present two options. The user can spend their money to address a critical area of need - education, the environment, health, or animal welfare - or select the more devilish option of more self-indulgent investments. While it’s fun to boost an overvalued stock or dress up a video game character, the website encourages more impactful causes based on a user’s ability to spend. After these suggestions are presented, the website jokingly shames the user if they select the selfish route and, should they be motivated to contribute, enables a donation using Checkbook’s API based on the designated amount and charity they select.

How we built it

We used Bootstrap, HTML, and CSS to design the website’s frontend. Javascript was a great help for selecting unique suggestions for different amounts of money the user suggested. We did this by creating a Javascript object with different settings for small, medium, and large sums of money. Each option also had a variety of serious and silly suggestions for items one could purchase within that price value. If you select the “donate” button, a form will appear with pre-populated information about the organization you decided to donate to. Thanks to Checkbook’s API, you can make a seamless, easy donation to that organization. We used Flask to host our server, and we used Google Cloud to host our Flask server and project as a website. Google Cloud was a great tool to make it easy to host our server online so anyone can test out our project by visiting our Google Cloud IP.

Challenges we ran into

At first, we struggled with spacing and formatting on the website and used Bootstrap to simplify interface design. After moving on, we discovered that transferring data between web pages was a way we challenged ourselves to make the user experience more intuitive. Once we completed that portion, we moved on to integrating the Checkbook API. While it was initially difficult to integrate the API, we learned Flask to access it from the server-side. We spent a very very long time debugging our Flask issues. Special thanks to mentors Ryan and Alan and Checkbook representatives PJ Gupta and mb for their advice and assistance when we struggled with Flask.

Accomplishments that we're proud of

Our team did not have a lot of experience with web development before tackling this project, so we are very proud of how nice everything turned out looking and that we were able to get the project working. We are also very grateful to the mentors and Checkbook representatives who helped us along the way.

What we learned

Since we did not have a lot of experience with web dev, we learned a lot during this hackathon. We learned how to use Bootstrap to design a website. We also learned how to use Flask to host a server to call the Checkbook API. We ran into a lot of problems when using Flask, read a lot about the tool online, and eventually got it working with the Checkbook API in the way we envisioned.

What's next for Devil’s Advocate

Our next idea is to create a Chrome extension that suggests charitable organizations you can donate to when it notices users shopping online at Amazon or eBay. We wanted to implement this feature during TreeHacks but ran out of time due to the difficulties we encountered with implementing the Flask server.

Share this project: