खोजें
blogia

Babel Fish AI का लॉन्च: Chrome एक्सटेंशन — वॉइस ट्रांसक्रिप्शन और अनुवाद

jls /
Transcription Traduction IA Extension Chrome Innovation Multilangue
Babel Fish AI का लॉन्च: Chrome एक्सटेंशन — वॉइस ट्रांसक्रिप्शन और अनुवाद

Babel Fish AI, एक व्यक्तिगत प्रोजेक्ट, एक नवाचारी Chrome एक्सटेंशन है जो आवाज़ को असाधारण सटीकता के साथ टेक्स्ट में बदलता है, और साथ ही स्वचालित अनुवाद का विकल्प भी देता है। यह विज्ञापन-मुक्त और भरोसेमंद होने के लिए डिज़ाइन किया गया है और OpenAI के Whisper API के माध्यम से उच्च-गुणवत्ता वाली वॉइस ट्रांसक्रिप्शन प्रदान करता है। मैंने यह एक्सटेंशन आंशिक रूप से अपनी व्यक्तिगत ज़रूरत के लिए बनाया: IA के साथ संचार को सरल बनाना, अपने अनुरोधों को बोलकर देने के लिए। आप इसे केवल ट्रांसक्रिप्शन के लिए उपयोग कर सकते हैं या बहु-भाषी संचार को आसान बनाने के लिए अनुवाद सक्षम कर सकते हैं। यह Roo Code के परीक्षण का भी एक उत्तम अवसर था: Roo Code, एक AI-सहायता प्राप्त विकास टूल।

1. परिचय

Babel Fish AI एक व्यक्तिगत प्रोजेक्ट है, जिसे Claude, Gemini और OpenAI जैसी IA के सहयोग से Roo Code की मदद से विकसित किया गया है। अपने सहज इंटरफ़ेस और अनुकूलन योग्य कॉन्फ़िगरेशन के साथ, Babel Fish AI तेज़ और सटीक ट्रांसक्रिप्शन प्रदान करता है, और भाषा बाधाओं को पार करने के लिए तुरंत अनुवाद का विकल्प देता है।

2. विशेषताएँ और विकल्प

  • उन्नत वॉइस ट्रांसक्रिप्शन :

    • माइक्रोफ़ोन के माध्यम से उच्च-गुणवत्ता ऑडियो कैप्चर।
    • ट्रांसक्रिप्शन OpenAI के Whisper API द्वारा किया जाता है, जो सक्रिय इनपुट फ़ील्ड में स्वतः डालता है या संवाद बॉक्स में प्रदर्शित करता है।

  • वैकल्पिक स्वचालित अनुवाद :

    • ट्रांसक्राइब किए गए टेक्स्ट का तेज़ और सटीक अनुवाद, आवश्यकता अनुसार सक्रिय किया जा सकता है।
    • एक्सटेंशन को केवल ट्रांसक्रिप्शन के लिए भी उपयोग करने का विकल्प।

  • पूर्ण बहुभाषी समर्थन : Babel Fish AI वॉइस इनपुट को संसाधित करता है और विभिन्न भाषाओं में टेक्स्ट दिखाता है, जिससे इसका अंतरराष्ट्रीय उपयोग बढ़ जाता है।
    समर्थित भाषाएँ : 🇸🇦 अरबी, 🇩🇪 जर्मन, 🇺🇸 अंग्रेज़ी, 🇪🇸 स्पेनिश, 🇫🇷 फ़्रेंच, 🇮🇳 हिंदी, 🇮🇹 इतालवी, 🇯🇵 जापानी, 🇰🇷 कोरियाई, 🇳🇱 नीदरलैंड्स, 🇵🇱 पोलिश, 🇵🇹 पुर्तगाली, 🇷🇴 रोमानियन, 🇸🇪 स्वीडिश, 🇨🇳 चीनी।

  • सहज और अनुकूलन योग्य इंटरफ़ेस :

    • सक्रिय इनपुट क्षेत्र में दिखाने या संवाद बॉक्स में दिखाने के बीच चयन।
    • त्वरित दृश्य संकेत के लिए अनुकूलन योग्य स्टेटस बैनर (रंग, अस्पष्टता, अवधि)।

  • उन्नत विकल्प :

    • विशेषज्ञ मोड जो विस्तृत कॉन्फ़िगरेशन देता है (API URLs, डोमेन-विशिष्ट पैरामीटर, आदि)।
    • एक्सटेंशन के विकल्प एक उपयोगकर्ता-मित्र पृष्ठ के माध्यम से सुलभ हैं।

