Flow State

Enter flow state by turning productivity into a shared, rewarding experience

Comment

Inspiration

We wanted to create a web application that transcends basic to-do lists by leveraging proven behavioral psychology.
Our goal is to transform how users achieve tasks through accountability mechanisms and reward systems.

What It Does

  • Video chat feature with categorized study rooms:
    • Independent study
    • Group study
    • Subject-specific rooms
    • Similar-task rooms
  • Customizable to-do lists where each task earns point values upon completion
  • Points unlock character customization options:
    • Accessories
    • Outfits
    • Characters
    • Exclusive features
  • Community-based video study sessions using the Pomodoro Technique (timed work intervals with breaks)
  • Leaderboards for communities and colleges with special rewards (e.g., crowns for top performers)

Background & Research

Task-Based Rewards

Users create customizable to-do lists where each task earns points upon completion.

Psychological Mechanism:
This enforces operant conditioning, where the brain learns to associate task completion with rewards.
It creates a positive feedback loop that encourages users to keep working—similar to how achievement systems in video games influence continued engagement (the same mechanism that drives slot machine engagement).

Research:

  • Badges, leaderboards, and performance graphs positively affect competence need satisfaction and perceived task meaningfulness (ResearchGate).

Self-Determination Theory

  • Points provide competence satisfaction, a form of intrinsic motivation that comes from seeing tangible evidence of one’s abilities.
  • Character customization improves engagement by giving users control over their experience, promoting ownership and accomplishment (PubMed).

Pomodoro & Community Influence

  • When users work alongside peers in synchronized Pomodoro sessions, they benefit from social facilitation—the well-documented phenomenon where the presence of others enhances performance on routine tasks.
  • The combination of points and social accountability triggers dopamine release (the “feel-good” chemical) when earning rewards, creating positive associations with productivity.

How We Built It

We used Cursor to scaffold the initial structure of the web application and accelerate early development. From there, we focused heavily on refining the app’s aesthetic and user experience, designing visuals and UI elements using Canva and other online design resources.

The majority of development was completed in Visual Studio Code, where we implemented features, refined interactions, and integrated assets. We also leveraged AI-assisted tools such as Claude and Gemini as supplemental resources to help debug, generate ideas, and speed up specific implementation tasks throughout the build process.

Challenges We Ran Into

  • TypeScript Learning Curve:
    Choosing TypeScript posed a challenge since most of the team was more familiar with HTML and CSS. Adapting to a strongly typed environment required rethinking code structure but ultimately resulted in a more organized and maintainable codebase.

  • Video Chat Integration:
    Early video chat implementations were complex and resource-intensive, prompting a pivot to a simpler video conferencing API that balanced performance and functionality.

  • Real-Time Pomodoro Synchronization:
    Keeping Pomodoro timers synchronized across multiple users required careful state management to ensure consistency and reliability.

  • Performance & UI/UX Balance:
    Balancing live video conferencing, active timers, and a visually appealing interface required thoughtful optimization and design trade-offs.

Addressing these challenges shaped both our technical decisions and the overall user experience.

Accomplishments We’re Proud Of

We placed a strong emphasis on UI design and aesthetics, recognizing that productivity-focused applications must be visually engaging to attract and retain users. By incorporating gamification elements, we made productivity feel rewarding rather than monotonous. Combining aesthetic design with interactive features allowed us to transform studying and focus into an experience users enjoy returning to.

What We Learned

  • How to design consistent and cohesive UI across multiple pages
  • How to create categorized video chat rooms that support different study preferences:
    • Independent
    • Collaborative
    • Subject-specific
  • How to apply behavioral science by integrating three major psychological principles:
    • Operant conditioning
    • Social facilitation
    • Pomodoro Technique
  • How to design a gamification system that enhances motivation through rewards
  • How to unify multiple psychological principles into a single cohesive platform

What’s Next for Flow State

In the future, we plan to implement geolocation services so users can join local communities if they choose. This will allow users to form friendships and study together more consistently. We also aim to integrate a scalable database to support a large number of user profiles and foster a safe, productive community for everyone.

Sources

ResearchGate

  • Matthews, G. (2015). Goal Research Summary. Dominican University of California.
    • Widely cited study on accountability and goal completion
    • Shows a 76% success rate for written goals with accountability vs. 43% without

PubMed

  • LaBrie, J. W., et al. (2015). PNF 2.0? Initial evidence that gamification can increase the efficacy of brief, web-based personalized normative feedback alcohol interventions. Addictive Behaviors, 36(1–2), 1–8.
    • PMID: 27978426
    • Randomized study of 237 college students showing that point-based gamified interventions significantly reduced alcohol use compared to standard interventions
Share this project:

Updates