The inspiration behind Carbon Purity stems from popular online questionnaires that help people further understand their actions in different aspects of their lives. We have personally had experience taking these questionnaires in areas such as food intake, maturity, and more. However, we have yet to encounter one related to carbon footprint, and therefore decided to create Carbon Purity to allow people to get an understanding of how their day-to-day actions contribute to their carbon footprint and spread awareness. The questionnaire and corresponding score of Carbon Purity is intended to help users become motivated to reach 100 and remain in the green zone.

What it does

Carbon Purity is a simple, easy-to-use application that allows users to become aware of their day-to-day actions and its effects on the environment. The most important part of the application is the questionnaire page, which consists of twenty common ways people increase their carbon footprint. For people visiting Carbon Purity, they can use the site in two different ways: one, they can simply head over to the questionnaire page and take the quiz to get a sense of how many ways they are easily increasing their carbon footprint. Two, they can create an account to get more information about how they can reduce their carbon footprint and be able to continuously check-in by filling out the questionnaire.

How we built it

We used Python and HTML/CSS to build our web application. With our main Python file, we imported Flask to build our main framework and used sqlquery to maintain a database of users, along with their information. Our main Python file redirects users and passes key information between HTML pages once a user performs specific actions, such as logging in and passing their name to the dashboard to display their name. Once a user creates an account, a new row is created in the database, storing key information: name, email, username, password, and default score and last checked in time. When a user has “checked in,” or filled out the questionnaire, their score is updated and displayed on the dashboard, along with the time since their last submission. The time will likely be 0 minutes right after a user has completed the quiz. However, for the users who want to check in every month, the dashboard will successfully display ‘1 month’ since the user last checked in. There are four different color options for the score on the dashboard: red if the user has a score less than 65, orange if the score is between 65 and 80, yellow if the score is between 80 and 90, and green if the score is between 90 and 100.

Challenges we ran into

Since Flask and sql query was unfamiliar for half of us, we had trouble starting off on the right foot; we all started by watching introductory Flask tutorials together to make sure we were starting on the same page. We were unfamiliar with flash messages (such as “login successful!” or “incorrect password”) and struggled with implementing them correctly; they sometimes flashed at the wrong pages, or were displayed for too long. On the HTML/CSS side, we had trouble using the Google Fonts API to import fonts, as we had never done so before. It also took us about an hour to realize that we had to clear our history on our browser every time we changed our css and html files, before it showed our changes.

Accomplishments that we're proud of

Although the time constraint of 24 hours was very daunting, we are proud of overall being able to have a functional app that completes our original intentions. In particular, we are proud of getting messages to display with the ability to disappear on command, making the website (mostly) visually pleasing to the eye, changing the color of the score depending on how high/low it is (it was interesting to understand how to write the for loops in the HTML files), and last but not least, working with the datetime module and getting the last-check-in-time to be displayed.

What we learned

We gained many new skills on both the front-end and the back-end. For instance, we learned how databases work and how to add/get/delete columns from it. We also learned how to custom import fonts and how to style those fonts (we really struggled with this). Included in this was learning that not being able to see some CSS styling changes on the browser could be fixed by just clearing the cache. We also learned how to work with checkboxes and get information from a list of them. Finally, we also learned new facts about how to reduce carbon footprint ourselves -- we hadn’t realized that certain small actions could have such a large impact on the environment.

What's next for Carbon Purity

One feature that we had hoped to include initially but ultimately didn’t get the time to is maintaining a progress bar in the dashboard for users to more visually see how they’re doing in reducing their carbon footprint. Overall, we would like to include more visual graphs and information about reducing carbon footprint so that we could help and encourage even more users to play their part in helping the environment. It would also be amazing if Carbon Purity can become interactive in the future, where users can become friends with other users and see their progresses.

Share this project: