MindfulFlow

MindfulFlow is a safeguarding mental well-being by transforming rigid study routines into burnout-preventative focus habits.

Comment

Inspiration: I am the kind of person who needs a timer to stay focused and motivated; it is the most effective way for me to get things done, especially when I have a long todo list. However, when I am locked into that high-focus state, I tend to ignore my physical health—forgetting to stretch, blink, or drink water. This toxic productivity leads straight to digital burnout.

I built MindfulFlow to solve this personal problem and align with UN Sustainable Development Goal 3 (Good Health and Well-being). It leverages the focus power of a timer but rewrites the rules to protect user health.

I chose to integrate a growing seed into the timer so users can visually experience their focus progress transforming into a thriving plant, replacing a plain countdown with a rewarding sense of achievement and success.

What it does:

MindfulFlow is a gamified, burnout-prevention study companion: -The Focus Loop: Tracks standard a 25minutes productivity blocks. -Gamified Tree Growing: A planted seed dynamically calculates elapsed time and visually grows into a full, swaying tree to reward your focus. -Forced Recovery API: The moment the timer hits zero, it locks into a mandatory 5minutes short break and fetches actionable health prompts (stretching, breathing, hydration checks) from a backend Flask REST API.

How we built it:

Using VS Code: version 1.123.0

Backend: Python and Flask manage the core app routing and serve the JSON-based wellness tip API.

Frontend: HTML5, CSS3, and Vanilla JavaScript handle the active timer countdown, smooth glassmorphism design, and dynamic tree-growth states.

Documentation: Instead of manually writing a README, we used the PresentMeApp GitHub ReadMe Agent to analyze our modular repository and generate our technical presentation instantly.

Challenges we ran into

The biggest challenge I faced was a path conflict where Windows OneDrive kept crashing our local Python virtual environment (venv) mid-build. To keep moving efficiently, we adapted quickly, deleted the corrupt folder, and installed Flask globally to bypass the sync lock entirely.

Accomplishments that we're proud of

I'm proud of building a fully functional, highly responsive web application with smooth custom state management. Successfully tying frontend UI transitions to backend data flows while keeping our code so clean that an AI could automatically document it was a massive win.

What we learned

Learned how to design intuitive, health-centric user experiences where productivity and wellness complement each other. We also mastered writing self-documenting, clean code that allows automated pipeline scanners to easily interpret codebase intent.

What's next for MindfulFlow

Next plan is to introduce a visual dashboard where users can save their "harvested" trees over time to see their wellness compound. Also want to integrate custom time-lapse visualizations so users can review their focus sessions alongside their well-being metrics, and allow users to add their preferred music; this can help relieve stress during their task.

Share this project:

Updates