Web Audio API के साथ गेम ऑडियो डेवलप करना

Boris Smus

परिचय

ऑडियो, मल्टीमीडिया अनुभव को ज़्यादा दिलचस्प बनाने में अहम भूमिका निभाता है. अगर आपने कभी आवाज़ बंद करके कोई फ़िल्म देखी है, तो आपको यह बात पता चली होगी.

गेम भी इस नियम के दायरे में आते हैं! वीडियो गेम से जुड़ी मेरी सबसे अच्छी यादें, उनके संगीत और साउंड इफ़ेक्ट से जुड़ी हैं. अपना पसंदीदा गेम खेलने के करीब दो दशक बाद भी, कई मामलों में मुझे कोजी कोंडो के ज़ेल्डा कंपोज़िशन और मैट उल्मेन के शानदार डायब्लो साउंडट्रैक का संगीत पसंद नहीं आता. यही बात साउंड इफ़ेक्ट पर भी लागू होती है, जैसे कि Warcraft से तुरंत पहचानने लायक यूनिट क्लिक रिस्पॉन्स और Nintendo के क्लासिक वर्शन के सैंपल.

गेम के ऑडियो में कुछ दिलचस्प चुनौतियां होती हैं. दिलचस्प गेम म्यूज़िक बनाने के लिए, डिज़ाइनर को गेम की संभावित स्थिति के हिसाब से बदलाव करना होगा, ताकि खिलाड़ी खुद को बेहतर ढंग से समझ सके. आम तौर पर, गेम के कुछ हिस्से अनिश्चित समय तक चलते हैं. साथ ही, आवाज़ें, कमरे के असर और आवाज़ की जगह जैसे जटिल तरीकों से, आस-पास के माहौल के साथ इंटरैक्ट कर सकती हैं और मिक्स हो सकती हैं. आखिर में, एक साथ कई आवाज़ें चल सकती हैं. इन सभी को एक साथ अच्छी तरह से सुनाई देना चाहिए और परफ़ॉर्मेंस पर असर डाले बिना रेंडर होना चाहिए.

वेब पर गेम का ऑडियो

आसान गेम के लिए, <audio> टैग का इस्तेमाल करना काफ़ी हो सकता है. हालांकि, कई ब्राउज़र में यह सुविधा ठीक से काम नहीं करती. इस वजह से, ऑडियो में गड़बड़ियां होती हैं और लैटेंसी बढ़ जाती है. हमें उम्मीद है कि यह समस्या कुछ समय के लिए है, क्योंकि वेंडर अपने-अपने प्लैटफ़ॉर्म पर इस सुविधा को बेहतर बनाने के लिए लगातार काम कर रहे हैं. <audio> टैग की स्थिति को समझने के लिए, areweplayingyet.org पर एक अच्छा टेस्ट सुइट है.

हालांकि, <audio> टैग की खास बातों को ध्यान से देखने पर, यह पता चलता है कि इसकी मदद से कई काम नहीं किए जा सकते. इसमें कोई हैरानी नहीं है, क्योंकि इसे मीडिया चलाने के लिए डिज़ाइन किया गया था. इसकी कुछ सीमाएं ये हैं:

  • साउंड सिग्नल पर फ़िल्टर लगाने की सुविधा नहीं है
  • रॉ PCM डेटा को ऐक्सेस करने का कोई तरीका नहीं है
  • सोर्स और लिसनर की पोज़िशन और डायरेक्शन का कोई कॉन्सेप्ट नहीं है
  • ज़्यादा सटीक समय नहीं.

इस लेख के बाकी हिस्से में, मैं Web Audio API का इस्तेमाल करके लिखे गए गेम ऑडियो के संदर्भ में, इनमें से कुछ विषयों पर ज़्यादा जानकारी दूंगा. इस एपीआई के बारे में कम शब्दों में जानकारी पाने के लिए, शुरू करने के लिए ट्यूटोरियल देखें.

बैकग्राउंड संगीत

गेम में अक्सर बैकग्राउंड संगीत लूप में चलता है.