3. विकास के पर्दे के पीछे : मेरा IA और Roo Code के साथ अनुभव

Babel Fish AI सिर्फ एक Chrome एक्सटेंशन नहीं है; यह आर्टिफिशियल इंटेलिजेंस के साथ एक रोमांचक प्रयोग और एक नवाचारी टूल, Roo Code, का परिणाम भी है।

आइए मैं बताता हूँ कि मैंने कैसे एक विचार को वास्तविकता में बदला, कई IA की शक्ति और एक अनूठे विकास वातावरण का उपयोग करते हुए।

3.1. Roo Code : मेरा IA कोडिंग साथी

Roo Code केवल एक साधारण VS Code एक्सटेंशन नहीं है। यह एक वास्तविक स्वायत्त कोडिंग एजेंट है जो आपके काम में मदद करता है। कल्पना कीजिए एक IA को-पायलट की जो सक्षम है:

  • स्वाभाविक भाषा में संवाद करने के लिए।
  • सीधे आपके कार्यक्षेत्र में फ़ाइलें पढ़ने और लिखने के लिए।
  • टर्मिनल कमांड चलाने के लिए।
  • विभिन्न API (OpenAI, Google Gemini, आदि) के साथ एकीकृत होने के लिए।
  • “कस्टम मोड” के माध्यम से अपनी “व्यक्तित्व” को अनुकूलित करने के लिए।

Babel Fish AI को विकसित करने के लिए मैंने Roo Code को एक कंडक्टर की तरह इस्तेमाल किया, जिसने विभिन्न IA को निर्देशित करके एक्सटेंशन बनाने में मदद की।

3.2. एक अनूठे प्रोजेक्ट के लिए IA की एक कास्ट

मैंने कई IA का उपयोग किया, जिनमें से हर एक की अपनी ताकत और कमजोरियाँ थीं :

  • o3-mini, Claude 3.5 Sonnet, Gemini (exp 1206, 1.5 pro exp 0827, Flash Think), GPT-4o : ये मॉडल मेरे मुख्य सहकर्मी रहे, हर एक ने परियोजना में अपना योगदान दिया।
  • Gemini (मुफ्त मॉडल) : इनकी मुफ्त उपलब्धता एक बड़ा फायदा थी, हालांकि मुझे कोटा के साथ संतुलन करना पड़ा (सौभाग्य से Roo Code असफलताओं के मामले में दोबारा प्रयासों को संभालता है !)।

3.3. बाधाओं को पार करना : चुनौतियाँ (और समाधान !)

डेवलपमेंट हमेशा सहज नहीं रहा। मुझे कई चुनौतियों का सामना करना पड़ा, जिनमें खासकर ये शामिल हैं :

  • माइक्रोफ़ोन एक्सेस और परमिशन्स : शुरुआत में, माइक्रोफ़ोन एक्सेस की अनुमति प्राप्त करना असम्भव लगा! IA लगातार मैनिफेस्ट V3 में मौजूद नहीं होने वाली “microphone” परमिशन जोड़ने पर ज़ोर दे रहे थे। मैंने आधिकारिक डॉक्यूमेंटेशन में गहरा डुबकी लगानी पड़ी और Claude 3.5 Sonnet को वह जानकारी देनी पड़ी ताकि वह समाधान ढूँढ सके।

  • API कीज़ का सुरक्षित भंडारण : एक और सिरदर्द ये था कि OpenAI API की को Chrome में सुरक्षित रूप से कैसे स्टोर और पुनर्प्राप्त करें? मैंने आधिकारिक डॉक्युमेंटेशन Gemini को दिया, जिसने Chrome स्टोरेज के साथ इंटरेक्ट करने के लिए उपयुक्त कोड सुझाया।

3.4. सहयोग और प्रयोग : सफलता की कुंजी

मैंने विकल्पों और लोकलाइज़ेशन के लिए कई IA का उपयोग किया, और Roo Code का परीक्षण भी करना चाहा।

