技術 29. Javascript 套件選集 - 總整理

本旅程的第二部分 - Javascript 套件選集 也結束啦～同樣的來回顧一下這兩個禮拜我們玩了什麼吧！ Live Demo 我們一開始認識了 tonel...

技術 18. Tone.js - 基本功能

昨天我們一起認識了 Tone.js，並用最簡單的範例讓它發出聲音；今天就接著介紹 Tone.js 的幾項重點觀念或功能吧！ 節點關係 Tone.js 是建構在...

技術 27. Wavesurfer.js

第 27 篇了，旅程也到達了尾聲。最後我們來玩玩一些音樂視覺化的套件吧～ 這是什麼？ Wavesurfer.js 是一個建構在 Wab Audio API 之上...

技術 01. 基礎建設

馬上要開始介紹 Web Audio API 了，總要有個網站來呈現各種內容吧；既然要學東西，那就順便把不熟的 Vue 架起來玩一玩囉！ 開始之前 筆者預期讀者您...

技術 20. Tone.js - 排程

旅程走到這邊，也逐漸認識 Tone.js 這個音樂框架了，是不是有種相見恨晚的感覺啊 XD 但也是因為我們先在 Web Audio API 上走過一圈，熟悉了模...

技術 19. Tone.js - 合成器

今天就來探索 Tone.js 的核心功能 - 合成器 回顧一下這幾天一直使用的範例： const synth = new Tone.Synth().toMast...

技術 17. Tone.js

昨天我們認識了一個專注在樂理上的套件 - tonal，並在最後展示了一個互動音樂的範例。 該範例是由 tonal 與一個知名的 Web Aduio 框架 - T...

技術 26. Scribbletune - 音軌處理

今天我們將會繼續介紹 Scribbletune 中實用的特色功能 - Session 及 Channel。 Channel 昨天我們講到了 Clip，也就是音樂...

技術 28 Rythm.js

最後一個套件，來個歡樂、輕鬆、簡單又有點ㄎㄧㄤ的套件吧 XD 這是什麼？ Rythm.js 是個可以讓網頁依據指定音檔的高低起伏，隨之舞動的套件，透過特定的 c...

技術 21. 音序機 Part.1

昨天我們聊到的 Tone.js 的強力功能 - 排程播放，那麼就來玩玩看許多高手前輩都做過的 音序機 吧～ Sequencer 音序機，顧名思義，就是能夠把聲音...

技術 00. 出發前準備

旅程開始前先聊聊天吧 不知道大家有沒有拜訪過 史萊姆的第一個家 ? 在筆者小時候，幾乎天天都會上去找一些小遊戲來玩：洛克人 X、史瓦特大進擊、2D CS 等，許...

技術 30. 結語

這是最後一篇了；這趟三十天的音樂漫遊也就到這邊結束了。 其實想要透過文章記錄下自己的學習歷程也想了挺久的，但一直礙於工作及自己的惰性，遲遲沒有真的起步。在辦公...

技術 16. tonal

昨天結束了 Web Audio API 的部分，那麼我們的旅程又是全新的開始啦～ Javascript 的音樂相關套件其實不少，Github 上數千顆星星的比比...

技術 22. 音序機 Part.2

其實，這個音序機在原本的鐵人三十天計畫中，大概只佔了一天的篇幅，但筆者寫著寫著就越寫越開心，不知不覺就玩開了，文章都不寫整天刻網站，啊哈哈哈哈哈。 今天就紀錄一...

技術 24. Scribbletune

結束了連續三天的音序機之旅，是否覺得互動式音樂非常有趣呢？接下來讓我們玩玩另一個有趣的音樂套件 - Scribbletune。 這是什麼？ Scribbletu...

技術 25. Scribbletune - Clip

昨天 我們一起認識了 Scribbletune 這個有趣的套件，如果你還沒看過昨天的文章，可以先去看完再回來喔～ 參考一下昨天最後使用的範例： Scribble...

技術 23. 音序機 Part.3

欸對，就是音序機的第三天。一個不小心玩得太開心，就又長出了一些功能，一起來看看吧！ 點擊 & 觸碰事件 一格一格點實在太慢了，還是來仿照前人的智慧，寫個...

技術 Trick 24: 重覆播放的環境音同時有三百個會怎樣

遊戲中總有某些音效需要循環播放，像是迴旋鏢在飛行時產生的咻咻聲，小火堆的辟啪聲，牛群經過時的咚咚聲。如果遊戲能確保聲音來源的數量，那可能沒什麼問題。但像是Min...

技術 Day 15｜Divi 功能練習 07 Audio Module 把你的音樂放到網站上吧！

嗨呦大家好我是 Jasmine～腦袋總是胡思亂想停不下來的設計師一枚\(✪ω✪)/ 今天我們要來學一個很酷的功能！ 那就是「如何在網站上放音樂」！ 如果你是音...