अगर आपका लूप छोटा और अनुमानित है, तो यह बहुत परेशान कर सकता है. अगर कोई प्लेयर किसी इलाके या लेवल में फंस जाता है और बैकग्राउंड में एक ही सैंपल लगातार चलता रहता है, तो प्लेयर को परेशान होने से बचाने के लिए, ट्रैक को धीरे-धीरे फ़ेड आउट किया जा सकता है. एक और रणनीति यह है कि गेम के हिसाब से, अलग-अलग इंटेंसिटी के मिक्स बनाए जाएं, जो धीरे-धीरे एक-दूसरे में क्रॉसफ़ेड होते जाएं.

उदाहरण के लिए, अगर आपका प्लेयर किसी एपिक बॉस से लड़ रहा है, तो आपके पास कई तरह के मिक्स हो सकते हैं. ये मिक्स, भावनाओं के हिसाब से अलग-अलग हो सकते हैं. जैसे, शांत, ऐटमॉस्फ़ीयर, पहले से बताने वाले, और ज़्यादा दिलचस्प. म्यूज़िक सिंथेसिस सॉफ़्टवेयर की मदद से, अक्सर किसी एक टुकड़े के आधार पर एक ही अवधि के कई मिक्स एक्सपोर्ट किए जा सकते हैं. इसके लिए, आपको एक्सपोर्ट में इस्तेमाल करने के लिए ट्रैक का सेट चुनना होगा. इससे, ट्रैक के बीच क्रॉस-फ़ेड करते समय, ट्रैक के बीच अचानक बदलाव होने से बचा जा सकता है.

गराजबैंड

इसके बाद, वेब ऑडियो एपीआई का इस्तेमाल करके, इन सभी सैंपल को इंपोर्ट किया जा सकता है. इसके लिए, XHR के ज़रिए BufferLoader क्लास जैसी किसी चीज़ का इस्तेमाल करें. इस बारे में ज़्यादा जानकारी के लिए, वेब ऑडियो एपीआई के बारे में जानकारी देने वाला लेख पढ़ें. साउंड लोड होने में समय लगता है. इसलिए, गेम में इस्तेमाल की जाने वाली ऐसेट को पेज लोड होने पर, लेवल की शुरुआत में या खिलाड़ी के गेम खेलते समय धीरे-धीरे लोड किया जाना चाहिए.

इसके बाद, हर नोड के लिए एक सोर्स और हर सोर्स के लिए एक गेन नोड बनाएं. साथ ही, ग्राफ़ को कनेक्ट करें.

ऐसा करने के बाद, लूप में इन सभी सोर्स को एक साथ चलाया जा सकता है. इन सभी सोर्स की लंबाई बराबर है, इसलिए Web Audio API इस बात की गारंटी देगा कि वे अलाइन रहेंगे. जैसे-जैसे गेम का मुख्य पात्र, आखिरी बॉस से दूर या नज़दीक आता है, गेम में चेन के हर नोड के लिए, गेन की वैल्यू बदल सकती है. इसके लिए, गेन की रकम का यह एल्गोरिदम इस्तेमाल किया जाता है:

// Assume gains is an array of AudioGainNode, normVal is the intensity
// between 0 and 1.
var value = normVal - (gains.length - 1);
// First reset gains on all nodes.
for (var i = 0; i < gains.length; i++) {
    gains[i].gain.value = 0;
}
// Decide which two nodes we are currently between, and do an equal
// power crossfade between them.
var leftNode = Math.floor(value);
// Normalize the value between 0 and 1.
var x = value - leftNode;
var gain1 = Math.cos(x - 0.5*Math.PI);
var gain2 = Math.cos((1.0 - x) - 0.5*Math.PI);
// Set the two gains accordingly.
gains[leftNode].gain.value = gain1;
// Check to make sure that there's a right node.
if (leftNode < gains.length - 1) {
    // If there is, adjust its gain.
    gains[leftNode + 1].gain.value = gain2;
}

ऊपर बताए गए तरीके में, दो सोर्स एक साथ चलते हैं. साथ ही, हम एक जैसे पावर कर्व का इस्तेमाल करके, उनके बीच क्रॉसफ़ेड करते हैं. इस बारे में शुरुआत में बताया गया है.

आज-कल कई गेम डेवलपर अपने बैकग्राउंड म्यूज़िक के लिए <audio> टैग का इस्तेमाल करते हैं, क्योंकि यह कॉन्टेंट स्ट्रीम करने के लिए सबसे सही है. अब <audio> टैग में मौजूद कॉन्टेंट को Web Audio में जोड़ा जा सकता है.