इन विशिष्ट चुनौतियों के अलावा, मैंने सक्षम किया :

  • Roo Code का वास्तविक परिस्थितियों में परीक्षण : Babel Fish AI का विकास इस आशाजनक टूल को परखने का भी अवसर था।
  • आइकन और बैकग्राउंड इमेज जनरेट करना : DALL·E 3 (OpenAI में इंटीग्रेटेड) की मदद से, मैंने एक्सटेंशन के लिए एक यूनिक विज़ुअल आइडेंटिटी बनाई।
  • डिस्प्ले बैनर को कस्टमाइज़ करना : मैंने GIMP का उपयोग करके इमेज से रंग निकाले, फिर IA से उन रंगों को कॉन्फ़िगर करने वाले विकल्प भाग का कोड बनाने के लिए कहा।
  • इंटरफ़ेस का कई भाषाओं में अनुवाद : Roo Code के जरिए IA की शक्ति का उपयोग करके मैंने लोकलाइज़ेशन फ़ाइलें (_locales) जनरेट कीं और कई भाषाओं में विकल्पों का अनुवाद किया, जिससे काफी समय बचा!
  • ड्रॉपडाउन मेनू बनाना: IA ने सब कुछ जेनरेट किया, एक बड़ा समय-बचत।
  • ऑप्शंस के HTML रेंडरिंग को मैनेज करना: IA के साथ समन्वय में।

3.5 आईए द्वारा पाई गई कठिनाइयाँ

  • Google Chat के लिए टेक्स्ट को iframe में इंजेक्ट करने में समस्या: एक अपवाद जोड़ा गया, और मैंने डिफॉल्ट पॉप-अप छोड़ा।
  • विशेषज्ञ मोड और परमिशन: API URLs को बदलने की अनुमति देने के लिए मैंने मैनिफेस्ट में सभी होस्ट्स को सक्षम करना पड़ा। यह Chrome की रिफोर्स्ड ब्राउज़िंग के साथ समस्या पैदा करता दिख रहा है, और फिलहाल मेरे पास कोई समाधान नहीं है (यदि किसी के पास आइडिया हो, तो बताइए!)।

4. क्यों Babel Fish AI ? एक आवश्यकता से जन्मी एक्सटेंशन

तकनीकी विवरणों में जाने से पहले, यह समझना महत्वपूर्ण है कि मैंने Babel Fish AI क्यों बनाया। यह सब एक व्यक्तिगत ज़रूरत से शुरू हुआ :

  • लंबे प्रॉम्प्ट टाइप करने से तंग आना : मैं IA से अधिक प्राकृतिक तरीके से संवाद करना चाहता था, सीधे बोलकर।
  • खराब ट्रांसक्रिप्शन : जो ट्रांसक्रिप्शन एक्सटेंशन मैंने आज़माए थे वे निराशाजनक थे।
  • पारदर्शिता की इच्छा : मैं एक ओपन सोर्स, विज्ञापन-मुक्त एक्सटेंशन चाहता था जिसका कोड मेरे नियंत्रण में हो।

इसलिए Babel Fish AI उस इच्छा से जन्मा कि एक ऐसा टूल बनाया जाए जो मेरी आवश्यकताओं को पूरा करे और समुदाय के लिए भी उपयोगी हो।

5. कोड और तकनीकी विवरणों पर नज़र

Babel Fish AI एक सामान्य Chrome एक्सटेंशन आर्किटेक्चर पर बना है, जिसमें कुछ विशिष्टताएँ हैं जो OpenAI API के उपयोग से जुड़ी हैं।

यहाँ मुख्य घटकों का एक अवलोकन है :

5.1. सामान्य आर्किटेक्चर

