เครื่องมือสร้างเพลงบนเว็บใหม่ที่เรียกว่า Strudel Flow ได้เปิดตัวขึ้น โดยผสมผสานพลังของการเขียนโค้ดสดกับอินเทอร์เฟซที่ใช้งานง่าย สร้างขึ้นบน Strudel.cc ซึ่งเป็นการนำภาษาโปรแกรมเพลง TidalCycles มาใช้บนเว็บ โครงการนี้เปลี่ยนการสร้างเพลงที่ซับซ้อนด้วยโค้ดให้กลายเป็นประสบการณ์แบบลากและวางที่ทั้งนักดนตรีและโปรแกรมเมอร์สามารถเพลิดเพลินได้
เทคโนโลยีที่ใช้:
- Audio Engine: Strudel.cc (สภาพแวดล้อมการเขียนโค้ดแบบสดบนเว็บ)
- UI Framework: React Flow Components
- Styling: Tailwind CSS และ shadcn/ui
- State Management: Zustand
- Package Managers: รองรับ npm, yarn, pnpm และ bun
การโปรแกรมแบบภาพพบกับการเขียนโค้ดสด
Strudel Flow แก้ไขอุปสรรคที่ใหญ่ที่สุดอย่างหนึ่งของการสร้างเพลงด้วยอัลกอริทึม นั่นคือเส้นโค้งการเรียนรู้ที่สูงชันของภาษาโปรแกรมที่ใช้ข้อความ แม้ว่า TidalCycles และ Strudel ที่เป็นเวอร์ชันเว็บจะได้รับความนิยมในหมู่นักดนตรีอิเล็กทรอนิกส์เนื่องจากความสามารถในการสร้างแพทเทิร์นที่ทรงพลัง แต่ก็ต้องการให้ผู้ใช้เขียนโค้ดเพื่อสร้างเพลง เครื่องมือใหม่นี้เชื่อมช่องว่างดังกล่าวด้วยการจัดหาอินเทอร์เฟซแบบโหนดที่ผู้ใช้สามารถเชื่อมต่อโหนดเครื่องดนตรีกับโหนดเอฟเฟกต์ได้อย่างเห็นภาพ
ระบบนี้เสนอเครื่องดนตรีหลายประเภทรวมถึงเครื่องกลอง arpeggiator และเครื่องเล่นคอร์ด โดยแต่ละอย่างจะแสดงเป็นโหนดแบบโต้ตอบบนแคนวาส ผู้ใช้สามารถสร้างการจัดเรียงเพลงที่ซับซ้อนได้โดยการเชื่อมต่อโหนดเหล่านี้ด้วยสายเคเบิลเสมือน คล้ายกับที่นักดนตรีอิเล็กทรอนิกส์เชื่อมต่อซินธิไซเซอร์และเครื่องเอฟเฟกต์ฮาร์ดแวร์เข้าด้วยกัน
ประเภท Node ที่มีให้ใช้งาน:
- เครื่องดนตรี: Pad Node, Beat Machine, Arpeggiator, Chord Node, Polyrhythm, Custom Node
- เอฟเฟกต์เสียง: Gain, Distortion, LPF, Pan, Phaser, Crush, Jux, FM, Room
- เอฟเฟกต์เวลา: Fast, Slow, Late, Attack, Release, Sustain, Reverse, Palindrome, Mask, Ply
การตอบสนองจากชุมชนและข้อสังเกตทางเทคนิค
ความคิดเห็นเบื้องต้นจากชุมชนนักพัฒนาส่วนใหญ่เป็นไปในทางบวก โดยผู้ใช้ชื่นชมทั้งการใช้งานทางเทคนิคและตัวเลือกการออกแบบ โครงการนี้แสดงให้เห็นความสามารถของ React Flow ในขณะที่รักษาอินเทอร์เฟซที่สะอาดและทันสมัยที่สร้างด้วย Tailwind CSS และคอมโพเนนต์ shadcn/ui
อย่างไรก็ตาม มีการระบุปัญหาทางเทคนิคบางประการ ผู้ใช้มือถือบน Android Chrome กำลังประสบปัญหากับตัวบ่งชี้ลำดับที่ไม่แสดงอย่างถูกต้องบนคอมโพเนนต์ Pad และ Beats ซึ่งอาจส่งผลกระทบต่อประสบการณ์ผู้ใช้สำหรับผู้สร้างเพลงบนมือถือ นอกจากนี้ยังมีการอภิปรายอย่างต่อเนื่องเกี่ยวกับคำศัพท์ โดยมีข้อเสนอแนะว่า Samples หรือ Sounds อาจเป็นป้ายกำกับที่เหมาะสมกว่า Synths สำหรับประเภทโหนดบางชนิด
คุณสมบัติหลัก:
- อินเทอร์เฟซแบบ node ที่สามารถลากและวางได้
- การแก้ไขแพทเทิร์นแบบเรียลไทม์ขณะเล่น
- การเล่น/หยุดแบบโกลบอลด้วย spacebar
- การเลือกเซลล์กริดหลายช่องพร้อมกันด้วย Shift+click
- การแสดงตัวอย่างแพทเทิร์นที่แสดงโค้ด Strudel ที่สร้างขึ้น
- รองรับมือถือ (แต่ยังมีข้อจำกัดบางประการใน Android Chrome ในปัจจุบัน)
สถาปัตยกรรมทางเทคนิคและการพัฒนาในอนาคต
โครงการนี้แสดงให้เห็นการจัดการสถานะที่ซับซ้อนโดยใช้ Zustand และใช้ประโยชน์จากเทคโนโลยีเว็บสมัยใหม่เพื่อส่งมอบการประมวลผลเสียงแบบเรียลไทม์ในเบราว์เซอร์ สถาปัตยกรรมแบบโมดูลาร์แยกเครื่องดนตรี เอฟเฟกต์ และการปรับเปลี่ยนตามเวลาออกเป็นหมวดหมู่โหนดที่แตกต่างกัน ทำให้ระบบมีทั้งความทรงพลังและสามารถขยายได้
ทีมพัฒนาดูเหมือนจะมุ่งมั่นต่อการปรับปรุงอย่างต่อเนื่อง โดยสมาชิกชุมชนให้ความคิดเห็นและข้อเสนอแนะอย่างแข็งขัน ลักษณะโอเพนซอร์สของโครงการและโครงสร้างเอกสารที่ชัดเจนบ่งบอกว่าอาจกลายเป็นเครื่องมือที่มีค่าสำหรับทั้งการศึกษาดนตรีและงานสร้างสรรค์ระดับมืออาชีพ
หมายเหตุ: TidalCycles เป็นภาษาโปรแกรมเฉพาะโดเมนสำหรับการสร้างแพทเทิร์นดนตรี ในขณะที่ Strudel.cc เป็นการนำไปใช้บนเบราว์เซอร์ที่ทำงานได้โดยไม่ต้องติดตั้งซอฟต์แวร์
อ้างอิง: Strudel Flow