यह तकनीक काम की हो सकती है, क्योंकि <audio> टैग कॉन्टेंट स्ट्रीमिंग के साथ काम कर सकता है. इससे आपको बैकग्राउंड म्यूज़िक के डाउनलोड होने का इंतज़ार करने से पहले, तुरंत बैकग्राउंड म्यूज़िक चलाने की सुविधा मिलती है. स्ट्रीम को वेब ऑडियो एपीआई में लाकर, उसमें बदलाव किया जा सकता है या उसका विश्लेषण किया जा सकता है. यहां दिए गए उदाहरण में, <audio> टैग से चलाए जा रहे संगीत पर लो पास फ़िल्टर लागू किया गया है:

var audioElement = document.querySelector('audio');
var mediaSourceNode = context.createMediaElementSource(audioElement);
// Create the filter
var filter = context.createBiquadFilter();
// Create the audio graph.
mediaSourceNode.connect(filter);
filter.connect(context.destination);

<audio> टैग को Web Audio API के साथ इंटिग्रेट करने के बारे में ज़्यादा जानने के लिए, यह छोटा लेख पढ़ें.

साउंड इफ़ेक्ट

गेम में अक्सर उपयोगकर्ता के इनपुट या गेम में आने वाले बदलावों के जवाब में साउंड इफ़ेक्ट चलाए जाते हैं. हालांकि, बैकग्राउंड संगीत की तरह ही साउंड इफ़ेक्ट भी बहुत जल्दी परेशान करने लगते हैं. इससे बचने के लिए, अक्सर मिलती-जुलती, लेकिन अलग-अलग आवाज़ों का पूल होना ज़रूरी होता है. यह फ़ुटस्टप के सैंपल में मामूली बदलाव से लेकर, ज़्यादा बदलाव तक हो सकता है. जैसे, Warcraft सीरीज़ में यूनिट पर क्लिक करने पर दिखने वाले बदलाव.

गेम में साउंड इफ़ेक्ट की एक और अहम सुविधा यह है कि एक साथ कई साउंड इफ़ेक्ट इस्तेमाल किए जा सकते हैं. मान लें कि आप किसी गोलीबारी के बीच हैं और कई कलाकार मशीन गन से गोलियां चला रहे हैं. हर मशीन गन से हर सेकंड में कई बार गोली चलाई जाती है. इस वजह से, एक साथ कई साउंड इफ़ेक्ट चलने लगते हैं. Web Audio API की सबसे बड़ी खासियत यह है कि यह एक साथ कई स्रोतों से सटीक समय पर ऑडियो चला सकता है.

यहां दिए गए उदाहरण में, एक से ज़्यादा बुलेट सैंपल से मशीन गन राउंड बनाया गया है. इसके लिए, एक से ज़्यादा साउंड सोर्स बनाए गए हैं और उनका प्लेलबैक अलग-अलग समय पर किया गया है.

var time = context.currentTime;
for (var i = 0; i < rounds; i++) {
    var source = this.makeSource(this.buffers[M4A1]);
    source.noteOn(time + i - interval);
}

अगर आपके गेम में सभी मशीन गन का आवाज़ एक जैसा होता है, तो गेम बहुत बोरिंग हो जाएगा. बेशक, वे लक्ष्य से दूरी और रिलेटिव पोज़िशन की पोज़िशन से दूरी के आधार पर आवाज़ के हिसाब से अलग-अलग हो सकते हैं (इस बारे में बाद में ज़्यादा जानकारी दी जाएगी), लेकिन शायद यह काफ़ी न हो. अच्छी बात यह है कि Web Audio API की मदद से, ऊपर दिए गए उदाहरण में दो तरीकों से आसानी से बदलाव किया जा सकता है:

  1. गोलियां चलने के बीच के समय में थोड़ी सी बदलाव के साथ
  2. हर सैंपल के playbackRate में बदलाव करके (पिच में भी बदलाव करके), असल दुनिया में होने वाली गड़बड़ियों को बेहतर तरीके से सिम्युलेट किया जा सकता है.

