This is a submission for the Hacktoberfest Open-Source AI Challenge Week 1: Touch Grass
🌿 Touch Grass: Turning Screen Time into Green Time
What I Built
I built Touch Grass, a web-based digital detox project designed to encourage people to step away from their screens and reconnect with the real world.
We spend so much time scrolling through social media, watching videos, and switching between apps that we sometimes forget to enjoy the world outside our screens. I wanted to explore how a simple, accessible website could encourage people to take mindful breaks and discover activities beyond their devices.
Touch Grass is designed around a simple idea: instead of spending another few minutes scrolling, do something meaningful offline.
The project is built using HTML, CSS, and JavaScript, with a focus on creating an approachable and user-friendly web experience.
The goal is to make digital breaks feel enjoyable rather than restrictive. Activities such as walking, spending time in nature, reading, drawing, exercising, or connecting with friends can provide alternatives to endless scrolling.
Who is it for?
- Students who spend long hours studying or using digital devices.
- People who want to reduce unnecessary screen time.
- Developers and technology enthusiasts interested in digital well-being.
- Anyone looking for simple ways to balance their online and offline lives.
My long-term vision is to extend Touch Grass with open-source AI that can suggest offline activities based on a person's available time, interests, and preferences.
Demo
🌐 Live Website: Touch Grass — Try It Here
Explore the live project and experience the website.
💻 GitHub Repository: Vanshika3123/Touch-Grass
The source code is available on GitHub, making it easier for other developers to explore the implementation, learn from it, and contribute improvements.
Code
The project is available as an open repository on GitHub:
🔗 View the Touch Grass source code
The project uses standard web technologies:
- HTML5: Structures the webpage and its content.
- CSS3: Defines the visual design, layout, and responsive styling.
- JavaScript: Powers client-side interactions and functionality.
I chose these technologies because they are accessible to beginners, easy to experiment with, and do not require an expensive development setup.
You can explore the repository, clone it locally, experiment with the interface, and build additional features.
To get started:
git clone https://github.com/Vanshika3123/Touch-Grass.git
cd Touch-Grass
Open the project in your preferred code editor and run index.html in a browser, or use a local development server if needed.
How I Built It
I built Touch Grass using HTML, CSS, and JavaScript, focusing on a lightweight web experience that can be hosted as a static website.
1. Frontend development
I used HTML to organize the page, CSS to create the visual experience, and JavaScript for interactive behavior.
Keeping the project lightweight makes it easier to understand, modify, and extend without requiring a complex framework.
2. Designing for digital well-being
The central design principle is to encourage users to take positive action outside their devices.
Instead of treating technology as the enemy, Touch Grass explores how technology itself can remind us to step away from it.
3. Exploring open-source AI
An important direction for this project is integrating an open-weight AI model to generate personalized offline activity suggestions.
For example, an AI-powered version could let a user specify that they have 15 minutes available and prefer outdoor activities. The model could then suggest a short walk, a nature observation challenge, or another activity suited to those preferences.
Tools such as Ollama could support local inference with compatible open-weight models. A small backend could connect the website to a locally running model without exposing private credentials in browser code.
Transparency note: The current implementation should be evaluated based on the features and AI integrations actually present in the linked repository. Any AI integration described above is a proposed extension unless it is already implemented and tested.
Why Does Open Innovation Matter?
Open innovation matters because building useful technology should not be limited to developers with access to expensive tools or proprietary services.
For Touch Grass, open-source technologies provide an opportunity to learn, experiment, collaborate, and gradually build more personalized experiences.
Here are three reasons I value open innovation:
1. Accessibility for learners
HTML, CSS, JavaScript, and openly available AI tools give students and independent developers a practical way to build projects and learn by experimenting.
2. Flexibility and transparency
Open-weight models can offer more control over model selection, deployment, and experimentation, subject to their individual licenses. Developers can compare different approaches instead of depending entirely on one closed AI provider.
3. Privacy-conscious possibilities
With a suitable model and local setup, some AI inference can happen on a user's own computer. This creates opportunities to design experiences that minimize the amount of personal information sent to external services.
A closed API may make certain integrations convenient, but open technologies can provide additional flexibility for learning, customization, and community collaboration.
Ultimately, I want Touch Grass to demonstrate that technology can do more than keep us online. It can also encourage us to disconnect, explore, and experience life beyond the screen.
My Agent Session
This section is optional.
If I use DevRelay or another supported agent workflow during development, I can add a link to the saved session here so readers can see how the project was built, including the development process, prompts, and decisions.
For now, I have not included an agent-session link.
Prize Categories
I am submitting Touch Grass for the Hacktoberfest Open-Source AI Challenge Week 1: Touch Grass.
Any additional partner prize categories should be listed only if the project meets their specific eligibility requirements. If the challenge requires a working open-source AI integration, I will ensure the implementation and supporting evidence are available before claiming that category.
Final Thoughts 🌱
Touch Grass started with a simple question:
What if technology helped us spend less time looking at screens and more time experiencing the world?
Through this project, I want to explore how a lightweight website—and potentially open-source AI—can encourage healthier digital habits.
I hope this project inspires other developers to experiment with open technologies and build tools that make a positive difference in everyday life.
Thanks for checking out my project!
🌐 Live Demo: https://vanshika3123.github.io/Touch-Grass/
💻 GitHub: https://github.com/Vanshika3123/Touch-Grass
Top comments (0)