線上節拍製作遊戲是一種基於瀏覽器的節奏編曲器,讓你透過點擊網格上的格子來開啟鼓點,無需安裝、註冊帳號或下載音色範本。線上鼓機會將一個 4×4 節拍轉換成 16 個等分的十六分音符步進,並在下方配置大鼓、小鼓與 hi-hat 三列,讓每次點擊都是在小節中某一刻對某個樂器的單一切換。按下播放後,移動的步進指示燈會掃過網格,瀏覽器會在 Web Audio 時間軸上排程每個啟用的格子,從本機振盪器與雜訊緩衝區合成大鼓、小鼓與 hi-hat 音效,而不是從音色伺服器拉取檔案。預設圖樣是四拍底鼓的起始節拍——每個四分音符都有大鼓、第二拍與第四拍有小鼓、每個奇數步有閉合 hi-hat——所以從第一次按下播放開始,迴圈聽起來就很有音樂性。從這裡開始,每個格子都可以一次點擊替換,這也是最像解謎遊戲的部分:你不是在錄製演奏,而是在解開一個 48 格圖樣。
是什麼讓節拍製作感覺像遊戲?
大多數鼓機工具感覺像軟體——錄音準備、推桿拉高、編輯段落。線上節拍製作遊戲感覺不同,因為輸入是二元的。每個步進都是單一的「是或否」決定:這裡大鼓要不要響、那裡小鼓要不要響、反拍上 hi-hat 要不要響?你不需要畫曲線、拖曳循環或試聽音色庫。每個格子你只動一步,迴圈就會立即告訴你這一步讓小節變得更好或更差。網格每次都保持相同的形狀——寬 16 格、高 3 列——所以關卡永遠不變;只有你的圖樣會變。
這種結構大量借鑑自解謎介面。總狀態空間小到足以思考,卻大到值得持續搜尋:48 個格子,每格開或關,可能的圖樣比任何人一輩子能試聽的還多。預設的四拍底鼓起始節拍代表你的第一個畫面已經是個能跑的節拍,所以這遊戲比較不是在從無到有打造,而是在轉化一個可辨識的東西。按下清除圖樣會讓每格回到靜音以重新開始,按下停止則會釋放音訊引擎,讓你在決定下一步前先安靜聆聽。
Web Audio context 只會在你按下播放時建立,這符合瀏覽器「音訊必須由使用者操作才能啟動」的規則。這個細節在你玩樂時感覺不到,但這正是這個工具能在你十分鐘前開的分頁中,於第一次點擊播放按鈕時仍感覺流暢的原因。音訊 context 也會在按下停止、組件卸載、發生播放錯誤,以及每次新執行時乾淨地關閉,所以背景不會有排程器悄悄運轉。
五個步驟寫出你的第一個迴圈
- 開啟線上鼓機,看一下起始圖樣:大鼓在步進 1、5、9、13(四個四分音符),小鼓在步進 5 與 13(第二拍與第四拍),閉合 hi-hat 在每個奇數步。
- 決定一個速度,將整數輸入 BPM 欄位,範圍在 40 到 240 之間。120 是熟悉的步行節奏速度;輸入 90 可得到嘻哈感;輸入 160 則是強勁的舞曲脈動。
- 點擊大鼓、小鼓或 hi-hat 列上的任何格子來切換該擊點的開關。圖樣編輯在播放期間持續有效,所以你可以在播放時雕琢迴圈。
- 按下播放啟動合成迴圈。在網格上移動的輪廓會顯示目前步進,三個音色會透過 25 毫秒輪詢計時器搭配 100 毫秒預讀窗口,在 AudioContext 時間軸上排程。
- 按下停止釋放音訊資源,或按下清除圖樣將全部 48 格一次關閉,從靜音重新開始。
如果在播放期間變更 BPM 欄位,迴圈會停止且音訊 context 會關閉,以免先前的排程滲漏到新節奏中。輸入有效的整數並再次按下播放,即可從第一步乾淨地啟動。這個取捨正是讓聽到的速度不會在小節中間飄移的原因。
BPM 與步進時序實際如何運作
此工具中的 BPM 代表每分鐘四分音符數,這與 W3C MusicXML sound 元素的速度定義相同。由於網格每個四分音符有四個十六分音符步進,一個步進的時長為 60 / BPM / 4 秒。計算範例:120 BPM 時,公式變成 60 / 120 / 4,等於每步 0.125 秒,完整的 16 步小節歷時 0.125 × 16 = 2 秒。將速度放慢到 40 BPM,每步延長為 0.375 秒,小節繞一圈需要 6 秒。推到上限 240 BPM,每步縮短為 0.0625 秒,小節僅歷時 1 秒。
| BPM | 一步(秒) | 完整 16 步小節(秒) |
|---|---|---|
| 40(下限) | 0.375 | 6.000 |
| 120(預設) | 0.125 | 2.000 |
| 240(上限) | 0.0625 | 1.000 |
速度欄位很嚴格:空輸入、像 119.5 的小數、正負號、像 1.2e2 的指數表示法,以及像「120bpm」的單位文字,都會產生可復原的錯誤訊息。低於 40 或高於 240 的數值也會被拒絕。40 到 240 之間含的整數是唯一可接受的值,這讓時序公式落在排程器所設計的安全範圍內。如果你想試驗該範圍外的速度,工具建議將圖樣概念轉移到專用的音樂應用程式。
每個合成音色聽起來如何
你聽到的每個擊點都由瀏覽器的 Web Audio 節點即時產生——沒有下載的音色、沒有外部音色庫,也沒有第三方授權要繼承。根據 W3C Web Audio API,AudioContext 可以在不聯絡伺服器的情況下建立振盪器、雜訊緩衝區、濾波器與增益包絡,這正是此工具塑造三個音色的方式。
大鼓是短促的正弦振盪器,音高急速下降,增益快速衰減,產生的撞擊感更像合成的 808,而不是錄製的真實大鼓。小鼓使用新產生的雜訊緩衝區,經過高通濾波器與增益包絡,每次擊點產生帶有雜訊感的脆響。hi-hat 使用更短、更安靜的雜訊爆發,搭配更高的高通截止頻率,因此在混音中位於大鼓與小鼓之上。由於每次小鼓與 hi-hat 擊點都由新的雜訊緩衝區構成,實際音色會在每次擊點、瀏覽器、輸出裝置與取樣率之間略有差異。
這是刻意的設計。此工具是直十六分音符概念的速寫板,而不是音色完全相同的鼓機。你的裝置音訊輸出、取樣率,以及瀏覽器產生的隨機雜訊,都會為聲音上色。嚴重的瀏覽器節流、暫停的分頁、裝置變更、高系統負載,以及作業系統音訊延遲,仍可能影響你聽到的內容,所以合約明確指出此工具不是數位音訊工作站,也不是 AudioWorklet 引擎。如果你需要可量產的分音軌或跨裝置完全相同的渲染,建議路徑是擷取圖樣概念,並將其移至專用的音樂應用程式。
開始前需了解的限制
把這個工具當作遊戲玩,會因為你事先知道它能做與不能做什麼而更有收穫。下表摘要了支援與超出範圍功能之間的界線,讓你不會在迴圈進行到一半時撞上缺少的控制項。
| 工具內支援 | 工具外不支援 |
|---|---|
| 在本機合成大鼓、小鼓與 hi-hat | 下載或上傳音色 |
| 迴圈嚴格的 16 步圖樣 | 支援 swing、三連音或每步重音 |
| 接受 40 到 240 的整數 BPM | 允許小數速度或 BPM 欄位中的文字 |
| 在瀏覽器中執行,無需帳號或上傳 | 錄製音訊、匯出 WAV 或同步至 MIDI |
| 使用顏色加上輪廓作為移動步進指示燈 | 保證跨裝置完全相同的播放 |
沒有單軌音量滑桿、沒有效果鏈、沒有拍號控制、沒有錄音按鈕,也沒有匯出功能。瀏覽器可能會對背景分頁進行節流,如果你長時間切換到別處,可能會影響播放。偏好減少動畫的使用者可取得不帶顏色過渡的步進輪廓,每個網格按鈕都帶有描述性的無障礙標籤,讓工具在看不見移動指示燈的情況下仍可使用。橫向捲動讓所有十六個步進在窄螢幕上都能觸及,而不會把觸控目標縮成難以辨識的記號。
Turn the Grid Into a Game
A few small habits make the loop feel less like a static pattern and more like a session you keep returning to.
- Score yourself on restraint. Open the starter pattern, press Clear, and try to rebuild a four-on-the-floor groove using no more than 14 active cells. The constraint is what makes it a puzzle rather than a blank canvas.
- Chain three patterns. Because edits apply to the upcoming schedule, you can change the snare row while the loop plays and hear the groove shift inside the same bar, then switch to a hi-hat-only pattern as the next "round."
- Test tempo extremes. Drop BPM to 40 to hear how the snare and hi-hat spaces out, then jump to 240 to feel how compressed the sixteenth notes become. The grid shape never changes; only the audible rate does.
- Match the hi-hat to the kick. Try opening the hi-hat on every step and the kick only on steps 1 and 9. Then move the kick to steps 1, 7, and 11 and listen for how the off-beat kick changes the pocket.
- Use Clear as a reset button. Pressing it turns all 48 cells off, which is the cleanest way to start a new round without restarting the page or losing the tempo you just dialed in.
Keep your device volume moderate before pressing Play, especially with headphones, because synthesized transients can sound louder on some output systems. The audio context closes when you press Stop, when the component unmounts, on a playback error, or when you start a new run, so there is no hidden resource drain between rounds. If browser audio initialization or scheduling fails, the tool reports a recoverable message and lets you try Play again instead of leaving a false playing state on screen.
If you finish a loop you like, write down the cell pattern by hand or screenshot the grid — the tool does not save patterns, record audio, or export a WAV. The pattern is a sketch rather than a session file, which is why the loop feels like a quick round of a game instead of a long studio project. Treat the next pattern as a new level, leave the cell counter visible, and run the same tempo twice to see whether you can land the same groove from memory.
For a deeper look, see Beat Maker Online Keyboard: 16-Step Drum Pattern Maker.
For a deeper look, see Beat Maker Online No Sign Up: Build a 16-Step Beat.