एक्सटेंशन कई जावास्क्रिप्ट फाइलों से मिलकर बनता है जो आपस में इंटरैक्ट करती हैं :

  • manifest.json: एक्सटेंशन की मुख्य कॉन्फ़िगरेशन फ़ाइल। यह परमिशन्स, स्क्रिप्ट्स, एक्सेसिबल रिसोर्सेज आदि को परिभाषित करती है।
  • background.js: बैकग्राउंड में चलने वाला सर्विस वर्कर। यह इवेंट्स (आइकन क्लिक, कीबोर्ड शॉर्टकट) को हैंडल करता है, यदि आवश्यक हो तो content script को इंजेक्ट करता है, और content script के साथ संचार करता है।
  • content.js: वह स्क्रिप्ट जो वेब पेज में इंजेक्ट होती है। यह सीधे DOM के साथ इंटरैक्ट करती है, माइक्रोफ़ोन से ऑडियो कैप्चर करती है, ट्रांसक्रिप्शन और अनुवाद API को कॉल करती है, और परिणाम दिखाती है।
  • src/utils/api.js: OpenAI के Whisper API (ट्रांसक्रिप्शन) को कॉल करने वाले फ़ंक्शन्स हैं।
  • src/utils/translation.js: OpenAI के GPT API (अनुवाद) को कॉल करने वाले फ़ंक्शन्स हैं।
  • src/utils/ui.js: UI मैनेजमेंट (बैनर, डायलॉग, कॉपी बटन) के उपयोगी फ़ंक्शन्स।
  • src/constants.js: कॉन्फ़िगरेशन, स्टेट्स, एक्शन्स आदि के लिए कॉन्स्टेंट्स।
  • src/pages/options/: एक्सटेंशन की ऑप्शंस पेज फाइलें (HTML, CSS, JavaScript)।

5.2. manifest.json

फाइल manifest.json मैनिफेस्ट वर्शन 3 का उपयोग करती है। इसमें निम्नलिखित परमिशन्स घोषित हैं :

  • activeTab : सक्रिय टैब तक पहुंच के लिए।
  • storage: API कीज़ और एक्सटेंशन विकल्पों को स्टोर करने के लिए।
  • commands: कीबोर्ड शॉर्टकट सेट करने के लिए।
  • scripting: content script को इंजेक्ट करने के लिए।
  • host_permissions: https://api.openai.com/* API कॉल के लिए, और https://*/* जो विशेषज्ञ मोड में आवश्यक है ताकि उपयोगकर्ता कस्टम API URLs निर्दिष्ट कर सके।

content_scripts को सभी URLs (<all_urls>) में इंजेक्ट किया जाता है और दस्तावेज़ के लोड होने के अंत में चलते हैं ("run_at": "document_end"). background script को मॉड्यूल प्रकार के सर्विस वर्कर के रूप में घोषित किया गया है ("type": "module").

5.3. background.js

background script के कई रोल हैं :

  • content script का इंजेक्शन : यदि content script पहले से इंजेक्ट नहीं है, तो background.js इसे इंटरैक्शन (आइकन क्लिक या शॉर्टकट) पर इंजेक्ट करता है।
  • इवेंट्स का प्रबंधन : यह chrome.runtime.onMessage (संदेशों से content script), chrome.action.onClicked (आइकन पर क्लिक) और chrome.commands.onCommand (कीबोर्ड शॉर्टकट) इवेंट्स को सुनता है।
  • content script के साथ संचार : यह रिकॉर्डिंग शुरू/रोकने के लिए content script को संदेश भेजता है ({ action: ACTIONS.TOGGLE })।
  • आइकन अपडेट : यह रिकॉर्डिंग की स्थिति (चल रही, रुकी, त्रुटि) दिखाने के लिए एक्सटेंशन आइकन के बैज को अपडेट करता है।

5.4. content.js

content script एक्सटेंशन का मूल भाग है। यह निम्नलिखित कार्य करता है :

  • इनिशियलाइज़ेशन : यह Chrome स्टोरेज से API की और बैनर रंग विकल्पों को इनिशियलाइज़ करता है।
  • ऑडियो कैप्चर : यह माइक्रोफोन तक पहुँचने और ऑडियो रिकॉर्ड करने के लिए navigator.mediaDevices.getUserMedia API का उपयोग करता है।
  • ट्रांसक्रिप्शन : यह ऑडियो को OpenAI के Whisper API को भेजने और ट्रांसक्रिप्शन प्राप्त करने के लिए transcribeAudio (src/utils/api.js) फ़ंक्शन का उपयोग करता है।
  • अनुवाद (वैकल्पिक) : यदि अनुवाद विकल्प सक्रिय है, तो यह ट्रांसक्राइब किए गए टेक्स्ट को OpenAI के GPT API को भेजने और अनुवाद प्राप्त करने के लिए translateText (src/utils/translation.js) फ़ंक्शन का उपयोग करता है।
  • डिस्प्ले : यह ट्रांसक्रिप्शन (और अनुवाद, यदि लागू हो) को या तो पेज के सक्रिय एलिमेंट में (यदि वह टेक्स्ट फ़ील्ड या एडिटेबल एलिमेंट है) डालता है, या एक डायलॉग बॉक्स में दिखाता है।
  • बैनर मैनेजमेंट : यह रिकॉर्डिंग की स्थिति या त्रुटि संदेश दिखाने के लिए पेज के ऊपर एक स्टेटस बैनर दिखाता है।
  • background script के साथ संचार : यह रिकॉर्डिंग के शुरुआत, अंत या त्रुटि को सूचित करने के लिए background script को संदेश भेजता है।
  • ऑप्शन्स बदलाव सुनना: यह एक्सटेंशन ऑप्शन्स में बदलाव सुनता है और डिस्प्ले को अपडेट करता है।