इन तकनीकों के काम करने के असल उदाहरण के लिए, पूल टेबल डेमो देखें. इसमें, गेंद के टकराने की आवाज़ को ज़्यादा दिलचस्प बनाने के लिए, रैंडम सैंपलिंग का इस्तेमाल किया गया है और playbackRate में बदलाव किया गया है.

3D पोज़िशनल साउंड

आम तौर पर, गेम को किसी ऐसी दुनिया में सेट किया जाता है जिसमें कुछ ज्यामितीय प्रॉपर्टी होती हैं. ये प्रॉपर्टी 2D या 3D में हो सकती हैं. अगर ऐसा है, तो स्टीरियो पोज़ीशन वाले ऑडियो की मदद से, वीडियो का इमर्सिव व्यू बेहतर तरीके से दिखाया जा सकता है. अच्छी बात यह है कि वेब ऑडियो एपीआई में, हार्डवेयर की मदद से ऑडियो की जगह का पता लगाने की सुविधाएं पहले से मौजूद होती हैं. इनका इस्तेमाल करना बहुत आसान होता है. वैसे, आपको यह पक्का करना चाहिए कि नीचे दिए गए उदाहरण को समझने के लिए, आपके पास स्टीरियो स्पीकर (खास तौर पर हेडफ़ोन) हों.

ऊपर दिए गए उदाहरण में, कैनवस के बीच में एक दर्शक (व्यक्ति आइकॉन) है और माउस का इस्तेमाल करके सोर्स (स्पीकर आइकॉन) की पोज़िशन बदली जा सकती है. इस तरह का इफ़ेक्ट पाने के लिए, AudioPannerNode का इस्तेमाल करने का एक आसान उदाहरण ऊपर दिया गया है. ऊपर दिए गए सैंपल का मूल मकसद, ऑडियो सोर्स की पोज़िशन सेट करके, माउस की मूवमेंट पर प्रतिक्रिया देना है. इसके लिए, यह तरीका अपनाएं:

PositionSample.prototype.changePosition = function(position) {
    // Position coordinates are in normalized canvas coordinates
    // with -0.5 < x, y < 0.5
    if (position) {
    if (!this.isPlaying) {
        this.play();
    }
    var mul = 2;
    var x = position.x / this.size.width;
    var y = -position.y / this.size.height;
    this.panner.setPosition(x - mul, y - mul, -0.5);
    } else {
    this.stop();
    }
};

वेब ऑडियो में स्पेसलाइज़ेशन के इस्तेमाल के बारे में ज़रूरी बातें:

  • लिसनर डिफ़ॉल्ट रूप से ऑरिजिन (0, 0, 0) पर होता है.
  • वेब ऑडियो के पोज़िशनल एपीआई में यूनिट नहीं होती हैं. इसलिए, मैंने डेमो की आवाज़ को बेहतर बनाने के लिए मल्टीप्लायर का इस्तेमाल किया है.
  • वेब ऑडियो, y-is-up कार्टेशियन निर्देशांक का इस्तेमाल करता है. यह ज़्यादातर कंप्यूटर ग्राफ़िक्स सिस्टम के उलट होता है. इसलिए, हम ऊपर दिए गए स्निपेट में y-ऐक्सिस को बदल रहे हैं

बेहतर: साउंड कोन

पोज़िशनल मॉडल काफ़ी बेहतर और आधुनिक है. यह ज़्यादातर OpenAL पर आधारित है. ज़्यादा जानकारी के लिए, ऊपर दी गई जानकारी के सेक्शन 3 और 4 देखें.

पोज़िशन मॉडल

Web Audio API के कॉन्टेक्स्ट से एक AudioListener जुड़ा होता है. इसे जगह और ओरिएंटेशन के हिसाब से कॉन्फ़िगर किया जा सकता है. हर सोर्स को AudioPannerNode से पास किया जा सकता है, जो इनपुट ऑडियो की जगह तय करता है. पैनर नोड में स्थिति और ओरिएंटेशन के साथ-साथ दूरी और दिशा-निर्देश वाला मॉडल होता है.

डिस्टेंस मॉडल, सोर्स के करीब होने के आधार पर गेन की मात्रा तय करता है. वहीं, डायरेक्श्नल मॉडल को कॉन्फ़िगर करने के लिए, इनर और आउटर कोन तय करना होता है. इनसे यह तय होता है कि अगर सुनने वाला व्यक्ति इनर कोन में है, इनर और आउटर कोन के बीच है या आउटर कोन के बाहर है, तो गेन की मात्रा (आम तौर पर नेगेटिव) कितनी होगी. 

