Focusly

Focusly is your AI-powered Productivity Suite blending focus, wellness, and music. Custom Pomodoro, dual-mode chatbot, mood-based playlists & smart snacks. One tool. Total flow. No app switching.

Comment

Inspiration

As students ourselves, we often found our productivity fragmented by the need to juggle multiple tools- timers, chatbots, music apps, wellness resources, and food suggestions. This disjointed workflow made it harder to stay in the zone. We wanted to create a single, integrated platform that not only helps students focus better but also supports their mental well-being and energy throughout the day.

What it does

Focusly is an AI-powered Productivity Suite that combines:

  • A customizable Pomodoro timer with user-defined session and break durations.
  • A dual-mode AI chatbot using Google Gemini API:
    • Study Mode for academic help and subject-specific support.
    • Wellness Mode for emotional support and mental health conversations.
  • An AI-powered mood-based music playlist generator via the Spotify Web API.
  • A smart to-do list with task tracking.
  • Food and productivity recommendations based on user mood, activity, and dietary preferences.
  • A single, responsive dashboard UI that combines everything—no context switching, just flow.

How we built it

  • Frontend: Built using React.js and CSS Modules for scoped, maintainable styling. The app is a responsive single-page application using component-based architecture and React Router for navigation.
  • Backend & AI Integration: AI chatbot functionality is powered by the Google Gemini API, with prompt engineering and contextual memory features.
  • Music Integration: Used Spotify Web API with OAuth2 authorization to fetch user preferences and generate mood-based playlists.
  • Persistence: Data such as user preferences, tasks, and chat history is stored using localStorage for this hackathon version.

Challenges we ran into

  • Integrating and managing OAuth2 flow with Spotify and handling token refresh securely.
  • Structuring prompt engineering with Google Gemini to make both Study and Wellness chatbot modes contextually aware and emotionally intelligent.
  • Managing component-level state in sync with global preferences, especially while switching chatbot modes or user focus states.
  • Achieving a consistent and responsive UI/UX across all modules in a time-constrained hackathon setting.

Accomplishments that we're proud of

  • Creating a truly all-in-one platform that blends productivity, wellness, and personalization.
  • Seamless integration of Gemini AI for both technical and emotional queries.
  • Dynamic playlist generation that actually fits the user’s mood and improves the ambiance while studying.
  • Building an intuitive and clean React UI in a modular, reusable way.
  • Making productivity feel less like a grind and more like a personalized flow.

What we learned

  • How to work with the Gemini API for advanced conversational AI.
  • Deepened our knowledge of OAuth2 workflows and Spotify’s developer ecosystem.
  • Improved our skills in modular React development, managing global state, and scoped styling with CSS Modules.
  • Understood the importance of combining technical productivity with emotional well-being in product design.

What's next for Focusly

  • Implement AI-generated daily focus plans based on subject, mood, and deadlines.
  • Expand recommendation system to include YouTube videos, articles, and wellness activities.
  • Build webcam-based mood detection (with user consent) to auto-suggest breaks or music.

Built With

Share this project:

Updates