DEV Community

Nacho
Nacho

Posted on • Edited on

Levanta.me: My Personal Productivity Guardian

Hey dev.to community! πŸ‘‹ I'm wanted to share a project I've been working on called Levanta.me. It's a React-based application that uses face detection to help me manage my work and rest times. Let's dive in!

What is Levanta.me?

Levanta.me is a productivity tool that uses my webcam to detect my presence and track my work and rest times. It's designed to help me maintain a healthy work-rest balance and avoid those long, unintended coding marathons we've all found ourselves in at some point.

Key Features

  • Face Detection: Uses @vladmandic/face-api to detect your presence in real-time.
  • Smart Time Tracking: Automatically tracks your work, rest, and idle times based on face detection.
  • Telegram Notifications: Sends notifications to Telegram Bot chat when I've been working, resting, or idle for too long.

Tech Stack

  • React
  • Chakra UI
  • Zustand
  • face-api.js
  • Navigator MediaDevices API

How It Works

  1. Face Detection: The app uses my webcam and face-api.js to detect if I'm in front of my computer.
  2. Time Tracking:
    • When my face is detected, it assumes I'm working.
    • When my face isn't detected, it assumes I'm resting.
    • If I am working and suddenly I go to make a cup of tea, or whatever, another timer starts running, where after a certain time it restarts my β€œwork timer” for having been too distracted, and vice versa, if I am resting and suddenly I get a message from work or whatever, and I sit down again for a long period of time, it resets my β€œrest timer”.
  3. Notifications: The app notifies me via Telegram when I exceed my set work, rest, or idle time limits.

Challenges and Learnings

Building Levanta.me was an exciting journey. Here are some challenges I faced and what I learned:

  1. Working with face-api.js: Integrating face detection was tricky at first, but it opened up a whole new world of possibilities for me in terms of computer vision in web apps.

  2. State Management: Keeping track of different timers and states was a bit complex, and I still have a lot of work to do to improve it.

  3. Notifications: Implementing both browser and Telegram notifications taught me about different ways to keep me informed and engaged.

What's Next for Levanta.me?

I'm always looking to improve Levanta.me. Some ideas for future updates include:

  • Adding more detailed analytics about work patterns
  • Create accounts to store settings and other data per user (now only uses Local Storage)

Try It Out!

If you're interested in giving Levanta.me a spin, check out the GitHub repository. I'd love to hear your thoughts and feedback!

Remember, taking regular breaks is crucial for maintaining productivity and avoiding burnout. Levanta.me it's being my friendly reminder to stand up, stretch, and give my eyes a rest from time to time.

Finally, here is the deploy: https://levanta-me.vercel.app/

Happy coding, everyone! πŸ’»βœ¨

Top comments (0)