5.5. संचार

background script और content script के बीच संचार Chrome के मैसेजिंग API (chrome.runtime.sendMessage और chrome.runtime.onMessage) के माध्यम से होता है।

5.6. API

एक्सटेंशन दो OpenAI API का उपयोग करती है :

  • Whisper : वॉइस ट्रांसक्रिप्शन के लिए। डिफ़ॉल्ट URL है https://api.openai.com/v1/audio/transcriptions, और उपयोग किया जाने वाला मॉडल है whisper-1।
  • GPT : अनुवाद के लिए (वैकल्पिक)। डिफ़ॉल्ट URL है https://api.openai.com/v1/chat/completions, और उपयोग किया जाने वाला मॉडल है gpt-4o-mini।

API URLs को एक्सटेंशन के विकल्पों में (विशेषज्ञ मोड) बदला जा सकता है।

5.7. स्टोरेज

एक्सटेंशन chrome.storage.sync का उपयोग करके स्टोर करती है :

  • OpenAI API कीज़ (apiKey)।
  • एक्सटेंशन विकल्प (डिस्प्ले, अनुवाद, बैनर रंग, आदि)।

5.8. उपयोगकर्ता इंटरफ़ेस

एक्सटेंशन का UI कई फ़ंक्शन्स में मैनेज किया जाता है src/utils/ui.js और content.js :

  • बैनर : पेज के ऊपर एक स्टेटस बैनर रिकॉर्डिंग की स्थिति या त्रुटि संदेश दिखाने के लिए प्रदर्शित होता है। बैनर का रंग और अस्पष्टता कस्टमाइज़ योग्य है।
  • डायलॉग बॉक्स : ट्रांसक्रिप्शन (और अनुवाद) को एक डायलॉग बॉक्स में दिखाया जा सकता है। दिखाने की अवधि कस्टमाइज़ की जा सकती है।
  • कॉपी बटन : डायलॉग बॉक्स में एक कॉपी बटन जोड़ा गया है ताकि ट्रांसक्राइब किए गए टेक्स्ट को आसानी से कॉपी किया जा सके।

5.9. त्रुटि प्रबंधन

त्रुटियों को केंद्रीकृत तरीके से संभाला जाता है। त्रुटि संदेश src/constants.js में परिभाषित हैं (ऑब्जेक्ट ERRORS)। त्रुटियाँ उपयोगकर्ता को स्टेटस बैनर के माध्यम से दिखाई जाती हैं।

6. संसाधन

7. निष्कर्ष

Babel Fish AI सटीक वॉइस ट्रांसक्रिप्शन और वैकल्पिक अनुवाद के लिए एक संपूर्ण समाधान प्रदान करता है, साथ ही एक सहज इंटरफ़ेस और उन्नत सुरक्षा सुनिश्चित करता है। इस एक्सटेंशन के साथ, आवाज़ से टेक्स्ट में रूपांतरण का अनुभव बेहतर होता है और भाषा की बाधा टूटती है। Chrome Web Store पर Babel Fish AI आज़माएँ और देखें कि यह आपकी संचार प्रक्रिया को कैसे बदल सकता है।

पढ़ने के लिए धन्यवाद, और Babel Fish AI का आनंद लें!

यह दस्तावेज़ gpt-5-mini मॉडल का उपयोग करके fr संस्करण से hi भाषा में अनुवादित किया गया है। अनुवाद प्रक्रिया के बारे में अधिक जानकारी के लिए देखें https://gitlab.com/jls42/ai-powered-markdown-translator