FocusTab Chrome Eklentisi

FocusTab – Chrome Başlangıç Eklentisi

Google Web Store Linki: https://go.emrecb.com/focustab-baslangic-sayfasi-web-store

Github Kaynak Kodu: https://go.emrecb.com/focustab-start-page-github

📌 Proje Özeti

FocusTab, tarayıcınızın varsayılan “Yeni Sekme” sayfasını, üretkenliği artıran ve zihinsel dinginlik sağlayan güçlü bir kişisel panele dönüştüren kapsamlı bir Google Chrome eklentisidir. Kullanıcıların günlük hedeflerine odaklanmasını sağlarken, özelleştirilebilir ortam sesleri ve görsel estetik ile benzersiz bir çalışma atmosferi sunar.

🚀 Temel Özellikler

1. Üretkenlik ve Odak Yönetimi

  • Pomodoro Zamanlayıcı: Entegre sayaç ile 25 dakikalık odaklanma periyotları (sesli ve görsel bildirimli).
  • Günlük Odak (Daily Focus): Günün en önemli görevini belirleme, tamamlama ve işaretleme özelliği.
  • Yapılacaklar Listesi (Todo List): Yan panelde açılan, görev ekleyip silinebilen pratik liste yönetimi.
  • Hızlı Kısayollar: Sık kullanılan web siteleri için özelleştirilebilir, ikonları otomatik çekilen hızlı erişim bağlantıları.
FocusTab Chrome Eklentisi

2. Atmosfer ve Ses Mikseri (Soundscape)

  • Gelişmiş Ses Mikseri: Yağmur, Kamp Ateşi, Kafe, Orman, Dalgalar, Klavye sesi ve Beyaz Gürültü gibi 18 farklı ortam sesini aynı anda çalabilme.
  • Ses Kontrolü: Her ses için ayrı ses seviyesi ayarı ve tek tuşla “Tümünü Durdur” özelliği.

3. Zen Modu (Derin Odaklanma)

  • Tek tuşla arayüzdeki dikkat dağıtıcı tüm öğeleri (saat, hava durumu, kısayollar vb.) gizleyerek sadece seçilen öğelere veya arka plana odaklanma imkanı.
  • Kullanıcı fareyi hareket ettirdiğinde beliren akıllı çıkış butonu.

4. Görsel ve Teknik Özelleştirme

  • Dinamik Arka Planlar: Unsplash API entegrasyonu ile yüksek kaliteli rastgele manzaralar veya kullanıcının belirlediği özel resim URL’si (Custom URL).
  • Hava Durumu Entegrasyonu: Open-Meteo API kullanılarak kullanıcının bulunduğu şehre göre anlık sıcaklık ve durum bilgisi.
  • Kişiselleştirme: İsimle selamlama (Günaydın/İyi Akşamlar), arka plan bulanıklığı (blur) ve karartma (overlay) ayarları.
  • Çoklu Dil Desteği (i18n): Türkçe, İngilizce, Almanca ve İspanyolca dillerine tam uyumlu arayüz.

🛠 Kullanılan Teknolojiler

  • Core: HTML5, CSS3, Vanilla JavaScript (ES6+)
  • Platform: Chrome Extension API (Manifest V3, Storage, Notifications, Search)
  • API Entegrasyonları: Open-Meteo (Hava Durumu), Unsplash (Görsel)
  • Veri Yönetimi: chrome.storage.local ile ayarların ve görevlerin kalıcı olarak saklanması.

FocusTab – Personalized Focus & Zen Dashboard

Google Web Store Link: https://go.emrecb.com/focustab-start-page-web-store

Github Source Code: https://go.emrecb.com/focustab-start-page-github

📌 Project Overview

FocusTab is a robust Google Chrome extension designed to transform the default “New Tab” page into a productivity hub and a sanctuary for mental clarity. It bridges the gap between task management and relaxation, allowing users to stay focused on their daily goals while immersing themselves in a customizable audio-visual environment.

🚀 Key Features

1. Productivity & Task Management

  • Pomodoro Timer: Built-in focus timer (standard 25-min intervals) with visual and audio notifications upon completion.
  • Daily Focus: A dedicated input area to define, track, and check off the single most important task of the day.
  • Todo List Sidebar: A slide-out panel to manage tasks seamlessly without cluttering the main view.
  • Smart Shortcuts: Add and manage quick links to favorite websites with automatic favicon fetching.

2. Ambient Sound Mixer

  • Multi-Track Soundscapes: Mix and match up to 18 different high-quality ambient sounds, including Rain, Fireplace, Cafe, Forest, Waves, Keyboard typing, and White Noise.
  • Volume Control: Independent volume sliders for each sound channel to create the perfect background atmosphere.

3. Zen Mode (Deep Work)

  • A dedicated mode that declutters the interface by hiding distractions (clock, weather, widgets) based on user preference.
  • Features a “mouse-over” reveal mechanism to exit the mode without breaking visual minimalism.

4. Customization & Utilities

  • Dynamic Backgrounds: Fetches high-quality wallpapers via Unsplash or allows users to set a Custom Image URL.
  • Live Weather: Integrated Open-Meteo API to display real-time temperature and weather conditions for the user’s city.
  • Personalization: Features time-based greetings (e.g., “Good Morning, [Name]”), adjustable background blur, and overlay opacity settings.
  • Localization (i18n): Full UI support for English, Turkish, German, and Spanish.

🛠 Tech Stack

  • Core: HTML5, CSS3, Vanilla JavaScript (ES6+)
  • Platform: Chrome Extension API (Manifest V3, Storage, Notifications, Search)
  • APIs Used: Open-Meteo (Weather Data), Unsplash (Images)
  • Data Persistence: Utilizes chrome.storage.local to save user preferences, todos, and active sound states.

Yorumlar

Bir yanıt yazın

E-posta adresiniz yayınlanmayacak. Gerekli alanlar * ile işaretlenmişlerdir