Earthentic

Earthentic - Cover Photo
Earthentic - Thumbnail

Inspiration

Our inspiration for making this project was our love and interest in the planet. We’ve realized that there are many resources for learning about global warming and its effects, however, we believe that none of them really gives justice to explaining its importance in a manner that can be comprehensible for anyone. Our product, Earthentic, does just that.

What it does

Earthentic provides a simple and easy way to understand the effects of global warming and their importance by using authentic data that was selected from various, requitable sources by our team. The website is organized in a way that incorporates aspects of storytelling while being serious with the information at hand.

How we built it

In order to build this project, we used HTML, CSS, JavaScript, Bootstrap, Python, matplotlib, pandas, and Figma for design. We used HTML, CSS, JavaScript, and Bootstrap to develop our front-end application and used matplotlib and pandas to create a line graph to represent Carbon Dioxide Emissions. We also used Canva and Photoshop to create our logo and buttons used for transitioning from one section to another.

Challenges we ran into

There were many obstacles faced while building Earthentic. For example, designing the website was difficult due to the lack of knowledge of UI/UX design. We wanted to make sure that our product was easy to use and easy to learn from so we emphasized the design aspect of it. The largest obstacle that we faced was translating our Figma designs into our front-end product using HTML, CSS, Bootstrap, and JavaScript. Although designing seemed like a very difficult aspect, keeping the website responsive without design was very difficult. Another challenge was time management because it held us back from focusing on the website's responsiveness for multiple screen sizes, including mobile.

Accomplishments that we're proud of

Despite facing many obstacles, such as having to change ideas mid-Hackathon, we’ve managed to create a version of our vision that holds many parts of what we wanted to put out, especially given the time allotted. We are also proud of working well as a team and helping each other with obstacles that we weren’t expecting to tackle, such as issues regarding obtaining a domain and using Figma to its full potential.

What we learned

When creating the website, it was important to first educate ourselves on the topic so we could proceed to educate others. The graphs used were looked at by all team members and then cross-referenced with other valid sources to see whether the graph’s data was true or not. In doing this, we digested the information from said sources, and can confidently say we have a base understanding of global warming and its ramifications.

What's next for Earthentic

Due to the time constraint, Earthentic didn’t materialize into its ideal form. We had multiple ideas that we wished to implement, but would just take too long to add. For example, the idea of animations for the graphs and paragraphs to come into the frame when scrolling down was something we wanted to see come to life, however the time it would take to research and implement animation would take too long. In addition, we wanted to add animations for when the user hovers over each word in the header, with the surrounding area greying out a little bit to emphasize focus on the hovered button. Another next step for Earthentic would be the implementation of a tab in which we describe ways the user could hope to make a difference and fight against the ever-growing carbon footprint of humanity. An example would be an outline letter that someone could fill out and mail to congress, in a way to voice their opinions to those who have a chance of changing something. Finally, working out the kinks of the website, which includes responsiveness for various devices would be one of our main goals to improve our product.