Focus

Focus helps users maintain focus and boost productivity by blocking completely distracting websites and modifying partially distracting ones.

Comment

💡Inspiration

The inspiration for "Focus" started from the alarming increase in global screen time, primarily driven by addictive social media platforms. Recognizing the bad effects on productivity and well-being, the idea was to create a solution that addresses the root cause while preserving the educational benefits of platforms like YouTube.

💬What it does

"Focus" is a free and open-source Chrome extension designed to enhance productivity by curbing social media distractions. It achieves this by removing YouTube's recommended page and replacing it with a simple search bar, emphasizing the user's original intent when visiting the site. The extension also includes default blocking for non-educational social media platforms like TikTok and Instagram, with customizable options through an intuitive dashboard. Additionally, it features an integrated ad-blocker to eliminate distracting ads, trackers, and miners during browsing.

🛠️ How I built it

The project was crafted using a combination of JavaScript, HTML, and CSS. The development process involved a deep dive into creating a Chrome extension, requiring the implementation of key components such as manifest.json and navigating Chrome storage. Over the course of seven days and 32 hours, I encountered various challenges and leveraged resources like Stack Overflow, articles, and YouTube tutorials to overcome them.

🤔Challenges I ran into

Creating a browser extension posed unique challenges, especially since I've never made one before. Issues ranged from understanding manifest.json, to efficiently accessing and manipulating hard-to-find elements on web pages. The development process involved troubleshooting errors, requiring a comprehensive approach to problem-solving.

🎉Accomplishments that I'm proud of

Despite the challenges, I successfully created a functional and user-friendly Chrome extension. Key accomplishments include the removal of YouTube recommendations, the implementation of default blocking for distracting platforms, and the integration of an ad-blocker for a streamlined browsing experience. I'm proud of the project's potential to positively impact users' lives by creating focused and distraction-free online sessions.

📚What I learned

The project provided valuable learning experiences, particularly in the subject of creating browser extensions. I enhanced my proficiency in JavaScript, HTML, and CSS.

🌟What's next for Focus

Release onto Chrome Webstore Develop versions for non-chromium browsers

Built With

Share this project:

Updates