Inspiration

In today's digital world, scrolling through social media has become a daily habit for many — whether to relax, zone out, or catch up on the latest news. But I began to wonder: what if we could transform that habitual scroll into something more meaningful? What if we could create a platform that not only brings joy and entertainment but also makes a real positive impact? What if, instead of feeling overwhelmed by negative news, we could replace that hopelessness with a sense of purpose and hope by sharing positive, accurate environmental news? That's the core idea behind EcoScroll — a platform designed to make scrolling not only enjoyable but also impactful.

What it does

EcoScroll is an interactive, social media-style scrolling platform that delivers a continuous feed of uplifting and informative environmental content. Its primary function is to engage users in a simple yet purposeful way: by scrolling. Instead of passively browsing through random content, users are presented with carefully curated posts about climate action, sustainability, green innovation, and eco-conscious living — all without the need to sign up or post anything themselves.

Each piece of content is auto-generated using AI that pulls from reputable ecological news sources. The system processes article URLs, generates concise summaries and headlines, and pairs them with relevant, high-quality images sourced via the Pexels API. This automated process ensures a steady flow of meaningful posts that resemble the format of mainstream social media feeds, making the experience familiar yet impactful.

As users scroll, their interactions are tracked to determine their engagement level. The platform rewards activity by offering a monthly prize to the top scroller — the user with the highest scroll count at the end of the month. This gamified element encourages consistent interaction while maintaining a focus on learning and awareness. Users can monitor their progress and compare it to others through a public leaderboard, creating a light competitive environment around a shared cause.

Ultimately, EcoScroll transforms the act of scrolling — often seen as idle or unproductive — into a tool for environmental education and positive reinforcement. It provides a space where digital behavior aligns with values of sustainability, offering users an easy, enjoyable, and motivating way to stay informed and inspired about the planet.

How we built it

I embarked on building EcoScroll by myself, dedicating around 2-3 hours per day for about a month. Using only free online resources, such as YouTube tutorials and open-source project code, I learned as I went. The idea began as a simple thought, and quickly developed into a concrete project after researching the various technologies and programming languages I’d need.

The first step was creating the interactive scrolling platform using HTML and a bit of JavaScript to bring the basic functionality to life. The real challenge came when I set up the Firebase database. After many trials and errors, I finally managed to get it to work after a week of intense experimentation. Next, I developed an algorithm to fetch environmental articles and generate summaries, along with images based on their headlines. These formed the foundation of the posts on the site. Finally, I added the leaderboard feature to foster friendly competition among users.

It is important to note that several AI tools were utilized in the development of this project, including ChatGPT and DeepSeek. These tools were exclusively employed to assist in problem-solving tasks and did not play a role in the decision-making process, ensuring that the project was entirely conceived and executed by humans.

📄 Sample Code from the HTML File

<h1>Sign Up</h1>
<form id="signupForm">
    <div class="form-group">
        <label for="signupUsername">Username</label>
        <input type="text" id="signupUsername" name="username" required>
    </div>
    <div class="form-group">
        <label for="signupPassword">Password</label>
        <input type="password" id="signupPassword" name="password" required>
    </div>
    <button type="submit" class="btn signup-btn">Sign Up</button>
    <button type="button" class="btn login-btn" id="goToLogin">Back to Login</button>
</form>
<div class="logo-container">
    <img src="assets/images/Ecoscroll_text_preserved.png" alt="Ecoscroll Logo" class="logo">
</div>

Challenges we ran into

The biggest challenge I faced was setting up the Firebase database. This database was intended to store all user-related information, including usernames, passwords, and scroll counts. I initially experimented with various models, but none seemed to work or they required knowledge I didn’t yet possess. There were moments of real frustration, but I kept pushing forward, testing new approaches and learning through trial and error. Eventually, after spending hours exploring the Firebase console and learning from my mistakes, I successfully configured the database and integrated it with the platform. The sense of accomplishment when everything finally worked was incredibly rewarding.

Accomplishments that we're proud of

I’m extremely proud of the fact that I was able to completely develop a fully functional platform on my own, particularly considering that I started with limited knowledge of some of the key technologies. The website features several functionalities, including the scroll count tracker and the leaderboard, both of which work seamlessly. It’s amazing to see how the project has come together, and I’m proud of the positive impact it has the potential to make.

What we learned

Before working on this project, my experience with JavaScript and HTML was minimal. I had built a few small projects, but nothing as complex as a fully functioning website. Throughout this process, I learned a great deal about using HTML elements and JavaScript functions, which has significantly improved my web development skills. Additionally, working with databases was a completely new challenge, and although it seemed daunting at first, I quickly realized that the more I worked with it, the easier it became. I now feel confident in incorporating databases into my future projects and am excited to continue expanding my knowledge in this area.

What's next for Eco Scroll

The next big step for EcoScroll is to make the platform publicly available for download. I plan to launch it on the App Store so people can use it in their daily lives, making a difference with each scroll. Additionally, I want to continue refining the user experience and add even more features to keep people engaged, such as push notifications for new content, social sharing, and more interactive elements. By making EcoScroll more accessible and easy to use, I hope to create a global community of environmentally conscious individuals who can stay informed, feel inspired, and help make a positive difference every day.

Share this project:

Updates

Submission history