var panner = context.createPanner();
panner.coneOuterGain = 0.5;
panner.coneOuterAngle = 180;
panner.coneInnerAngle = 0;

मेरा उदाहरण 2D में है, लेकिन यह मॉडल तीसरे डाइमेंशन में आसानी से लागू होता है. 3D में स्पेसलाइज़ किए गए साउंड का उदाहरण देखने के लिए, यह पोज़िशनल सैंपल देखें. पोज़िशन के अलावा, वेब ऑडियो साउंड मॉडल में डॉपलर शिफ़्ट के लिए वेलोसिटी भी शामिल की जा सकती है. इस उदाहरण में, डॉप्लर इफ़ेक्ट के बारे में ज़्यादा जानकारी दी गई है.

इस विषय पर ज़्यादा जानकारी के लिए, [पोज़िशनल ऑडियो और WebGL[webgl] के मिक्स पर पूरी जानकारी देने वाला ट्यूटोरियल पढ़ें.

रूम के इफ़ेक्ट और फ़िल्टर

असल में, आवाज़ को जिस तरह से सुना जाता है वह इस बात पर काफ़ी निर्भर करता है कि आवाज़ किस कमरे में सुनी जा रही है. किसी बड़े हॉल की तुलना में, बेसमेंट में एक ही दरवाज़े से होने वाली आवाज़ बहुत अलग होगी. ज़्यादा प्रोडक्शन वैल्यू वाले गेम, इन इफ़ेक्ट की नकल करना चाहेंगे. ऐसा इसलिए, क्योंकि हर एनवायरमेंट के लिए सैंपल का अलग सेट बनाना बहुत महंगा होता है. साथ ही, इससे ज़्यादा ऐसेट और गेम डेटा भी जनरेट होगा.

आम तौर पर, ऑडियो में किसी आवाज़ के असल और रॉ वर्शन के बीच के अंतर को इंपल्स रिस्पॉन्स कहा जाता है. इन इंपल्स रिस्पॉन्स को रिकॉर्ड करना बहुत मुश्किल होता है. हालांकि, आपकी सुविधा के लिए, कुछ साइटें पहले से रिकॉर्ड की गई इन इंपल्स रिस्पॉन्स फ़ाइलों को होस्ट करती हैं. ये फ़ाइलें ऑडियो के तौर पर सेव होती हैं.

किसी दिए गए एनवायरमेंट से इंपल्स रिस्पॉन्स बनाने के तरीके के बारे में ज़्यादा जानने के लिए, Web Audio API स्पेसिफ़िकेशन के कंवॉल्यूशन सेक्शन में "रिकॉर्डिंग सेटअप" सेक्शन पढ़ें.

हमारे उद्देश्यों के लिए इससे भी अहम बात यह है कि Web Audio API, ConvolverNode का इस्तेमाल करके इन आवेग वाले रिस्पॉन्स को हमारी आवाज़ों पर लागू करने का एक आसान तरीका उपलब्ध कराता है.

// Make a source node for the sample.
var source = context.createBufferSource();
source.buffer = this.buffer;
// Make a convolver node for the impulse response.
var convolver = context.createConvolver();
convolver.buffer = this.impulseResponseBuffer;
// Connect the graph.
source.connect(convolver);
convolver.connect(context.destination);

Web Audio API के स्पेसिफ़िकेशन पेज पर, रूम इफ़ेक्ट का यह डेमो भी देखें. साथ ही, यह उदाहरण भी देखें. इससे आपको किसी बेहतरीन जैज़ स्टैंडर्ड के ड्राई (रॉ) और वेट (कंवॉल्वर के ज़रिए प्रोसेस किए गए) मिक्सिंग पर कंट्रोल मिलता है.

आखिरी काउंटडाउन

आपने एक गेम बना लिया है, अपने पोज़िशनल ऑडियो को कॉन्फ़िगर किया है, और अब आपके ग्राफ़ में बहुत सारे AudioNodes हैं, जिन्हें एक साथ चलाया जा रहा है. बहुत बढ़िया, लेकिन अभी भी एक और चीज़ पर विचार करना चाहिए:

कई आवाज़ें एक-दूसरे के ऊपर इकट्ठा हो जाती हैं और उनका वॉल्यूम एक जैसा नहीं होता. इसलिए, हो सकता है कि आपके स्पीकर की क्षमता से ज़्यादा आवाज़ें सुनाई दें. कैनवस की सीमाओं से बाहर निकलने वाली इमेज की तरह, अगर वेवफ़ॉर्म अपने ज़्यादा से ज़्यादा थ्रेशोल्ड से ज़्यादा हो जाता है, तो आवाज़ भी क्लिप हो सकती है. इससे आवाज़ में अलग तरह का विरूपण होता है. वेवफ़ॉर्म कुछ ऐसा दिखेगा:

क्लिप करना

यहां क्लिप करने की सुविधा के काम करने का एक असल उदाहरण दिया गया है. वेवफ़ॉर्म खराब दिखता है:

क्लिपिंग

ऊपर दी गई तरह की गड़बड़ियों को सुनना ज़रूरी है. इसके अलावा, ज़रूरत से ज़्यादा कम किए गए मिक्स को भी सुनना ज़रूरी है, ताकि आपके दर्शकों को वॉल्यूम बढ़ाना पड़े. अगर आपका चैनल इस स्थिति में है, तो आपको इसे ठीक करना होगा!

क्लिपिंग का पता लगाना

तकनीकी तौर पर, क्लिपिंग तब होती है, जब किसी चैनल में सिग्नल की वैल्यू, -1 और 1 के बीच की मान्य रेंज से ज़्यादा होती है. इसकी पहचान होने के बाद, यह जानकारी देने के लिए विज़ुअल फ़ीडबैक देना मददगार होता है कि ऐसा हो रहा है. इसे भरोसेमंद तरीके से करने के लिए, अपने ग्राफ़ में JavaScriptAudioNode डालें. ऑडियो ग्राफ़ को इस तरह सेट अप किया जाएगा:

// Assume entire sound output is being piped through the mix node.
var meter = context.createJavaScriptNode(2048, 1, 1);
meter.onaudioprocess = processAudio;
mix.connect(meter);
meter.connect(context.destination);

साथ ही, क्लिपिंग का पता इस processAudio हैंडलर में लगाया जा सकता है:

function processAudio(e) {
    var buffer = e.inputBuffer.getChannelData(0);

    var isClipping = false;
    // Iterate through buffer to check if any of the |values| exceeds 1.
    for (var i = 0; i < buffer.length; i++) {
    var absValue = Math.abs(buffer[i]);
    if (absValue >= 1) {
        isClipping = true;
        break;
    }
    }
}

आम तौर पर, परफ़ॉर्मेंस की वजहों से JavaScriptAudioNode का ज़्यादा इस्तेमाल न करें. इस मामले में, मेज़रमेंट को लागू करने के किसी अन्य तरीके से, रेंडर के समय getByteFrequencyData के लिए ऑडियो ग्राफ़ में RealtimeAnalyserNode को पोल किया जा सकता है. यह requestAnimationFrame से तय होता है. यह तरीका ज़्यादा कारगर है, लेकिन ज़्यादातर सिग्नल छूट जाते हैं (उन जगहों समेत जहां यह क्लिप हो सकती है), क्योंकि रेंडर करने की प्रक्रिया एक सेकंड में ज़्यादा से ज़्यादा 60 बार होती है, जबकि ऑडियो सिग्नल बहुत तेज़ी से बदलता है.

क्लिप का पता लगाना बहुत ज़रूरी है. इसलिए, हो सकता है कि आने वाले समय में हमें पहले से मौजूद MeterNode वेब ऑडियो एपीआई नोड दिखे.

वीडियो को क्लिप करने से रोकना

मास्टर AudioGainNode पर गेन में बदलाव करके, अपने मिक्स को कम किया जा सकता है, ताकि क्लिपिंग न हो. हालांकि, गेम में बजने वाली आवाज़ें कई बातों पर निर्भर करती हैं. इसलिए, सभी स्थितियों में क्लिपिंग को रोकने के लिए, मास्टर गेन की वैल्यू तय करना मुश्किल हो सकता है. आम तौर पर, आपको सबसे खराब स्थिति का अनुमान लगाने के लिए, बढ़ोतरी में बदलाव करना चाहिए. हालांकि, यह विज्ञान के बजाय कला है.

थोड़ी शक्कर डालें

आम तौर पर, संगीत और गेम प्रोडक्शन में कंप्रेसर का इस्तेमाल किया जाता है. इससे सिग्नल को बेहतर बनाया जा सकता है और पूरे सिग्नल में होने वाली स्पाइक को कंट्रोल किया जा सकता है. यह फ़ंक्शन, वेब ऑडियो की दुनिया में DynamicsCompressorNode के ज़रिए उपलब्ध है. इसे आपके ऑडियो ग्राफ़ में शामिल करके, तेज़, बेहतर, और बेहतर आवाज़ पाने के साथ-साथ क्लिप बनाने में भी मदद मिलती है. यह नोड सीधे स्पेसिफ़िकेशन के बारे में बताता है

आम तौर पर, डाइनैमिक कम्प्रेशन का इस्तेमाल करना अच्छा होता है. खास तौर पर, गेम की सेटिंग में, जहां आपको यह पता नहीं होता कि कौनसी आवाज़ें कब और कैसे बजेंगी. DinahMoe labs का Plink इसका एक बेहतरीन उदाहरण है. इसमें, आपको और मीटिंग में हिस्सा लेने वाले दूसरे लोगों को जो आवाज़ें सुनाई देती हैं वे पूरी तरह से आपके और दूसरे लोगों के इंटरैक्शन पर निर्भर करती हैं. कंप्रेसर का इस्तेमाल ज़्यादातर मामलों में किया जा सकता है. हालांकि, कुछ मामलों में इसका इस्तेमाल नहीं किया जा सकता. जैसे, जब आपको ऐसे ट्रैक को मैस्टर करना हो जिन्हें पहले से ही "ठीक" आवाज़ के लिए ट्यून किया गया हो.

इसे लागू करने का मतलब है कि आपके ऑडियो ग्राफ़ में डाइनैमिकsCompressorNode को शामिल करना होगा. आम तौर पर, इसे डेस्टिनेशन से पहले के आखिरी नोड के तौर पर लागू किया जाता है.:

// Assume the output is all going through the mix node.
var compressor = context.createDynamicsCompressor();
mix.connect(compressor);
compressor.connect(context.destination);

डाइनैमिक कंप्रेसन के बारे में ज़्यादा जानने के लिए, Wikipedia का यह लेख पढ़ें.

खास जानकारी देने के लिए, क्लिप बनाने को ध्यान से सुनें और मास्टर गेन नोड डालकर इसे रोकें. इसके बाद, डाइनैमिक्स कंप्रेशर नोड का इस्तेमाल करके पूरे मिक्स को कस लें. आपका ऑडियो ग्राफ़ कुछ ऐसा दिख सकता है:

आखिरी नतीजा

नतीजा

इसमें वेब ऑडियो एपीआई का इस्तेमाल करके, गेम के ऑडियो को डेवलप करने के सबसे अहम पहलुओं के बारे में बताया गया है. इन तकनीकों की मदद से, अपने ब्राउज़र में ही शानदार ऑडियो अनुभव बनाए जा सकते हैं. साइन इन करने से पहले, मैं आपको एक ब्राउज़र टिप के बारे में बता देती हूं: अगर page visibility API का इस्तेमाल करके टैब बैकग्राउंड में चला जाता है, तो आवाज़ को रोकना न भूलें. अगर ऐसा नहीं किया जाता है, तो उपयोगकर्ता को काफ़ी परेशानी हो सकती है.

वेब ऑडियो के बारे में ज़्यादा जानकारी के लिए, शुरुआत करने के बारे में जानकारी देने वाला लेख देखें. अगर आपका कोई सवाल है, तो वेब ऑडियो के बारे में अक्सर पूछे जाने वाले सवाल में देखें कि क्या उसका जवाब पहले ही दिया जा चुका है. आखिर में, अगर आपके कुछ और सवाल हैं, तो उन्हें वेब-ऑडियो टैग का इस्तेमाल करके स्टैक ओवरफ़्लो पर पूछें.

साइन ऑफ़ करने से पहले, मैं आपको रीयल गेम में Web Audio API के शानदार इस्तेमाल के बारे में बताऊंगी: