在 16 步線上節拍製造器中，以 120 BPM 播放時，一個十六分音符的步長時間正好是 60 ÷ 120 ÷ 4 = 0.125 秒，因此整個 pattern 會以 2 秒為週期循環，而工具範圍 40–240 內的所有 BPM 都依照這個公式等比例縮放(根據 W3C MusicXML 4.0 對 tempo 的定義，以每分鐘幾個四分音符為單位，其中每個四分音符包含四個十六分音符步長)。大多數線上節拍製造器都採用同樣的步進格，但底層的設計選擇——如何解析 tempo、如何產生聲音、播放時是否將排程器與測試邏輯分開——會改變哪些錯誤容易犯、哪些錯誤根本不會發生。最乾淨的做法是選擇一個完全在你本機執行的瀏覽器工具、讓你能設定嚴格的 tempo，並說明它的排程器實際在做什麼。Online Drum Machine 正是這樣的設計:它將整個 16 步格、播放迴圈與合成音色全部保留在瀏覽器內，不需要上傳，也不需要繼承任何音色庫的授權。以下的建議聚焦在這個工具上，因為它回答的問題——一個步長實際持續多久、為什麼更改 tempo 會停止播放、為什麼不會下載檔案——正是人們第一次在線上編寫節拍時最常碰到的問題。
「線上節拍製造器」在瀏覽器中真正的意義
線上節拍製造器從重量級、DAW 風格的網頁應用，到輕量、活在單一分頁中的步進音序器都有。最關鍵的區別在於音訊實際產生的位置。從 CDN 拉取音色或在遠端機器上渲染的工具會上傳資料;而在你自己的 Web Audio context 中，以振盪器建立大鼓、以噪音緩衝區建立小鼓與 hi-hat 的工具則不會。Online Drum Machine 明確屬於後者:大鼓是一個短促的正弦振盪器，其頻率隨著增益衰減而下降;小鼓是新產生的噪音，經過高通濾波器與增益包絡塑形;hi-hat 則是更短、更安靜、且截斷頻率更高的噪音(根據 W3C Web Audio API 規範)。這在實務上帶來兩點影響。第一，開啟頁面時不會連線到音色主機，因此你的 pattern 不會有任何資料離開裝置。第二，由於噪音是每次擊擊時重新產生的，而非從固定檔案串流，因此音色會在瀏覽器、輸出硬體與取樣率之間略有差異。如果你做了一個節拍，在朋友的筆電上聽起來有些微不同，那是噪音產生器在作用，而不是 bug。
對步進編曲而言，更重要的決定是格線如何連接。16 步格可以代表 4/4 拍中的一个小節、以十六分音符組成，但工具也可以將它用於兩個小節中的八個八分音符，或任何其他切分方式。Online Drum Machine 將其固定為四個四分音符、再分成十六個等長的十六分音符步長，因此格線永遠代表同一件事。這種固定關係正是你能推理 tempo 的基礎:四分音符是在選定 BPM 下的一個拍點，而每個十六分音符正好是該時長的四分之一。
破壞線上節拍 pattern 的常見錯誤
大多數新手都會碰上同樣那幾個問題。在進入推論之前，先提供一份快速對照表:
| 錯誤 | 為什麼會破壞節拍 | 修正方式 |
|---|---|---|
| 輸入小數、空格或帶正負號的 tempo | 輸入框只接受 40 到 240 之間的整數 | 在顯示範圍內輸入整數 |
| 在循環播放時編輯 tempo | 排程器刻意停止以釋放 AudioContext | 先按 Stop，改 tempo，再按 Play |
| 以為有 swing 或 triplet 可用 | 格線只有平直的十六分音符 | 等循環聽起來對了之後，再到 DAW 中加入 swing |
| 在背景化的分頁上按 Play | 瀏覽器節流會拉長 look-ahead 視窗 | 播放時保持分頁為作用中狀態 |
| 第一次擊點前就把裝置音量開到最大 | 合成的暫態訊號在某些輸出上可能會暴衝 | 從中等音量開始，尤其是使用耳機時 |
| 期待不同裝置之間音色完全一致 | 小鼓與 hi-hat 的噪音每次擊點都會重新產生 | 將音色差異視為設計的一部分 |
最浪費時間的習慣是中途更改 tempo。當你編輯 tempo 時，工具會刻意停止播放:舊 BPM 已排入佇列的事件會被釋放、AudioContext 會關閉，新的 Play 會從第一步以新數值重新啟動。嘗試平滑地滑動 tempo 並不是設計功能，而是刻意如此。第二常見的錯誤是把 16 格當成 16 個獨立的拍點。一個小節其實只有四拍;其餘十二格是細分，這也是為什麼四四拍底鼓 pattern 會把 kick 放在 1、5、9、13 格，而不是 1、2、3、4 格。
一個更細微的錯誤，是假設排程器在每台裝置上都能達到取樣精度的準確度。Look-ahead 每 25 毫秒輪詢一次，並在 AudioContext 時間軸上預排至多 100 毫秒後的事件，這能消除大部分 JavaScript 計時器的抖動，但分頁被暫停、裝置突然切換或系統負載過重，仍可能讓你聽到的結果略有偏移。請把這個時序視為「在作用中分頁上像錄音室一樣精準」，而不是絕對保證。
從零開始編寫一個 16 步節拍
使用 Online Drum Machine 只需要三個動作:選定 tempo、點擊格子、然後播放或停止。詳細步驟如下:
- 輸入 40 到 240 BPM 之間的整數 tempo。工具以「每分鐘幾個四分音符」解讀 BPM，因此 120 BPM 代表每個四分音符長 0.5 秒，每個十六分音符步長為 60 ÷ 120 ÷ 4 = 0.125 秒。
- 在十六步格上切換大鼓、小鼓與 hi-hat 格子。點一下格子可在該步開啟該樂器;再點一下則關閉。每一列代表三種音色之一;每一欄代表小節中的一個十六分音符步長。
- 按 Play 循環播放合成節拍。移動的外框會顯示目前步長，排程器會在 AudioContext 時間軸上預排至多 100 毫秒後的事件，因此即使頁面忙碌，時序仍能保持穩定。
- 按 Stop 釋放音訊。Stop 會清除排程器計時器、停止並斷開追蹤中的音源節點，然後關閉 AudioContext，讓後續的 Play 從乾淨的狀態重新開始，不會留下殘留事件。
- 按 Clear pattern 關閉全部 48 格。這是無需手動逐格點擊、從靜音開始的最快方式，並且不論循環是否正在播放都可以執行。
格線預設為四四拍底鼓起手式:大鼓落在四分音符位置，小鼓在第二拍與第四拍，closed hi-hat 在八分音符位置。把它當作起點:可以保留原樣、一次改一格，或 Clear 後從頭重來。
會改變節拍感受的 tempo 數字
因為每個步長為 60 ÷ BPM ÷ 4 秒，同一個 pattern 在範圍最低與最高處的感受會截然不同。下表列出五個基準點的步長與整個小節長度，依工具所記載的公式計算:
| BPM | 步長 | 小節長度 (16 步) | 典型感受 |
|---|---|---|---|
| 40 | 0.375 s | 6.000 s | 慢速練習脈衝 |
| 90 | ≈0.167 s | ≈2.667 s | 放鬆的嘻哈 groove |
| 120 | 0.125 s | 2.000 s | 預設 house / pop 律動 |
| 180 | ≈0.083 s | ≈1.333 s | 推進感強的搖滾或 DnB 感受 |
| 240 | 0.0625 s | 1.000 s | Blast-beat / DnB 上限 |
40、120 與 240 這幾列與該工具已驗證行為中所公布的明確基準點一致。90 與 180 這兩列則是依工具所記載的同一個 60 / BPM / 4 公式推得，因此所有數值都落在嚴格的整數輸入範圍內，可以直接輸入而不會觸發可恢復的錯誤訊息。
一個實用的建議:在編排格子時先不要動 tempo，等 pattern 聽起來對了，再用幾個不同的 BPM 試聽。因為更改 tempo 會停止播放，所以每次都會短暫失去循環，這是刻意的安全行為，而不是故障。
讓線上節拍更紮實的實用技巧
幾個習慣能讓你少重做幾次同樣的循環:
- 先編排大鼓。先決定正拍位置(四四拍的話是 1、5、9、13 格;半速脈衝的話是 1 與 9 格)，再加小鼓與 hi-hat，讓 pattern 其餘部分有清楚的參考點。
- 用 hi-hat 定義細分，而非填補空隙。每隔一格擊 closed hi-hat(1、3、5、7、9、11、13、15 步)能產生穩定的八分音符脈衝;若改擊 off-beat(3、7、11、15 步)，則會讓整體感覺更為開放。
- 在大多數 pop、搖滾與嘻哈 pattern 中，小鼓落在第二拍與第四拍。5 與 13 格是預設 pattern 的位置，初次編寫時通常不需要移動。
- 先以中等系統音量聆聽。合成的大鼓與小鼓暫態訊號在某些耳機上可能會比預期更響，而 Web Audio 音源節點本身並未內建限制器。
- 播放時保持分頁在前景。背景分頁會被節流，可能拉長 look-ahead 視窗，即使底層時序運算正確，也會讓節拍聽起來不穩。
- 將喜愛的 pattern 存成螢幕截圖或筆記。工具不會錄製、匯出或在 session 之間保存任何循環，因此想保留的 pattern 必須手動重現，或逐格記下來。
Limits to Know Before You Start
The Online Drum Machine is intentionally narrow. It does not support swing, triplets, velocity, accents, per-track volume, effects, recording, export, MIDI synchronization, arbitrary time signatures, or background-tab guarantees. AudioContext is created only after you press Play, which respects browsers that require a user gesture before audio starts; if the browser blocks the audio context or scheduling fails, the tool reports a recoverable message and lets you try again rather than leaving a false "playing" state. The accessibility behavior is also worth knowing: the moving step indicator uses color and an outline only, and color transitions are disabled when reduced-motion is requested, so users who turn motion off still see the playhead change position without a flashing cue.
Pattern edits remain available during playback and are read by the upcoming scheduling window, so you can tweak cells while the loop runs and hear the change on the next bar. If you need production arrangement, sample-accurate synchronization across devices, rendered stems, or latency calibration, transfer the concept to a dedicated music application. The tool is best used for sketching straight sixteenth-note ideas, learning how a 16-step grid maps to a real bar, and testing whether a basic pulse works before committing to a heavier workflow.
Beat making online is at its best when the tool removes the busywork — sample licensing, file uploads, account creation — and leaves you with the grid, the tempo, and the click. Once the math is in your head (60 / BPM / 4 seconds per sixteenth-note step) and the scheduler's limits are clear (active tab, integer BPM, intentional stop on tempo change), the only real decision is where to put each cell. A quick rhythm sketch in the Online Drum Machine can move from "what if I put snare on cell 9" to a two-second loop in the time it takes to click a few buttons, and that fast feedback is what makes an online beat maker worth reaching for in the first place. For a beginner-friendly walkthrough of the same grid, see the Beat Maker Online for Beginners guide.
If you're weighing options, Beat Maker Online Without App: Build Beats in Browser covers this in detail.